Security News
Introducing the Socket Python SDK
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.
react-accessible-form
Advanced tools
React Accessible Form handles makes layout and accessibility easy when writing forms.
React Accessible Form handles makes layout and accessibility easy when writing forms.
Try the other libaries in the series! React Stateful Tabs, React Smart Promise, React Use Pagination
<Form.Group layout="aligned" required>
<Form.Label>Email Addresses</Form.Label>
<Form.Control type="email" />
<small>Separated by semicolon (;)</small>
</Form.Group>
Without react-accessible-form:
<div className="form-group form-group--aligned">
<div className="form-group-section">
<label for="email_field" className="form-label--required">
Email Addresses
</label>
</div>
<div className="form-group-section">
<input type="email" class="form-control" id="email_field" required />
<small>Separated by semicolon (;)</small>
</div>
</div>
id
for the label’s htmlFor
and input’s id
props and links themclassNames
to all of the components to make theming straightforwardas
prop on Form.Control
Form
PropsType: React.ElementType
Required: false
Default: "form"
Changes the underlying element of the Form
component.
Type: boolean
Required: false
Default: false
Sets the disabled prop on all children Form.Control
components.
Type: "stacked" | "aligned"
Required: false
Default: "stacked"
Propagates down to all of the children Form.Group
components. stacked
is the default, which is to set all of the children to display: block
. aligned
splits all of Form.Group
’s children into two groups: "label", and "rest" so that all of the form’s labels will align to the same width.
Form.Group
PropsType: string
Required: false
Default: UUIDv4()
The id
to set on the Form.Control
and associated htmlFor
to set on the Form.Label
Type: boolean
Required: false
Default: false
Set classNames on the label to indicate a required field, and set the required
prop on the Form.Control
Type: boolean
Required: false
Default: false
Set classNames on the label to indicate a disabled field, and set the disabled
prop on the Form.Control
Form.Control
PropsType: React.ElementType
Required: false
Default: "input"
<Form.Control as="select">
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
</Form.Control>
<Form.Control as={ReactSelect} options={[{value: "AL", label: "Alabama"}]} />
<Form.Control as={({className, ...props}) => <ReactSelect className="custom" {...props} />} />
FAQs
React Accessible Form handles makes layout and accessibility easy when writing forms.
The npm package react-accessible-form receives a total of 138 weekly downloads. As such, react-accessible-form popularity was classified as not popular.
We found that react-accessible-form demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.
Security News
Floating dependency ranges in npm can introduce instability and security risks into your project by allowing unverified or incompatible versions to be installed automatically, leading to unpredictable behavior and potential conflicts.
Security News
A new Rust RFC proposes "Trusted Publishing" for Crates.io, introducing short-lived access tokens via OIDC to improve security and reduce risks associated with long-lived API tokens.