open-index/open-npm huggingface dataset:
npm package: @megalabs/react-accordion
Description: Описание структуры компонента:
Author: Anton Bukin
Latest version: 0.4.26

# Accordion
Описание структуры компонента:

| **Элемент**   | **Описание**                                                          |
| ------------- | --------------------------------------------------------------------- |
| Accordion     | Родительский блок                                                     |
| AccordionItem | Пункт меню                                                            |
| Content       | Содержимое раскрываемого пункта меню                                  |
| SubItem       | Нужен для того, чтобы организовать дополнительный уровень вложенности |

Пример вложенной структуры

```jsx
    <Accordion>
                        <AccordionItem title="Заголовок 1">
                            <SubItem>
                                <AccordionItem title="Подзаголовок 1">
                                    <SubItem>
                                        <AccordionItem title="Подзаголовок 2">
                                            <Content>
                                                 Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum incidunt provident eum tenetur esse nisi eveniet quisquam quaerat explicabo deserunt rem saepe minima sapiente, eius magni laudantium dolor obcaecati! Reiciendis.
                                            </Content>
                                        </AccordionItem>
                                    </SubItem>
                                </AccordionItem>
                            </SubItem>
                        </AccordionItem>
                             <AccordionItem title="Заголовок 2">
                                                                   <Content>
                                                 Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum incidunt provident eum tenetur esse nisi eveniet quisquam quaerat explicabo deserunt rem saepe minima sapiente, eius magni laudantium dolor obcaecati! Reiciendis.
                                            </Content>
                                                        </AccordionItem>
                    </Accordion>
```
npm package: @megalabs/react-bayan
Description: <!-- STORY -->
Author: Anton Bukin
Latest version: 0.4.26

# Компонент Bayan
<!-- STORY -->

## Установка

``` npm i @megalabs/react-bayan ```

## Описание
Компонент состоит из 2 элементов, это оболочка <Bayan> и дочерний элемент <Item>
Элементов Item может быть бесконечное количество


## Параметры ```<item>```

| **propName** | **propType** | **defaultValue** | **isRequired** |     **Description**                      |
| ------------ | -------------|------------------|----------------|----------------------------------------- |
| title         | String       |            |                | Заголовок .                   |
| icon         | String       |                  |                | Иконка слева от заголовка          |


## Пример использования

```jsx
import React, { Component } from 'react';
import {Bayan, Item} from '@megalabs/react-bayan';
const data={"items": [
      {
        "icon": "/icons/O-platezh_24.svg",
        "title": "Lorem ipsum dolor",
        "content": "<h3>Lorem ipsum dolor</h3><br/><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Mollitia sed neque magnam. Recusandae velit praesentium distinctio quod ad quidem delectus modi corporis itaque, nemo quos quae neque dolore hic quis.</p>",
        "image": "/images/vks/1tab.jpg"
      },
      {
        "icon": "/icons/Question_24.svg",
        "title": "Lorem ipsum dolor",
        "content": "<h3>Lorem ipsum dolor</h3><br/><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Mollitia sed neque magnam. Recusandae velit praesentium distinctio quod ad quidem delectus modi corporis itaque, nemo quos quae neque dolore hic quis.</p>",
        "image": "/images/vks/2tab.jpg"
      },
      {
        "icon": "/icons/Promo_24.svg",
        "title": "Lorem ipsum dolor",
        "content": "<h3>Lorem ipsum dolor</h3><br/><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Mollitia sed neque magnam. Recusandae velit praesentium distinctio quod ad quidem delectus modi corporis itaque, nemo quos quae neque dolore hic quis.</p>",
        "image": "/images/vks/3tab.jpg"
      },
      {
        "icon": "/icons/Map_24.svg",
        "title": "Lorem ipsum dolor",
        "content": "<h3>Lorem ipsum dolor</h3><br/><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Mollitia sed neque magnam. Recusandae velit praesentium distinctio quod ad quidem delectus modi corporis itaque, nemo quos quae neque dolore hic quis.</p>",
        "image": "/images/vks/4tab.jpg"
      }
    ]}
class App extends Component {
  render() {
    return (
      <div className="App">
				<Bayan>
					{data.items.map((item,index)=>{
					return <Item key={index}
								title={item.title}
								icon={item.icon}
								image={item.image}>
								<div className={`${s.tab} ${index%2!==0?s.tab_imgleft:''}`} style={{backgroundImage:`url(${item.image})`}}>
										<div className={s.text} dangerouslySetInnerHTML={{__html: item.content}}/>
								</div>
						</Item>	})}
				</Bayan>
      </div>
    );
  }
}

export default App;
```
npm package: @megalabs/react-button
Description: <!-- STORY -->
Author: Anton Bukin
Latest version: 0.4.24

# Компонент кнопка
<!-- STORY -->

## Установка

``` npm i @megalabs/react-button ```

## Параметры

| **propName** | **propType** | **defaultValue** | **isRequired** |     **Description**                      |
| ------------ | -------------|------------------|----------------|----------------------------------------- |
| type         | String       | button           |                | Определяет тип кнопки.                   |
| href         | String       |                  |                | Делает из кнопки простую ссылку          |
| fullWidth    | Boolean      | false            |                | 100% ширины                              |

Параметр type принимает след. значения:
- outline
- cta
- button

## Пример использования

```jsx
import React, { Component } from 'react';
import {Button} from '@megalabs/react-button';

class App extends Component {
  render() {
    return (
      <div className="App">
						<Button type="outline">Clik me!</Button>
						<Button type="cta">Clik me!</Button>
						<Button type="button">Clik me!</Button>
						<Button href="https://megafon.ru">Clik me!</Button>
      </div>
    );
  }
}

export default App;
```