# mop-react-ui-components

> React UI Components

Latest version **0.1.0** (published 2020-04-21) · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install mop-react-ui-components
pnpm add mop-react-ui-components
yarn add mop-react-ui-components
bun add mop-react-ui-components
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.1.0 |
| Published | 2020-04-21 |
| First published | 2020-04-19 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 838.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | sholja |
| Keywords | react, react-ui, react-ui-components, widgets, react-component |

## Links

- npm: https://www.npmjs.com/package/mop-react-ui-components
- Repository: https://github.com/Sholja/mop-react-ui-components
- Homepage: https://react-ui-components-22fbe.firebaseapp.com/
- npm.io page: https://npm.io/package/mop-react-ui-components

## Dependencies (6)

- [polished](https://npm.io/package/polished.md) ^3.4.4
- [react-icons](https://npm.io/package/react-icons.md) ^3.9.0
- [styled-system](https://npm.io/package/styled-system.md) ^5.1.5
- [@emotion/styled](https://npm.io/package/@emotion/styled.md) ^10.0.27
- [emotion-theming](https://npm.io/package/emotion-theming.md) ^10.0.27
- [simple-react-modal](https://npm.io/package/simple-react-modal.md) ^0.5.1

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.1.0 (latest) — 2020-04-21
- 0.0.9 — 2020-04-21
- 0.0.8 — 2020-04-21
- 0.0.7 — 2020-04-21
- 0.0.6 — 2020-04-19
- 0.0.5 — 2020-04-19
- 0.0.4 — 2020-04-19
- 0.0.3 — 2020-04-19
- 0.0.2 — 2020-04-19
- 1.0.0 — 2020-04-19
- 0.0.1 — 2020-04-19

## README

# mop-react-ui-components

React UI Components

## Project architecture:

* Framework: React

* Language: Javascript

* Packet manager: Yarn

## Project implementation:

### Application parts below are flagged like this:

* 📒 Folders
* 📑 Files

### Project arhitecture:

* 📒 src
  * 📒 assets
  * 📒 common
    * 📑 helpers.js
  * 📒 components
    * 📒 default-input
      * 📑 default-input.js
      * 📑 default-input.test.js
      * 📑 default-input-styles.js
      * 📑 default-input.stories.js
    * 📑 index.js
  * 📒 theme
    * 📒 styles
    * 📑 theme.js
* 📑 package.json
* 📑 README.md

## Setting up project:

* Install dependencies:
  `yarn install`

* Start project:
  `yarn start`

* Create a deployable build
  `yarn build`

* To build locally and test in other app:
  - Run `yarn run build:watch`.
  - Run `yarn link` - this will set the local build of the package to resolve to.
  - In the other project directory run `yarn link "mop-react-ui-components"`.
  - After you are done, run `yarn unlink`.

* Trigger tests
  `yarn test`

* Build storybook for deployment
  `yarn build-storybook`

## Usage

You'll need to wrap your app in the exported theme provider to be able to use any components:

```
import { DefaultTheme, ThemeProvider, Text } from 'mop-react-ui-components';

const App = () =>
  <ThemeProvider theme={DefaultTheme}>
    <Text>Hello MOP</Text>
  </ThemeProvider>

```

You can override or replace `DefaultTheme` with your own theme.

## Prettier and ESLint

Install Visual Studio Code extensions:

* [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
* [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)

Should you want to impose specific Visual Studio Code editor configuration, you can do that in [settings.json](https://github.com/SwipeStoxGmbH/naga-card/tree/master/.vscode/settings.json)


## Authors and contributors

* **Eldin Soljic** - [Sholja](https://github.com/Sholja) - **Software Developer**

See also the list of [contributors](https://github.com/Sholja/mop-react-ui-components/graphs/contributors) who participated in this project.

# Happy coding!

---
_Source: https://npm.io/package/mop-react-ui-components · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._