styled-components-ui-library
v0.1.5
Published
> concept to create an UI library with styled components and [Storybook](https://storybook.js.org)
Downloads
9
Readme
styled components ui library
concept to create an UI library with styled components and Storybook
Features
- UI Hub to preview the UI components
- Jest snapshot testing to figure out dependencies between UI components. This works for the Markup as well as for the CSS
- native TypeScript support, because the UI library is written in TypeScript
- Stylelint for SCSS of the styled components
Usage
Add the UI library to your project:
npm i styled-components-ui-library
# OR
yarn add styled-components-ui-library
Use it in your React components (example written in TypeScript):
import * as React from 'react';
import { Modal } from 'styled-components-ui-library';
class App extends React.Component<{}, {}> {
render() {
return (
<div className="App">
<Modal
title="Do you like this demo?"
text="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
saveButtonClickHandler={() => null}
/>
</div>
);
}
}
export default App;
You can find a simple example here (bootstrapped with react-create-app): https://github.com/HenrikFricke/styled-components-ui-lib-consumer
Contribute
# clone repo
git clone [email protected]:HenrikFricke/styled-components-ui-library.git
cd styled-components-ui-library
# install dependencies
yarn
# fire up storybook
yarn start
Visit: http://localhost:6006/
Deployment
Push your changes to master and create a new GitHub release (based on semver). CircleCI is in place to push a new version to npm, it will also create and upload a new version of the react storybook.