docs: add resize/positioning reference baseline (zoom=1 visible UI)

This commit is contained in:
Hermes Agent committed 2026-09-10 17:16:31 +02:00
1 parent 47cad7968d
commit c799c22889
1 file changed
+44
+44
View File
@@ -56,6 +56,50 @@
- **Решение:** remote как `http://<TOKEN>:@<host>/admin/figma-ai-plugin.git`. Токен должен иметь scope `write:repository` (без `write:user` создать репо нельзя — создавать через basic auth admin-ом).
- **Ссылка:** IDEA.md, Gitea http://x1qnvk08zec2u5cx6yh5iexh.155.212.186.39.sslip.io/admin/figma-ai-plugin
## ЭТАЛОН — ресайз и позиционирование (подтверждено пользователем)
> Зафиксировано после коммита `47cad79`. Любые правки в `ui.tsx`/`main.ts` сверять с этим.
> Среда замера: zoom=1, Figma UI виден (лимит окна ≈ 454×783 при full HD viewport).
### Модель координат
- `reposition(x,y)` / `getPosition().canvasSpace` — В canvas-space, отсчёт от **верха шапки** окна плагина (38px).
- `resize(w,h)` — в ЭКРАННЫХ px. Figma КЛАМПИТ до своего лимита при видимом UI (≈454×783), при спрятанном UI (Ctrl+\) — до всего viewport.
- Перевод: `wCanvas = w/zoom`, `hCanvasFull = (38+h)/zoom`.
### Периметральные ручки (8 фиолетовых div)
- **Drag** (>4px) = ресайз (single-/dual-axis). Якорь фиксируется в `RESIZE_START`, размер считается от якоря.
- **Чистый клик** (без движения):
- Угол **не в доке** → телепорт в угол (`dockWindow`).
- Угол **в доке** (край) → свободная ось = 50% viewport (`DOCK_HALF`), прижим в угол, выход из дока.
- Край → телепорт в край (`dockWindow`).
- Центр — ТОЛЬКО кнопкой в шапке (в периметр не входит).
### Что есть «док»
- **Док = окно растянуто у КРАЯ** (одна ось = 320, другая = max viewport). Углы и центр доком НЕ считаются.
- Краевые кнопки (▬▭▏▕) пишут `dockedPosRef`; углы/центр — нет.
### Ожидаемые значения (zoom=1, bounds 3513,-1774 · 908×872, видимый UI)
Реальный лимит: maxW≈454, maxH≈783. Растяжение срабатывает ТОЛЬКО по «своей» оси (другая клампится):
| Кнопка | Реал. W×H | x | y | relX | relY |
|---|---|---|---|---|---|
| ◤ top-left | 454×417 | 3513 | -1774 | 0 | 0 |
| ▬ top-center | 454×320 | 3740 | -1774 | 227 | 0 |
| ◥ top-right | 454×417 | 3867 | -1774 | 354 | 0 |
| ▏ center-left | 320×783 | 3513 | -1748 | 0 | 26 |
| ⊕ center | 454×417 | 3740 | -1565 | 227 | 209 |
| ▕ center-right | 320×783 | 4101 | -1748 | 588 | 26 |
| ◣ bottom-left | 454×417 | 3513 | -1357 | 0 | 417 |
| ▭ bottom-center | 454×320 | 3740 | -1260 | 227 | 514 |
| ◢ bottom-right | 454×417 | 3867 | -1357 | 354 | 417 |
- `▬ top-center`: relX=227 (окно ПО ЦЕНТРУ по X), relY=0 (прижат к верху).
- `▏ center-left`: relY=26, gapT=gapB=25 (вертикально ОТЦЕНТРИРОВАНО).
- Баг детектора: если видишь relX=0 на `▬` — окно прижалось к левому краю вместо центра (позиция считается от канона, а не реального размера). Фикс: `DOCK_REFINE` считает от реального `window.innerWidth/Height`.
### Кнопки в шапке
`[размер] [copy] [центр=IconDockToSide24] [развернуть/свернуть]`. Сетка 3×3 из тела УДАЛЕНА.
## Ресурсы (не терять)
- UI Storybook: https://yuanqing.github.io/create-figma-plugin/ui/
- Figma Plugin API docs: https://www.figma.com/plugin-docs/