Form components for Rhythm UI.
For the moment the library can be installed directly from the repository:
npm install @deloitte-digital-au/rhythm-form-react
Using a component
To use a component, just import it:
import Text from '@deloitte-digital-au/rhythm-form-react/lib/controls/Text';
Refer to the component's doc page for a guide to using a specific component.
Using a component's sass file
Each component also has a sass file that you can import and use however you like.
To import, just add
/style to end the component's import path.
The sass files use a set of default variables which you can customise.
For now, look at
src/utils/defaults.scss for the list of variables.
Using CSS modules
If you're using CSS modules in your app, you can still use them here with a bit of effort.
This approach was inspired by the awesome reactstrap.
Each component can take a
cssModule prop, which expects a CSS module object. You can use this prop to create a new component with your styles baked in.
You can structure this any way you like, but as an example, in your project:
;// This could be any css file you want;<Text cssModules=textStyles ...props />// Now you can use that component elsewhere;
It's important to note that the components inside the component won't be passed the CSS module. This means that things like the won't be styled.
You will need to individually hook up each component from this library with it's own CSS module