@superdoc-dev/esign 1.2.0 → 1.3.0

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import ce, { forwardRef as ue, useState as N, useRef as Z, useCallback as P, useEffect as re, useImperativeHandle as de } from "react";
-var Q = { exports: {} }, $ = {};
+import pe, { forwardRef as me, useState as I, useRef as L, useEffect as te, useCallback as M, useImperativeHandle as ge } from "react";
+var re = { exports: {} }, W = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -9,29 +9,29 @@ var Q = { exports: {} }, $ = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var ne;
-function fe() {
-  if (ne) return $;
-  ne = 1;
-  var m = Symbol.for("react.transitional.element"), g = Symbol.for("react.fragment");
-  function f(a, o, u) {
-    var b = null;
-    if (u !== void 0 && (b = "" + u), o.key !== void 0 && (b = "" + o.key), "key" in o) {
-      u = {};
-      for (var _ in o)
-        _ !== "key" && (u[_] = o[_]);
-    } else u = o;
-    return o = u.ref, {
-      $$typeof: m,
+var ie;
+function ve() {
+  if (ie) return W;
+  ie = 1;
+  var g = Symbol.for("react.transitional.element"), v = Symbol.for("react.fragment");
+  function m(a, n, f) {
+    var x = null;
+    if (f !== void 0 && (x = "" + f), n.key !== void 0 && (x = "" + n.key), "key" in n) {
+      f = {};
+      for (var S in n)
+        S !== "key" && (f[S] = n[S]);
+    } else f = n;
+    return n = f.ref, {
+      $$typeof: g,
       type: a,
-      key: b,
-      ref: o !== void 0 ? o : null,
-      props: u
+      key: x,
+      ref: n !== void 0 ? n : null,
+      props: f
     };
   }
-  return $.Fragment = g, $.jsx = f, $.jsxs = f, $;
+  return W.Fragment = v, W.jsx = m, W.jsxs = m, W;
 }
-var q = {};
+var V = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -41,126 +41,126 @@ var q = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var oe;
-function me() {
-  return oe || (oe = 1, process.env.NODE_ENV !== "production" && (function() {
-    function m(e) {
+var ce;
+function be() {
+  return ce || (ce = 1, process.env.NODE_ENV !== "production" && (function() {
+    function g(e) {
       if (e == null) return null;
       if (typeof e == "function")
-        return e.$$typeof === ee ? null : e.displayName || e.name || null;
+        return e.$$typeof === oe ? null : e.displayName || e.name || null;
       if (typeof e == "string") return e;
       switch (e) {
-        case x:
+        case _:
           return "Fragment";
-        case v:
+        case b:
           return "Profiler";
-        case V:
+        case H:
           return "StrictMode";
-        case S:
+        case T:
           return "Suspense";
-        case J:
+        case Z:
           return "SuspenseList";
-        case H:
+        case K:
           return "Activity";
       }
       if (typeof e == "object")
         switch (typeof e.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
         ), e.$$typeof) {
-          case K:
+          case ne:
             return "Portal";
-          case w:
+          case A:
             return e.displayName || "Context";
-          case z:
+          case G:
             return (e._context.displayName || "Context") + ".Consumer";
-          case B:
-            var n = e.render;
-            return e = e.displayName, e || (e = n.displayName || n.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
-          case I:
-            return n = e.displayName || null, n !== null ? n : m(e.type) || "Memo";
-          case C:
-            n = e._payload, e = e._init;
+          case X:
+            var r = e.render;
+            return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case Q:
+            return r = e.displayName || null, r !== null ? r : g(e.type) || "Memo";
+          case P:
+            r = e._payload, e = e._init;
             try {
-              return m(e(n));
+              return g(e(r));
             } catch {
             }
         }
       return null;
     }
-    function g(e) {
+    function v(e) {
       return "" + e;
     }
-    function f(e) {
+    function m(e) {
       try {
-        g(e);
-        var n = !1;
+        v(e);
+        var r = !1;
       } catch {
-        n = !0;
+        r = !0;
       }
-      if (n) {
-        n = console;
-        var l = n.error, c = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
-        return l.call(
-          n,
+      if (r) {
+        r = console;
+        var c = r.error, u = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return c.call(
+          r,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          c
-        ), g(e);
+          u
+        ), v(e);
       }
     }
     function a(e) {
-      if (e === x) return "<>";
-      if (typeof e == "object" && e !== null && e.$$typeof === C)
+      if (e === _) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === P)
         return "<...>";
       try {
-        var n = m(e);
-        return n ? "<" + n + ">" : "<...>";
+        var r = g(e);
+        return r ? "<" + r + ">" : "<...>";
       } catch {
         return "<...>";
       }
     }
-    function o() {
-      var e = T.A;
+    function n() {
+      var e = w.A;
       return e === null ? null : e.getOwner();
     }
-    function u() {
+    function f() {
       return Error("react-stack-top-frame");
     }
-    function b(e) {
+    function x(e) {
       if (y.call(e, "key")) {
-        var n = Object.getOwnPropertyDescriptor(e, "key").get;
-        if (n && n.isReactWarning) return !1;
+        var r = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (r && r.isReactWarning) return !1;
       }
       return e.key !== void 0;
     }
-    function _(e, n) {
-      function l() {
+    function S(e, r) {
+      function c() {
         k || (k = !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)",
-          n
+          r
         ));
       }
-      l.isReactWarning = !0, Object.defineProperty(e, "key", {
-        get: l,
+      c.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: c,
         configurable: !0
       });
     }
-    function L() {
-      var e = m(this.type);
-      return G[e] || (G[e] = !0, console.error(
+    function z() {
+      var e = g(this.type);
+      return N[e] || (N[e] = !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."
       )), e = this.props.ref, e !== void 0 ? e : null;
     }
-    function W(e, n, l, c, O, Y) {
-      var t = l.ref;
+    function B(e, r, c, u, D, q) {
+      var d = c.ref;
       return e = {
-        $$typeof: U,
+        $$typeof: J,
         type: e,
-        key: n,
-        props: l,
-        _owner: c
-      }, (t !== void 0 ? t : null) !== null ? Object.defineProperty(e, "ref", {
+        key: r,
+        props: c,
+        _owner: u
+      }, (d !== void 0 ? d : null) !== null ? Object.defineProperty(e, "ref", {
         enumerable: !1,
-        get: L
+        get: z
       }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
         configurable: !1,
         enumerable: !1,
@@ -175,133 +175,140 @@ function me() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: O
+        value: D
       }), Object.defineProperty(e, "_debugTask", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: Y
+        value: q
       }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
     }
-    function D(e, n, l, c, O, Y) {
-      var t = n.children;
-      if (t !== void 0)
-        if (c)
-          if (te(t)) {
-            for (c = 0; c < t.length; c++)
-              F(t[c]);
-            Object.freeze && Object.freeze(t);
+    function Y(e, r, c, u, D, q) {
+      var d = r.children;
+      if (d !== void 0)
+        if (u)
+          if (ae(d)) {
+            for (u = 0; u < d.length; u++)
+              $(d[u]);
+            Object.freeze && Object.freeze(d);
           } else
             console.error(
               "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 F(t);
-      if (y.call(n, "key")) {
-        t = m(e);
-        var r = Object.keys(n).filter(function(d) {
-          return d !== "key";
+        else $(d);
+      if (y.call(r, "key")) {
+        d = g(e);
+        var C = Object.keys(r).filter(function(se) {
+          return se !== "key";
         });
-        c = 0 < r.length ? "{key: someKey, " + r.join(": ..., ") + ": ...}" : "{key: someKey}", X[t + c] || (r = 0 < r.length ? "{" + r.join(": ..., ") + ": ...}" : "{}", console.error(
+        u = 0 < C.length ? "{key: someKey, " + C.join(": ..., ") + ": ...}" : "{key: someKey}", j[d + u] || (C = 0 < C.length ? "{" + C.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          c,
-          t,
-          r,
-          t
-        ), X[t + c] = !0);
+          u,
+          d,
+          C,
+          d
+        ), j[d + u] = !0);
       }
-      if (t = null, l !== void 0 && (f(l), t = "" + l), b(n) && (f(n.key), t = "" + n.key), "key" in n) {
-        l = {};
-        for (var s in n)
-          s !== "key" && (l[s] = n[s]);
-      } else l = n;
-      return t && _(
-        l,
+      if (d = null, c !== void 0 && (m(c), d = "" + c), x(r) && (m(r.key), d = "" + r.key), "key" in r) {
+        c = {};
+        for (var F in r)
+          F !== "key" && (c[F] = r[F]);
+      } else c = r;
+      return d && S(
+        c,
         typeof e == "function" ? e.displayName || e.name || "Unknown" : e
-      ), W(
+      ), B(
         e,
-        t,
-        l,
-        o(),
-        O,
-        Y
+        d,
+        c,
+        n(),
+        D,
+        q
       );
     }
-    function F(e) {
-      h(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === C && (e._payload.status === "fulfilled" ? h(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    function $(e) {
+      h(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === P && (e._payload.status === "fulfilled" ? h(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
     }
     function h(e) {
-      return typeof e == "object" && e !== null && e.$$typeof === U;
+      return typeof e == "object" && e !== null && e.$$typeof === J;
     }
-    var A = ce, U = Symbol.for("react.transitional.element"), K = Symbol.for("react.portal"), x = Symbol.for("react.fragment"), V = Symbol.for("react.strict_mode"), v = Symbol.for("react.profiler"), z = Symbol.for("react.consumer"), w = Symbol.for("react.context"), B = Symbol.for("react.forward_ref"), S = Symbol.for("react.suspense"), J = Symbol.for("react.suspense_list"), I = Symbol.for("react.memo"), C = Symbol.for("react.lazy"), H = Symbol.for("react.activity"), ee = Symbol.for("react.client.reference"), T = A.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, y = Object.prototype.hasOwnProperty, te = Array.isArray, E = console.createTask ? console.createTask : function() {
+    var O = pe, J = Symbol.for("react.transitional.element"), ne = Symbol.for("react.portal"), _ = Symbol.for("react.fragment"), H = Symbol.for("react.strict_mode"), b = Symbol.for("react.profiler"), G = Symbol.for("react.consumer"), A = Symbol.for("react.context"), X = Symbol.for("react.forward_ref"), T = Symbol.for("react.suspense"), Z = Symbol.for("react.suspense_list"), Q = Symbol.for("react.memo"), P = Symbol.for("react.lazy"), K = Symbol.for("react.activity"), oe = Symbol.for("react.client.reference"), w = O.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, y = Object.prototype.hasOwnProperty, ae = Array.isArray, E = console.createTask ? console.createTask : function() {
       return null;
     };
-    A = {
+    O = {
       react_stack_bottom_frame: function(e) {
         return e();
       }
     };
-    var k, G = {}, M = A.react_stack_bottom_frame.bind(
-      A,
-      u
-    )(), j = E(a(u)), X = {};
-    q.Fragment = x, q.jsx = function(e, n, l) {
-      var c = 1e4 > T.recentlyCreatedOwnerStacks++;
-      return D(
+    var k, N = {}, ee = O.react_stack_bottom_frame.bind(
+      O,
+      f
+    )(), U = E(a(f)), j = {};
+    V.Fragment = _, V.jsx = function(e, r, c) {
+      var u = 1e4 > w.recentlyCreatedOwnerStacks++;
+      return Y(
         e,
-        n,
-        l,
+        r,
+        c,
         !1,
-        c ? Error("react-stack-top-frame") : M,
-        c ? E(a(e)) : j
+        u ? Error("react-stack-top-frame") : ee,
+        u ? E(a(e)) : U
       );
-    }, q.jsxs = function(e, n, l) {
-      var c = 1e4 > T.recentlyCreatedOwnerStacks++;
-      return D(
+    }, V.jsxs = function(e, r, c) {
+      var u = 1e4 > w.recentlyCreatedOwnerStacks++;
+      return Y(
         e,
-        n,
-        l,
+        r,
+        c,
         !0,
-        c ? Error("react-stack-top-frame") : M,
-        c ? E(a(e)) : j
+        u ? Error("react-stack-top-frame") : ee,
+        u ? E(a(e)) : U
       );
     };
-  })()), q;
+  })()), V;
 }
-var ae;
-function pe() {
-  return ae || (ae = 1, process.env.NODE_ENV === "production" ? Q.exports = fe() : Q.exports = me()), Q.exports;
+var le;
+function xe() {
+  return le || (le = 1, process.env.NODE_ENV === "production" ? re.exports = ve() : re.exports = be()), re.exports;
 }
-var p = pe();
-const ge = ({
-  value: m,
-  onChange: g,
-  isDisabled: f,
+var p = xe();
+const he = ({
+  value: g,
+  onChange: v,
+  isDisabled: m,
   label: a
-}) => /* @__PURE__ */ p.jsxs("div", { className: "superdoc-esign-signature-input", style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
-  a && /* @__PURE__ */ p.jsx("label", { children: a }),
-  /* @__PURE__ */ p.jsx(
-    "input",
-    {
-      type: "text",
-      value: String(m || ""),
-      onChange: (o) => g(o.target.value),
-      disabled: f,
-      placeholder: "Type your full name",
-      style: {
-        fontFamily: "cursive",
-        fontSize: "18px"
-      }
-    }
-  )
-] }), ve = ({
-  value: m,
-  onChange: g,
-  isDisabled: f,
+}) => /* @__PURE__ */ p.jsxs(
+  "div",
+  {
+    className: "superdoc-esign-signature-input",
+    style: { display: "flex", flexDirection: "column", gap: "8px" },
+    children: [
+      a && /* @__PURE__ */ p.jsx("label", { children: a }),
+      /* @__PURE__ */ p.jsx(
+        "input",
+        {
+          type: "text",
+          value: String(g || ""),
+          onChange: (n) => v(n.target.value),
+          disabled: m,
+          placeholder: "Type your full name",
+          style: {
+            fontFamily: "cursive",
+            fontSize: "18px"
+          }
+        }
+      )
+    ]
+  }
+), ye = ({
+  value: g,
+  onChange: v,
+  isDisabled: m,
   label: a
 }) => /* @__PURE__ */ p.jsxs(
   "label",
@@ -313,120 +320,119 @@ const ge = ({
         "input",
         {
           type: "checkbox",
-          checked: !!m,
-          onChange: (o) => g(o.target.checked),
-          disabled: f
+          checked: !!g,
+          onChange: (n) => v(n.target.checked),
+          disabled: m
         }
       ),
       /* @__PURE__ */ p.jsx("span", { children: a })
     ]
   }
-), be = (m) => ({
-  onClick: f,
+), Ee = (g) => ({
+  onClick: m,
   fileName: a,
-  isDisabled: o
+  isDisabled: n
 }) => {
-  const u = m?.label || "Download";
+  const f = g?.label || "Download";
   return /* @__PURE__ */ p.jsxs(
     "button",
     {
-      onClick: f,
-      disabled: o,
-      className: "superdoc-esign-btn",
+      onClick: m,
+      disabled: n,
+      className: "superdoc-esign-btn superdoc-esign-btn--download",
       style: {
-        padding: "10px 20px",
+        padding: "8px 16px",
         borderRadius: "6px",
-        border: "none",
-        background: "#fff",
+        border: "1px solid #d0d5dd",
+        background: "#ffffff",
         color: "#333",
-        cursor: o ? "not-allowed" : "pointer",
-        opacity: o ? 0.5 : 1,
+        cursor: n ? "not-allowed" : "pointer",
+        opacity: n ? 0.5 : 1,
         fontSize: "16px",
         fontWeight: "bold"
       },
       children: [
-        u,
+        f,
         " ",
         a && `(${a})`
       ]
     }
   );
-}, he = (m) => ({
-  onClick: f,
+}, _e = (g) => ({
+  onClick: m,
   isValid: a,
-  isDisabled: o,
-  isSubmitting: u
+  isDisabled: n,
+  isSubmitting: f
 }) => {
-  const b = () => m?.label || "Submit";
+  const x = () => g?.label || "Submit";
   return /* @__PURE__ */ p.jsx(
     "button",
     {
-      onClick: f,
-      disabled: !a || o || u,
-      className: "superdoc-esign-btn",
+      onClick: m,
+      disabled: !a || n || f,
+      className: "superdoc-esign-btn superdoc-esign-btn--submit",
       style: {
         padding: "12px 24px",
         borderRadius: "6px",
         border: "none",
         background: "#007bff",
         color: "#fff",
-        cursor: !a || o ? "not-allowed" : "pointer",
-        opacity: !a || o ? 0.5 : 1,
+        cursor: !a || n ? "not-allowed" : "pointer",
+        opacity: !a || n ? 0.5 : 1,
         fontSize: "16px",
         fontWeight: "bold"
       },
-      children: b()
+      children: x()
     }
   );
-}, Ee = ue(
-  (m, g) => {
+}, Re = me(
+  (g, v) => {
     const {
-      eventId: f,
+      eventId: m,
       document: a,
-      fields: o = {},
-      download: u,
-      submit: b,
-      onSubmit: _,
-      onDownload: L,
-      onStateChange: W,
-      onFieldChange: D,
-      onFieldsDiscovered: F,
+      fields: n = {},
+      download: f,
+      submit: x,
+      onSubmit: S,
+      onDownload: z,
+      onStateChange: B,
+      onFieldChange: Y,
+      onFieldsDiscovered: $,
       isDisabled: h = !1,
-      className: A,
-      style: U,
-      documentHeight: K = "600px"
-    } = m, [x, V] = N(
+      className: O,
+      style: J,
+      documentHeight: ne = "600px"
+    } = g, [_, H] = I(
       !a.validation?.scroll?.required
-    ), [v, z] = N(/* @__PURE__ */ new Map()), [w, B] = N(!1), [S, J] = N(!1), [I, C] = N([]), [H, ee] = N(!1), T = Z(null), y = Z(null), te = Z(Date.now()), E = Z(o);
-    E.current = o;
-    const k = P((t) => {
+    ), [b, G] = I(
+      /* @__PURE__ */ new Map()
+    ), [A, X] = I(!1), [T, Z] = I(!1), [Q, P] = I([]), [K, oe] = I(!1), w = L(null), y = L(null), ae = L(Date.now()), E = L(n), k = L([]);
+    E.current = n, te(() => {
+      k.current = Q;
+    }, [Q]);
+    const N = M((t) => {
       if (!y.current?.activeEditor) return;
-      const r = y.current.activeEditor, s = E.current.signer?.find((i) => i.id === t.id);
-      let d;
-      s?.type === "signature" && t.value ? d = {
+      const o = y.current.activeEditor, s = E.current.signer?.find(
+        (i) => i.id === t.id
+      );
+      let l;
+      s?.type === "signature" && t.value ? l = {
         json: {
           type: "image",
-          attrs: { src: typeof t.value == "string" && t.value.startsWith("data:image/") ? t.value : G(String(t.value)), alt: "Signature" }
+          attrs: { src: typeof t.value == "string" && t.value.startsWith("data:image/") ? t.value : ee(String(t.value)), alt: "Signature" }
         }
-      } : d = { text: String(t.value ?? "") }, t.id && r.commands.updateStructuredContentById(
-        t.id,
-        d
-      );
+      } : l = { text: String(t.value ?? "") }, t.id && o.commands.updateStructuredContentById(t.id, l);
     }, []);
-    function G(t) {
-      const r = globalThis.document.createElement("canvas"), s = r.getContext("2d"), d = 30;
-      s.font = `italic ${d}px cursive`;
-      const R = s.measureText(t).width, se = d * 1.3, ie = 4, le = 6;
-      return r.width = Math.ceil(R + ie * 2) + 20, r.height = Math.ceil(se + le * 2), s.font = `italic ${d}px cursive`, s.fillStyle = "black", s.textAlign = "center", s.textBaseline = "middle", s.fillText(
-        t,
-        r.width / 2,
-        r.height / 2
-      ), r.toDataURL("image/png");
+    function ee(t) {
+      const o = globalThis.document.createElement("canvas"), s = o.getContext("2d"), l = 30;
+      s.font = `italic ${l}px cursive`;
+      const R = s.measureText(t).width, ue = l * 1.3, de = 4, fe = 6;
+      return o.width = Math.ceil(R + de * 2) + 20, o.height = Math.ceil(ue + fe * 2), s.font = `italic ${l}px cursive`, s.fillStyle = "black", s.textAlign = "center", s.textBaseline = "middle", s.fillText(t, o.width / 2, o.height / 2), o.toDataURL("image/png");
     }
-    const M = P(
+    const U = M(
       (t) => {
         if (!t) return;
-        const r = t.helpers.structuredContentCommands.getStructuredContentTags(
+        const o = t.helpers.structuredContentCommands.getStructuredContentTags(
           t.state
         ), s = /* @__PURE__ */ new Map();
         E.current.document?.forEach((i) => {
@@ -434,222 +440,279 @@ const ge = ({
         }), E.current.signer?.forEach((i) => {
           i.value !== void 0 && s.set(i.id, i.value);
         });
-        const d = r.map(({ node: i }) => ({
+        const l = o.map(({ node: i }) => ({
           id: i.attrs.id,
           label: i.attrs.label,
           value: s.get(i.attrs.id) ?? i.textContent ?? ""
         })).filter((i) => i.id);
-        d.length > 0 && (F?.(d), [
+        l.length > 0 && ($?.(l), [
           ...E.current.document || [],
           ...E.current.signer || []
         ].filter((R) => R.value !== void 0).forEach(
-          (R) => k({
+          (R) => N({
             id: R.id,
             value: R.value
           })
         ));
       },
-      [F, k]
+      [$, N]
     ), j = (t) => {
-      const r = {
+      const o = {
         ...t,
         timestamp: (/* @__PURE__ */ new Date()).toISOString()
-      };
-      C((s) => [...s, r]);
+      }, s = globalThis?.__SUPERDOC_AUDIT_MOCK__;
+      s && s(o);
+      const l = [...k.current, o];
+      return k.current = l, P(l), l;
     };
-    re(() => T.current ? ((async () => {
-      const { SuperDoc: r } = await import("./superdoc.es-CqejOF1J.js").then((d) => d.D), s = new r({
-        selector: T.current,
+    te(() => w.current ? ((async () => {
+      const { SuperDoc: o } = await import("./superdoc.es-CqejOF1J.js").then((l) => l.D), s = new o({
+        selector: w.current,
         document: a.source,
         documentMode: "viewing",
         onReady: () => {
-          s.activeEditor && M(s.activeEditor), j({ type: "ready" }), ee(!0);
+          s.activeEditor && U(s.activeEditor), j({ type: "ready" }), oe(!0);
         }
       });
       y.current = s;
     })(), () => {
-      y.current && (y.current.destroy(), y.current = null);
-    }) : void 0, [a.source, a.mode, M]), re(() => {
-      if (!a.validation?.scroll?.required || !H) return;
-      const t = T.current;
+      y.current && (typeof y.current.destroy == "function" && y.current.destroy(), y.current = null);
+    }) : void 0, [a.source, a.mode, U]), te(() => {
+      if (!a.validation?.scroll?.required || !K) return;
+      const t = w.current;
       if (!t) return;
-      const r = () => {
-        const { scrollTop: s, scrollHeight: d, clientHeight: i } = t, R = s / (d - i);
-        (R >= 0.95 || d <= i) && (V(!0), j({
+      const o = () => {
+        const { scrollTop: s, scrollHeight: l, clientHeight: i } = t, R = s / (l - i);
+        (R >= 0.95 || l <= i) && (H(!0), j({
           type: "scroll",
           data: { percent: Math.round(R * 100) }
         }));
       };
-      return t.addEventListener("scroll", r), r(), () => t.removeEventListener("scroll", r);
-    }, [a.validation?.scroll?.required, H]);
-    const X = P(
-      (t, r) => {
-        z((s) => {
-          const d = s.get(t), i = new Map(s);
-          return i.set(t, r), k({
+      return t.addEventListener("scroll", o), o(), () => t.removeEventListener("scroll", o);
+    }, [a.validation?.scroll?.required, K]);
+    const e = M(
+      (t, o) => {
+        G((s) => {
+          const l = s.get(t), i = new Map(s);
+          return i.set(t, o), N({
             id: t,
-            value: r
+            value: o
           }), j({
             type: "field_change",
-            data: { fieldId: t, value: r, previousValue: d }
-          }), D?.({
+            data: { fieldId: t, value: o, previousValue: l }
+          }), Y?.({
             id: t,
-            value: r,
-            previousValue: d
+            value: o,
+            previousValue: l
           }), i;
         });
       },
-      [D, k]
-    ), e = P(() => a.validation?.scroll?.required && !x ? !1 : (o.signer || []).every((t) => {
+      [Y, N]
+    ), r = M(() => a.validation?.scroll?.required && !_ ? !1 : (n.signer || []).every((t) => {
       if (!t.validation?.required) return !0;
-      const r = v.get(t.id);
-      return r && (typeof r != "string" || r.trim());
-    }), [x, o.signer, v, a.validation?.scroll?.required]);
-    re(() => {
-      const t = e();
-      B(t), W?.({
-        scrolled: x,
-        fields: v,
+      const o = b.get(t.id);
+      return o && (typeof o != "string" || o.trim());
+    }), [
+      _,
+      n.signer,
+      b,
+      a.validation?.scroll?.required
+    ]);
+    te(() => {
+      const t = r();
+      X(t), B?.({
+        scrolled: _,
+        fields: b,
         isValid: t,
-        isSubmitting: S
+        isSubmitting: T
       });
-    }, [x, v, S, e, W]);
-    const n = P(async () => {
+    }, [_, b, T, r, B]);
+    const c = M(async () => {
       if (h) return;
       const t = {
-        eventId: f,
+        eventId: m,
         documentSource: a.source,
         fields: {
-          document: o.document || [],
-          signer: (o.signer || []).map((r) => ({
-            id: r.id,
-            value: v.get(r.id) ?? null
+          document: n.document || [],
+          signer: (n.signer || []).map((o) => ({
+            id: o.id,
+            value: b.get(o.id) ?? null
           }))
         },
-        fileName: u?.fileName || "document.pdf"
+        fileName: f?.fileName || "document.pdf"
       };
-      await L?.(t);
-    }, [h, f, a.source, o, v, u, L]), l = P(async () => {
-      if (!w || h || S) return;
-      J(!0), j({ type: "submit" });
-      const t = {
-        eventId: f,
+      await z?.(t);
+    }, [
+      h,
+      m,
+      a.source,
+      n,
+      b,
+      f,
+      z
+    ]), u = M(async () => {
+      if (!A || h || T) return;
+      Z(!0), j({ type: "submit" });
+      const t = j({ type: "submit" }), o = {
+        eventId: m,
         timestamp: (/* @__PURE__ */ new Date()).toISOString(),
-        duration: Math.floor((Date.now() - te.current) / 1e3),
-        auditTrail: I,
-        documentFields: o.document || [],
-        signerFields: (o.signer || []).map((r) => ({
-          id: r.id,
-          value: v.get(r.id) ?? null
+        duration: Math.floor((Date.now() - ae.current) / 1e3),
+        auditTrail: t,
+        documentFields: n.document || [],
+        signerFields: (n.signer || []).map((s) => ({
+          id: s.id,
+          value: b.get(s.id) ?? null
         })),
-        isFullyCompleted: w
+        isFullyCompleted: A
       };
       try {
-        await _(t);
+        await S(o);
       } finally {
-        J(!1);
+        Z(!1);
       }
     }, [
-      w,
+      A,
       h,
-      S,
-      f,
-      I,
-      o,
-      v,
-      _
-    ]), c = (t) => {
-      const r = t.component || O(t.type);
+      T,
+      m,
+      n,
+      b,
+      S
+    ]), D = (t) => {
+      const o = t.component || q(t.type);
       return /* @__PURE__ */ p.jsx(
-        r,
+        o,
         {
-          value: v.get(t.id) ?? null,
-          onChange: (s) => X(t.id, s),
+          value: b.get(t.id) ?? null,
+          onChange: (s) => e(t.id, s),
           isDisabled: h,
           label: t.label
         },
         t.id
       );
-    }, O = (t) => {
+    }, q = (t) => {
       switch (t) {
         case "signature":
         case "text":
-          return ge;
+          return he;
         case "checkbox":
-          return ve;
+          return ye;
       }
-    }, Y = () => {
-      const t = u?.component || be(u), r = b?.component || he(b);
-      return /* @__PURE__ */ p.jsxs(
+    }, d = () => {
+      const t = f?.component || Ee(f);
+      return t ? /* @__PURE__ */ p.jsx(
+        t,
+        {
+          onClick: c,
+          fileName: f?.fileName,
+          isDisabled: h
+        }
+      ) : null;
+    }, C = () => {
+      if (a.mode === "download")
+        return null;
+      const t = x?.component || _e(x);
+      return /* @__PURE__ */ p.jsx(
         "div",
         {
-          className: "superdoc-esign-actions",
+          className: "superdoc-esign-actions superdoc-esign-form-actions",
           style: { display: "flex", gap: "10px" },
-          children: [
-            a.mode !== "download" && /* @__PURE__ */ p.jsx(
-              r,
-              {
-                onClick: l,
-                isValid: w,
-                isDisabled: h,
-                isSubmitting: S
-              }
-            ),
-            /* @__PURE__ */ p.jsx(
-              t,
-              {
-                onClick: n,
-                fileName: u?.fileName,
-                isDisabled: h
-              }
-            )
-          ]
+          children: /* @__PURE__ */ p.jsx(
+            t,
+            {
+              onClick: u,
+              isValid: A,
+              isDisabled: h,
+              isSubmitting: T
+            }
+          )
         }
       );
-    };
-    return de(g, () => ({
+    }, F = d(), se = C();
+    return ge(v, () => ({
       getState: () => ({
-        scrolled: x,
-        fields: v,
-        isValid: w,
-        isSubmitting: S
+        scrolled: _,
+        fields: b,
+        isValid: A,
+        isSubmitting: T
       }),
-      getAuditTrail: () => I,
+      getAuditTrail: () => k.current,
       reset: () => {
-        V(!a.validation?.scroll?.required), z(/* @__PURE__ */ new Map()), B(!1), C([]);
+        H(!a.validation?.scroll?.required), G(/* @__PURE__ */ new Map()), X(!1), k.current = [], P([]);
       }
     })), /* @__PURE__ */ p.jsxs(
       "div",
       {
-        className: `superdoc-esign-container ${A || ""}`,
-        style: U,
+        className: `superdoc-esign-container ${O || ""}`,
+        style: J,
         children: [
-          /* @__PURE__ */ p.jsx("div", { className: "superdoc-esign-document", children: /* @__PURE__ */ p.jsx(
+          /* @__PURE__ */ p.jsxs(
+            "div",
+            {
+              className: "superdoc-esign-document",
+              "data-testid": "superdoc-esign-document",
+              style: { display: "flex", flexDirection: "column" },
+              children: [
+                F && /* @__PURE__ */ p.jsx(
+                  "div",
+                  {
+                    className: "superdoc-esign-document-toolbar",
+                    style: {
+                      display: "flex",
+                      justifyContent: "flex-end",
+                      alignItems: "center",
+                      padding: "8px 12px"
+                    },
+                    children: /* @__PURE__ */ p.jsx(
+                      "div",
+                      {
+                        className: "superdoc-esign-document-controls",
+                        style: { display: "flex", gap: "8px" },
+                        children: F
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ p.jsx(
+                  "div",
+                  {
+                    ref: w,
+                    className: "superdoc-esign-document-viewer",
+                    "data-testid": "superdoc-scroll-container",
+                    style: { height: ne, overflow: "auto" }
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ p.jsxs(
             "div",
             {
-              ref: T,
-              style: { height: K, overflow: "auto" }
+              className: "superdoc-esign-controls",
+              style: { marginTop: "20px" },
+              "data-testid": "superdoc-esign-controls",
+              children: [
+                n.signer && n.signer.length > 0 && /* @__PURE__ */ p.jsx(
+                  "div",
+                  {
+                    className: "superdoc-esign-fields",
+                    style: { marginBottom: "20px" },
+                    "data-testid": "superdoc-esign-fields",
+                    children: n.signer.map(D)
+                  }
+                ),
+                se
+              ]
             }
-          ) }),
-          /* @__PURE__ */ p.jsxs("div", { className: "superdoc-esign-controls", style: { marginTop: "20px" }, children: [
-            o.signer && o.signer.length > 0 && /* @__PURE__ */ p.jsx(
-              "div",
-              {
-                className: "superdoc-esign-fields",
-                style: { marginBottom: "20px" },
-                children: o.signer.map(c)
-              }
-            ),
-            Y()
-          ] })
+          )
         ]
       }
     );
   }
 );
-Ee.displayName = "SuperDocESign";
+Re.displayName = "SuperDocESign";
 export {
-  ve as CheckboxInput,
-  ge as SignatureInput,
-  Ee as default
+  ye as CheckboxInput,
+  he as SignatureInput,
+  Re as default
 };