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>
<FormField alignEnd>
<input type="checkbox" id="input" />
<label htmlFor="input">Input Label</label>
</FormField>
<FormField noWrap>
<input type="checkbox" id="input" />
<label htmlFor="input">Input Label</label>
</FormField>
<FormField spaceBetween>
<input type="checkbox" id="input" />
<label htmlFor="input">Input Label</label>
</FormField>
A FormField component.
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. |