@cosxai/ui 0.13.1 → 0.13.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosxai/ui",
-  "version": "0.13.1",
+  "version": "0.13.3",
   "description": "COSX design system — React 19 component primitives shared across product-meta and other consumers",
   "license": "UNLICENSED",
   "type": "module",

package/src/primitives/SignaturePad.tsx

@@ -156,14 +156,29 @@ export const SignaturePad = forwardRef<SignaturePadHandle, SignaturePadProps>(
         return;
       }
       let cancelled = false;
-      void fonts.ready.then(() => {
-        if (cancelled) return;
-        setFontReady(true);
-      });
+      // Actively REQUEST the typed font. @font-face registration
+      // (fontsource CSS etc.) doesn't fetch the file until some
+      // rendered text uses it — and this component's only consumer
+      // of the font is the canvas, whose fillText silently falls
+      // back to the next family when the face isn't loaded yet.
+      // fonts.load() forces the fetch; fonts.ready is the safety
+      // net for browsers without it / faces not registered.
+      const kick =
+        typeof fonts.load === "function"
+          ? fonts.load(`32px ${typedFontFamily}`).catch(() => [])
+          : Promise.resolve([]);
+      void kick
+        .then(() => fonts.ready)
+        .then(() => {
+          if (cancelled) return;
+          setFontReady(true);
+        });
       return () => {
         cancelled = true;
       };
-    }, [fontReady]);
+      // typedFontFamily is config-stable per consumer; re-kicking on
+      // change is correct anyway.
+    }, [fontReady, typedFontFamily]);
 
     // Mode switch — clear the canvas so a stale typed baseline
     // doesn't hang around behind a drawn signature (or vice versa).
@@ -236,13 +251,21 @@ export const SignaturePad = forwardRef<SignaturePadHandle, SignaturePadProps>(
       strokeColor,
     ]);
 
-    // Restore a previously-captured value into the canvas on remount.
-    // Typed mode uses the effect above; drawn mode needs to explicitly
-    // paint the dataURL back onto the canvas so subsequent strokes
-    // continue on top of it (rather than starting from blank).
+    // Restore a previously-captured value into the canvas on MOUNT
+    // only (parent phase round-trips remount the pad). Typed mode
+    // uses the repaint effect above; drawn mode needs to explicitly
+    // paint the dataURL back so subsequent strokes continue on top.
+    //
+    // Deliberately NOT re-run on mode switch: the clear effect wipes
+    // the canvas on switch, and re-painting the old capture here
+    // resurrected the TYPED baseline inside the drawn pad (v0.13.2
+    // regression — switching Type → Draw showed the handwriting-font
+    // bake as if it had been drawn).
+    const didRestoreRef = useRef(false);
     useEffect(() => {
-      if (mode !== "drawn") return;
-      if (!value) return;
+      if (didRestoreRef.current) return;
+      didRestoreRef.current = true;
+      if (mode !== "drawn" || !value) return;
       const canvas = canvasRef.current;
       if (!canvas) return;
       const ctx = canvas.getContext("2d");
@@ -255,7 +278,7 @@ export const SignaturePad = forwardRef<SignaturePadHandle, SignaturePadProps>(
       };
       img.src = value;
       // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [mode]);
+    }, []);
 
     const clear = useCallback(() => {
       const canvas = canvasRef.current;