SignaturePad

SignaturePad wraps react-native-signature-canvas and adapts its onOK callback into a typed onSign(dataUri). When the peer isn't installed, the component renders a MissingPeer fallback with the exact install command instead of crashing.

Peer dependency

pnpm add react-native-signature-canvas

When the peer isn't installed, the component renders a MissingPeer fallback with the exact install command — this means you can use it conditionally without crashing.

Import

import { SignaturePad } from '@mindees/ui';

Usage

<SignaturePad onSign={(dataUri) => save(dataUri)} onClear={() => console.log('cleared')} />

Props

Prop	Type	Default	Description
onSign	(signatureDataUri: string) => void	—	Called with a base64 PNG data URI when the user confirms the signature.
onClear	() => void	—	Called when the canvas is cleared.

All remaining props are forwarded to react-native-signature-canvas, so its full configuration surface (pen colour, background, descriptionText, etc.) is available.

Accessibility

A signature is an inherently visual gesture. Provide an accessibilityLabel on the surrounding container describing what is being signed, and pair the pad with a text alternative such as a typed full name plus a "I agree" checkbox where regulation allows.