@unlev/exeq 0.5.4 → 0.5.6

package/dist/index.mjs

@@ -60,11 +60,17 @@ function getCssTextStyle(field) {
   const decorations = [];
   if (field.underline) decorations.push("underline");
   if (field.strikethrough) decorations.push("line-through");
+  const align = field.align ?? "left";
   return {
     fontFamily: getCssFontFamily(field.fontFamily),
     fontWeight: field.bold ? "bold" : void 0,
     fontStyle: field.italic ? "italic" : void 0,
-    textDecorationLine: decorations.length ? decorations.join(" ") : void 0
+    textDecorationLine: decorations.length ? decorations.join(" ") : void 0,
+    textAlign: field.align,
+    // Hug the alignment edge — no padding on the trailing side — so text reaches
+    // the container edge (matches the PDF's 2pt offsets).
+    paddingLeft: align === "right" ? "0px" : "2px",
+    paddingRight: align === "left" ? "0px" : "2px"
   };
 }
 function sortFieldsByPosition(fields) {
@@ -735,6 +741,27 @@ function FieldPropertyPanel({ field, signerRoles, onUpdate, onDelete, prefillCon
           /* @__PURE__ */ jsx2("button", { type: "button", className: `text-format-btn ${field.strikethrough ? "active" : ""}`, style: { textDecorationLine: "line-through" }, title: "Strikethrough", onClick: () => onUpdate(field.id, { strikethrough: !field.strikethrough }), children: "S" })
         ] })
       ] }),
+      isText && /* @__PURE__ */ jsxs2("div", { className: "panel-field", children: [
+        /* @__PURE__ */ jsx2("label", { children: "Alignment" }),
+        /* @__PURE__ */ jsx2("div", { className: "text-format-buttons", children: [
+          ["left", "Left", "\u2AF7"],
+          ["center", "Center", "\u2261"],
+          ["right", "Right", "\u2AF8"]
+        ].map(([value, label, glyph]) => {
+          const active = (field.align || "left") === value;
+          return /* @__PURE__ */ jsx2(
+            "button",
+            {
+              type: "button",
+              className: `text-format-btn ${active ? "active" : ""}`,
+              title: `Align ${label}`,
+              onClick: () => onUpdate(field.id, { align: value === "left" ? void 0 : value }),
+              children: glyph
+            },
+            value
+          );
+        }) })
+      ] }),
       isText && /* @__PURE__ */ jsxs2("div", { className: "panel-field-row", children: [
         /* @__PURE__ */ jsxs2("div", { className: "panel-field panel-field-half", children: [
           /* @__PURE__ */ jsx2("label", { children: "Letter Spacing" }),
@@ -2187,11 +2214,17 @@ function resolveFormula(formula, fields, customTransforms, values) {
     const transformName = pipeMatch ? pipeMatch[2].trim() : null;
     const lowerLabel = sourceLabel.toLowerCase();
     const sourceField = fields.find((f) => f.label.toLowerCase() === lowerLabel) || fields.find((f) => f.id === sourceLabel);
-    let rawValue = sourceField ? sourceField.value || "" : void 0;
+    let rawValue;
+    if (sourceField && sourceField.value) {
+      rawValue = sourceField.value;
+    }
     if (rawValue === void 0 && values) {
       const key = Object.keys(values).find((k) => k.toLowerCase() === lowerLabel);
       if (key !== void 0) rawValue = values[key] || "";
     }
+    if (rawValue === void 0 && sourceField) {
+      rawValue = sourceField.value || "";
+    }
     if (rawValue === void 0 && (lowerLabel === "today" || lowerLabel === "now")) {
       rawValue = todayIso();
     }
@@ -2326,7 +2359,9 @@ async function renderFieldsOnPages(pages, fields, getFont, getSignature) {
         fieldHeightPt: h,
         measure: textWidthAtSize
       });
-      const textX = x + 2;
+      const fullTextWidth = textWidthAtSize(field.value, fontSize);
+      const pad = 2;
+      const textX = field.align === "center" ? x + Math.max(pad, (w - fullTextWidth) / 2) : field.align === "right" ? x + Math.max(pad, w - fullTextWidth - pad) : x + pad;
       const baselineY = y + h * 0.3;
       if (spacing > 0) {
         let cx = textX;
@@ -2580,37 +2615,54 @@ function FieldNavigator({
 // src/components/pdf-builder/SignerView.tsx
 import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 var useIsoLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect3;
-function shrinkToFit(el, maxPt, selfBox) {
-  if (!el) return;
-  const box = selfBox ? el : el.parentElement;
-  if (!box) return;
+var measureCtx = null;
+function fitFont(el, box, maxPt, text, shrink) {
+  if (!shrink || typeof document === "undefined") {
+    el.style.fontSize = `${maxPt}pt`;
+    return;
+  }
+  if (!measureCtx) measureCtx = document.createElement("canvas").getContext("2d");
+  const boxStyle = getComputedStyle(box);
+  const padX = (parseFloat(boxStyle.paddingLeft) || 0) + (parseFloat(boxStyle.paddingRight) || 0);
+  const avail = box.clientWidth - padX - 1;
+  if (!text || !measureCtx || avail <= 0) {
+    el.style.fontSize = `${maxPt}pt`;
+    return;
+  }
+  const cs = getComputedStyle(el);
+  const PX_PER_PT = 96 / 72;
   let pt = Math.max(1, maxPt);
-  el.style.fontSize = `${pt}pt`;
-  let guard = 0;
-  while (pt > 2 && guard++ < 400 && (el.scrollWidth > box.clientWidth + 0.5 || el.scrollHeight > box.clientHeight + 0.5)) {
+  while (pt > 2) {
+    measureCtx.font = `${cs.fontStyle} ${cs.fontWeight} ${pt * PX_PER_PT}px ${cs.fontFamily}`;
+    if (measureCtx.measureText(text).width <= avail) break;
     pt -= 0.5;
-    el.style.fontSize = `${pt}pt`;
   }
+  el.style.fontSize = `${pt}pt`;
 }
 function FitInput({
   maxPt,
+  shrink,
   ...rest
 }) {
   const ref = useRef5(null);
   useIsoLayoutEffect(() => {
-    shrinkToFit(ref.current, maxPt, true);
+    const el = ref.current;
+    if (el) fitFont(el, el, maxPt, String(el.value ?? ""), shrink);
   });
   return /* @__PURE__ */ jsx6("input", { ref, ...rest });
 }
 function FitText({
   maxPt,
+  shrink,
   className,
   style,
   children
 }) {
   const ref = useRef5(null);
   useIsoLayoutEffect(() => {
-    shrinkToFit(ref.current, maxPt, false);
+    const el = ref.current;
+    const box = el?.parentElement;
+    if (el && box) fitFont(el, box, maxPt, el.textContent ?? "", shrink);
   });
   return /* @__PURE__ */ jsx6("div", { ref, className, style, children });
 }
@@ -2814,7 +2866,7 @@ function SignerView({
     if (!pdfSource) return;
     setSubmitting(true);
     try {
-      const finalFields = resolveAllFormulas(fields, transforms);
+      const finalFields = resolveAllFormulas(fields, transforms, initialValues);
       let pdfBytes;
       if (includeAuditTrail) {
         const { PDFDocument: PDFDocument2, StandardFonts: StandardFonts2, rgb: rgb2 } = await import("pdf-lib");
@@ -2864,13 +2916,13 @@ ${row.join(",")}`, "csv");
     } finally {
       setSubmitting(false);
     }
-  }, [pdfSource, fields, callbackUrl, allRequiredFilled, onComplete, isLastSigner, signer, onSignerComplete, includeAuditTrail, exportFormat, onExport, getValues, transforms]);
+  }, [pdfSource, fields, callbackUrl, allRequiredFilled, onComplete, isLastSigner, signer, onSignerComplete, includeAuditTrail, exportFormat, onExport, getValues, transforms, initialValues]);
   const renderFieldContent = useCallback5((field) => {
     if (isRedactField(field)) {
       return null;
     }
     if (field.formula) {
-      return /* @__PURE__ */ jsx6(FitText, { maxPt: field.fontSize, className: "field-overlay-value formula", style: getCssTextStyle(field), children: field.value || "..." });
+      return /* @__PURE__ */ jsx6(FitText, { maxPt: field.fontSize, shrink: !!field.autoShrink, className: "field-overlay-value formula", style: getCssTextStyle(field), children: field.value || "" });
     }
     const editable = field.assignee === signer;
     if (!editable) {
@@ -2880,7 +2932,7 @@ ${row.join(",")}`, "csv");
       if (field.type === "checkbox") {
         return /* @__PURE__ */ jsx6("div", { className: "field-checkbox-display readonly", children: field.value === "true" ? "\u2713" : "" });
       }
-      return /* @__PURE__ */ jsx6(FitText, { maxPt: field.fontSize, className: "field-overlay-placeholder readonly", style: getCssTextStyle(field), children: field.value || field.placeholder });
+      return /* @__PURE__ */ jsx6(FitText, { maxPt: field.fontSize, shrink: !!field.autoShrink, className: "field-overlay-placeholder readonly", style: getCssTextStyle(field), children: field.value || field.placeholder });
     }
     if (isSignatureField(field)) {
       if (field.value) {
@@ -2902,7 +2954,7 @@ ${row.join(",")}`, "csv");
       );
     }
     if (field.type === "signed-date") {
-      return /* @__PURE__ */ jsx6(FitText, { maxPt: field.fontSize, className: "field-overlay-value", style: getCssTextStyle(field), children: field.value || (/* @__PURE__ */ new Date()).toLocaleDateString() });
+      return /* @__PURE__ */ jsx6(FitText, { maxPt: field.fontSize, shrink: !!field.autoShrink, className: "field-overlay-value", style: getCssTextStyle(field), children: field.value || (/* @__PURE__ */ new Date()).toLocaleDateString() });
     }
     const fontStyle = {
       letterSpacing: field.letterSpacing ? `${field.letterSpacing}pt` : void 0,
@@ -2930,6 +2982,7 @@ ${row.join(",")}`, "csv");
       FitInput,
       {
         maxPt: field.fontSize,
+        shrink: !!field.autoShrink,
         type: field.textSubtype === "email" ? "email" : field.textSubtype === "number" ? "number" : field.textSubtype === "phone" ? "tel" : field.textSubtype === "date" ? "date" : "text",
         className: "field-inline-input",
         value: field.value,
@@ -2957,10 +3010,10 @@ ${row.join(",")}`, "csv");
   useEffect3(() => {
     const hasFormulas = fields.some((f) => f.formula);
     if (!hasFormulas) return;
-    const resolved = resolveAllFormulas(fields, transforms);
+    const resolved = resolveAllFormulas(fields, transforms, initialValues);
     const changed = resolved.some((f, i) => f.value !== fields[i].value);
     if (changed) setFields(resolved);
-  }, [fields, transforms]);
+  }, [fields, transforms, initialValues]);
   return /* @__PURE__ */ jsxs6("div", { className: "signer-layout", ref: containerRef, children: [
     loading && /* @__PURE__ */ jsx6("div", { className: "loading-indicator", children: "Loading document..." }),
     /* @__PURE__ */ jsxs6("div", { className: "signer-content", children: [