React Faux Button
Table of Contents
Use sparingly. If you can use the default
<button> – possible more often than not – just do so.
Incidentally, this is the reason the package is called "faux" button :)
- Accessible defaults.
- Full presentational control for the caller.
- Easy to understand source code. You should be able to fork and do your thing if desired.
- Ample documentation to help you understand the problem, in addition to the solutions.
What it does not do by itself:
- Style things. That is up to you :)
This package is distributed via npm.
$ npm install --save react-faux-button# or$ yarn add react-faux-button
// ES Modules;/// CommonJS modulesconst FauxButton = ;
When having an interactable item in your application, a
button is almost always the right answer.
I have found that many developers are averse to using
button due to its historical styling issues.
While I find the button resets (and more importantly, styling) to be straightforward nowadays, I often have
to work with codebases that use
divs with an
onClick. Those codebases might have non-straightforward
resets, might rely on the element being a
div, and so on. In those cases, I find it particularly useful
to have an accessible
button usurper. This is the one I use.
If you want to just dive in, do this:
import FauxButton from "react-faux-button";<FauxButton ="div" =>Print files</FauxButton>
The ARIA authoring practices offer a concise overview of expected button behaviour: