React
Is new design vision part implemented using new tokens?
Up to date
Resources
Example
import { SignatureInput } from '@optimus-web/core';
<SignatureInput
label="Signature Input Label"
helperText="Please sign above with your finger or by mouse"
required={false}
height={240}
disabled={false}
error=""
helper="helper"
inline={false}
insideCompoundField={false}
readOnly={false}
name="field-name"
onChange={() => {}}
/>
API
|
Name |
Description |
Type |
Default |
|---|---|---|---|
|
disabled? |
Allows the input to be disabled |
boolean |
false |
|
error? |
Enables to add an error to the bottom of the Input (or inside if you have inlined set to true) |
ReactNode |
undefined |
|
height? |
Defines the height of the signature pad |
number |
200 |
|
helper? |
Helper text that shows on the bottom left of the Input |
string |
undefined |
|
helperText? |
Helper text rendered just below the signature pad |
ReactNode |
undefined |
|
inline? |
Removes the label, caption, error, and helper when set to true |
boolean |
false |
|
label? |
Text that describes what your Input needs and used as the label attribute |
string |
undefined |
|
name |
Name associated with label and used as the name and id of the input |
string |
undefined |
|
onChange |
Callback fired every time the inout changes |
(event: Event | MouseEvent, value: string | null) => void |
- |
|
readOnly? |
Gives the input a readOnly attribute and state |
boolean |
false |
|
required? |
Gives the input an * an makes it required for the user |
boolean |
false |