# AebUiKitReact

Инструкция по разработке:

1. npm ci
2. npm run storybook
3. http://localhost:6006/

Рекомендуемые VS Code расширения для разработки:

1. vscode-styled-components
2. CSS Variable Autocomplete
3. Flutter Color

Инструкция по сборке и публикации:

1. npm run build
2. npm run publish

Инструкция по использованию в проекте:

1. `npm install @albank/react-ui-kit`
2. Импортировать в глобальный стилевой файл стили из библиотеки `@import '@albank/react-ui-kit/style.css';`
3. Запустить проект (например, `npm start`)

По умолчанию UI-кит использует шрифты `Roboto`, но в сборку они не входят, поэтому нужно добавить их отдельно. Пример добавления шрифтов `Roboto`:

```scss
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    src: url('/fonts/Roboto-Regular.ttf') format('truetype');
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 500;
    src: url('/fonts/Roboto-Medium.ttf') format('truetype');
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 700;
    src: url('/fonts/Roboto-Bold.ttf') format('truetype');
}
```

Для изменения шрифтов компонентов UI-кита, нужно перезаписать CSS-переменную `--default-font` у себя в проекте через псевдокласс `:root`