require-form-control-label

Github

Require accessible labels for Pluma form controls.


Use this rule to catch missing accessible labels on Pluma form controls before Pluma's runtime accessibility guard throws.

Incorrect

import { TextField } from '@customerio/pluma-components/react';

<TextField value={name} />

Correct

import { TextField } from '@customerio/pluma-components/react';

<TextField label="Name" value={name} />
<TextField ariaLabel="Name" value={name} />
<TextField ariaLabelledby="name-label" value={name} />

What is checked

The rule reports imported Pluma form controls that lack label, ariaLabel, or ariaLabelledby. OptionCard has no label prop and takes its name from its title instead, so the rule accepts title, ariaLabel, or ariaLabelledby on it. Components with spread props are ignored because the label may be provided through the spread object.

On this page