@ac-ui/react-components
v2.0.7
Published
A React Component library
Downloads
20
Keywords
Readme
@ac-ui/react-components
A React Component library
Installation
- Install as a npm dependency
npm i @ac-ui/react-components
- Import component
import { Subheader } from '~@ac-ui/react-components'; const Example = () => <Subheader title={"Subheader example"}/>
Contribution
Everyone is encouraged and welcome to contribute to @ac-ui/react-components! This library is built (being built) for Avenue Coders to use, and to develop. To maintain usability, keep code consistent, and to ensure a quality product, linting and pre-commit hooks have been added in to the repository.
How do I make a component?
- Run
$ npm run component:stub
- Rename component to desired name, and update all references
- Make component exportable by adding it to
src/index.js
- Preview components in styleguidist using
npm run styleguide
What does a component need to have
- A component only needs to have:
index.js
(with the following contentexport{ default as ComponentName } from './ComponentName'
)ComponentName.jsx
- As nice to haves
ComponentName.md
to enhance component in StyleguidistComponentName.spec.js
because unit testing is always smartComponentName.scss
to style things
How do I style a component?
- Completely custom element?
- Import the variables, mixins, and helpers all in one go
- (
@import "~@ac-ui/design-system/src/base";
)
- (
- Import the variables, mixins, and helpers all in one go
- Is it built around a TWBS Component
- Import the 'bridge', which imports variables, helpers, and utility classes for the component
- (
@import "~@ac-ui/design-system/src/bridge/buttons";
)
- (
- Import the 'bridge', which imports variables, helpers, and utility classes for the component
- Always style using variables, and TWBS where possible!
- A variable doesn't exist?
- Is there one close to it? Use that.
- Is it going to be used only in this component? Initiate variable there
- Is it only going to be used in many files? Add it to
@ac-ui/design-system
- A variable doesn't exist?