npm package: @moneymade/moneymade-widgets
Description: Moneymade Widgets
Author: Volodymyr Kovalyk
Latest version: 1.0.2

<h1 align="center">Welcome to <code>moneymade-widgets</code></h1>
<p>&nbsp;</p>

## Installation

Just run the following command at the root of your project:

```jsx
npm install moneymade-widgets
```
<p>&nbsp;</p>

## Usage

First you need to wrap your project with MoneymadeEmbed component
 
```jsx
import { MoneymadeEmbed } from 'moneymade-widgets' 
```

```jsx
<MoneymadeEmbed>
  {children}
</MoneymadeEmbed>
```
<p>&nbsp;</p>

## Examples
Our Comonents:
  - TickerSimple
  - ArticleSnapshot
  - CategoryRoundup
  - Monetized
  - TickerTable
  - InlineData
  - TickerExpanded

Basic example:

```jsx
import { 
  InlineData,
  Monetized,
  TickerTable,
  CategoryRoundup,
  TickerExpanded,
  ArticleSnapshot,
  TickerSimple } from 'moneymade-widgets' 
```
### TickerSimple
```jsx
 <TickerSimple symbol="AAPL" />
```
| Props    | Type    | Default | Description           |
|----------|---------|---------|-----------------------|
| symbol   | string  | -       | Set ticker to display |
| schema   | string  | -       | Set schema to display |

### ArticleSnapshot
```jsx
  <ArticleSnapshot title="Test" symbols={['AAPL', 'BRK.A', 'MSGE']} />
```
| Props    | Type    | Default | Description            |
|----------|---------|---------|------------------------|
| symbols  | string[]| -       | Set array with tickers |
| title    | string  | ''      | Set text               |
| schema   | string  | -       | Set schema to display |

### CategoryRoundup
```jsx
  <CategoryRoundup title="Test" symbols={['AAPL', 'BRK.A', 'MSGE']} />
```
| Props    | Type    | Default | Description            |
|----------|---------|---------|------------------------|
| symbols  | string[]| -       | Set array with tickers |
| title    | string  | ''      | Set text               |
| schema   | string  | -       | Set schema to display  |

### Monetized
```jsx
  <Monetized symbols={['AAPL', 'MSGE']} timeframe="1Y" />
```
| Props    | Type    | Default                  | Description                                       |
|----------|---------|--------------------------|---------------------------------------------------|
| symbols  | string[]| -                        | Set array with tickers                            |
| timeframe| string  |24H, 7D, 30D, 1Y, 5Y, 10Y |You need select one of the proposed default values |
| schema   | string  | -                        | Set schema to display                             |

### InlineData
```jsx
  <InlineData symbol="FB" dataPoint="5yr-average-annual-return" fontSize="20" />
```
| Props    | Type    | Default                                   | Description                                                                                                              |
|----------|---------|-------------------------------------------|--------------------------------------------------------------------------------------------------------------------------|
| symbol   | string  | -                                         | Set ticker to display                                                                                                    |
| schema   | string  | -                                         | Set schema to display                                                                                                    |
| fontSize | string  |12, 14, 16, 18, 20, 22, 24, 26, 28, 30, 32 |You need select one of the proposed default values                                                                        |
| dataPoint| string  |market-cap, price, ytd-return,todays-return, last-5-trading-days-return, last-52-weeks-return, 5yr-average-annual-return, 10yr-average-annual-return |You need select one of the proposed default values|  

### TickerExpanded
```jsx
  <TickerExpanded symbol="FB" />
```
| Props    | Type    | Default | Description           |
|----------|---------|---------|-----------------------|
| symbol   | string  | -       | Set ticker to display |
| schema   | string  | -       | Set schema to display |

<p>&nbsp;</p>