Тимур Городецкий
42 lines
1.4 KiB
Markdown
42 lines
1.4 KiB
Markdown
# @tnsu/ui-kit
|
|
|
|
Общие UI-компоненты для SPFx web part'ов ТНСУ. Единый дизайн, один источник правды.
|
|
|
|
> Внутренняя память проекта (решения, план, прогресс) — в [PROJECT.md](./PROJECT.md).
|
|
|
|
## Установка
|
|
|
|
```powershell
|
|
npm i @tnsu/ui-kit
|
|
```
|
|
|
|
Пакет требует, чтобы в проекте уже были (peerDependencies):
|
|
`react@17`, `react-dom@17`, `@fluentui/react@8`, `tslib`.
|
|
У любого SPFx-решения этого поколения они есть.
|
|
|
|
## Использование
|
|
|
|
```ts
|
|
import { Button } from '@tnsu/ui-kit';
|
|
import '@tnsu/ui-kit/styles.css'; // один раз в точке входа web part
|
|
|
|
<Button variant="primary">Отправить</Button>;
|
|
```
|
|
|
|
## Компоненты
|
|
|
|
_Наполняется по мере переноса. Полная витрина со всеми состояниями — в Storybook._
|
|
|
|
| Компонент | Описание | Статус |
|
|
|-----------|----------|--------|
|
|
| Button | Кнопка, варианты primary/accent/secondary/ghost/danger | ⏳ переносится |
|
|
|
|
## Разработка
|
|
|
|
```powershell
|
|
npm i # поставить зависимости
|
|
npm run build # собрать пакет в dist/
|
|
npm run dev # сборка в watch-режиме
|
|
# npm run storybook — витрина (добавим на шаге 5)
|
|
```
|