@carandesign/drawui 0.1.2 → 0.2.2

package/dist/drawui.es.js

@@ -1,28 +1,28 @@
-import st, { createContext as nt, useContext as rt, useRef as E, useState as U, useEffect as C } from "react";
-var ce = { exports: {} }, Y = {};
+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 Y;
+  if (je) return Z;
   je = 1;
   var o = /* @__PURE__ */ Symbol.for("react.transitional.element"), e = /* @__PURE__ */ Symbol.for("react.fragment");
-  function n(s, t, r) {
+  function s(t, n, r) {
     var i = null;
-    if (r !== void 0 && (i = "" + r), t.key !== void 0 && (i = "" + t.key), "key" in t) {
+    if (r !== void 0 && (i = "" + r), n.key !== void 0 && (i = "" + n.key), "key" in n) {
       r = {};
-      for (var a in t)
-        a !== "key" && (r[a] = t[a]);
-    } else r = t;
-    return t = r.ref, {
+      for (var a in n)
+        a !== "key" && (r[a] = n[a]);
+    } else r = n;
+    return n = r.ref, {
       $$typeof: o,
-      type: s,
+      type: t,
       key: i,
-      ref: t !== void 0 ? t : null,
+      ref: n !== void 0 ? n : null,
       props: r
     };
   }
-  return Y.Fragment = e, Y.jsx = n, Y.jsxs = n, Y;
+  return Z.Fragment = e, Z.jsx = s, Z.jsxs = s, Z;
 }
-var B = {};
+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 G:
-            return p.displayName || "Context";
           case z:
+            return p.displayName || "Context";
+          case C:
             return (p._context.displayName || "Context") + ".Consumer";
-          case K:
-            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 {
             }
         }
@@ -72,35 +72,35 @@ function at() {
     function e(p) {
       return "" + p;
     }
-    function n(p) {
+    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);
       }
     }
-    function s(p) {
+    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 "<...>";
       }
     }
-    function t() {
+    function n() {
       var p = x.A;
       return p === null ? null : p.getOwner();
     }
@@ -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", {
@@ -126,23 +126,23 @@ function at() {
         configurable: !0
       });
     }
-    function l() {
+    function c() {
       var p = o(this.type);
-      return F[p] || (F[p] = !0, console.error(
+      return q[p] || (q[p] = !0, console.error(
         "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", {
         enumerable: !1,
-        get: l
+        get: c
       }) : Object.defineProperty(p, "ref", { enumerable: !1, value: null }), p._store = {}, Object.defineProperty(p._store, "validated", {
         configurable: !1,
         enumerable: !1,
@@ -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 c(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 H = Object.keys(M).filter(function(tt) {
+        var G = Object.keys(w).filter(function(tt) {
           return tt !== "key";
         });
-        P = 0 < H.length ? "{key: someKey, " + H.join(": ..., ") + ": ...}" : "{key: someKey}", V[T + P] || (H = 0 < H.length ? "{" + H.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} />
@@ -192,15 +192,15 @@ React keys must be passed directly to JSX without using spread:
   <%s key={someKey} {...props} />`,
           P,
           T,
-          H,
+          G,
           T
-        ), V[T + P] = !0);
+        ), B[T + P] = !0);
       }
-      if (T = null, _ !== void 0 && (n(_), T = "" + _), i(M) && (n(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
@@ -208,18 +208,18 @@ React keys must be passed directly to JSX without using spread:
         p,
         T,
         _,
-        t(),
+        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"), z = /* @__PURE__ */ Symbol.for("react.consumer"), G = /* @__PURE__ */ Symbol.for("react.context"), K = /* @__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, I = 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,79 +227,79 @@ React keys must be passed directly to JSX without using spread:
         return p();
       }
     };
-    var D, F = {}, oe = d.react_stack_bottom_frame.bind(
+    var I, q = {}, oe = d.react_stack_bottom_frame.bind(
       d,
       r
-    )(), ae = I(s(r)), V = {};
-    B.Fragment = b, B.jsx = function(p, M, _) {
+    )(), ae = W(t(r)), B = {};
+    X.Fragment = b, X.jsx = function(p, w, _) {
       var P = 1e4 > x.recentlyCreatedOwnerStacks++;
-      return c(
+      return l(
         p,
-        M,
+        w,
         _,
         !1,
         P ? Error("react-stack-top-frame") : oe,
-        P ? I(s(p)) : ae
+        P ? W(t(p)) : ae
       );
-    }, B.jsxs = function(p, M, _) {
+    }, X.jsxs = function(p, w, _) {
       var P = 1e4 > x.recentlyCreatedOwnerStacks++;
-      return c(
+      return l(
         p,
-        M,
+        w,
         _,
         !0,
         P ? Error("react-stack-top-frame") : oe,
-        P ? I(s(p)) : ae
+        P ? W(t(p)) : ae
       );
     };
-  })()), B;
+  })()), 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();
-function Te(o, e, n) {
+var M = it();
+function Te(o, e, s) {
   if (o && o.length) {
-    const [s, t] = e, r = Math.PI / 180 * n, i = Math.cos(r), a = Math.sin(r);
-    for (const l of o) {
-      const [u, c] = l;
-      l[0] = (u - s) * i - (c - t) * a + s, l[1] = (u - s) * a + (c - t) * i + t;
+    const [t, n] = e, r = Math.PI / 180 * s, i = Math.cos(r), a = Math.sin(r);
+    for (const c of o) {
+      const [u, l] = c;
+      c[0] = (u - t) * i - (l - n) * a + t, c[1] = (u - t) * a + (l - n) * i + n;
     }
   }
 }
-function ct(o, e, n) {
-  const s = [];
-  o.forEach((t) => s.push(...t)), Te(s, e, n);
+function ct(o, e, s) {
+  const t = [];
+  o.forEach((n) => t.push(...n)), Te(t, e, s);
 }
 function lt(o, e) {
   return o[0] === e[0] && o[1] === e[1];
 }
-function ut(o, e, n, s = 1) {
-  const t = n, r = Math.max(e, 0.1), i = o[0] && o[0][0] && typeof o[0][0] == "number" ? [o] : o, a = [0, 0];
-  if (t)
+function ut(o, e, s, t = 1) {
+  const n = s, r = Math.max(e, 0.1), i = o[0] && o[0][0] && typeof o[0][0] == "number" ? [o] : o, a = [0, 0];
+  if (n)
     for (const u of i)
-      Te(u, a, t);
-  const l = ht(i, r, s);
-  if (t) {
+      Te(u, a, n);
+  const c = ht(i, r, t);
+  if (n) {
     for (const u of i)
-      Te(u, a, -t);
-    ct(l, a, -t);
+      Te(u, a, -n);
+    ct(c, a, -n);
   }
-  return l;
+  return c;
 }
-function ht(o, e, n) {
-  const s = [];
+function ht(o, e, s) {
+  const t = [];
   for (const u of o) {
-    const c = [...u];
-    lt(c[0], c[c.length - 1]) || c.push([c[0][0], c[0][1]]), c.length > 2 && s.push(c);
+    const l = [...u];
+    lt(l[0], l[l.length - 1]) || l.push([l[0][0], l[0][1]]), l.length > 2 && t.push(l);
   }
-  const t = [];
+  const n = [];
   e = Math.max(e, 0.1);
   const r = [];
-  for (const u of s)
-    for (let c = 0; c < u.length - 1; c++) {
-      const h = u[c], f = u[c + 1];
+  for (const u of t)
+    for (let l = 0; l < u.length - 1; l++) {
+      const h = u[l], f = u[l + 1];
       if (h[1] !== f[1]) {
         const d = Math.min(h[1], f[1]);
         r.push({
@@ -310,9 +310,9 @@ function ht(o, e, n) {
         });
       }
     }
-  if (r.sort((u, c) => u.ymin < c.ymin ? -1 : u.ymin > c.ymin ? 1 : u.x < c.x ? -1 : u.x > c.x ? 1 : u.ymax === c.ymax ? 0 : (u.ymax - c.ymax) / Math.abs(u.ymax - c.ymax)), !r.length)
-    return t;
-  let i = [], a = r[0].ymin, l = 0;
+  if (r.sort((u, l) => u.ymin < l.ymin ? -1 : u.ymin > l.ymin ? 1 : u.x < l.x ? -1 : u.x > l.x ? 1 : u.ymax === l.ymax ? 0 : (u.ymax - l.ymax) / Math.abs(u.ymax - l.ymax)), !r.length)
+    return n;
+  let i = [], a = r[0].ymin, c = 0;
   for (; i.length || r.length; ) {
     if (r.length) {
       let u = -1;
@@ -322,119 +322,119 @@ function ht(o, e, n) {
         i.push({ s: a, edge: h });
       });
     }
-    if (i = i.filter((u) => !(u.edge.ymax <= a)), i.sort((u, c) => u.edge.x === c.edge.x ? 0 : (u.edge.x - c.edge.x) / Math.abs(u.edge.x - c.edge.x)), (n !== 1 || l % e === 0) && i.length > 1)
+    if (i = i.filter((u) => !(u.edge.ymax <= a)), i.sort((u, l) => u.edge.x === l.edge.x ? 0 : (u.edge.x - l.edge.x) / Math.abs(u.edge.x - l.edge.x)), (s !== 1 || c % e === 0) && i.length > 1)
       for (let u = 0; u < i.length; u = u + 2) {
-        const c = u + 1;
-        if (c >= i.length)
+        const l = u + 1;
+        if (l >= i.length)
           break;
-        const h = i[u].edge, f = i[c].edge;
-        t.push([
+        const h = i[u].edge, f = i[l].edge;
+        n.push([
           [Math.round(h.x), a],
           [Math.round(f.x), a]
         ]);
       }
-    a += n, i.forEach((u) => {
-      u.edge.x = u.edge.x + n * u.edge.islope;
-    }), l++;
+    a += s, i.forEach((u) => {
+      u.edge.x = u.edge.x + s * u.edge.islope;
+    }), c++;
   }
-  return t;
+  return n;
 }
-function Q(o, e) {
-  var n;
-  const s = e.hachureAngle + 90;
-  let t = e.hachureGap;
-  t < 0 && (t = e.strokeWidth * 4), t = Math.round(Math.max(t, 0.1));
+function J(o, e) {
+  var s;
+  const t = e.hachureAngle + 90;
+  let n = e.hachureGap;
+  n < 0 && (n = e.strokeWidth * 4), n = Math.round(Math.max(n, 0.1));
   let r = 1;
-  return e.roughness >= 1 && (((n = e.randomizer) === null || n === void 0 ? void 0 : n.next()) || Math.random()) > 0.7 && (r = t), ut(o, t, s, r || 1);
+  return e.roughness >= 1 && (((s = e.randomizer) === null || s === void 0 ? void 0 : s.next()) || Math.random()) > 0.7 && (r = n), ut(o, n, t, r || 1);
 }
 class Le {
   constructor(e) {
     this.helper = e;
   }
-  fillPolygons(e, n) {
-    return this._fillPolygons(e, n);
+  fillPolygons(e, s) {
+    return this._fillPolygons(e, s);
   }
-  _fillPolygons(e, n) {
-    const s = Q(e, n);
-    return { type: "fillSketch", ops: this.renderLines(s, n) };
+  _fillPolygons(e, s) {
+    const t = J(e, s);
+    return { type: "fillSketch", ops: this.renderLines(t, s) };
   }
-  renderLines(e, n) {
-    const s = [];
-    for (const t of e)
-      s.push(...this.helper.doubleLineOps(t[0][0], t[0][1], t[1][0], t[1][1], n));
-    return s;
+  renderLines(e, s) {
+    const t = [];
+    for (const n of e)
+      t.push(...this.helper.doubleLineOps(n[0][0], n[0][1], n[1][0], n[1][1], s));
+    return t;
   }
 }
-function Me(o) {
-  const e = o[0], n = o[1];
-  return Math.sqrt(Math.pow(e[0] - n[0], 2) + Math.pow(e[1] - n[1], 2));
+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));
 }
 class ft extends Le {
-  fillPolygons(e, n) {
-    let s = n.hachureGap;
-    s < 0 && (s = n.strokeWidth * 4), s = Math.max(s, 0.1);
-    const t = Object.assign({}, n, { hachureGap: s }), r = Q(e, t), i = Math.PI / 180 * n.hachureAngle, a = [], l = s * 0.5 * Math.cos(i), u = s * 0.5 * Math.sin(i);
+  fillPolygons(e, s) {
+    let t = s.hachureGap;
+    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([
-        [h[0] - l, h[1] + u],
+      we([h, f]) && a.push([
+        [h[0] - c, h[1] + u],
         [...f]
       ], [
-        [h[0] + l, h[1] - u],
+        [h[0] + c, h[1] - u],
         [...f]
       ]);
-    return { type: "fillSketch", ops: this.renderLines(a, n) };
+    return { type: "fillSketch", ops: this.renderLines(a, s) };
   }
 }
 class dt extends Le {
-  fillPolygons(e, n) {
-    const s = this._fillPolygons(e, n), t = Object.assign({}, n, { hachureAngle: n.hachureAngle + 90 }), r = this._fillPolygons(e, t);
-    return s.ops = s.ops.concat(r.ops), s;
+  fillPolygons(e, s) {
+    const t = this._fillPolygons(e, s), n = Object.assign({}, s, { hachureAngle: s.hachureAngle + 90 }), r = this._fillPolygons(e, n);
+    return t.ops = t.ops.concat(r.ops), t;
   }
 }
 class pt {
   constructor(e) {
     this.helper = e;
   }
-  fillPolygons(e, n) {
-    n = Object.assign({}, n, { hachureAngle: 0 });
-    const s = Q(e, n);
-    return this.dotsOnLines(s, n);
-  }
-  dotsOnLines(e, n) {
-    const s = [];
-    let t = n.hachureGap;
-    t < 0 && (t = n.strokeWidth * 4), t = Math.max(t, 0.1);
-    let r = n.fillWeight;
-    r < 0 && (r = n.strokeWidth / 2);
-    const i = t / 4;
+  fillPolygons(e, s) {
+    s = Object.assign({}, s, { hachureAngle: 0 });
+    const t = J(e, s);
+    return this.dotsOnLines(t, s);
+  }
+  dotsOnLines(e, s) {
+    const t = [];
+    let n = s.hachureGap;
+    n < 0 && (n = s.strokeWidth * 4), n = Math.max(n, 0.1);
+    let r = s.fillWeight;
+    r < 0 && (r = s.strokeWidth / 2);
+    const i = n / 4;
     for (const a of e) {
-      const l = Me(a), u = l / t, c = Math.ceil(u) - 1, h = l - c * t, f = (a[0][0] + a[1][0]) / 2 - t / 4, d = Math.min(a[0][1], a[1][1]);
-      for (let g = 0; g < c; g++) {
-        const m = d + h + g * t, b = f - i + Math.random() * 2 * i, v = m - i + Math.random() * 2 * i, y = this.helper.ellipse(b, v, r, r, n);
-        s.push(...y.ops);
+      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);
       }
     }
-    return { type: "fillSketch", ops: s };
+    return { type: "fillSketch", ops: t };
   }
 }
 class gt {
   constructor(e) {
     this.helper = e;
   }
-  fillPolygons(e, n) {
-    const s = Q(e, n);
-    return { type: "fillSketch", ops: this.dashedLine(s, n) };
+  fillPolygons(e, s) {
+    const t = J(e, s);
+    return { type: "fillSketch", ops: this.dashedLine(t, s) };
   }
-  dashedLine(e, n) {
-    const s = n.dashOffset < 0 ? n.hachureGap < 0 ? n.strokeWidth * 4 : n.hachureGap : n.dashOffset, t = n.dashGap < 0 ? n.hachureGap < 0 ? n.strokeWidth * 4 : n.hachureGap : n.dashGap, r = [];
+  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), l = Math.floor(a / (s + t)), u = (a + t - l * (s + t)) / 2;
-      let c = i[0], h = i[1];
-      c[0] > h[0] && (c = i[1], h = i[0]);
-      const f = Math.atan((h[1] - c[1]) / (h[0] - c[0]));
-      for (let d = 0; d < l; d++) {
-        const g = d * (s + t), m = g + s, b = [c[0] + g * Math.cos(f) + u * Math.cos(f), c[1] + g * Math.sin(f) + u * Math.sin(f)], v = [c[0] + m * Math.cos(f) + u * Math.cos(f), c[1] + m * Math.sin(f) + u * Math.sin(f)];
-        r.push(...this.helper.doubleLineOps(b[0], b[1], v[0], v[1], n));
+      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]));
+      for (let d = 0; d < c; d++) {
+        const g = d * (t + n), m = g + t, b = [l[0] + g * Math.cos(f) + u * Math.cos(f), l[1] + g * Math.sin(f) + u * Math.sin(f)], v = [l[0] + m * Math.cos(f) + u * Math.cos(f), l[1] + m * Math.sin(f) + u * Math.sin(f)];
+        r.push(...this.helper.doubleLineOps(b[0], b[1], v[0], v[1], s));
       }
     }), r;
   }
@@ -443,51 +443,51 @@ class mt {
   constructor(e) {
     this.helper = e;
   }
-  fillPolygons(e, n) {
-    const s = n.hachureGap < 0 ? n.strokeWidth * 4 : n.hachureGap, t = n.zigzagOffset < 0 ? s : n.zigzagOffset;
-    n = Object.assign({}, n, { hachureGap: s + t });
-    const r = Q(e, n);
-    return { type: "fillSketch", ops: this.zigzagLines(r, t, n) };
+  fillPolygons(e, s) {
+    const t = s.hachureGap < 0 ? s.strokeWidth * 4 : s.hachureGap, n = s.zigzagOffset < 0 ? t : s.zigzagOffset;
+    s = Object.assign({}, s, { hachureGap: t + n });
+    const r = J(e, s);
+    return { type: "fillSketch", ops: this.zigzagLines(r, n, s) };
   }
-  zigzagLines(e, n, s) {
-    const t = [];
+  zigzagLines(e, s, t) {
+    const n = [];
     return e.forEach((r) => {
-      const i = Me(r), a = Math.round(i / (2 * n));
-      let l = r[0], u = r[1];
-      l[0] > u[0] && (l = r[1], u = r[0]);
-      const c = Math.atan((u[1] - l[1]) / (u[0] - l[0]));
+      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]));
       for (let h = 0; h < a; h++) {
-        const f = h * 2 * n, d = (h + 1) * 2 * n, g = Math.sqrt(2 * Math.pow(n, 2)), m = [l[0] + f * Math.cos(c), l[1] + f * Math.sin(c)], b = [l[0] + d * Math.cos(c), l[1] + d * Math.sin(c)], v = [m[0] + g * Math.cos(c + Math.PI / 4), m[1] + g * Math.sin(c + Math.PI / 4)];
-        t.push(...this.helper.doubleLineOps(m[0], m[1], v[0], v[1], s), ...this.helper.doubleLineOps(v[0], v[1], b[0], b[1], s));
+        const f = h * 2 * s, d = (h + 1) * 2 * s, g = Math.sqrt(2 * Math.pow(s, 2)), m = [c[0] + f * Math.cos(l), c[1] + f * Math.sin(l)], b = [c[0] + d * Math.cos(l), c[1] + d * Math.sin(l)], v = [m[0] + g * Math.cos(l + Math.PI / 4), m[1] + g * Math.sin(l + Math.PI / 4)];
+        n.push(...this.helper.doubleLineOps(m[0], m[1], v[0], v[1], t), ...this.helper.doubleLineOps(v[0], v[1], b[0], b[1], t));
       }
-    }), t;
+    }), n;
   }
 }
-const O = {};
+const E = {};
 function kt(o, e) {
-  let n = o.fillStyle || "hachure";
-  if (!O[n])
-    switch (n) {
+  let s = o.fillStyle || "hachure";
+  if (!E[s])
+    switch (s) {
       case "zigzag":
-        O[n] || (O[n] = new ft(e));
+        E[s] || (E[s] = new ft(e));
         break;
       case "cross-hatch":
-        O[n] || (O[n] = new dt(e));
+        E[s] || (E[s] = new dt(e));
         break;
       case "dots":
-        O[n] || (O[n] = new pt(e));
+        E[s] || (E[s] = new pt(e));
         break;
       case "dashed":
-        O[n] || (O[n] = new gt(e));
+        E[s] || (E[s] = new gt(e));
         break;
       case "zigzag-line":
-        O[n] || (O[n] = new mt(e));
+        E[s] || (E[s] = new mt(e));
         break;
       default:
-        n = "hachure", O[n] || (O[n] = new Le(e));
+        s = "hachure", E[s] || (E[s] = new Le(e));
         break;
     }
-  return O[n];
+  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,73 +518,73 @@ function _e(o, e) {
   return o.type === e;
 }
 function Ae(o) {
-  const e = [], n = wt(o);
-  let s = "BOD", t = 0, r = n[t];
+  const e = [], s = Mt(o);
+  let t = "BOD", n = 0, r = s[n];
   for (; !_e(r, Be); ) {
     let i = 0;
     const a = [];
-    if (s === "BOD")
+    if (t === "BOD")
       if (r.text === "M" || r.text === "m")
-        t++, i = le[r.text], s = r.text;
+        n++, i = le[r.text], t = r.text;
       else
         return Ae("M0,0" + o);
-    else _e(r, xe) ? i = le[s] : (t++, i = le[r.text], s = r.text);
-    if (t + i < n.length) {
-      for (let l = t; l < t + i; l++) {
-        const u = n[l];
+    else _e(r, xe) ? i = le[t] : (n++, i = le[r.text], t = r.text);
+    if (n + i < s.length) {
+      for (let c = n; c < n + i; c++) {
+        const u = s[c];
         if (_e(u, xe))
           a[a.length] = +u.text;
         else
-          throw new Error("Param not a number: " + s + "," + u.text);
+          throw new Error("Param not a number: " + t + "," + u.text);
       }
-      if (typeof le[s] == "number") {
-        const l = { key: s, data: a };
-        e.push(l), t += i, r = n[t], s === "M" && (s = "L"), s === "m" && (s = "l");
+      if (typeof le[t] == "number") {
+        const c = { key: t, data: a };
+        e.push(c), n += i, r = s[n], t === "M" && (t = "L"), t === "m" && (t = "l");
       } else
-        throw new Error("Bad segment: " + s);
+        throw new Error("Bad segment: " + t);
     } else
       throw new Error("Path data ended short");
   }
   return e;
 }
 function Ze(o) {
-  let e = 0, n = 0, s = 0, t = 0;
+  let e = 0, s = 0, t = 0, n = 0;
   const r = [];
   for (const { key: i, data: a } of o)
     switch (i) {
       case "M":
-        r.push({ key: "M", data: [...a] }), [e, n] = a, [s, t] = a;
+        r.push({ key: "M", data: [...a] }), [e, s] = a, [t, n] = a;
         break;
       case "m":
-        e += a[0], n += a[1], r.push({ key: "M", data: [e, n] }), s = e, t = n;
+        e += a[0], s += a[1], r.push({ key: "M", data: [e, s] }), t = e, n = s;
         break;
       case "L":
-        r.push({ key: "L", data: [...a] }), [e, n] = a;
+        r.push({ key: "L", data: [...a] }), [e, s] = a;
         break;
       case "l":
-        e += a[0], n += a[1], r.push({ key: "L", data: [e, n] });
+        e += a[0], s += a[1], r.push({ key: "L", data: [e, s] });
         break;
       case "C":
-        r.push({ key: "C", data: [...a] }), e = a[4], n = a[5];
+        r.push({ key: "C", data: [...a] }), e = a[4], s = a[5];
         break;
       case "c": {
-        const l = a.map((u, c) => c % 2 ? u + n : u + e);
-        r.push({ key: "C", data: l }), e = l[4], n = l[5];
+        const c = a.map((u, l) => l % 2 ? u + s : u + e);
+        r.push({ key: "C", data: c }), e = c[4], s = c[5];
         break;
       }
       case "Q":
-        r.push({ key: "Q", data: [...a] }), e = a[2], n = a[3];
+        r.push({ key: "Q", data: [...a] }), e = a[2], s = a[3];
         break;
       case "q": {
-        const l = a.map((u, c) => c % 2 ? u + n : u + e);
-        r.push({ key: "Q", data: l }), e = l[2], n = l[3];
+        const c = a.map((u, l) => l % 2 ? u + s : u + e);
+        r.push({ key: "Q", data: c }), e = c[2], s = c[3];
         break;
       }
       case "A":
-        r.push({ key: "A", data: [...a] }), e = a[5], n = a[6];
+        r.push({ key: "A", data: [...a] }), e = a[5], s = a[6];
         break;
       case "a":
-        e += a[5], n += a[6], r.push({ key: "A", data: [a[0], a[1], a[2], a[3], a[4], e, n] });
+        e += a[5], s += a[6], r.push({ key: "A", data: [a[0], a[1], a[2], a[3], a[4], e, s] });
         break;
       case "H":
         r.push({ key: "H", data: [...a] }), e = a[0];
@@ -593,120 +593,120 @@ function Ze(o) {
         e += a[0], r.push({ key: "H", data: [e] });
         break;
       case "V":
-        r.push({ key: "V", data: [...a] }), n = a[0];
+        r.push({ key: "V", data: [...a] }), s = a[0];
         break;
       case "v":
-        n += a[0], r.push({ key: "V", data: [n] });
+        s += a[0], r.push({ key: "V", data: [s] });
         break;
       case "S":
-        r.push({ key: "S", data: [...a] }), e = a[2], n = a[3];
+        r.push({ key: "S", data: [...a] }), e = a[2], s = a[3];
         break;
       case "s": {
-        const l = a.map((u, c) => c % 2 ? u + n : u + e);
-        r.push({ key: "S", data: l }), e = l[2], n = l[3];
+        const c = a.map((u, l) => l % 2 ? u + s : u + e);
+        r.push({ key: "S", data: c }), e = c[2], s = c[3];
         break;
       }
       case "T":
-        r.push({ key: "T", data: [...a] }), e = a[0], n = a[1];
+        r.push({ key: "T", data: [...a] }), e = a[0], s = a[1];
         break;
       case "t":
-        e += a[0], n += a[1], r.push({ key: "T", data: [e, n] });
+        e += a[0], s += a[1], r.push({ key: "T", data: [e, s] });
         break;
       case "Z":
       case "z":
-        r.push({ key: "Z", data: [] }), e = s, n = t;
+        r.push({ key: "Z", data: [] }), e = t, s = n;
         break;
     }
   return r;
 }
 function Xe(o) {
   const e = [];
-  let n = "", s = 0, t = 0, r = 0, i = 0, a = 0, l = 0;
-  for (const { key: u, data: c } of o) {
+  let s = "", t = 0, n = 0, r = 0, i = 0, a = 0, c = 0;
+  for (const { key: u, data: l } of o) {
     switch (u) {
       case "M":
-        e.push({ key: "M", data: [...c] }), [s, t] = c, [r, i] = c;
+        e.push({ key: "M", data: [...l] }), [t, n] = l, [r, i] = l;
         break;
       case "C":
-        e.push({ key: "C", data: [...c] }), s = c[4], t = c[5], a = c[2], l = c[3];
+        e.push({ key: "C", data: [...l] }), t = l[4], n = l[5], a = l[2], c = l[3];
         break;
       case "L":
-        e.push({ key: "L", data: [...c] }), [s, t] = c;
+        e.push({ key: "L", data: [...l] }), [t, n] = l;
         break;
       case "H":
-        s = c[0], e.push({ key: "L", data: [s, t] });
+        t = l[0], e.push({ key: "L", data: [t, n] });
         break;
       case "V":
-        t = c[0], e.push({ key: "L", data: [s, t] });
+        n = l[0], e.push({ key: "L", data: [t, n] });
         break;
       case "S": {
         let h = 0, f = 0;
-        n === "C" || n === "S" ? (h = s + (s - a), f = t + (t - l)) : (h = s, f = t), e.push({ key: "C", data: [h, f, ...c] }), a = c[0], l = c[1], s = c[2], t = c[3];
+        s === "C" || s === "S" ? (h = t + (t - a), f = n + (n - c)) : (h = t, f = n), e.push({ key: "C", data: [h, f, ...l] }), a = l[0], c = l[1], t = l[2], n = l[3];
         break;
       }
       case "T": {
-        const [h, f] = c;
+        const [h, f] = l;
         let d = 0, g = 0;
-        n === "Q" || n === "T" ? (d = s + (s - a), g = t + (t - l)) : (d = s, g = t);
-        const m = s + 2 * (d - s) / 3, b = t + 2 * (g - t) / 3, v = h + 2 * (d - h) / 3, y = f + 2 * (g - f) / 3;
-        e.push({ key: "C", data: [m, b, v, y, h, f] }), a = d, l = g, s = h, t = f;
+        s === "Q" || s === "T" ? (d = t + (t - a), g = n + (n - c)) : (d = t, g = n);
+        const m = t + 2 * (d - t) / 3, b = n + 2 * (g - n) / 3, v = h + 2 * (d - h) / 3, y = f + 2 * (g - f) / 3;
+        e.push({ key: "C", data: [m, b, v, y, h, f] }), a = d, c = g, t = h, n = f;
         break;
       }
       case "Q": {
-        const [h, f, d, g] = c, m = s + 2 * (h - s) / 3, b = t + 2 * (f - t) / 3, v = d + 2 * (h - d) / 3, y = g + 2 * (f - g) / 3;
-        e.push({ key: "C", data: [m, b, v, y, d, g] }), a = h, l = f, s = d, t = g;
+        const [h, f, d, g] = l, m = t + 2 * (h - t) / 3, b = n + 2 * (f - n) / 3, v = d + 2 * (h - d) / 3, y = g + 2 * (f - g) / 3;
+        e.push({ key: "C", data: [m, b, v, y, d, g] }), a = h, c = f, t = d, n = g;
         break;
       }
       case "A": {
-        const h = Math.abs(c[0]), f = Math.abs(c[1]), d = c[2], g = c[3], m = c[4], b = c[5], v = c[6];
-        h === 0 || f === 0 ? (e.push({ key: "C", data: [s, t, b, v, b, v] }), s = b, t = v) : (s !== b || t !== v) && (Ue(s, t, b, v, h, f, d, g, m).forEach(function(z) {
-          e.push({ key: "C", data: z });
-        }), s = b, t = v);
+        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(C) {
+          e.push({ key: "C", data: C });
+        }), t = b, n = v);
         break;
       }
       case "Z":
-        e.push({ key: "Z", data: [] }), s = r, t = i;
+        e.push({ key: "Z", data: [] }), t = r, n = i;
         break;
     }
-    n = u;
+    s = u;
   }
   return e;
 }
 function yt(o) {
   return Math.PI * o / 180;
 }
-function Z(o, e, n) {
-  const s = o * Math.cos(n) - e * Math.sin(n), t = o * Math.sin(n) + e * Math.cos(n);
-  return [s, t];
+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];
 }
-function Ue(o, e, n, s, t, r, i, a, l, u) {
-  const c = yt(i);
+function Ue(o, e, s, t, n, r, i, a, c, u) {
+  const l = yt(i);
   let h = [], f = 0, d = 0, g = 0, m = 0;
   if (u)
     [f, d, g, m] = u;
   else {
-    [o, e] = Z(o, e, -c), [n, s] = Z(n, s, -c);
-    const x = (o - n) / 2, S = (e - s) / 2;
-    let j = x * x / (t * t) + S * S / (r * r);
-    j > 1 && (j = Math.sqrt(j), t = j * t, r = j * r);
-    const I = a === l ? -1 : 1, D = t * t, F = r * r, oe = D * F - D * S * S - F * x * x, ae = D * S * S + F * x * x, V = I * Math.sqrt(Math.abs(oe / ae));
-    g = V * t * S / r + (o + n) / 2, m = V * -r * x / t + (e + s) / 2, f = Math.asin(parseFloat(((e - m) / r).toFixed(9))), d = Math.asin(parseFloat(((s - m) / r).toFixed(9))), o < g && (f = Math.PI - f), n < g && (d = Math.PI - d), f < 0 && (f = Math.PI * 2 + f), d < 0 && (d = Math.PI * 2 + d), l && f > d && (f = f - Math.PI * 2), !l && d > f && (d = d - Math.PI * 2);
+    [o, e] = U(o, e, -l), [s, t] = U(s, t, -l);
+    const x = (o - s) / 2, S = (e - t) / 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 = n, j = s;
-    l && d > f ? d = f + Math.PI * 120 / 180 * 1 : d = f + Math.PI * 120 / 180 * -1, n = g + t * Math.cos(d), s = m + r * Math.sin(d), h = Ue(n, s, S, j, t, r, i, 0, l, [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), z = Math.cos(d), G = Math.sin(d), K = Math.tan(b / 4), ee = 4 / 3 * t * K, te = 4 / 3 * r * K, se = [o, e], $ = [o + ee * y, e - te * v], ne = [n + ee * G, s - te * z], re = [n, s];
-  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 = Z(h[S][0], h[S][1], c), I = Z(h[S + 1][0], h[S + 1][1], c), D = Z(h[S + 2][0], h[S + 2][1], c);
-      x.push([j[0], j[1], I[0], I[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;
   }
@@ -717,146 +717,146 @@ const _t = {
   ellipse: Tt,
   doubleLineOps: Rt
 };
-function Qe(o, e, n, s, t) {
-  return { type: "path", ops: N(o, e, n, s, t) };
-}
-function de(o, e, n) {
-  const s = (o || []).length;
-  if (s > 2) {
-    const t = [];
-    for (let r = 0; r < s - 1; r++)
-      t.push(...N(o[r][0], o[r][1], o[r + 1][0], o[r + 1][1], n));
-    return e && t.push(...N(o[s - 1][0], o[s - 1][1], o[0][0], o[0][1], n)), { type: "path", ops: t };
-  } else if (s === 2)
-    return Qe(o[0][0], o[0][1], o[1][0], o[1][1], n);
+function Qe(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(...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: [] };
 }
 function St(o, e) {
   return de(o, !0, e);
 }
-function Pt(o, e, n, s, t) {
+function Pt(o, e, s, t, n) {
   const r = [
     [o, e],
-    [o + n, e],
-    [o + n, e + s],
-    [o, e + s]
+    [o + s, e],
+    [o + s, e + t],
+    [o, e + t]
   ];
-  return St(r, t);
+  return St(r, n);
 }
-function ze(o, e) {
+function De(o, e) {
   if (o.length) {
-    const s = typeof o[0][0] == "number" ? [o] : o, t = ue(s[0], 1 * (1 + e.roughness * 0.2), e), r = e.disableMultiStroke ? [] : ue(s[0], 1.5 * (1 + e.roughness * 0.22), We(e));
-    for (let i = 1; i < s.length; i++) {
-      const a = s[i];
+    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++) {
+      const a = t[i];
       if (a.length) {
-        const l = ue(a, 1 * (1 + e.roughness * 0.2), e), u = e.disableMultiStroke ? [] : ue(a, 1.5 * (1 + e.roughness * 0.22), We(e));
-        for (const c of l)
-          c.op !== "move" && t.push(c);
-        for (const c of u)
-          c.op !== "move" && r.push(c);
+        const c = ue(a, 1 * (1 + e.roughness * 0.2), e), u = e.disableMultiStroke ? [] : ue(a, 1.5 * (1 + e.roughness * 0.22), We(e));
+        for (const l of c)
+          l.op !== "move" && n.push(l);
+        for (const l of u)
+          l.op !== "move" && r.push(l);
       }
     }
-    return { type: "path", ops: t.concat(r) };
+    return { type: "path", ops: n.concat(r) };
   }
   return { type: "path", ops: [] };
 }
-function Tt(o, e, n, s, t) {
-  const r = Je(n, s, t);
-  return Oe(o, e, t, r).opset;
+function Tt(o, e, s, t, n) {
+  const r = Je(s, t, n);
+  return Oe(o, e, n, r).opset;
 }
-function Je(o, e, n) {
-  const s = Math.sqrt(Math.PI * 2 * Math.sqrt((Math.pow(o / 2, 2) + Math.pow(e / 2, 2)) / 2)), t = Math.ceil(Math.max(n.curveStepCount, n.curveStepCount / Math.sqrt(200) * s)), r = Math.PI * 2 / t;
+function Je(o, e, s) {
+  const t = Math.sqrt(Math.PI * 2 * Math.sqrt((Math.pow(o / 2, 2) + Math.pow(e / 2, 2)) / 2)), n = Math.ceil(Math.max(s.curveStepCount, s.curveStepCount / Math.sqrt(200) * t)), r = Math.PI * 2 / n;
   let i = Math.abs(o / 2), a = Math.abs(e / 2);
-  const l = 1 - n.curveFitting;
-  return i += k(i * l, n), a += k(a * l, n), { increment: r, rx: i, ry: a };
+  const c = 1 - s.curveFitting;
+  return i += k(i * c, s), a += k(a * c, s), { increment: r, rx: i, ry: a };
 }
-function Oe(o, e, n, s) {
-  const [t, r] = Fe(s.increment, o, e, s.rx, s.ry, 1, s.increment * me(0.1, me(0.4, 1, n), n), n);
-  let i = ke(t, null, n);
-  if (!n.disableMultiStroke && n.roughness !== 0) {
-    const [a] = Fe(s.increment, o, e, s.rx, s.ry, 1.5, 0, n), l = ke(a, null, n);
-    i = i.concat(l);
+function Oe(o, e, s, t) {
+  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] = He(t.increment, o, e, t.rx, t.ry, 1.5, 0, s), c = ke(a, null, s);
+    i = i.concat(c);
   }
   return {
     estimatedPoints: r,
     opset: { type: "path", ops: i }
   };
 }
-function Ie(o, e, n, s, t, r, i, a, l) {
-  const u = o, c = e;
-  let h = Math.abs(n / 2), f = Math.abs(s / 2);
-  h += k(h * 0.01, l), f += k(f * 0.01, l);
-  let d = t, g = r;
+function Ie(o, e, s, t, n, r, i, a, c) {
+  const u = o, l = e;
+  let h = Math.abs(s / 2), f = Math.abs(t / 2);
+  h += k(h * 0.01, c), f += k(f * 0.01, c);
+  let d = n, g = r;
   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 / l.curveStepCount, b = Math.min(m / 2, (g - d) / 2), v = He(b, u, c, h, f, d, g, 1, l);
-  if (!l.disableMultiStroke) {
-    const y = He(b, u, c, h, f, d, g, 1.5, l);
+  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 = Fe(b, u, l, h, f, d, g, 1.5, c);
     v.push(...y);
   }
-  return i && (a ? v.push(...N(u, c, u + h * Math.cos(d), c + f * Math.sin(d), l), ...N(u, c, u + h * Math.cos(g), c + f * Math.sin(g), l)) : v.push({ op: "lineTo", data: [u, c] }, { op: "lineTo", data: [u + h * Math.cos(d), c + 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 n = Xe(Ze(Ae(o))), s = [];
-  let t = [0, 0], r = [0, 0];
-  for (const { key: i, data: a } of n)
+  const s = Xe(Ze(Ae(o))), t = [];
+  let n = [0, 0], r = [0, 0];
+  for (const { key: i, data: a } of s)
     switch (i) {
       case "M": {
-        r = [a[0], a[1]], t = [a[0], a[1]];
+        r = [a[0], a[1]], n = [a[0], a[1]];
         break;
       }
       case "L":
-        s.push(...N(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 [l, u, c, h, f, d] = a;
-        s.push(...Ct(l, u, c, h, f, d, r, e)), r = [f, d];
+        const [c, u, l, h, f, d] = a;
+        t.push(...Ct(c, u, l, h, f, d, r, e)), r = [f, d];
         break;
       }
       case "Z":
-        s.push(...N(r[0], r[1], t[0], t[1], e)), r = [t[0], t[1]];
+        t.push(...H(r[0], r[1], n[0], n[1], e)), r = [n[0], n[1]];
         break;
     }
-  return { type: "path", ops: s };
+  return { type: "path", ops: t };
 }
 function Se(o, e) {
-  const n = [];
-  for (const s of o)
-    if (s.length) {
-      const t = e.maxRandomnessOffset || 0, r = s.length;
+  const s = [];
+  for (const t of o)
+    if (t.length) {
+      const n = e.maxRandomnessOffset || 0, r = t.length;
       if (r > 2) {
-        n.push({ op: "move", data: [s[0][0] + k(t, e), s[0][1] + k(t, e)] });
+        s.push({ op: "move", data: [t[0][0] + k(n, e), t[0][1] + k(n, e)] });
         for (let i = 1; i < r; i++)
-          n.push({ op: "lineTo", data: [s[i][0] + k(t, e), s[i][1] + k(t, e)] });
+          s.push({ op: "lineTo", data: [t[i][0] + k(n, e), t[i][1] + k(n, e)] });
       }
     }
-  return { type: "fillPath", ops: n };
+  return { type: "fillPath", ops: s };
 }
-function q(o, e) {
+function V(o, e) {
   return kt(e, _t).fillPolygons(o, e);
 }
-function xt(o, e, n, s, t, r, i) {
-  const a = o, l = e;
-  let u = Math.abs(n / 2), c = Math.abs(s / 2);
-  u += k(u * 0.01, i), c += k(c * 0.01, i);
-  let h = t, f = r;
+function xt(o, e, s, t, n, r, i) {
+  const a = o, c = e;
+  let u = Math.abs(s / 2), l = Math.abs(t / 2);
+  u += k(u * 0.01, i), l += k(l * 0.01, i);
+  let h = n, f = r;
   for (; h < 0; )
     h += Math.PI * 2, f += Math.PI * 2;
   f - h > Math.PI * 2 && (h = 0, f = Math.PI * 2);
   const d = (f - h) / i.curveStepCount, g = [];
   for (let m = h; m <= f; m = m + d)
-    g.push([a + u * Math.cos(m), l + c * Math.sin(m)]);
-  return g.push([a + u * Math.cos(f), l + c * Math.sin(f)]), g.push([a, l]), q([g], i);
+    g.push([a + u * Math.cos(m), c + l * Math.sin(m)]);
+  return g.push([a + u * Math.cos(f), c + l * Math.sin(f)]), g.push([a, c]), V([g], i);
 }
 function Ot(o, e) {
   return k(o, e);
 }
-function Et(o, e, n) {
-  return me(o, e, n);
+function Et(o, e, s) {
+  return me(o, e, s);
 }
-function Rt(o, e, n, s, t) {
-  return N(o, e, n, s, t, !0);
+function Rt(o, e, s, t, n) {
+  return H(o, e, s, t, n, !0);
 }
 function We(o) {
   const e = Object.assign({}, o);
@@ -865,29 +865,29 @@ function We(o) {
 function Ke(o) {
   return o.randomizer || (o.randomizer = new vt(o.seed || 0)), o.randomizer.next();
 }
-function me(o, e, n, s = 1) {
-  return n.roughness * s * (Ke(n) * (e - o) + o);
+function me(o, e, s, t = 1) {
+  return s.roughness * t * (Ke(s) * (e - o) + o);
 }
-function k(o, e, n = 1) {
-  return me(-o, o, e, n);
+function k(o, e, s = 1) {
+  return me(-o, o, e, s);
 }
-function N(o, e, n, s, t, r = !1) {
-  const i = r ? t.disableMultiStrokeFill : t.disableMultiStroke, a = Ee(o, e, n, s, t, !0, !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;
-  const l = Ee(o, e, n, s, t, !0, !0);
-  return a.concat(l);
+  const c = Ee(o, e, s, t, n, !0, !0);
+  return a.concat(c);
 }
-function Ee(o, e, n, s, t, r, i) {
-  const a = Math.pow(o - n, 2) + Math.pow(e - s, 2), l = Math.sqrt(a);
+function Ee(o, e, s, t, n, r, i) {
+  const a = Math.pow(o - s, 2) + Math.pow(e - t, 2), c = Math.sqrt(a);
   let u = 1;
-  l < 200 ? u = 1 : l > 500 ? u = 0.4 : u = -16668e-7 * l + 1.233334;
-  let c = t.maxRandomnessOffset || 0;
-  c * c * 100 > a && (c = l / 10);
-  const h = c / 2, f = 0.2 + Ke(t) * 0.2;
-  let d = t.bowing * t.maxRandomnessOffset * (s - e) / 200, g = t.bowing * t.maxRandomnessOffset * (o - n) / 200;
-  d = k(d, t, u), g = k(g, t, u);
-  const m = [], b = () => k(h, t, u), v = () => k(c, t, u), y = t.preserveVertices;
+  c < 200 ? u = 1 : c > 500 ? u = 0.4 : u = -16668e-7 * c + 1.233334;
+  let l = n.maxRandomnessOffset || 0;
+  l * l * 100 > a && (l = c / 10);
+  const h = l / 2, f = 0.2 + Ke(n) * 0.2;
+  let d = n.bowing * n.maxRandomnessOffset * (t - e) / 200, g = n.bowing * n.maxRandomnessOffset * (o - s) / 200;
+  d = k(d, n, u), g = k(g, n, u);
+  const m = [], b = () => k(h, n, u), v = () => k(l, n, u), y = n.preserveVertices;
   return i ? m.push({
     op: "move",
     data: [
@@ -897,62 +897,62 @@ function Ee(o, e, n, s, t, r, i) {
   }) : m.push({
     op: "move",
     data: [
-      o + (y ? 0 : k(c, t, u)),
-      e + (y ? 0 : k(c, t, u))
+      o + (y ? 0 : k(l, n, u)),
+      e + (y ? 0 : k(l, n, u))
     ]
   }), i ? m.push({
     op: "bcurveTo",
     data: [
-      d + o + (n - o) * f + b(),
-      g + e + (s - e) * f + b(),
-      d + o + 2 * (n - o) * f + b(),
-      g + e + 2 * (s - e) * f + b(),
-      n + (y ? 0 : b()),
-      s + (y ? 0 : b())
+      d + o + (s - o) * f + b(),
+      g + e + (t - e) * f + b(),
+      d + o + 2 * (s - o) * f + b(),
+      g + e + 2 * (t - e) * f + b(),
+      s + (y ? 0 : b()),
+      t + (y ? 0 : b())
     ]
   }) : m.push({
     op: "bcurveTo",
     data: [
-      d + o + (n - o) * f + v(),
-      g + e + (s - e) * f + v(),
-      d + o + 2 * (n - o) * f + v(),
-      g + e + 2 * (s - e) * f + v(),
-      n + (y ? 0 : v()),
-      s + (y ? 0 : v())
+      d + o + (s - o) * f + v(),
+      g + e + (t - e) * f + v(),
+      d + o + 2 * (s - o) * f + v(),
+      g + e + 2 * (t - e) * f + v(),
+      s + (y ? 0 : v()),
+      t + (y ? 0 : v())
     ]
   }), m;
 }
-function ue(o, e, n) {
+function ue(o, e, s) {
   if (!o.length)
     return [];
-  const s = [];
-  s.push([
-    o[0][0] + k(e, n),
-    o[0][1] + k(e, n)
-  ]), s.push([
-    o[0][0] + k(e, n),
-    o[0][1] + k(e, n)
+  const t = [];
+  t.push([
+    o[0][0] + k(e, s),
+    o[0][1] + k(e, s)
+  ]), t.push([
+    o[0][0] + k(e, s),
+    o[0][1] + k(e, s)
   ]);
-  for (let t = 1; t < o.length; t++)
-    s.push([
-      o[t][0] + k(e, n),
-      o[t][1] + k(e, n)
-    ]), t === o.length - 1 && s.push([
-      o[t][0] + k(e, n),
-      o[t][1] + k(e, n)
+  for (let n = 1; n < o.length; n++)
+    t.push([
+      o[n][0] + k(e, s),
+      o[n][1] + k(e, s)
+    ]), n === o.length - 1 && t.push([
+      o[n][0] + k(e, s),
+      o[n][1] + k(e, s)
     ]);
-  return ke(s, null, n);
-}
-function ke(o, e, n) {
-  const s = o.length, t = [];
-  if (s > 3) {
-    const r = [], i = 1 - n.curveTightness;
-    t.push({ op: "move", data: [o[1][0], o[1][1]] });
-    for (let a = 1; a + 2 < s; a++) {
-      const l = o[a];
-      r[0] = [l[0], l[1]], r[1] = [l[0] + (i * o[a + 1][0] - i * o[a - 1][0]) / 6, l[1] + (i * o[a + 1][1] - i * o[a - 1][1]) / 6], r[2] = [o[a + 1][0] + (i * o[a][0] - i * o[a + 2][0]) / 6, o[a + 1][1] + (i * o[a][1] - i * o[a + 2][1]) / 6], r[3] = [o[a + 1][0], o[a + 1][1]], t.push({ op: "bcurveTo", data: [r[1][0], r[1][1], r[2][0], r[2][1], r[3][0], r[3][1]] });
+  return ke(t, null, s);
+}
+function ke(o, e, s) {
+  const t = o.length, n = [];
+  if (t > 3) {
+    const r = [], i = 1 - s.curveTightness;
+    n.push({ op: "move", data: [o[1][0], o[1][1]] });
+    for (let a = 1; a + 2 < t; a++) {
+      const c = o[a];
+      r[0] = [c[0], c[1]], r[1] = [c[0] + (i * o[a + 1][0] - i * o[a - 1][0]) / 6, c[1] + (i * o[a + 1][1] - i * o[a - 1][1]) / 6], r[2] = [o[a + 1][0] + (i * o[a][0] - i * o[a + 2][0]) / 6, o[a + 1][1] + (i * o[a][1] - i * o[a + 2][1]) / 6], r[3] = [o[a + 1][0], o[a + 1][1]], n.push({ op: "bcurveTo", data: [r[1][0], r[1][1], r[2][0], r[2][1], r[3][0], r[3][1]] });
     }
-  } else s === 3 ? (t.push({ op: "move", data: [o[1][0], o[1][1]] }), t.push({
+  } else t === 3 ? (n.push({ op: "move", data: [o[1][0], o[1][1]] }), n.push({
     op: "bcurveTo",
     data: [
       o[1][0],
@@ -962,117 +962,117 @@ function ke(o, e, n) {
       o[2][0],
       o[2][1]
     ]
-  })) : s === 2 && t.push(...Ee(o[0][0], o[0][1], o[1][0], o[1][1], n, !0, !0));
-  return t;
-}
-function Fe(o, e, n, s, t, r, i, a) {
-  const l = a.roughness === 0, u = [], c = [];
-  if (l) {
-    o = o / 4, c.push([
-      e + s * Math.cos(-o),
-      n + t * Math.sin(-o)
+  })) : t === 2 && n.push(...Ee(o[0][0], o[0][1], o[1][0], o[1][1], s, !0, !0));
+  return n;
+}
+function He(o, e, s, t, n, r, i, a) {
+  const c = a.roughness === 0, u = [], l = [];
+  if (c) {
+    o = o / 4, l.push([
+      e + t * Math.cos(-o),
+      s + n * Math.sin(-o)
     ]);
     for (let h = 0; h <= Math.PI * 2; h = h + o) {
       const f = [
-        e + s * Math.cos(h),
-        n + t * Math.sin(h)
+        e + t * Math.cos(h),
+        s + n * Math.sin(h)
       ];
-      u.push(f), c.push(f);
+      u.push(f), l.push(f);
     }
-    c.push([
-      e + s * Math.cos(0),
-      n + t * Math.sin(0)
-    ]), c.push([
-      e + s * Math.cos(o),
-      n + t * Math.sin(o)
+    l.push([
+      e + t * Math.cos(0),
+      s + n * Math.sin(0)
+    ]), l.push([
+      e + t * Math.cos(o),
+      s + n * Math.sin(o)
     ]);
   } else {
     const h = k(0.5, a) - Math.PI / 2;
-    c.push([
-      k(r, a) + e + 0.9 * s * Math.cos(h - o),
-      k(r, a) + n + 0.9 * t * Math.sin(h - o)
+    l.push([
+      k(r, a) + e + 0.9 * t * Math.cos(h - o),
+      k(r, a) + s + 0.9 * n * Math.sin(h - o)
     ]);
     const f = Math.PI * 2 + h - 0.01;
     for (let d = h; d < f; d = d + o) {
       const g = [
-        k(r, a) + e + s * Math.cos(d),
-        k(r, a) + n + t * Math.sin(d)
+        k(r, a) + e + t * Math.cos(d),
+        k(r, a) + s + n * Math.sin(d)
       ];
-      u.push(g), c.push(g);
+      u.push(g), l.push(g);
     }
-    c.push([
-      k(r, a) + e + s * Math.cos(h + Math.PI * 2 + i * 0.5),
-      k(r, a) + n + t * Math.sin(h + Math.PI * 2 + i * 0.5)
-    ]), c.push([
-      k(r, a) + e + 0.98 * s * Math.cos(h + i),
-      k(r, a) + n + 0.98 * t * Math.sin(h + i)
-    ]), c.push([
-      k(r, a) + e + 0.9 * s * Math.cos(h + i * 0.5),
-      k(r, a) + n + 0.9 * t * Math.sin(h + i * 0.5)
+    l.push([
+      k(r, a) + e + t * Math.cos(h + Math.PI * 2 + i * 0.5),
+      k(r, a) + s + n * Math.sin(h + Math.PI * 2 + i * 0.5)
+    ]), l.push([
+      k(r, a) + e + 0.98 * t * Math.cos(h + i),
+      k(r, a) + s + 0.98 * n * Math.sin(h + i)
+    ]), l.push([
+      k(r, a) + e + 0.9 * t * Math.cos(h + i * 0.5),
+      k(r, a) + s + 0.9 * n * Math.sin(h + i * 0.5)
     ]);
   }
-  return [c, u];
+  return [l, u];
 }
-function He(o, e, n, s, t, r, i, a, l) {
-  const u = r + k(0.1, l), c = [];
-  c.push([
-    k(a, l) + e + 0.9 * s * Math.cos(u - o),
-    k(a, l) + n + 0.9 * t * Math.sin(u - o)
+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),
+    k(a, c) + s + 0.9 * n * Math.sin(u - o)
   ]);
   for (let h = u; h <= i; h = h + o)
-    c.push([
-      k(a, l) + e + s * Math.cos(h),
-      k(a, l) + n + t * Math.sin(h)
+    l.push([
+      k(a, c) + e + t * Math.cos(h),
+      k(a, c) + s + n * Math.sin(h)
     ]);
-  return c.push([
-    e + s * Math.cos(i),
-    n + t * Math.sin(i)
-  ]), c.push([
-    e + s * Math.cos(i),
-    n + t * Math.sin(i)
-  ]), ke(c, null, l);
-}
-function Ct(o, e, n, s, t, r, i, a) {
-  const l = [], u = [a.maxRandomnessOffset || 1, (a.maxRandomnessOffset || 1) + 0.3];
-  let c = [0, 0];
+  return l.push([
+    e + t * Math.cos(i),
+    s + n * Math.sin(i)
+  ]), l.push([
+    e + t * Math.cos(i),
+    s + n * Math.sin(i)
+  ]), ke(l, null, c);
+}
+function Ct(o, e, s, t, n, r, i, a) {
+  const c = [], u = [a.maxRandomnessOffset || 1, (a.maxRandomnessOffset || 1) + 0.3];
+  let l = [0, 0];
   const h = a.disableMultiStroke ? 1 : 2, f = a.preserveVertices;
   for (let d = 0; d < h; d++)
-    d === 0 ? l.push({ op: "move", data: [i[0], i[1]] }) : l.push({ op: "move", data: [i[0] + (f ? 0 : k(u[0], a)), i[1] + (f ? 0 : k(u[0], a))] }), c = f ? [t, r] : [t + k(u[d], a), r + k(u[d], a)], l.push({
+    d === 0 ? c.push({ op: "move", data: [i[0], i[1]] }) : c.push({ op: "move", data: [i[0] + (f ? 0 : k(u[0], a)), i[1] + (f ? 0 : k(u[0], a))] }), l = f ? [n, r] : [n + k(u[d], a), r + k(u[d], a)], c.push({
       op: "bcurveTo",
       data: [
         o + k(u[d], a),
         e + k(u[d], a),
-        n + k(u[d], a),
         s + k(u[d], a),
-        c[0],
-        c[1]
+        t + k(u[d], a),
+        l[0],
+        l[1]
       ]
     });
-  return l;
+  return c;
 }
-function X(o) {
+function Q(o) {
   return [...o];
 }
 function qe(o, e = 0) {
-  const n = o.length;
-  if (n < 3)
+  const s = o.length;
+  if (s < 3)
     throw new Error("A curve must have at least three points.");
-  const s = [];
-  if (n === 3)
-    s.push(X(o[0]), X(o[1]), X(o[2]), X(o[2]));
+  const t = [];
+  if (s === 3)
+    t.push(Q(o[0]), Q(o[1]), Q(o[2]), Q(o[2]));
   else {
-    const t = [];
-    t.push(o[0], o[0]);
+    const n = [];
+    n.push(o[0], o[0]);
     for (let a = 1; a < o.length; a++)
-      t.push(o[a]), a === o.length - 1 && t.push(o[a]);
+      n.push(o[a]), a === o.length - 1 && n.push(o[a]);
     const r = [], i = 1 - e;
-    s.push(X(t[0]));
-    for (let a = 1; a + 2 < t.length; a++) {
-      const l = t[a];
-      r[0] = [l[0], l[1]], r[1] = [l[0] + (i * t[a + 1][0] - i * t[a - 1][0]) / 6, l[1] + (i * t[a + 1][1] - i * t[a - 1][1]) / 6], r[2] = [t[a + 1][0] + (i * t[a][0] - i * t[a + 2][0]) / 6, t[a + 1][1] + (i * t[a][1] - i * t[a + 2][1]) / 6], r[3] = [t[a + 1][0], t[a + 1][1]], s.push(r[1], r[2], r[3]);
+    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]);
     }
   }
-  return s;
+  return t;
 }
 function Lt(o, e) {
   return Math.sqrt(pe(o, e));
@@ -1080,98 +1080,98 @@ function Lt(o, e) {
 function pe(o, e) {
   return Math.pow(o[0] - e[0], 2) + Math.pow(o[1] - e[1], 2);
 }
-function At(o, e, n) {
-  const s = pe(e, n);
-  if (s === 0)
+function At(o, e, s) {
+  const t = pe(e, s);
+  if (t === 0)
     return pe(o, e);
-  let t = ((o[0] - e[0]) * (n[0] - e[0]) + (o[1] - e[1]) * (n[1] - e[1])) / s;
-  return t = Math.max(0, Math.min(1, t)), pe(o, W(e, n, t));
+  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, F(e, s, n));
 }
-function W(o, e, n) {
+function F(o, e, s) {
   return [
-    o[0] + (e[0] - o[0]) * n,
-    o[1] + (e[1] - o[1]) * n
+    o[0] + (e[0] - o[0]) * s,
+    o[1] + (e[1] - o[1]) * s
   ];
 }
 function jt(o, e) {
-  const n = o[e + 0], s = o[e + 1], t = o[e + 2], r = o[e + 3];
-  let i = 3 * s[0] - 2 * n[0] - r[0];
+  const s = o[e + 0], t = o[e + 1], n = o[e + 2], r = o[e + 3];
+  let i = 3 * t[0] - 2 * s[0] - r[0];
   i *= i;
-  let a = 3 * s[1] - 2 * n[1] - r[1];
+  let a = 3 * t[1] - 2 * s[1] - r[1];
   a *= a;
-  let l = 3 * t[0] - 2 * r[0] - n[0];
-  l *= l;
-  let u = 3 * t[1] - 2 * r[1] - n[1];
-  return u *= u, i < l && (i = l), a < u && (a = u), i + a;
-}
-function Re(o, e, n, s) {
-  const t = s || [];
-  if (jt(o, e) < n) {
+  let c = 3 * n[0] - 2 * r[0] - s[0];
+  c *= c;
+  let u = 3 * n[1] - 2 * r[1] - s[1];
+  return u *= u, i < c && (i = c), a < u && (a = u), i + a;
+}
+function Re(o, e, s, t) {
+  const n = t || [];
+  if (jt(o, e) < s) {
     const r = o[e + 0];
-    t.length ? Lt(t[t.length - 1], r) > 1 && t.push(r) : t.push(r), t.push(o[e + 3]);
+    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], l = o[e + 2], u = o[e + 3], c = W(i, a, 0.5), h = W(a, l, 0.5), f = W(l, u, 0.5), d = W(c, h, 0.5), g = W(h, f, 0.5), m = W(d, g, 0.5);
-    Re([i, c, d, m], 0, n, t), Re([m, g, f, u], 0, n, t);
+    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 t;
+  return n;
 }
 function $t(o, e) {
   return be(o, 0, o.length, e);
 }
-function be(o, e, n, s, t) {
-  const r = t || [], i = o[e], a = o[n - 1];
-  let l = 0, u = 1;
-  for (let c = e + 1; c < n - 1; ++c) {
-    const h = At(o[c], i, a);
-    h > l && (l = h, u = c);
+function be(o, e, s, t, n) {
+  const r = n || [], i = o[e], a = o[s - 1];
+  let c = 0, u = 1;
+  for (let l = e + 1; l < s - 1; ++l) {
+    const h = At(o[l], i, a);
+    h > c && (c = h, u = l);
   }
-  return Math.sqrt(l) > s ? (be(o, e, u + 1, s, r), be(o, u, n, s, r)) : (r.length || r.push(i), r.push(a)), r;
+  return Math.sqrt(c) > t ? (be(o, e, u + 1, t, r), be(o, u, s, t, r)) : (r.length || r.push(i), r.push(a)), r;
 }
-function Ce(o, e = 0.15, n) {
-  const s = [], t = (o.length - 1) / 3;
-  for (let r = 0; r < t; r++) {
+function Ce(o, e = 0.15, s) {
+  const t = [], n = (o.length - 1) / 3;
+  for (let r = 0; r < n; r++) {
     const i = r * 3;
-    Re(o, i, e, s);
+    Re(o, i, e, t);
   }
-  return n && n > 0 ? be(s, 0, s.length, n) : s;
+  return s && s > 0 ? be(t, 0, t.length, s) : t;
 }
-function Dt(o, e, n) {
-  const s = Ae(o), t = Xe(Ze(s)), r = [];
-  let i = [], a = [0, 0], l = [];
+function zt(o, e, s) {
+  const t = Ae(o), n = Xe(Ze(t)), r = [];
+  let i = [], a = [0, 0], c = [];
   const u = () => {
-    l.length >= 4 && i.push(...Ce(l, e)), l = [];
-  }, c = () => {
+    c.length >= 4 && i.push(...Ce(c, e)), c = [];
+  }, l = () => {
     u(), i.length && (r.push(i), i = []);
   };
-  for (const { key: f, data: d } of t)
+  for (const { key: f, data: d } of n)
     switch (f) {
       case "M":
-        c(), a = [d[0], d[1]], i.push(a);
+        l(), a = [d[0], d[1]], i.push(a);
         break;
       case "L":
         u(), i.push([d[0], d[1]]);
         break;
       case "C":
-        if (!l.length) {
+        if (!c.length) {
           const g = i.length ? i[i.length - 1] : a;
-          l.push([g[0], g[1]]);
+          c.push([g[0], g[1]]);
         }
-        l.push([d[0], d[1]]), l.push([d[2], d[3]]), l.push([d[4], d[5]]);
+        c.push([d[0], d[1]]), c.push([d[2], d[3]]), c.push([d[4], d[5]]);
         break;
       case "Z":
         u(), i.push([a[0], a[1]]);
         break;
     }
-  if (c(), !n)
+  if (l(), !s)
     return r;
   const h = [];
   for (const f of r) {
-    const d = $t(f, n);
+    const d = $t(f, s);
     d.length && h.push(d);
   }
   return h;
 }
-const R = "none";
+const L = "none";
 class ve {
   constructor(e) {
     this.defaultOptions = {
@@ -1203,57 +1203,57 @@ class ve {
   _o(e) {
     return e ? Object.assign({}, this.defaultOptions, e) : this.defaultOptions;
   }
-  _d(e, n, s) {
-    return { shape: e, sets: n || [], options: s || this.defaultOptions };
+  _d(e, s, t) {
+    return { shape: e, sets: s || [], options: t || this.defaultOptions };
   }
-  line(e, n, s, t, r) {
+  line(e, s, t, n, r) {
     const i = this._o(r);
-    return this._d("line", [Qe(e, n, s, t, i)], i);
+    return this._d("line", [Qe(e, s, t, n, i)], i);
   }
-  rectangle(e, n, s, t, r) {
-    const i = this._o(r), a = [], l = Pt(e, n, s, t, i);
+  rectangle(e, s, t, n, r) {
+    const i = this._o(r), a = [], c = Pt(e, s, t, n, i);
     if (i.fill) {
-      const u = [[e, n], [e + s, n], [e + s, n + t], [e, n + t]];
-      i.fillStyle === "solid" ? a.push(Se([u], i)) : a.push(q([u], i));
+      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(l), this._d("rectangle", a, i);
+    return i.stroke !== L && a.push(c), this._d("rectangle", a, i);
   }
-  ellipse(e, n, s, t, r) {
-    const i = this._o(r), a = [], l = Je(s, t, i), u = Oe(e, n, i, l);
+  ellipse(e, s, t, n, r) {
+    const i = this._o(r), a = [], c = Je(t, n, i), u = Oe(e, s, i, c);
     if (i.fill)
       if (i.fillStyle === "solid") {
-        const c = Oe(e, n, i, l).opset;
-        c.type = "fillPath", a.push(c);
+        const l = Oe(e, s, i, c).opset;
+        l.type = "fillPath", a.push(l);
       } else
-        a.push(q([u.estimatedPoints], i));
-    return i.stroke !== R && a.push(u.opset), this._d("ellipse", a, i);
+        a.push(V([u.estimatedPoints], i));
+    return i.stroke !== L && a.push(u.opset), this._d("ellipse", a, i);
   }
-  circle(e, n, s, t) {
-    const r = this.ellipse(e, n, s, s, t);
+  circle(e, s, t, n) {
+    const r = this.ellipse(e, s, t, t, n);
     return r.shape = "circle", r;
   }
-  linearPath(e, n) {
-    const s = this._o(n);
-    return this._d("linearPath", [de(e, !1, s)], s);
+  linearPath(e, s) {
+    const t = this._o(s);
+    return this._d("linearPath", [de(e, !1, t)], t);
   }
-  arc(e, n, s, t, r, i, a = !1, l) {
-    const u = this._o(l), c = [], h = Ie(e, n, s, t, r, i, a, !0, u);
+  arc(e, s, t, n, r, i, a = !1, c) {
+    const u = this._o(c), l = [], h = Ie(e, s, t, n, r, i, a, !0, u);
     if (a && u.fill)
       if (u.fillStyle === "solid") {
         const f = Object.assign({}, u);
         f.disableMultiStroke = !0;
-        const d = Ie(e, n, s, t, r, i, !0, !1, f);
-        d.type = "fillPath", c.push(d);
+        const d = Ie(e, s, t, n, r, i, !0, !1, f);
+        d.type = "fillPath", l.push(d);
       } else
-        c.push(xt(e, n, s, t, r, i, u));
-    return u.stroke !== R && c.push(h), this._d("arc", c, u);
-  }
-  curve(e, n) {
-    const s = this._o(n), t = [], r = ze(e, s);
-    if (s.fill && s.fill !== R)
-      if (s.fillStyle === "solid") {
-        const i = ze(e, Object.assign(Object.assign({}, s), { disableMultiStroke: !0, roughness: s.roughness ? s.roughness + s.fillShapeRoughnessGain : 0 }));
-        t.push({
+        l.push(xt(e, s, t, n, r, i, u));
+    return u.stroke !== L && l.push(h), this._d("arc", l, u);
+  }
+  curve(e, s) {
+    const t = this._o(s), n = [], r = De(e, t);
+    if (t.fill && t.fill !== L)
+      if (t.fillStyle === "solid") {
+        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)
         });
@@ -1261,134 +1261,134 @@ class ve {
         const i = [], a = e;
         if (a.length) {
           const u = typeof a[0][0] == "number" ? [a] : a;
-          for (const c of u)
-            c.length < 3 ? i.push(...c) : c.length === 3 ? i.push(...Ce(qe([
-              c[0],
-              c[0],
-              c[1],
-              c[2]
-            ]), 10, (1 + s.roughness) / 2)) : i.push(...Ce(qe(c), 10, (1 + s.roughness) / 2));
+          for (const l of u)
+            l.length < 3 ? i.push(...l) : l.length === 3 ? i.push(...Ce(qe([
+              l[0],
+              l[0],
+              l[1],
+              l[2]
+            ]), 10, (1 + t.roughness) / 2)) : i.push(...Ce(qe(l), 10, (1 + t.roughness) / 2));
         }
-        i.length && t.push(q([i], s));
+        i.length && n.push(V([i], t));
       }
-    return s.stroke !== R && t.push(r), this._d("curve", t, s);
+    return t.stroke !== L && n.push(r), this._d("curve", n, t);
   }
-  polygon(e, n) {
-    const s = this._o(n), t = [], r = de(e, !0, s);
-    return s.fill && (s.fillStyle === "solid" ? t.push(Se([e], s)) : t.push(q([e], s))), s.stroke !== R && t.push(r), this._d("polygon", t, s);
+  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 !== L && n.push(r), this._d("polygon", n, t);
   }
-  path(e, n) {
-    const s = this._o(n), t = [];
+  path(e, s) {
+    const t = this._o(s), n = [];
     if (!e)
-      return this._d("path", t, s);
+      return this._d("path", n, t);
     e = (e || "").replace(/\n/g, " ").replace(/(-\s)/g, "-").replace("/(ss)/g", " ");
-    const r = s.fill && s.fill !== "transparent" && s.fill !== R, i = s.stroke !== R, a = !!(s.simplification && s.simplification < 1), l = a ? 4 - 4 * (s.simplification || 1) : (1 + s.roughness) / 2, u = Dt(e, 1, l), c = Ne(e, s);
+    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 (s.fillStyle === "solid")
+      if (t.fillStyle === "solid")
         if (u.length === 1) {
-          const h = Ne(e, Object.assign(Object.assign({}, s), { disableMultiStroke: !0, roughness: s.roughness ? s.roughness + s.fillShapeRoughnessGain : 0 }));
-          t.push({
+          const h = Ne(e, Object.assign(Object.assign({}, t), { disableMultiStroke: !0, roughness: t.roughness ? t.roughness + t.fillShapeRoughnessGain : 0 }));
+          n.push({
             type: "fillPath",
             ops: this._mergedShape(h.ops)
           });
         } else
-          t.push(Se(u, s));
+          n.push(Se(u, t));
       else
-        t.push(q(u, s));
+        n.push(V(u, t));
     return i && (a ? u.forEach((h) => {
-      t.push(de(h, !1, s));
-    }) : t.push(c)), this._d("path", t, s);
-  }
-  opsToPath(e, n) {
-    let s = "";
-    for (const t of e.ops) {
-      const r = typeof n == "number" && n >= 0 ? t.data.map((i) => +i.toFixed(n)) : t.data;
-      switch (t.op) {
+      n.push(de(h, !1, t));
+    }) : n.push(l)), this._d("path", n, t);
+  }
+  opsToPath(e, s) {
+    let t = "";
+    for (const n of e.ops) {
+      const r = typeof s == "number" && s >= 0 ? n.data.map((i) => +i.toFixed(s)) : n.data;
+      switch (n.op) {
         case "move":
-          s += `M${r[0]} ${r[1]} `;
+          t += `M${r[0]} ${r[1]} `;
           break;
         case "bcurveTo":
-          s += `C${r[0]} ${r[1]}, ${r[2]} ${r[3]}, ${r[4]} ${r[5]} `;
+          t += `C${r[0]} ${r[1]}, ${r[2]} ${r[3]}, ${r[4]} ${r[5]} `;
           break;
         case "lineTo":
-          s += `L${r[0]} ${r[1]} `;
+          t += `L${r[0]} ${r[1]} `;
           break;
       }
     }
-    return s.trim();
+    return t.trim();
   }
   toPaths(e) {
-    const n = e.sets || [], s = e.options || this.defaultOptions, t = [];
-    for (const r of n) {
+    const s = e.sets || [], t = e.options || this.defaultOptions, n = [];
+    for (const r of s) {
       let i = null;
       switch (r.type) {
         case "path":
           i = {
             d: this.opsToPath(r),
-            stroke: s.stroke,
-            strokeWidth: s.strokeWidth,
-            fill: R
+            stroke: t.stroke,
+            strokeWidth: t.strokeWidth,
+            fill: L
           };
           break;
         case "fillPath":
           i = {
             d: this.opsToPath(r),
-            stroke: R,
+            stroke: L,
             strokeWidth: 0,
-            fill: s.fill || R
+            fill: t.fill || L
           };
           break;
         case "fillSketch":
-          i = this.fillSketch(r, s);
+          i = this.fillSketch(r, t);
           break;
       }
-      i && t.push(i);
+      i && n.push(i);
     }
-    return t;
+    return n;
   }
-  fillSketch(e, n) {
-    let s = n.fillWeight;
-    return s < 0 && (s = n.strokeWidth / 2), {
+  fillSketch(e, s) {
+    let t = s.fillWeight;
+    return t < 0 && (t = s.strokeWidth / 2), {
       d: this.opsToPath(e),
-      stroke: n.fill || R,
-      strokeWidth: s,
-      fill: R
+      stroke: s.fill || L,
+      strokeWidth: t,
+      fill: L
     };
   }
   _mergedShape(e) {
-    return e.filter((n, s) => s === 0 ? !0 : n.op !== "move");
+    return e.filter((s, t) => t === 0 ? !0 : s.op !== "move");
   }
 }
-class zt {
-  constructor(e, n) {
-    this.canvas = e, this.ctx = this.canvas.getContext("2d"), this.gen = new ve(n);
+class Dt {
+  constructor(e, s) {
+    this.canvas = e, this.ctx = this.canvas.getContext("2d"), this.gen = new ve(s);
   }
   draw(e) {
-    const n = e.sets || [], s = e.options || this.getDefaultOptions(), t = this.ctx, r = e.options.fixedDecimalPlaceDigits;
-    for (const i of n)
+    const s = e.sets || [], t = e.options || this.getDefaultOptions(), n = this.ctx, r = e.options.fixedDecimalPlaceDigits;
+    for (const i of s)
       switch (i.type) {
         case "path":
-          t.save(), t.strokeStyle = s.stroke === "none" ? "transparent" : s.stroke, t.lineWidth = s.strokeWidth, s.strokeLineDash && t.setLineDash(s.strokeLineDash), s.strokeLineDashOffset && (t.lineDashOffset = s.strokeLineDashOffset), this._drawToContext(t, i, r), t.restore();
+          n.save(), n.strokeStyle = t.stroke === "none" ? "transparent" : t.stroke, n.lineWidth = t.strokeWidth, t.strokeLineDash && n.setLineDash(t.strokeLineDash), t.strokeLineDashOffset && (n.lineDashOffset = t.strokeLineDashOffset), this._drawToContext(n, i, r), n.restore();
           break;
         case "fillPath": {
-          t.save(), t.fillStyle = s.fill || "";
+          n.save(), n.fillStyle = t.fill || "";
           const a = e.shape === "curve" || e.shape === "polygon" || e.shape === "path" ? "evenodd" : "nonzero";
-          this._drawToContext(t, i, r, a), t.restore();
+          this._drawToContext(n, i, r, a), n.restore();
           break;
         }
         case "fillSketch":
-          this.fillSketch(t, i, s);
+          this.fillSketch(n, i, t);
           break;
       }
   }
-  fillSketch(e, n, s) {
-    let t = s.fillWeight;
-    t < 0 && (t = s.strokeWidth / 2), e.save(), s.fillLineDash && e.setLineDash(s.fillLineDash), s.fillLineDashOffset && (e.lineDashOffset = s.fillLineDashOffset), e.strokeStyle = s.fill || "", e.lineWidth = t, this._drawToContext(e, n, s.fixedDecimalPlaceDigits), e.restore();
+  fillSketch(e, s, t) {
+    let n = t.fillWeight;
+    n < 0 && (n = t.strokeWidth / 2), e.save(), t.fillLineDash && e.setLineDash(t.fillLineDash), t.fillLineDashOffset && (e.lineDashOffset = t.fillLineDashOffset), e.strokeStyle = t.fill || "", e.lineWidth = n, this._drawToContext(e, s, t.fixedDecimalPlaceDigits), e.restore();
   }
-  _drawToContext(e, n, s, t = "nonzero") {
+  _drawToContext(e, s, t, n = "nonzero") {
     e.beginPath();
-    for (const r of n.ops) {
-      const i = typeof s == "number" && s >= 0 ? r.data.map((a) => +a.toFixed(s)) : r.data;
+    for (const r of s.ops) {
+      const i = typeof t == "number" && t >= 0 ? r.data.map((a) => +a.toFixed(t)) : r.data;
       switch (r.op) {
         case "move":
           e.moveTo(i[0], i[1]);
@@ -1401,7 +1401,7 @@ class zt {
           break;
       }
     }
-    n.type === "fillPath" ? e.fill(t) : e.stroke();
+    s.type === "fillPath" ? e.fill(n) : e.stroke();
   }
   get generator() {
     return this.gen;
@@ -1409,75 +1409,75 @@ class zt {
   getDefaultOptions() {
     return this.gen.defaultOptions;
   }
-  line(e, n, s, t, r) {
-    const i = this.gen.line(e, n, s, t, r);
+  line(e, s, t, n, r) {
+    const i = this.gen.line(e, s, t, n, r);
     return this.draw(i), i;
   }
-  rectangle(e, n, s, t, r) {
-    const i = this.gen.rectangle(e, n, s, t, r);
+  rectangle(e, s, t, n, r) {
+    const i = this.gen.rectangle(e, s, t, n, r);
     return this.draw(i), i;
   }
-  ellipse(e, n, s, t, r) {
-    const i = this.gen.ellipse(e, n, s, t, r);
+  ellipse(e, s, t, n, r) {
+    const i = this.gen.ellipse(e, s, t, n, r);
     return this.draw(i), i;
   }
-  circle(e, n, s, t) {
-    const r = this.gen.circle(e, n, s, t);
+  circle(e, s, t, n) {
+    const r = this.gen.circle(e, s, t, n);
     return this.draw(r), r;
   }
-  linearPath(e, n) {
-    const s = this.gen.linearPath(e, n);
-    return this.draw(s), s;
+  linearPath(e, s) {
+    const t = this.gen.linearPath(e, s);
+    return this.draw(t), t;
   }
-  polygon(e, n) {
-    const s = this.gen.polygon(e, n);
-    return this.draw(s), s;
+  polygon(e, s) {
+    const t = this.gen.polygon(e, s);
+    return this.draw(t), t;
   }
-  arc(e, n, s, t, r, i, a = !1, l) {
-    const u = this.gen.arc(e, n, s, t, r, i, a, l);
+  arc(e, s, t, n, r, i, a = !1, c) {
+    const u = this.gen.arc(e, s, t, n, r, i, a, c);
     return this.draw(u), u;
   }
-  curve(e, n) {
-    const s = this.gen.curve(e, n);
-    return this.draw(s), s;
+  curve(e, s) {
+    const t = this.gen.curve(e, s);
+    return this.draw(t), t;
   }
-  path(e, n) {
-    const s = this.gen.path(e, n);
-    return this.draw(s), s;
+  path(e, s) {
+    const t = this.gen.path(e, s);
+    return this.draw(t), t;
   }
 }
 const he = "http://www.w3.org/2000/svg";
 class It {
-  constructor(e, n) {
-    this.svg = e, this.gen = new ve(n);
+  constructor(e, s) {
+    this.svg = e, this.gen = new ve(s);
   }
   draw(e) {
-    const n = e.sets || [], s = e.options || this.getDefaultOptions(), t = this.svg.ownerDocument || window.document, r = t.createElementNS(he, "g"), i = e.options.fixedDecimalPlaceDigits;
-    for (const a of n) {
-      let l = null;
+    const s = e.sets || [], t = e.options || this.getDefaultOptions(), n = this.svg.ownerDocument || window.document, r = n.createElementNS(he, "g"), i = e.options.fixedDecimalPlaceDigits;
+    for (const a of s) {
+      let c = null;
       switch (a.type) {
         case "path": {
-          l = t.createElementNS(he, "path"), l.setAttribute("d", this.opsToPath(a, i)), l.setAttribute("stroke", s.stroke), l.setAttribute("stroke-width", s.strokeWidth + ""), l.setAttribute("fill", "none"), s.strokeLineDash && l.setAttribute("stroke-dasharray", s.strokeLineDash.join(" ").trim()), s.strokeLineDashOffset && l.setAttribute("stroke-dashoffset", `${s.strokeLineDashOffset}`);
+          c = n.createElementNS(he, "path"), c.setAttribute("d", this.opsToPath(a, i)), c.setAttribute("stroke", t.stroke), c.setAttribute("stroke-width", t.strokeWidth + ""), c.setAttribute("fill", "none"), t.strokeLineDash && c.setAttribute("stroke-dasharray", t.strokeLineDash.join(" ").trim()), t.strokeLineDashOffset && c.setAttribute("stroke-dashoffset", `${t.strokeLineDashOffset}`);
           break;
         }
         case "fillPath": {
-          l = t.createElementNS(he, "path"), l.setAttribute("d", this.opsToPath(a, i)), l.setAttribute("stroke", "none"), l.setAttribute("stroke-width", "0"), l.setAttribute("fill", s.fill || ""), (e.shape === "curve" || e.shape === "polygon") && l.setAttribute("fill-rule", "evenodd");
+          c = n.createElementNS(he, "path"), c.setAttribute("d", this.opsToPath(a, i)), c.setAttribute("stroke", "none"), c.setAttribute("stroke-width", "0"), c.setAttribute("fill", t.fill || ""), (e.shape === "curve" || e.shape === "polygon") && c.setAttribute("fill-rule", "evenodd");
           break;
         }
         case "fillSketch": {
-          l = this.fillSketch(t, a, s);
+          c = this.fillSketch(n, a, t);
           break;
         }
       }
-      l && r.appendChild(l);
+      c && r.appendChild(c);
     }
     return r;
   }
-  fillSketch(e, n, s) {
-    let t = s.fillWeight;
-    t < 0 && (t = s.strokeWidth / 2);
+  fillSketch(e, s, t) {
+    let n = t.fillWeight;
+    n < 0 && (n = t.strokeWidth / 2);
     const r = e.createElementNS(he, "path");
-    return r.setAttribute("d", this.opsToPath(n, s.fixedDecimalPlaceDigits)), r.setAttribute("stroke", s.fill || ""), r.setAttribute("stroke-width", t + ""), r.setAttribute("fill", "none"), s.fillLineDash && r.setAttribute("stroke-dasharray", s.fillLineDash.join(" ").trim()), s.fillLineDashOffset && r.setAttribute("stroke-dashoffset", `${s.fillLineDashOffset}`), r;
+    return r.setAttribute("d", this.opsToPath(s, t.fixedDecimalPlaceDigits)), r.setAttribute("stroke", t.fill || ""), r.setAttribute("stroke-width", n + ""), r.setAttribute("fill", "none"), t.fillLineDash && r.setAttribute("stroke-dasharray", t.fillLineDash.join(" ").trim()), t.fillLineDashOffset && r.setAttribute("stroke-dashoffset", `${t.fillLineDashOffset}`), r;
   }
   get generator() {
     return this.gen;
@@ -1485,49 +1485,49 @@ class It {
   getDefaultOptions() {
     return this.gen.defaultOptions;
   }
-  opsToPath(e, n) {
-    return this.gen.opsToPath(e, n);
+  opsToPath(e, s) {
+    return this.gen.opsToPath(e, s);
   }
-  line(e, n, s, t, r) {
-    const i = this.gen.line(e, n, s, t, r);
+  line(e, s, t, n, r) {
+    const i = this.gen.line(e, s, t, n, r);
     return this.draw(i);
   }
-  rectangle(e, n, s, t, r) {
-    const i = this.gen.rectangle(e, n, s, t, r);
+  rectangle(e, s, t, n, r) {
+    const i = this.gen.rectangle(e, s, t, n, r);
     return this.draw(i);
   }
-  ellipse(e, n, s, t, r) {
-    const i = this.gen.ellipse(e, n, s, t, r);
+  ellipse(e, s, t, n, r) {
+    const i = this.gen.ellipse(e, s, t, n, r);
     return this.draw(i);
   }
-  circle(e, n, s, t) {
-    const r = this.gen.circle(e, n, s, t);
+  circle(e, s, t, n) {
+    const r = this.gen.circle(e, s, t, n);
     return this.draw(r);
   }
-  linearPath(e, n) {
-    const s = this.gen.linearPath(e, n);
-    return this.draw(s);
+  linearPath(e, s) {
+    const t = this.gen.linearPath(e, s);
+    return this.draw(t);
   }
-  polygon(e, n) {
-    const s = this.gen.polygon(e, n);
-    return this.draw(s);
+  polygon(e, s) {
+    const t = this.gen.polygon(e, s);
+    return this.draw(t);
   }
-  arc(e, n, s, t, r, i, a = !1, l) {
-    const u = this.gen.arc(e, n, s, t, r, i, a, l);
+  arc(e, s, t, n, r, i, a = !1, c) {
+    const u = this.gen.arc(e, s, t, n, r, i, a, c);
     return this.draw(u);
   }
-  curve(e, n) {
-    const s = this.gen.curve(e, n);
-    return this.draw(s);
+  curve(e, s) {
+    const t = this.gen.curve(e, s);
+    return this.draw(t);
   }
-  path(e, n) {
-    const s = this.gen.path(e, n);
-    return this.draw(s);
+  path(e, s) {
+    const t = this.gen.path(e, s);
+    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);
@@ -1538,15 +1538,15 @@ const L = {
   newSeed() {
     return ve.newSeed();
   }
-}, J = (o, e, n, s, t) => `M${o + t},${e} 
-          H${o + n - t} 
-          A${t},${t} 0 0 1 ${o + n},${e + t} 
-          V${e + s - t} 
-          A${t},${t} 0 0 1 ${o + n - t},${e + s} 
-          H${o + t} 
-          A${t},${t} 0 0 1 ${o},${e + s - t} 
-          V${e + t} 
-          A${t},${t} 0 0 1 ${o + t},${e} 
+}, K = (o, e, s, t, n) => `M${o + n},${e} 
+          H${o + s - n} 
+          A${n},${n} 0 0 1 ${o + s},${e + n} 
+          V${e + t - n} 
+          A${n},${n} 0 0 1 ${o + s - n},${e + t} 
+          H${o + n} 
+          A${n},${n} 0 0 1 ${o},${e + t - n} 
+          V${e + n} 
+          A${n},${n} 0 0 1 ${o + n},${e} 
           Z`, Nt = {
   "drawui-button": "_drawui-button_1nx7z_1"
 }, ge = {
@@ -1565,7 +1565,7 @@ const L = {
     }
   },
   roughness: {
-    roughness: 1.8,
+    roughness: 3,
     bowing: 2
   },
   fill: {
@@ -1623,7 +1623,7 @@ const L = {
     }
   }
 }, et = nt(ge), Gt = ({ theme: o, children: e }) => {
-  const n = {
+  const s = {
     ...ge,
     ...o,
     stroke: {
@@ -1635,65 +1635,67 @@ const L = {
       ...o?.radius
     }
   };
-  return /* @__PURE__ */ w.jsx(et.Provider, { value: n, 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: n = "sm",
-  backgroundColor: s,
-  children: t,
-  ...r
+  size: s = "sm",
+  backgroundColor: t,
+  children: n,
+  fillStyle: r,
+  ...i
 }) => {
-  const i = A(), a = E(null), [l, u] = U(!1), c = i.buttonSize[n].width, h = i.buttonSize[n].height, f = i.buttonSize[n].fontSize;
-  return C(() => {
-    if (!a.current) return;
-    const d = L.svg(a.current);
-    a.current.innerHTML = "";
-    const g = i.stroke[o], m = d.path(
-      J(0, 0, c, h, i.radius[e]),
+  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 = A.svg(c.current);
+    c.current.innerHTML = "";
+    const m = a.stroke[o], b = g.path(
+      K(0, 0, h, f, a.radius[e]),
       {
-        stroke: g.color,
-        strokeWidth: g.width,
-        fill: s ?? i.fill.background,
-        roughness: l ? i.roughness.roughness + 1 : i.roughness.roughness,
-        bowing: i.roughness.bowing
+        stroke: m.color,
+        strokeWidth: m.width,
+        fill: t ?? a.fill.background,
+        fillStyle: r,
+        roughness: u ? a.roughness.roughness + 1 : a.roughness.roughness,
+        bowing: a.roughness.bowing
       }
     );
-    a.current.appendChild(m);
-  }, [l, o, e, i]), /* @__PURE__ */ w.jsxs(
+    c.current.appendChild(b);
+  }, [u, o, e, a]), /* @__PURE__ */ M.jsxs(
     "button",
     {
-      ...r,
-      onMouseEnter: () => u(!0),
-      onMouseLeave: () => u(!1),
-      className: `${Nt["drawui-button"]} ${r.className ?? ""}`,
+      ...i,
+      onMouseEnter: () => l(!0),
+      onMouseLeave: () => l(!1),
+      className: `${Nt["drawui-button"]} ${i.className ?? ""}`,
       style: {
         position: "relative",
-        width: c,
-        height: h,
+        width: h,
+        height: f,
         border: "none",
         background: "transparent",
         cursor: "pointer"
       },
       children: [
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "svg",
           {
-            ref: a,
-            width: c,
-            height: h,
+            ref: c,
+            width: h,
+            height: f,
             style: { position: "absolute", inset: 0 }
           }
         ),
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "span",
           {
             style: {
               position: "relative",
-              fontSize: f,
+              fontSize: d,
               pointerEvents: "none"
             },
-            children: t
+            children: n
           }
         )
       ]
@@ -1704,49 +1706,51 @@ 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%",
-  vertical: n = !1,
-  className: s
+  vertical: s = !1,
+  className: t,
+  fillStyle: n
 }) => {
-  const t = A(), r = E(null);
-  return C(() => {
-    if (!r.current) return;
-    r.current.innerHTML = "";
-    const i = L.svg(r.current), a = t.stroke[o];
-    if (n) {
-      const l = typeof e == "number" ? e : 100, u = i.line(0, 0, 0, l, {
-        stroke: a.color,
-        strokeWidth: a.width,
-        roughness: t.roughness.roughness,
-        bowing: t.roughness.bowing
+  const r = j(), i = O(null);
+  return R(() => {
+    if (!i.current) return;
+    i.current.innerHTML = "";
+    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,
+        strokeWidth: c.width,
+        roughness: r.roughness.roughness,
+        bowing: r.roughness.bowing
       });
-      r.current.appendChild(u);
+      i.current.appendChild(l);
     } else {
-      const l = typeof e == "number" ? e : 300, u = i.line(0, 0, l, 0, {
-        stroke: a.color,
-        strokeWidth: a.width,
-        roughness: t.roughness.roughness,
-        bowing: t.roughness.bowing
+      const u = typeof e == "number" ? e : 300, l = a.line(0, 0, u, 0, {
+        stroke: c.color,
+        strokeWidth: c.width,
+        roughness: r.roughness.roughness,
+        bowing: r.roughness.bowing,
+        fillStyle: n
       });
-      r.current.appendChild(u);
+      i.current.appendChild(l);
     }
-  }, [t, o, e, n]), /* @__PURE__ */ w.jsx(
+  }, [r, o, e, s]), /* @__PURE__ */ M.jsx(
     "div",
     {
-      className: `${Pe["drawui-divider"]} ${n ? Pe.vertical : Pe.horizontal} ${s ?? ""}`,
-      style: { width: n ? void 0 : e },
-      children: /* @__PURE__ */ w.jsx(
+      className: `${Pe["drawui-divider"]} ${s ? Pe.vertical : Pe.horizontal} ${t ?? ""}`,
+      style: { width: s ? void 0 : e },
+      children: /* @__PURE__ */ M.jsx(
         "svg",
         {
-          ref: r,
-          width: n ? 2 : e,
-          height: n ? e : 2,
+          ref: i,
+          width: s ? 2 : e,
+          height: s ? e : 2,
           style: { display: "block" }
         }
       )
@@ -1755,58 +1759,86 @@ const L = {
 }, Yt = ({
   strokeWeight: o = "medium",
   radius: e = "md",
-  width: n = 300,
-  height: s = 200,
-  backgroundColor: t,
+  width: s = 300,
+  height: t,
+  //optional, card adjust height itself by content
+  backgroundColor: n,
   header: r,
   footer: i,
-  children: a,
-  ...l
+  fillStyle: a,
+  children: c,
+  ...u
 }) => {
-  const u = A(), c = E(null), [h, f] = U(!1);
-  return C(() => {
-    if (!c.current) return;
-    const d = L.svg(c.current);
-    c.current.innerHTML = "";
-    const g = u.stroke[o], m = d.path(
-      J(0, 0, n, s, u.radius[e]),
+  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 y = A.svg(h.current);
+    h.current.innerHTML = "";
+    const C = l.stroke[o], z = t ?? m, N = y.path(
+      K(0, 0, s, z, l.radius[e]),
       {
-        stroke: g.color,
-        strokeWidth: g.width,
-        fill: t ?? u.fill.background,
-        roughness: h ? u.roughness.roughness + 1 : u.roughness.roughness,
-        bowing: u.roughness.bowing
+        stroke: C.color,
+        strokeWidth: C.width,
+        fill: n ?? l.fill.background,
+        roughness: d ? l.roughness.roughness + 1 : l.roughness.roughness,
+        bowing: l.roughness.bowing,
+        fillStyle: a
       }
     );
-    c.current.appendChild(m);
-  }, [o, e, n, s, t, u]), /* @__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",
     {
-      ...l,
-      className: `${fe["drawui-card"]} ${l.className ?? ""}`,
-      onMouseEnter: () => f(!0),
-      onMouseLeave: () => f(!1),
+      ...u,
+      ref: f,
+      className: `${fe["drawui-card"]} ${u.className ?? ""}`,
+      onMouseEnter: () => g(!0),
+      onMouseLeave: () => g(!1),
       style: {
         position: "relative",
-        width: n,
-        height: s,
+        width: s,
+        minHeight: t || "auto",
+        height: t || "auto",
         cursor: "default",
         display: "flex",
         flexDirection: "column",
         overflow: "hidden"
       },
       children: [
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "svg",
           {
-            ref: c,
-            width: n,
-            height: s,
+            ref: h,
+            width: s,
+            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"],
@@ -1814,19 +1846,19 @@ const L = {
               children: r
             }
           ),
-          /* @__PURE__ */ w.jsx(Ge, { width: n, strokeWeight: "thick" })
+          /* @__PURE__ */ M.jsx(Ge, { width: s, strokeWeight: "thick" })
         ] }),
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "div",
           {
             className: fe["drawui-card-body"],
             style: { position: "relative", zIndex: 1, flex: 1 },
-            children: a
+            children: c
           }
         ),
-        i && /* @__PURE__ */ w.jsxs(w.Fragment, { children: [
-          /* @__PURE__ */ w.jsx(Ge, { width: n, 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"],
@@ -1844,77 +1876,81 @@ const L = {
 }, Bt = ({
   header: o,
   children: e,
-  strokeWeight: n = "medium",
-  radius: s = "md",
-  width: t = 300,
-  className: r
+  strokeWeight: s = "medium",
+  radius: t = "md",
+  width: n = 300,
+  fillStyle: r,
+  className: i
 }) => {
-  const i = A(), a = E(null);
-  return C(() => {
-    if (!a.current) return;
-    const l = L.svg(a.current);
-    a.current.innerHTML = "";
-    const u = i.stroke[n], c = l.path(
-      J(0, 0, t, 40, i.radius[s]),
+  const a = j(), c = O(null);
+  return R(() => {
+    if (!c.current) return;
+    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]),
       {
-        stroke: u.color,
-        strokeWidth: u.width,
+        stroke: l.color,
+        strokeWidth: l.width,
         fill: "transparent",
-        roughness: i.roughness.roughness,
-        bowing: i.roughness.bowing
+        roughness: a.roughness.roughness,
+        bowing: a.roughness.bowing,
+        fillStyle: r
       }
     );
-    a.current.appendChild(c);
-  }, [i, n, s, t]), /* @__PURE__ */ w.jsx("div", { className: `${Ve["drawui-collapse"]} ${r ?? ""}`, style: { width: t }, children: /* @__PURE__ */ w.jsxs("details", { children: [
-    /* @__PURE__ */ w.jsxs("summary", { style: { position: "relative" }, children: [
-      /* @__PURE__ */ w.jsx(
+    c.current.appendChild(h);
+  }, [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: a,
-          width: t,
+          ref: c,
+          width: n,
           height: 40,
           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: n = "sm",
-  icon: s,
-  backgroundColor: t,
-  ...r
+  size: s = "sm",
+  icon: t,
+  fillStyle: n,
+  backgroundColor: r,
+  ...i
 }) => {
-  const i = A(), a = E(null), [l, u] = U(!1), c = i.buttonSize[n].height;
-  return C(() => {
-    if (!a.current) return;
-    const h = L.svg(a.current);
-    a.current.innerHTML = "";
-    const f = i.stroke[o], d = h.path(
-      J(0, 0, c, c, i.radius[e]),
+  const a = j(), c = O(null), [u, l] = Y(!1), h = a.buttonSize[s].height;
+  return R(() => {
+    if (!c.current) return;
+    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]),
       {
-        stroke: f.color,
-        strokeWidth: f.width,
-        fill: t ?? i.fill.background,
-        roughness: l ? i.roughness.roughness + 1 : i.roughness.roughness,
-        bowing: i.roughness.bowing
+        stroke: d.color,
+        strokeWidth: d.width,
+        fill: r ?? a.fill.background,
+        roughness: u ? a.roughness.roughness + 1 : a.roughness.roughness,
+        bowing: a.roughness.bowing,
+        fillStyle: n
       }
     );
-    a.current.appendChild(d);
-  }, [l, o, e, i, c, t]), /* @__PURE__ */ w.jsxs(
+    c.current.appendChild(g);
+  }, [u, o, e, a, h, r]), /* @__PURE__ */ M.jsxs(
     "button",
     {
-      ...r,
-      onMouseEnter: () => u(!0),
-      onMouseLeave: () => u(!1),
-      className: `${Ht["drawui-button"]} ${r.className ?? ""}`,
+      ...i,
+      onMouseEnter: () => l(!0),
+      onMouseLeave: () => l(!1),
+      className: `${Ft["drawui-button"]} ${i.className ?? ""}`,
       style: {
         position: "relative",
-        width: c,
-        height: c,
+        width: h,
+        height: h,
         // height and width are equal
         border: "none",
         background: "transparent",
@@ -1925,12 +1961,12 @@ const L = {
         padding: 0
       },
       children: [
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "svg",
           {
-            ref: a,
-            width: c,
-            height: c,
+            ref: c,
+            width: h,
+            height: h,
             style: {
               position: "absolute",
               inset: 0,
@@ -1938,7 +1974,7 @@ const L = {
             }
           }
         ),
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "span",
           {
             style: {
@@ -1948,7 +1984,7 @@ const L = {
               alignItems: "center",
               justifyContent: "center"
             },
-            children: s
+            children: t
           }
         )
       ]
@@ -1960,62 +1996,64 @@ const L = {
 }, Xt = ({
   strokeWeight: o = "medium",
   backgroundColor: e,
-  radius: n = "md",
-  inputSize: s = "md",
-  className: t,
-  style: r,
-  ...i
+  radius: s = "md",
+  inputSize: t = "md",
+  className: n,
+  fillStyle: r,
+  style: i,
+  ...a
 }) => {
-  const a = A(), l = E(null), u = E(null), [c, h] = U(!1), [f, d] = U(!1), g = a.inputSize[s].height, m = a.inputSize[s].fontSize, b = a.inputSize[s].paddingX;
-  return C(() => {
-    if (!l.current || !u.current) return;
-    const v = u.current.offsetWidth, y = L.svg(l.current);
-    l.current.innerHTML = "";
-    const z = a.stroke[o], G = y.path(
-      J(0, 0, v, g, a.radius[n]),
+  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, C = A.svg(u.current);
+    u.current.innerHTML = "";
+    const z = c.stroke[o], N = C.path(
+      K(0, 0, y, m, c.radius[s]),
       {
         stroke: z.color,
         strokeWidth: z.width,
-        fill: e ?? a.fill.background,
-        roughness: c ? a.roughness.roughness + 1 : a.roughness.roughness,
-        bowing: a.roughness.bowing
+        fill: e ?? c.fill.background,
+        roughness: h ? c.roughness.roughness + 1 : c.roughness.roughness,
+        bowing: c.roughness.bowing,
+        fillStyle: r
       }
     );
-    l.current.appendChild(G);
-  }, [c, f, o, n, s, a, e]), /* @__PURE__ */ w.jsxs(
+    u.current.appendChild(N);
+  }, [h, d, o, s, t, c, e]), /* @__PURE__ */ M.jsxs(
     "div",
     {
-      ref: u,
-      className: `${Ye["drawui-input"]} ${t ?? ""}`,
-      style: { height: g, ...r },
-      onMouseEnter: () => d(!0),
-      onMouseLeave: () => d(!1),
+      ref: l,
+      className: `${Ye["drawui-input"]} ${n ?? ""}`,
+      style: { height: m, ...i },
+      onMouseEnter: () => g(!0),
+      onMouseLeave: () => g(!1),
       children: [
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "svg",
           {
-            ref: l,
+            ref: u,
             width: "100%",
-            height: g,
+            height: m,
             style: { position: "absolute", inset: 0 }
           }
         ),
-        /* @__PURE__ */ w.jsx(
+        /* @__PURE__ */ M.jsx(
           "input",
           {
-            ...i,
+            ...a,
             className: Ye["drawui-input-field"],
             style: {
-              height: g,
-              fontSize: m,
-              paddingLeft: b,
-              paddingRight: b
+              height: m,
+              fontSize: b,
+              paddingLeft: v,
+              paddingRight: v
             },
-            onFocus: (v) => {
-              h(!0), i.onFocus?.(v);
+            onFocus: (y) => {
+              f(!0), a.onFocus?.(y);
             },
-            onBlur: (v) => {
-              h(!1), i.onBlur?.(v);
+            onBlur: (y) => {
+              f(!1), a.onBlur?.(y);
             }
           }
         )
@@ -2025,203 +2063,203 @@ const L = {
 }, Ut = ({
   size: o = 24,
   strokeWeight: e = "medium",
-  color: n,
-  className: s
+  color: s,
+  className: t
 }) => {
-  const t = 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 = t.stroke[e], l = n ?? a.color, u = i.path(
+    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",
       {
-        stroke: l,
+        stroke: c,
         strokeWidth: a.width,
-        roughness: t.roughness.roughness,
-        bowing: t.roughness.bowing,
+        roughness: n.roughness.roughness,
+        bowing: n.roughness.bowing,
         fill: "transparent"
       }
     );
     r.current.appendChild(u);
-    const c = i.circle(12, 18, 2, {
-      stroke: l,
+    const l = i.circle(12, 18, 2, {
+      stroke: c,
       strokeWidth: a.width,
-      roughness: t.roughness.roughness,
-      bowing: t.roughness.bowing,
+      roughness: n.roughness.roughness,
+      bowing: n.roughness.bowing,
       fill: "transparent"
     });
-    r.current.appendChild(c);
-  }, [t, e, n]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: s });
+    r.current.appendChild(l);
+  }, [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: n,
-  className: s
+  color: s,
+  className: t
 }) => {
-  const t = 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 = t.stroke[e], l = n ?? a.color, u = i.path(
+    const a = n.stroke[e], c = s ?? a.color, u = i.path(
       "M2 12 L12 2 L22 12 V22 H2 Z",
       {
-        stroke: l,
+        stroke: c,
         strokeWidth: a.width,
-        roughness: t.roughness.roughness,
-        bowing: t.roughness.bowing,
+        roughness: n.roughness.roughness,
+        bowing: n.roughness.bowing,
         fill: "transparent"
       }
     );
     r.current.appendChild(u);
-  }, [t, e, n]), /* @__PURE__ */ w.jsx(
+  }, [n, e, s]), /* @__PURE__ */ M.jsx(
     "svg",
     {
       ref: r,
       width: o,
       height: o,
       viewBox: "0 0 24 24",
-      className: s
+      className: t
     }
   );
 }, Jt = ({
   size: o = 24,
   strokeWeight: e = "medium",
-  color: n,
-  className: s
+  color: s,
+  className: t
 }) => {
-  const t = 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 = t.stroke[e], l = n ?? a.color, u = i.line(4, 12, 20, 12, {
-      stroke: l,
+    const a = n.stroke[e], c = s ?? a.color, u = i.line(4, 12, 20, 12, {
+      stroke: c,
       strokeWidth: a.width,
-      roughness: t.roughness.roughness,
-      bowing: t.roughness.bowing
+      roughness: n.roughness.roughness,
+      bowing: n.roughness.bowing
     });
     r.current.appendChild(u);
-  }, [t, e, n]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: s });
+  }, [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: n,
-  className: s
+  color: s,
+  className: t
 }) => {
-  const t = 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 = t.stroke[e], l = n ?? a.color, u = i.line(12, 4, 12, 20, {
-      stroke: l,
+    const a = n.stroke[e], c = s ?? a.color, u = i.line(12, 4, 12, 20, {
+      stroke: c,
       strokeWidth: a.width,
-      roughness: t.roughness.roughness,
-      bowing: t.roughness.bowing
-    }), c = i.line(4, 12, 20, 12, {
-      stroke: l,
+      roughness: n.roughness.roughness,
+      bowing: n.roughness.bowing
+    }), l = i.line(4, 12, 20, 12, {
+      stroke: c,
       strokeWidth: a.width,
-      roughness: t.roughness.roughness,
-      bowing: t.roughness.bowing
+      roughness: n.roughness.roughness,
+      bowing: n.roughness.bowing
     });
-    r.current.appendChild(u), r.current.appendChild(c);
-  }, [t, e, n]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: s });
+    r.current.appendChild(u), r.current.appendChild(l);
+  }, [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: n,
-  className: s
+  color: s,
+  className: t
 }) => {
-  const t = 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 = t.stroke[e], l = n ?? a.color, u = i.circle(10, 10, 14, {
-      stroke: l,
+    const a = n.stroke[e], c = s ?? a.color, u = i.circle(10, 10, 14, {
+      stroke: c,
       strokeWidth: a.width,
-      roughness: t.roughness.roughness,
-      bowing: t.roughness.bowing,
+      roughness: n.roughness.roughness,
+      bowing: n.roughness.bowing,
       fill: "transparent"
-    }), c = i.line(16, 16, 22, 22, {
-      stroke: l,
+    }), l = i.line(16, 16, 22, 22, {
+      stroke: c,
       strokeWidth: a.width,
-      roughness: t.roughness.roughness,
-      bowing: t.roughness.bowing
+      roughness: n.roughness.roughness,
+      bowing: n.roughness.bowing
     });
-    r.current.appendChild(u), r.current.appendChild(c);
-  }, [t, e, n]), /* @__PURE__ */ w.jsx(
+    r.current.appendChild(u), r.current.appendChild(l);
+  }, [n, e, s]), /* @__PURE__ */ M.jsx(
     "svg",
     {
       ref: r,
       width: o,
       height: o,
       viewBox: "0 0 24 24",
-      className: s
+      className: t
     }
   );
 }, ts = ({
   size: o = 24,
   strokeWeight: e = "medium",
-  color: n,
-  className: s
+  color: s,
+  className: t
 }) => {
-  const t = 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 = t.stroke[e], l = n ?? a.color, u = i.circle(12, 12, 14, {
-      stroke: l,
+    const a = n.stroke[e], c = s ?? a.color, u = i.circle(12, 12, 14, {
+      stroke: c,
       strokeWidth: a.width,
-      roughness: t.roughness.roughness,
-      bowing: t.roughness.bowing,
+      roughness: n.roughness.roughness,
+      bowing: n.roughness.bowing,
       fill: "transparent"
     });
     r.current.appendChild(u);
-    for (let c = 0; c < 8; c++) {
-      const h = c * Math.PI * 2 / 8, f = 12 + 7 * Math.cos(h), d = 12 + 7 * Math.sin(h), g = 12 + 10 * Math.cos(h), m = 12 + 10 * Math.sin(h), b = i.line(f, d, g, m, {
-        stroke: l,
+    for (let l = 0; l < 8; l++) {
+      const h = l * Math.PI * 2 / 8, f = 12 + 7 * Math.cos(h), d = 12 + 7 * Math.sin(h), g = 12 + 10 * Math.cos(h), m = 12 + 10 * Math.sin(h), b = i.line(f, d, g, m, {
+        stroke: c,
         strokeWidth: a.width,
-        roughness: t.roughness.roughness,
-        bowing: t.roughness.bowing
+        roughness: n.roughness.roughness,
+        bowing: n.roughness.bowing
       });
       r.current.appendChild(b);
     }
-  }, [t, e, n]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: s });
+  }, [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: n,
-  className: s
+  color: s,
+  className: t
 }) => {
-  const t = 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 = t.stroke[e], l = n ?? a.color, u = i.circle(12, 8, 6, {
-      stroke: l,
+    const a = n.stroke[e], c = s ?? a.color, u = i.circle(12, 8, 6, {
+      stroke: c,
       strokeWidth: a.width,
-      roughness: t.roughness.roughness,
-      bowing: t.roughness.bowing,
+      roughness: n.roughness.roughness,
+      bowing: n.roughness.bowing,
       fill: "transparent"
     });
     r.current.appendChild(u);
-    const c = i.path(
+    const l = i.path(
       "M4 20 Q12 16 20 20",
       {
-        stroke: l,
+        stroke: c,
         strokeWidth: a.width,
-        roughness: t.roughness.roughness,
-        bowing: t.roughness.bowing,
+        roughness: n.roughness.roughness,
+        bowing: n.roughness.bowing,
         fill: "transparent"
       }
     );
-    r.current.appendChild(c);
-  }, [t, e, n]), /* @__PURE__ */ w.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: s });
+    r.current.appendChild(l);
+  }, [n, e, s]), /* @__PURE__ */ M.jsx("svg", { ref: r, width: o, height: o, viewBox: "0 0 24 24", className: t });
 };
 export {
   Vt as DrawuiButton,
@@ -2238,5 +2276,5 @@ export {
   es as IconSearch,
   ts as IconSettings,
   ss as IconUser,
-  A as useDrawuiTheme
+  j as useDrawuiTheme
 };