@shznet/pdf-sign-react 0.2.2 → 0.2.3

package/README.md

@@ -36,7 +36,7 @@ export function App() {
 ```
 
 ```tsx
-<button onClick={() => controlRef.current?.print({ withSignatures: true })}>
+<button onClick={() => controlRef.current?.print()}>
   Print PDF
 </button>
 ```
@@ -46,10 +46,105 @@ export function App() {
 | Prop | Type | Description |
 |------|------|-------------|
 | `src` | `string \| Uint8Array \| ArrayBuffer` | PDF source to load. |
-| `viewMode` | `'single' \| 'scroll'` | Initial view mode. |
+| `page` | `number` | Current page number (1-based). Supports two-way binding via state. |
+| `viewMode` | `'single' \| 'scroll'` | View mode - changes trigger re-render. |
+| `scale` | `number` | Zoom scale - changes trigger re-render. |
 | `zoomable` | `boolean` | Enable/disable gesture zooming (default: true). |
-| `fields` | `SignatureField[]` | Initial fields to render. |
+| `fields` | `SignatureField[]` | Controlled fields list. |
+| `pdfLoaderOptions` | `PdfLoaderOptions` | PDF.js configuration (workerSrc, etc.). |
+| `onReady` | `(control: PdfSignControl) => void` | Callback when control is initialized. |
 | `onLoad` | `() => void` | Callback when PDF is loaded. |
-| `onPageChange` | `(page: number, total: number) => void` | Callback when page changes. |
+| `onPageChange` | `(page: number, total: number) => void` | Callback when page changes (enables two-way binding). |
 | `onScaleChange` | `(scale: number) => void` | Callback when zoom level changes. |
-| `onFieldsChange` | `(fields: SignatureField[]) => void` | Callback when fields are added/removed/updated. |
+| `onFieldsChange` | `(fields: SignatureField[]) => void` | Callback when fields are modified. |
+| `onError` | `(error: Error) => void` | Callback on errors. |
+
+## Two-Way Binding Example
+
+```tsx
+import { PdfSignReact } from '@shznet/pdf-sign-react';
+import { useState } from 'react';
+
+export function App() {
+  const [currentPage, setCurrentPage] = useState(1);
+  const [totalPages, setTotalPages] = useState(0);
+  const [scale, setScale] = useState(1.0);
+
+  return (
+    <div>
+      <div>
+        <button onClick={() => setCurrentPage(p => Math.max(1, p - 1))}>
+          Previous
+        </button>
+        <span>Page {currentPage} / {totalPages}</span>
+        <button onClick={() => setCurrentPage(p => Math.min(totalPages, p + 1))}>
+          Next
+        </button>
+        
+        <button onClick={() => setScale(s => s + 0.25)}>Zoom In</button>
+        <button onClick={() => setScale(s => Math.max(0.25, s - 0.25))}>Zoom Out</button>
+      </div>
+
+      <PdfSignReact
+        src="https://example.com/doc.pdf"
+        page={currentPage}
+        scale={scale}
+        onPageChange={(page, total) => {
+          setCurrentPage(page);  // Two-way binding
+          setTotalPages(total);
+        }}
+        onScaleChange={setScale}  // Two-way binding
+        style={{ height: '600px' }}
+      />
+    </div>
+  );
+}
+```
+
+## Ref Methods
+
+Access methods via `ref` for imperative control:
+
+```tsx
+const pdfRef = useRef<PdfSignReactRef>(null);
+
+// Navigation
+pdfRef.current?.goToPage(5);
+pdfRef.current?.nextPage();
+pdfRef.current?.previousPage();
+const currentPage = pdfRef.current?.getCurrentPage();
+const totalPages = pdfRef.current?.getTotalPages();
+
+// Zoom
+pdfRef.current?.setScale(1.5);
+const scale = pdfRef.current?.getScale();
+
+// View Mode
+await pdfRef.current?.setViewMode('single');
+const mode = pdfRef.current?.getViewMode();
+
+// Page Dimensions
+const dims = await pdfRef.current?.getPageDimensions(0); // Page 1 (0-based index)
+console.log(`Page size: ${dims?.width} x ${dims?.height} points`);
+
+// Field Management
+await pdfRef.current?.addField({
+  id: 'sig1',
+  pageIndex: 0,
+  rect: { x: 100, y: 100, width: 200, height: 80 },
+  type: 'signature',
+  content: '<svg>...</svg>',
+  draggable: true,
+  resizable: true
+});
+
+pdfRef.current?.removeField('sig1');
+pdfRef.current?.updateField('sig1', { rect: { x: 150, y: 150, width: 200, height: 80 } });
+const fields = pdfRef.current?.getFields();
+
+// Printing
+await pdfRef.current?.print({ withSignatures: false });
+
+// Direct Control Access
+const control = pdfRef.current?.getControl();
+```

package/dist/index.js

@@ -1,5 +1,5 @@
 import { jsx as an } from "react/jsx-runtime";
-import { forwardRef as on, useRef as rs, useImperativeHandle as hn, useEffect as Kt } from "react";
+import { forwardRef as on, useRef as rs, useImperativeHandle as hn, useEffect as Vt } from "react";
 var vi = (c) => {
   throw TypeError(c);
 }, Ds = (c, t, e) => t.has(c) || vi("Cannot " + e), Y = (c, t, e) => (Ds(c, t, "read from private field"), e ? e.call(c) : t.get(c)), Ft = (c, t, e) => t.has(c) ? vi("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(c) : t.set(c, e), mt = (c, t, e, s) => (Ds(c, t, "write to private field"), t.set(c, e), e), It = (c, t, e) => (Ds(c, t, "access private method"), e), ln = (c, t, e, s) => ({
@@ -361,38 +361,38 @@ function L(c, t, e, s = !1) {
     writable: !1
   }), e;
 }
-const Xt = (function() {
+const Yt = (function() {
   function c(t, e) {
     this.message = t, this.name = e;
   }
   return c.prototype = new Error(), c.constructor = c, c;
 })();
-class Xs extends Xt {
+class Xs extends Yt {
   constructor(t, e) {
     super(t, "PasswordException"), this.code = e;
   }
 }
-class os extends Xt {
+class os extends Yt {
   constructor(t, e) {
     super(t, "UnknownErrorException"), this.details = e;
   }
 }
-class ys extends Xt {
+class ys extends Yt {
   constructor(t) {
     super(t, "InvalidPDFException");
   }
 }
-class We extends Xt {
+class We extends Yt {
   constructor(t, e, s) {
     super(t, "ResponseException"), this.status = e, this.missing = s;
   }
 }
-class bn extends Xt {
+class bn extends Yt {
   constructor(t) {
     super(t, "FormatError");
   }
 }
-class $t extends Xt {
+class $t extends Yt {
   constructor(t) {
     super(t, "AbortException");
   }
@@ -913,7 +913,7 @@ class ke {
     return T.applyInverseTransform(s, this.transform), s;
   }
 }
-class Rs extends Xt {
+class Rs extends Yt {
   constructor(t, e = 0) {
     super(t, "RenderingCancelledException"), this.extraDelay = e;
   }
@@ -1110,7 +1110,7 @@ function Et(c) {
   } = c.getTransform().invertSelf();
   return [t, e, s, i, n, r];
 }
-function jt(c, t, e = !1, s = !0) {
+function Wt(c, t, e = !1, s = !0) {
   if (t instanceof ke) {
     const {
       pageWidth: i,
@@ -8025,7 +8025,7 @@ class he {
 }
 for (const c in Ee)
   he.prototype[c] !== void 0 && (he.prototype[Ee[c]] = he.prototype[c]);
-class Wt {
+class qt {
   static #t = null;
   static #e = "";
   static get workerPort() {
@@ -9209,7 +9209,7 @@ class yt {
       pageX: r,
       pageY: a
     } = s.rawDims;
-    this.#b = [1, 0, 0, -1, -r, a + n], this.#o = i, this.#n = n, yt.#P(), e.style.setProperty("--min-font-size", yt.#_), jt(e, s), this.#t.promise.finally(() => {
+    this.#b = [1, 0, 0, -1, -r, a + n], this.#o = i, this.#n = n, yt.#P(), e.style.setProperty("--min-font-size", yt.#_), Wt(e, s), this.#t.promise.finally(() => {
       yt.#A.delete(this), this.#r = null, this.#p = null;
     }).catch(() => {
     });
@@ -9241,7 +9241,7 @@ class yt {
     onBefore: e = null
   }) {
     const s = t.scale * kt.pixelRatio, i = t.rotation;
-    if (i !== this.#u && (e?.(), this.#u = i, jt(this.#h, {
+    if (i !== this.#u && (e?.(), this.#u = i, Wt(this.#h, {
       rotation: i
     })), s !== this.#d) {
       e?.(), this.#d = s;
@@ -9421,7 +9421,7 @@ function Gi(c = {}) {
   };
   l || (l = Cs.create({
     verbosity: d,
-    port: Wt.workerPort
+    port: qt.workerPort
   }), t._worker = l);
   const de = {
     docId: e,
@@ -10011,14 +10011,14 @@ class Nr {
     return this._stats;
   }
 }
-var Vt, Pt, Ht, le, gs, Jt, ne, St, Ue, Wi, qi, me, _e, Xe;
+var Gt, Pt, Ht, le, gs, Jt, ne, St, Ue, Wi, qi, me, _e, Xe;
 const rt = class Ae {
   constructor({
     name: t = null,
     port: e = null,
     verbosity: s = fn()
   } = {}) {
-    if (Ft(this, St), Ft(this, Vt, Promise.withResolvers()), Ft(this, Pt, null), Ft(this, Ht, null), Ft(this, le, null), this.name = t, this.destroyed = !1, this.verbosity = s, e) {
+    if (Ft(this, St), Ft(this, Gt, Promise.withResolvers()), Ft(this, Pt, null), Ft(this, Ht, null), Ft(this, le, null), this.name = t, this.destroyed = !1, this.verbosity = s, e) {
       if (Y(Ae, ne).has(e))
         throw new Error("Cannot use more than one PDFWorker per port.");
       Y(Ae, ne).set(e, this), It(this, St, Wi).call(this, e);
@@ -10026,7 +10026,7 @@ const rt = class Ae {
       It(this, St, qi).call(this);
   }
   get promise() {
-    return Y(this, Vt).promise;
+    return Y(this, Gt).promise;
   }
   get port() {
     return Y(this, Ht);
@@ -10047,8 +10047,8 @@ const rt = class Ae {
     return new Ae(t);
   }
   static get workerSrc() {
-    if (Wt.workerSrc)
-      return Wt.workerSrc;
+    if (qt.workerSrc)
+      return qt.workerSrc;
     throw new Error('No "GlobalWorkerOptions.workerSrc" specified.');
   }
   static get _setupFakeWorkerGlobal() {
@@ -10059,8 +10059,8 @@ const rt = class Ae {
     )).WorkerMessageHandler)());
   }
 };
-Vt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap(), Ht = /* @__PURE__ */ new WeakMap(), le = /* @__PURE__ */ new WeakMap(), gs = /* @__PURE__ */ new WeakMap(), Jt = /* @__PURE__ */ new WeakMap(), ne = /* @__PURE__ */ new WeakMap(), St = /* @__PURE__ */ new WeakSet(), Ue = function() {
-  Y(this, Vt).resolve(), Y(this, Pt).send("configure", {
+Gt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap(), Ht = /* @__PURE__ */ new WeakMap(), le = /* @__PURE__ */ new WeakMap(), gs = /* @__PURE__ */ new WeakMap(), Jt = /* @__PURE__ */ new WeakMap(), ne = /* @__PURE__ */ new WeakMap(), St = /* @__PURE__ */ new WeakSet(), Ue = function() {
+  Y(this, Gt).resolve(), Y(this, Pt).send("configure", {
     verbosity: this.verbosity
   });
 }, Wi = function(c) {
@@ -10079,7 +10079,7 @@ Vt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap(), Ht = /*
     const t = new Worker(c, {
       type: "module"
     }), e = new ve("main", "worker", t), s = () => {
-      i.abort(), e.destroy(), t.terminate(), this.destroyed ? Y(this, Vt).reject(new Error("Worker was destroyed")) : It(this, St, me).call(this);
+      i.abort(), e.destroy(), t.terminate(), this.destroyed ? Y(this, Gt).reject(new Error("Worker was destroyed")) : It(this, St, me).call(this);
     }, i = new AbortController();
     t.addEventListener("error", () => {
       Y(this, le) || s();
@@ -10115,7 +10115,7 @@ Vt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap(), Ht = /*
 }, me = function() {
   Y(rt, Jt) || (I("Setting up fake worker."), mt(rt, Jt, !0)), rt._setupFakeWorkerGlobal.then((c) => {
     if (this.destroyed) {
-      Y(this, Vt).reject(new Error("Worker was destroyed"));
+      Y(this, Gt).reject(new Error("Worker was destroyed"));
       return;
     }
     const t = new jn();
@@ -10123,7 +10123,7 @@ Vt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap(), Ht = /*
     const e = `fake${ln(rt, gs)._++}`, s = new ve(e + "_worker", e, t);
     c.setup(s, t), mt(this, Pt, new ve(e, e + "_worker", t)), It(this, St, Ue).call(this);
   }).catch((c) => {
-    Y(this, Vt).reject(new Error(`Setting up fake worker failed: "${c.message}".`));
+    Y(this, Gt).reject(new Error(`Setting up fake worker failed: "${c.message}".`));
   });
 }, _e = /* @__PURE__ */ new WeakSet(), Xe = function() {
   try {
@@ -10131,7 +10131,7 @@ Vt = /* @__PURE__ */ new WeakMap(), Pt = /* @__PURE__ */ new WeakMap(), Ht = /*
   } catch {
     return null;
   }
-}, Ft(rt, _e), Ft(rt, gs, 0), Ft(rt, Jt, !1), Ft(rt, ne, /* @__PURE__ */ new WeakMap()), dt && (mt(rt, Jt, !0), Wt.workerSrc ||= "./pdf.worker.mjs"), rt._isSameOrigin = (c, t) => {
+}, Ft(rt, _e), Ft(rt, gs, 0), Ft(rt, Jt, !1), Ft(rt, ne, /* @__PURE__ */ new WeakMap()), dt && (mt(rt, Jt, !0), qt.workerSrc ||= "./pdf.worker.mjs"), rt._isSameOrigin = (c, t) => {
   const e = URL.parse(c);
   if (!e?.origin || e.origin === "null")
     return !1;
@@ -10913,7 +10913,7 @@ class Ye extends $r {
     return document.createElementNS(Rt, t);
   }
 }
-const zr = 9, qt = /* @__PURE__ */ new WeakSet(), Ur = (/* @__PURE__ */ new Date()).getTimezoneOffset() * 60 * 1e3;
+const zr = 9, Xt = /* @__PURE__ */ new WeakSet(), Ur = (/* @__PURE__ */ new Date()).getTimezoneOffset() * 60 * 1e3;
 class fs {
   static create(t) {
     switch (t.data.annotationType) {
@@ -10932,7 +10932,7 @@ class fs {
           case "Sig":
             return new Wr(t);
         }
-        return new Yt(t);
+        return new Kt(t);
       case it.POPUP:
         return new Ts(t);
       case it.FREETEXT:
@@ -11114,7 +11114,7 @@ class K {
         viewport: i
       }
     } = this, n = document.createElement("section");
-    n.setAttribute("data-annotation-id", e.id), !(this instanceof Yt) && !(this instanceof zs) && (n.tabIndex = 0);
+    n.setAttribute("data-annotation-id", e.id), !(this instanceof Kt) && !(this instanceof zs) && (n.tabIndex = 0);
     const {
       style: r
     } = n;
@@ -11365,7 +11365,7 @@ class K {
           if (n === -1 || r === e)
             continue;
           const o = typeof a == "string" ? a : null, h = document.querySelector(`[data-element-id="${r}"]`);
-          if (h && !qt.has(h)) {
+          if (h && !Xt.has(h)) {
             I(`_getElementsByName - element not allowed: ${r}`);
             continue;
           }
@@ -11381,7 +11381,7 @@ class K {
       const {
         exportValue: n
       } = i, r = i.getAttribute("data-element-id");
-      r !== e && qt.has(i) && s.push({
+      r !== e && Xt.has(i) && s.push({
         id: r,
         exportValue: n,
         domElement: i
@@ -11575,7 +11575,7 @@ class zs extends K {
         }
         const u = document.querySelector(`[data-element-id="${d}"]`);
         if (u) {
-          if (!qt.has(u)) {
+          if (!Xt.has(u)) {
             I(`_bindResetFormAction - element not allowed: ${d}`);
             continue;
           }
@@ -11607,7 +11607,7 @@ class Gr extends K {
     })), !this.data.popupRef && this.hasPopupData && (this.hasOwnCommentButton = !0, this._createPopup()), this.container.append(t), this.container;
   }
 }
-class Yt extends K {
+class Kt extends K {
   render() {
     return this.container;
   }
@@ -11678,7 +11678,7 @@ class Yt extends K {
     e ? t.setAttribute("required", !0) : t.removeAttribute("required"), t.setAttribute("aria-required", e);
   }
 }
-class jr extends Yt {
+class jr extends Kt {
   constructor(t) {
     const e = t.renderForms || t.data.hasOwnCanvas || !t.data.hasAppearance && !!t.data.fieldValue;
     super(t, {
@@ -11715,7 +11715,7 @@ class jr extends Yt {
         commitKey: 1,
         focused: !1
       };
-      this.data.multiLine ? (s = document.createElement("textarea"), s.textContent = a ?? n, this.data.doNotScroll && (s.style.overflowY = "hidden")) : (s = document.createElement("input"), s.type = this.data.password ? "password" : "text", s.setAttribute("value", a ?? n), this.data.doNotScroll && (s.style.overflowX = "hidden")), this.data.hasOwnCanvas && (s.hidden = !0), qt.add(s), this.contentElement = s, s.setAttribute("data-element-id", e), s.disabled = this.data.readOnly, s.name = this.data.fieldName, s.tabIndex = 0;
+      this.data.multiLine ? (s = document.createElement("textarea"), s.textContent = a ?? n, this.data.doNotScroll && (s.style.overflowY = "hidden")) : (s = document.createElement("input"), s.type = this.data.password ? "password" : "text", s.setAttribute("value", a ?? n), this.data.doNotScroll && (s.style.overflowX = "hidden")), this.data.hasOwnCanvas && (s.hidden = !0), Xt.add(s), this.contentElement = s, s.setAttribute("data-element-id", e), s.disabled = this.data.readOnly, s.name = this.data.fieldName, s.tabIndex = 0;
       const {
         datetimeFormat: h,
         datetimeType: l,
@@ -11908,14 +11908,14 @@ class jr extends Yt {
     return this._setTextStyle(s), this._setBackgroundColor(s), this._setDefaultPropertiesFromJS(s), this.container.append(s), this.container;
   }
 }
-class Wr extends Yt {
+class Wr extends Kt {
   constructor(t) {
     super(t, {
       isRenderable: !!t.data.hasOwnCanvas
     });
   }
 }
-class qr extends Yt {
+class qr extends Kt {
   constructor(t) {
     super(t, {
       isRenderable: t.renderForms
@@ -11930,7 +11930,7 @@ class qr extends Yt {
       value: i
     })), this.container.classList.add("buttonWidgetAnnotation", "checkBox");
     const n = document.createElement("input");
-    return qt.add(n), n.setAttribute("data-element-id", s), n.disabled = e.readOnly, this._setRequired(n, this.data.required), n.type = "checkbox", n.name = e.fieldName, i && n.setAttribute("checked", !0), n.setAttribute("exportValue", e.exportValue), n.tabIndex = 0, n.addEventListener("change", (r) => {
+    return Xt.add(n), n.setAttribute("data-element-id", s), n.disabled = e.readOnly, this._setRequired(n, this.data.required), n.type = "checkbox", n.name = e.fieldName, i && n.setAttribute("checked", !0), n.setAttribute("exportValue", e.exportValue), n.tabIndex = 0, n.addEventListener("change", (r) => {
       const {
         name: a,
         checked: o
@@ -11959,7 +11959,7 @@ class qr extends Yt {
     }), this._setEventListeners(n, null, [["change", "Validate"], ["change", "Action"], ["focus", "Focus"], ["blur", "Blur"], ["mousedown", "Mouse Down"], ["mouseenter", "Mouse Enter"], ["mouseleave", "Mouse Exit"], ["mouseup", "Mouse Up"]], (r) => r.target.checked)), this._setBackgroundColor(n), this._setDefaultPropertiesFromJS(n), this.container.append(n), this.container;
   }
 }
-class Yi extends Yt {
+class Yi extends Kt {
   constructor(t) {
     super(t, {
       isRenderable: t.renderForms
@@ -11979,7 +11979,7 @@ class Yi extends Yt {
           value: !1
         });
     const n = document.createElement("input");
-    if (qt.add(n), n.setAttribute("data-element-id", s), n.disabled = e.readOnly, this._setRequired(n, this.data.required), n.type = "radio", n.name = e.fieldName, i && n.setAttribute("checked", !0), n.tabIndex = 0, n.addEventListener("change", (r) => {
+    if (Xt.add(n), n.setAttribute("data-element-id", s), n.disabled = e.readOnly, this._setRequired(n, this.data.required), n.type = "radio", n.name = e.fieldName, i && n.setAttribute("checked", !0), n.tabIndex = 0, n.addEventListener("change", (r) => {
       const {
         name: a,
         checked: o
@@ -12029,7 +12029,7 @@ class Xr extends zs {
     })), t;
   }
 }
-class Yr extends Yt {
+class Yr extends Kt {
   constructor(t) {
     super(t, {
       isRenderable: t.renderForms
@@ -12040,7 +12040,7 @@ class Yr extends Yt {
     const t = this.annotationStorage, e = this.data.id, s = t.getValue(e, {
       value: this.data.fieldValue
     }), i = document.createElement("select");
-    qt.add(i), i.setAttribute("data-element-id", e), i.disabled = this.data.readOnly, this._setRequired(i, this.data.required), i.name = this.data.fieldName, i.tabIndex = 0;
+    Xt.add(i), i.setAttribute("data-element-id", e), i.disabled = this.data.readOnly, this._setRequired(i, this.data.required), i.name = this.data.fieldName, i.tabIndex = 0;
     let n = this.data.combo && this.data.options.length > 0;
     this.data.combo || (i.size = this.data.options.length, this.data.multiSelect && (i.multiple = !0)), i.addEventListener("resetform", (l) => {
       const d = this.data.defaultFieldValue;
@@ -12977,7 +12977,7 @@ class Vs {
     const {
       annotations: e
     } = t, s = this.div;
-    jt(s, this.viewport);
+    Wt(s, this.viewport);
     const i = /* @__PURE__ */ new Map(), n = [], r = {
       data: null,
       layer: s,
@@ -13100,7 +13100,7 @@ class Vs {
     viewport: t
   }) {
     const e = this.div;
-    this.viewport = t, jt(e, {
+    this.viewport = t, Wt(e, {
       rotation: t.rotation
     }), this.#h(), e.hidden = !1;
   }
@@ -13696,7 +13696,7 @@ class M {
     return [(t + 5 * s) / 6, (e + 5 * i) / 6, (5 * s + n) / 6, (5 * i + r) / 6, (s + n) / 2, (i + r) / 2];
   }
 }
-class Gt {
+class jt {
   #t;
   #e = [];
   #i;
@@ -13712,12 +13712,12 @@ class Gt {
   #p = [];
   static #m = 8;
   static #f = 2;
-  static #c = Gt.#m + Gt.#f;
+  static #c = jt.#m + jt.#f;
   constructor({
     x: t,
     y: e
   }, s, i, n, r, a = 0) {
-    this.#t = s, this.#d = n * i, this.#s = r, this.#r.set([NaN, NaN, NaN, NaN, t, e], 6), this.#i = a, this.#h = Gt.#m * i, this.#l = Gt.#c * i, this.#u = i, this.#p.push(t, e);
+    this.#t = s, this.#d = n * i, this.#s = r, this.#r.set([NaN, NaN, NaN, NaN, t, e], 6), this.#i = a, this.#h = jt.#m * i, this.#l = jt.#c * i, this.#u = i, this.#p.push(t, e);
   }
   isEmpty() {
     return isNaN(this.#r[8]);
@@ -13877,7 +13877,7 @@ class tn extends M {
     return this.#e;
   }
   newOutliner(t, e, s, i, n, r = 0) {
-    return new Gt(t, e, s, i, n, r);
+    return new jt(t, e, s, i, n, r);
   }
   getNewOutline(t, e) {
     const [s, i, n, r] = this.#e, [a, o, h, l] = this.#t, d = n * h, u = r * l, p = s * h + a, f = i * l + o, g = this.newOutliner({
@@ -14053,7 +14053,7 @@ class aa extends M {
     return ["highlightOutline"];
   }
 }
-class Ps extends Gt {
+class Ps extends jt {
   newFreeDrawOutline(t, e, s, i, n, r) {
     return new oa(t, e, s, i, n, r);
   }
@@ -17352,7 +17352,7 @@ class Lt {
   render({
     viewport: t
   }) {
-    this.viewport = t, jt(this.div, t);
+    this.viewport = t, Wt(this.div, t);
     for (const e of this.#c.getEditors(this.pageIndex))
       this.add(e), e.rebuild();
     this.updateMode();
@@ -17362,7 +17362,7 @@ class Lt {
   }) {
     this.#c.commitOrRemove(), this.#A();
     const e = this.viewport.rotation, s = t.rotation;
-    if (this.viewport = t, jt(this.div, {
+    if (this.viewport = t, Wt(this.div, {
       rotation: s
     }), e !== s)
       for (const i of this.#r.values())
@@ -17530,7 +17530,7 @@ globalThis.pdfjsLib = {
   getRGB: De,
   getUuid: Si,
   getXfaPageViewport: Mn,
-  GlobalWorkerOptions: Wt,
+  GlobalWorkerOptions: qt,
   ImageKind: je,
   InvalidPDFException: ys,
   isDataScheme: Ze,
@@ -17550,7 +17550,7 @@ globalThis.pdfjsLib = {
   RenderingCancelledException: Rs,
   renderRichText: Ti,
   ResponseException: We,
-  setLayerDimensions: jt,
+  setLayerDimensions: Wt,
   shadow: L,
   SignatureExtractor: ee,
   stopEvent: Q,
@@ -17566,7 +17566,7 @@ globalThis.pdfjsLib = {
 class ca {
   document = null;
   constructor(t = {}) {
-    t.workerSrc ? Wt.workerSrc = t.workerSrc : Wt.workerSrc = `https://cdnjs.cloudflare.com/ajax/libs/pdf.js/${Xi}/pdf.worker.min.mjs`;
+    t.workerSrc ? qt.workerSrc = t.workerSrc : qt.workerSrc = `https://cdnjs.cloudflare.com/ajax/libs/pdf.js/${Xi}/pdf.worker.min.mjs`;
   }
   async loadDocument(t) {
     try {
@@ -18296,6 +18296,29 @@ class ya {
   getScale() {
     return this.currentScale;
   }
+  /**
+   * Get dimensions of a specific page in PDF points
+   * @param pageIndex - Zero-based page index
+   * @returns Page dimensions { width: number, height: number } or null if page doesn't exist
+   */
+  async getPageDimensions(t) {
+    if (!this.pdfDocument)
+      throw new Error("PDF not loaded");
+    if (t < 0 || t >= this.pdfDocument.numPages)
+      return null;
+    const e = this.pageInfo.get(t);
+    if (e)
+      return { width: e.width, height: e.height };
+    try {
+      const s = (await this.pdfDocument.getPage(t + 1)).getViewport({ scale: 1 }), i = {
+        width: s.width,
+        height: s.height
+      };
+      return this.pageInfo.set(t, i), i;
+    } catch (s) {
+      return console.error(`Failed to get dimensions for page ${t}:`, s), null;
+    }
+  }
   // Field Management
   fields = [];
   setFields(t) {
@@ -18516,6 +18539,9 @@ class wa {
   getScale() {
     return this.viewer.getScale();
   }
+  async getPageDimensions(t) {
+    return this.viewer.getPageDimensions(t);
+  }
   // Event handling
   on(t, e) {
     this.viewer.on(t, e);
@@ -18566,12 +18592,23 @@ const xa = on((c, t) => {
     getViewMode: () => s.current?.getViewMode() ?? "scroll",
     print: async (n) => {
       s.current && await s.current.print(n);
-    }
+    },
+    getPageDimensions: async (n) => s.current ? await s.current.getPageDimensions(n) : null,
+    addField: async (n) => {
+      s.current && await s.current.addField(n);
+    },
+    removeField: (n) => {
+      s.current?.removeField(n);
+    },
+    updateField: (n, r) => {
+      s.current?.updateField(n, r);
+    },
+    getFields: () => s.current?.getFields() ?? []
   }));
   const i = rs(c);
-  return Kt(() => {
+  return Vt(() => {
     i.current = c;
-  }), Kt(() => {
+  }), Vt(() => {
     if (!(!e.current || s.current))
       return s.current = new wa({
         container: e.current,
@@ -18585,16 +18622,18 @@ const xa = on((c, t) => {
       }), s.current.on("field:add", (n) => i.current.onFieldAdd?.(n)), s.current.on("field:remove", (n) => i.current.onFieldRemove?.(n)), s.current.on("field:update", (n) => i.current.onFieldUpdate?.(n)), s.current.on("fields:change", (n) => i.current.onFieldsChange?.(n)), c.onReady && c.onReady(s.current), () => {
         s.current?.destroy(), s.current = null;
       };
-  }, []), Kt(() => {
+  }, []), Vt(() => {
     s.current && c.src && s.current.load(c.src).then(() => c.onLoad?.()).catch((n) => c.onError?.(n));
-  }, [c.src]), Kt(() => {
+  }, [c.src]), Vt(() => {
+    s.current && c.page !== void 0 && s.current.getCurrentPage() !== c.page && s.current.goToPage(c.page);
+  }, [c.page]), Vt(() => {
     s.current && c.viewMode && s.current.setViewMode(c.viewMode);
-  }, [c.viewMode]), Kt(() => {
+  }, [c.viewMode]), Vt(() => {
     if (s.current && c.scale !== void 0) {
       const n = s.current.getScale();
       Math.abs(n - c.scale) > 1e-3 && s.current.setScale(c.scale);
     }
-  }, [c.scale]), Kt(() => {
+  }, [c.scale]), Vt(() => {
     if (s.current && c.fields) {
       const n = s.current.getFields();
       if (JSON.stringify(n) === JSON.stringify(c.fields))

package/dist/lib/pdf-sign-react.d.ts

@@ -21,16 +21,30 @@ export interface PdfSignReactRef {
     /** Set view mode */
     setViewMode(mode: ViewMode): Promise<void>;
     /** Get current view mode */
-    /** Get current view mode */
     getViewMode(): ViewMode;
     /** Print the PDF */
     print(options?: {
         withSignatures?: boolean;
     }): Promise<void>;
+    /** Get dimensions of a specific page in PDF points */
+    getPageDimensions(pageIndex: number): Promise<{
+        width: number;
+        height: number;
+    } | null>;
+    /** Add a signature field */
+    addField(field: SignatureField): Promise<void>;
+    /** Remove a signature field by ID */
+    removeField(fieldId: string): void;
+    /** Update a signature field */
+    updateField(fieldId: string, updates: Partial<SignatureField>): void;
+    /** Get all signature fields */
+    getFields(): SignatureField[];
 }
 export interface PdfSignReactProps {
     /** PDF source URL or ArrayBuffer - auto-loads when provided */
     src?: string | Uint8Array | ArrayBuffer;
+    /** Initial page number */
+    page?: number;
     /** Initial view mode: 'scroll' or 'single' */
     viewMode?: ViewMode;
     /** Current zoom scale */

package/dist/lib/pdf-sign-react.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pdf-sign-react.d.ts","sourceRoot":"","sources":["../../src/lib/pdf-sign-react.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"pdf-sign-react.d.ts","sourceRoot":"","sources":["../../src/lib/pdf-sign-react.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shznet/pdf-sign-react",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "React wrapper for @shznet/pdf-sign-control",
   "license": "MIT",
   "repository": {