# Please Pay Me — Widgetbook

Portable component catalog for the mobile UI kit. Lives as a **separate package**
under `mobile/widgetbook/` and depends on the app package via path — no changes
required in production `lib/main.dart`.

## Run

```powershell
cd mobile\widgetbook
.\run.ps1                  # chrome по умолчанию
.\run.ps1 -Device windows
```

Или из `mobile/`:

```powershell
.\run.ps1 -Target widgetbook -Device chrome
```

```bash
cd mobile/widgetbook
flutter pub get
flutter run -d chrome
# or
flutter run -d windows
```

## Structure

```
widgetbook/
├── lib/
│   ├── main.dart
│   ├── app.dart              # WidgetbookRoot + addons
│   ├── catalog.dart          # directory tree (also used by smoke tests)
│   ├── addons/               # theme / locale / device frame
│   ├── knobs/                # shared knob helpers
│   ├── support/preview.dart    # iOS grouped-background canvas for use-cases
│   ├── support/demo_scope.dart # real screens on the in-memory DemoBackend
│   └── use_cases/            # Atoms → Molecules → Navigation → Feedback → Screens
└── test/catalog_smoke_test.dart
```

## iOS kit

Компоненты построены на Cupertino и следуют Apple HIG:

- семантические цвета (`label` / `separator` / `groupedBackground`) объявлены как
  `CupertinoDynamicColor`, поэтому light/dark резолвится автоматически;
- типографика — шкала SF Pro (`largeTitle` 34 … `caption2` 11), в качестве
  кросс-платформенной замены SF используется Inter;
- списки — inset-grouped секции с hairline-разделителями (0.5pt) и отступом
  под leading-бейдж, как в Settings;
- контролы — `CupertinoButton`, `CupertinoTextField`, `CupertinoSwitch`,
  `CupertinoSlidingSegmentedControl`, `CupertinoTabBar`, `CupertinoAlertDialog`,
  `CupertinoActionSheet`, `CupertinoActivityIndicator`;
- вместо Material SnackBar — `AppToast`: плавающая blur-капсула поверх контента.

Бренд-тинт остался зелёным (`AppColors.accent`) и подменяет `systemBlue`.

Use-cases render **real widgets** from `package:please_pay_me/ui/...` and themes from
`package:please_pay_me/theme/...`.

Addons:

- **Theme** — Light / Dark (`CupertinoThemeAddon`, `buildLightTheme` / `buildDarkTheme`)
- **Locale** — `ru` / `en`
- **Viewport** — iPhone / Android frames

## Reuse in another Flutter project

1. Copy `widgetbook/` folder (or this package).
2. Point `please_pay_me` path dependency to your UI package (or rename dependency).
3. Keep exporting widgets from that package; use-cases only import them.
4. Run `flutter pub get && flutter run`.

Optional codegen (annotations already in `pubspec.yaml`):

```bash
dart run build_runner build --delete-conflicting-outputs
```

Current catalog is **manual** via `catalog.dart` so it stays easy to copy without
a generator step.

## Tests

```bash
cd mobile/widgetbook
flutter test
```

Smoke-тесты проверяют, что структура каталога на месте, и **рендерят каждый use-case
в светлой и тёмной теме** внутри `WidgetbookScope` (knobs читают состояние из контекста),
падая на любом исключении при построении.