https://github.com/scaleflex/ui

Scaleflex UI library built with React, TypeScript and styled-components. Any questions or issues, please report to https://github.com/scaleflex/ui/issues
https://github.com/scaleflex/ui

Last synced: 5 days ago
JSON representation

Scaleflex UI library built with React, TypeScript and styled-components. Any questions or issues, please report to https://github.com/scaleflex/ui/issues

• Host: GitHub
• URL: https://github.com/scaleflex/ui
• Owner: scaleflex
• License: other
• Created: 2020-12-16T09:13:09.000Z (almost 4 years ago)
• Default Branch: master
• Last Pushed: 2024-10-11T12:55:25.000Z (about 1 month ago)
• Last Synced: 2024-10-14T10:05:59.499Z (about 1 month ago)
• Language: TypeScript
• Homepage:
• Size: 33.9 MB
• Stars: 7
• Watchers: 5
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Scaleflex UI

[![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lerna.js.org/)

[![style: styled-components](https://img.shields.io/badge/style-%F0%9F%92%85%20styled--components-orange.svg?colorB=daa357&colorA=db748e)](https://github.com/styled-components/styled-components)

Scaleflex UI framework for React built with [TypeScript](https://github.com/microsoft/TypeScript) and [styled-components](https://github.com/styled-components/styled-components).

---



  

    Storybook for UI (Documentation)

  



Scaleflex UI is shipping several packages:

- [`ui`](packages/ui/README.md)

- [`icons`](packages/icons/README.md)

## Installation

```shell script

npm i @scaleflex/ui # styled-components react react-dom

```

```shell script

yarn add @scaleflex/ui # styled-components react react-dom

```

> Make sure to have `react`, `react-dom` and `styled-components` installed in your package as they are included in our peer dependencies.

## Usage

Before writing any components in your application make sure to provide them with our theme.

This is done by wrapping your application in our `ThemeProvider` component.

```typescript jsx

import ThemeProvider from '@scaleflex/ui/theme';

ReactDOM.render(

  

    

  ,

  document.querySelector('#root')

);

```

> More examples can be found in the [`theme`](packages/theme/README.md) package readme.

After that, you are ready to use our framework inside of your application!

```typescript jsx

// Please note that in most cases we provide direct default exports for better tree-shaking support.

import Button from '@scaleflex/ui/core/button';

```