SubtleForm

SubtleForm UI Component

Installation

npm i @synerise/ds-subtle-form
or
yarn add @synerise/ds-subtle-form

Usage

import SubtleForm from '@synerise/ds-subtle-form'
const [value, setValue] = React.useState('');
return (
<SubtleForm.TextArea
minRows={1}
maxRows={10}
value={value}
onChange={setValue}
placeholder={'Description'}
label={'Label'}
labelTooltip={'Label tooltip'}
suffixTooltip={'Edit'}
/>

Demo

API

TextArea

PropertyDescriptionTypeDefault
disabledDisables hover effects and value editingbooleanfalse
labelLabel text displayed above the textareastring / React.ReactNode---
labelTooltipTooltip displayed on label hoverstring / React.ReactNode---
maxRowsMaximum rows to be displayednumber0
minRowsMinimum rows to be displayednumber1
onChangeCallback execute after input change(value: string) => void---
valueValue displayed in the inputstring---
placeholderPlaceholder displayed in the inputstring---
suffixSuffix element rendered on the right-hand sideReact.ReactNode---
suffixTooltipSuffix tooltip dispalyed on hoverstring / React.ReactNode---