Signature allows users to provide a handwritten, typed, or uploaded signature with RTL support.
Loading demo: signature-real-world
npx sdaia-ui@latest add signature
import { Signature } from "@/components/ui/signature"<Signature type="draw" />Freehand drawn signature using mouse or touch input.
Loading demo: signature-draw
Signature generated from typed text.
Loading demo: signature-text
Signature uploaded as an image file.
Loading demo: signature-upload
Props for the Signature component.
Prop | Type | Default | Required |
|---|---|---|---|
type | 'draw' | 'text' | 'upload' | - | optional |
defaultType | 'draw' | 'text' | 'upload' | 'draw' | optional |
onTypeChange | (type: SignatureType) => void | - | optional |
helperText | string | "By signing this document, I certify that I have reviewed and accepted the agreement." | optional |
showHelperText | boolean | true | optional |
showOptions | boolean | true | optional |
showTabs | boolean | true | optional |
cancelLabel | string | 'Cancel' | optional |
acceptLabel | string | 'Accept and Sign' | optional |
onCancel | () => void | - | optional |
onAccept | (data?: string | File) => void | - | optional |
className | string | - | optional |