51:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:T2403,// Ballmac UI: Signature Pad. https://ui.ballmac.com/components/signature-pad "use client" import * as React from "react" import { PenLine, RotateCcw, Trash2, Type } from "lucide-react" import { cn } from "@/lib/utils" import { useMessages } from "@/lib/ballmac/i18n" type SignatureValue = | { /** Drawing mode. */ mode: "draw" /** SVG path strings in a 600 × 200 viewBox. */ strokes: string[] } | { /** Typing mode. */ mode: "type"; /** Typed signer name. */ text: string } type SignaturePadProps = Omit< React.ComponentProps<"div">, "defaultValue" | "onChange" > & { /** Visible and accessible field label. */ label: string /** Controlled signature. */ value?: SignatureValue /** Initial signature. */ defaultValue?: SignatureValue /** Called when a stroke, typed name, or mode changes. */ onValueChange?: (value: SignatureValue) => void /** Native form field name for serialized signature data. */ name?: string /** Disable drawing, typing, and actions. */ disabled?: boolean } function SignaturePad({ className, label, value, defaultValue = { mode: "draw", strokes: [] }, onValueChange, name, disabled = false, ...props }: SignaturePadProps) { const msg = useMessages() const [internal, setInternal] = React.useState(defaultValue) const [preview, setPreview] = React.useState(null) const active = React.useRef(null) const current = value ?? internal function update(next: SignatureValue) { if (value === undefined) setInternal(next) onValueChange?.(next) } function point(event: React.PointerEvent) { const rect = event.currentTarget.getBoundingClientRect() return [ Math.max( 0, Math.min(600, ((event.clientX - rect.left) / rect.width) * 600), ), Math.max( 0, Math.min(200, ((event.clientY - rect.top) / rect.height) * 200), ), ] } function begin(event: React.PointerEvent) { if (disabled || current.mode !== "draw") return const [x, y] = point(event) active.current = `M ${x.toFixed(1)} ${y.toFixed(1)}` setPreview(active.current) event.currentTarget.setPointerCapture?.(event.pointerId) } function draw(event: React.PointerEvent) { if (!active.current) return const [x, y] = point(event) active.current += ` L ${x.toFixed(1)} ${y.toFixed(1)}` setPreview(active.current) } function end() { if (!active.current || current.mode !== "draw") return const stroke = active.current.includes(" L ") ? active.current : `${active.current} l 0.1 0` update({ mode: "draw", strokes: [...current.strokes, stroke] }) active.current = null setPreview(null) } function clear() { update( current.mode === "draw" ? { mode: "draw", strokes: [] } : { mode: "type", text: "" }, ) } const hasValue = current.mode === "draw" ? current.strokes.length > 0 : current.text.length > 0 return (

{label} {msg("signature-pad.drawOrType", "Draw or type")}

{current.mode === "draw" ? (

) : ( update({ mode: "type", text: event.target.value }) } className="border-input bg-background mt-3 h-20 w-full rounded-md border px-4 font-serif text-2xl italic outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:opacity-50" /> )}

{current.mode === "draw" ? "Use a pointer to sign; choose Type for keyboard entry." : "Your typed name is saved as the signature."}

{current.mode === "draw" && ( )}

{name && ( )}

) } export { SignaturePad, type SignaturePadProps, type SignatureValue } 50:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L51",null,{"namespace":"@ballmac","registryDependencies":["utils","https://ui.ballmac.com/r/i18n.json"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"registry/ballmac/components/signature-pad.tsx","content":"$53","type":"registry:ui","target":"@components/ballmac/signature-pad.tsx"}],"className":"h-[70svh] min-h-80"}]]}]