chore: update lint rules

This commit is contained in:
2026-09-11 07:39:51 +05:00
parent 87bd4482a3
commit fa5f7660c7
12 changed files with 532 additions and 79 deletions
+20 -46
View File
@@ -24,66 +24,40 @@
## Правила кода
### Svelte 5: типизация props через `interface Props`
Синтаксические ограничения описывать не нужно — они проверяются линтером
(весь список правил и токены-префиксы в `web/eslint-plugins/README.md`,
прогон: `pnpm --dir web lint` / `pnpm --dir web lint:all`). Здесь — только то,
что линтер не умеет.
Все типизированные пропсы компонентов описываются через локальный
`interface Props`, а деструктуризация идёт через аннотацию типа при `$props()`:
### Svelte 5
```svelte
<script lang="ts">
import type { Snippet } from 'svelte';
Типизация пропсов через локальный `interface Props` закреплена правилом
`conventions/interface-props`; руками его нигде дублировать не надо.
interface Props {
label: string;
accent?: boolean;
children?: Snippet;
}
### Сначала искать
let { label, accent = false, children }: Props = $props();
</script>
```
Новая константа или тип не заводится, пока не произведён поиск существующего
определения (по ключу в соседних модулях и по всему `web/src/`). Это правило
в первую очередь для ИИ-агентов: дублирующее определение ухудшает правки в
нескольких местах и запутывает. (Синтаксис самих определений — под линтером:
строка `conventions/no-string-union-alias` и т.д.)
Не использовать инлайн-дженерик `$props<{ ... }>()` — он тяжело читается и
разносит тип и деструктуризацию по разным местам. Также **не использовать
инлайн-импорты в типах** (`children?: import('svelte').Snippet;`) — все
`import type` поднимаются наверх файла.
### Дизайн
> Правило «всегда `interface Props` + `let {...}: Props = $props()`» стандартным
> ESLint-правилом не покрывается — остаётся конвенцией.
### Дизайн: новый визуальный язык
Описание дизайна — в `docs/plan-redesign.md`. Общие правила:
Описание нового визуального языка — в `docs/plan-redesign.md`. Общие правила,
которые линтер не проверяет:
- Новый дизайн живёт в `web/src/app.css` (корневые маршруты), старый — в
`web/src/app_v1.css` (маршруты `/v1/*`).
- Все повторяющиеся визуальные элементы — отдельные компоненты в
`web/src/lib/components/`, даже «просто div с двумя стилями».
### Линтинг дизайн-токенов
Запрещено «захардкоживать» дизайн: цвета, размеры, длительности и z-index
обязаны приходить из CSS-переменных. Прогон: `pnpm --dir web lint:all`.
- **Цвета**: только `hct(...)` в `app.css`, seed-токены
(`--brand-main`/`--brand-alt`) и `color-mix(...)` — исключения.
`oklch()/rgb()/#hex` в `--color-*` запрещены.
- **Размеры**: `--space-*`, `--text-*`, `--radius-*`, `--size-*`.
- **Breakpoints**: `@custom-media --bp-*` (объявления в `app.css`, используются
как `@media (--bp-*)`).
- **z-index**: `--z-*`; **длительности**: `--duration-*`, `--ease-*`.
- В `<style>` svelte-компонентов: нельзя хардкодить цвета/размеры/длительности,
нельзя использовать необъявленные `var(--x)`, нельзя путать категории
(color-токен в size-свойстве).
Детали: полный список правил плагина, токены-префиксы, настройка stylelint — см.
`web/eslint-plugins/README.md`.
- Дизайн-токены (цвета, размеры, длительности, z-index) — только из
CSS-переменных; детали ограничений — в `web/eslint-plugins/README.md`.
### Изоляция веток old ↔ new
Старый (`v1/`) и новый UI полностью изолированы: ESLint-правило
`isolation/no-mixed-imports` резолвит каждый импорт до файла и запрещает
смешивание.
Старый (`v1/`) и новый UI изолированы: `isolation/no-mixed-imports` резолвит
каждый импорт до файла и запрещает смешивание.
- Trunk-based: коммиты делает разработчик после ревью, самому не коммитить.
Изменения делать небольшими (< ~500 строк), атомарными.