@rmwc/formfield
v14.3.5
Published
MDC Form Field provides an mdc-formfield helper class for easily making theme-aware, RTL-aware form field + label combos. It also provides an MDCFormField class for easily making input ripples respond to label events.
Downloads
28,979
Readme
Form Fields
MDC Form Field provides an mdc-formfield helper class for easily making theme-aware, RTL-aware form field + label combos. It also provides an MDCFormField class for easily making input ripples respond to label events.
- Module @rmwc/formfield
- Import styles:
- Using CSS Loader
- import '@rmwc/formfield/styles';
- Or include stylesheets
- '@material/form-field/dist/mdc.form-field.css'
- Using CSS Loader
- MDC Docs: https://material.io/develop/web/components/input-controls/form-fields/
<FormField>
<input type="checkbox" id="input" />
<label htmlFor="input">Input Label</label>
</FormField>
Align end
<FormField alignEnd>
<input type="checkbox" id="input" />
<label htmlFor="input">Input Label</label>
</FormField>
No wrap
<FormField noWrap>
<input type="checkbox" id="input" />
<label htmlFor="input">Input Label</label>
</FormField>
Space between
<FormField spaceBetween>
<input type="checkbox" id="input" />
<label htmlFor="input">Input Label</label>
</FormField>
FormField
A FormField component.
Props
| Name | Type | Description |
|------|------|-------------|
| alignEnd
| boolean
| Position the input after the label. |
| foundationRef
| Ref<MDCFormFieldFoundation<>>
| Advanced: A reference to the MDCFoundation. |
| noWrap
| boolean
| Forces text to stay on a single line. |
| spaceBetween
| boolean
| Adds space between content. |