# Mottled-library

A tree-shakeable library containing common reusable components for substrate based chains

## Install and run dev

Package is using workspaces for custom build/bundle the library. Core components exist under dir `packages/library`.
For documentation and development purposes [Storybook](https://storybook.js.org/) was the tool of choice. This way contributors can catch up to speed with current components and also develop faster new ones.
In order to install all required packages and execute in `watch` mode the library and storybook just run the command below:

```
yarn && yarn run dev
```

## Usage

Principle followed in the library is to carry components and styling in different packages. This way the user of the library can decide if wants to style the components using his own css (overwrite classNames or using tailwind) or using default css.

In order to use default css see the following example:

```tsx
import React, { Component } from "react"

// importing css for specific component
import 'mottled-library/css/SpecificComponent.css'

// importing the specific component
import { SpecificComponent } from "mottled-library"

class Example extends Component {
  render() {
    return (
      <>
        <SpecificComponent />
      </>
  }
}
```

In addition to components exists the `core` of the library that contains reusable variables and functions that are used from almost all components but can also be useful stand alone.

## Storybook

As mentioned above, Storybook is used for documentation and development.
In order to see a showcase of current components and recipes see [here]()(Implementation pending)

## Possible Errors:

### error:0308010C:digital envelope routines::unsupported

An `error:0308010C:digital envelope routines::unsupported` occurs with the Node.js version 17 as it’s not the LTS version, and there is a breaking change in the OpenSSL. Use LTS version 16.14.0 for not facing the issue. NODE_OPTIONS could also be set, as an alternative, but is not a recommended approach (you can still try this on your local machine as a quick fix).