feat: migrate nextjs to rr7

packages/ui/primitives/signature-pad/signature-pad.tsx

@@ -1,11 +1,7 @@
-'use client';
-
 import type { HTMLAttributes, MouseEvent, PointerEvent, TouchEvent } from 'react';
 import { useEffect, useMemo, useRef, useState } from 'react';
 
-import { Caveat } from 'next/font/google';
-
-import { Trans } from '@lingui/macro';
+import { Trans } from '@lingui/react/macro';
 import { Undo2, Upload } from 'lucide-react';
 import type { StrokeOptions } from 'perfect-freehand';
 import { getStroke } from 'perfect-freehand';
@@ -24,13 +20,6 @@ import { cn } from '../../lib/utils';
 import { getSvgPathFromStroke } from './helper';
 import { Point } from './point';
 
-const fontCaveat = Caveat({
-  weight: ['500'],
-  subsets: ['latin'],
-  display: 'swap',
-  variable: '--font-caveat',
-});
-
 const DPI = 2;
 
 const isBase64Image = (value: string) => value.startsWith('data:image/png;base64,');
@@ -282,7 +271,11 @@ export const SignaturePad = ({
       event.preventDefault();
     }
 
-    onMouseUp(event, false);
+    if (isPressed) {
+      onMouseUp(event, true);
+    } else {
+      onMouseUp(event, false);
+    }
   };
 
   const onClearClick = () => {
@@ -312,7 +305,7 @@ export const SignaturePad = ({
       if (ctx) {
         const canvasWidth = $el.current.width;
         const canvasHeight = $el.current.height;
-        const fontFamily = String(fontCaveat.style.fontFamily);
+        const fontFamily = 'Caveat';
 
         ctx.clearRect(0, 0, canvasWidth, canvasHeight);
         ctx.textAlign = 'center';
@@ -479,6 +472,7 @@ export const SignaturePad = ({
       })}
     >
       <canvas
+        data-testid="signature-pad"
         ref={$el}
         className={cn(
           'relative block',