@rmwc/formfield NPM | npm.io

14.3.5 • Published 2 months ago

Install

Weekly downloads

6,912

License

MIT

Repository

Last release

2 months ago

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'
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.

@material/form-field @rmwc/base @rmwc/types

@everything-registry/sub-chunk-784 rmwc react-material-site tutorbook @rmwc/checkbox @rmwc/switch @rmwc/toggleable @rmwc/radio @zalastax/nolb-_rm

2 months ago

3 months ago

4 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

5 months ago

5 months ago

4 months ago

8 months ago

8 months ago

8 months ago

8 months ago

9 months ago

9 months ago

9 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

11 months ago

11 months ago

11 months ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago