Jsx Attribute Formatting

Keep an HTML or JSX opening tag with exactly one attribute on one line. When an HTML or JSX opening tag has two or more attributes, use a multiline opening tag and place every attribute on its own line. Always sort multi-lined attributes in JSX and HTML.

Correct

<Field value={value} />
<Field
    disabled
    value={value}
/>
<Field
    {...rest}
    disabled
    value={value}
/>

Incorrect

<Field disabled value={value} />
<Field
    value={value}
/>
<Field
    value={value}
    disabled
/>

Fix

Use one line for one attribute; otherwise give each attribute its own line and sort named attributes within each spread boundary. Preserve spread order because it controls overrides.