fix: drag works again; size label updates only on pointerup

- ui.tsx: useWindowResize callback emits RESIZE_WINDOW with hook-computed
  size (not window.innerWidth) so figma.ui.resize grows correctly during drag
- ui.tsx: add window 'pointerup' listener to refresh size readout AFTER
  drag ends (Figma already applied new size by then)
This commit is contained in:
Hermes Agent committed 2026-09-09 12:58:26 +02:00
1 parent 4aa82fbefa
commit 84ec81bf03
1 file changed
+19 -5
+19 -5
View File
@@ -11,7 +11,7 @@ import {
} from '@create-figma-plugin/ui'
import { emit } from '@create-figma-plugin/utilities'
import { h, Fragment } from 'preact'
import { useState } from 'preact/hooks'
import { useState, useEffect } from 'preact/hooks'
const MIN_WINDOW_SIZE = { width: 320, height: 200 }
const MAX_WINDOW_SIZE = { width: 800, height: 800 }
@@ -22,11 +22,10 @@ function Plugin () {
// Нативный drag-ресайз окна Figma (тянуть за правый нижний угол).
// Опции min/max обязательны: без них хук берёт базу из window.innerWidth на момент
// маунта (окно ещё не приняло размер от showUI) → первый drag не работает.
// ВАЖНО: хук мутирует и отдаёт ОДИН объект по ссылке, поэтому делаем копию
// (иначе Preact не видит изменений и цифры размера не перерисовываются).
// В колбэке шлём размер в main (figma.ui.resize), чтобы окно тянулось вживую.
// State с цифрами НЕ трогаем здесь — обновляем только после отпускания (pointerup).
useWindowResize(function (windowSize: { width: number; height: number }) {
const size = { width: window.innerWidth, height: window.innerHeight }
setCurrentWindowSize(size)
const size = { width: windowSize.width, height: windowSize.height }
emit('RESIZE_WINDOW', size)
}, {
minWidth: 320,
@@ -35,6 +34,21 @@ function Plugin () {
maxHeight: 800
})
// Обновляем цифры размера ТОЛЬКО после окончания drag'а (отпускание кнопки).
// К моменту pointerup Figma уже применила новый размер окна.
useEffect(function () {
const handlePointerUp = function () {
setCurrentWindowSize({
width: window.innerWidth,
height: window.innerHeight
})
}
window.addEventListener('pointerup', handlePointerUp)
return function () {
window.removeEventListener('pointerup', handlePointerUp)
}
}, [])
function toggleWindowSize () {
const isMaximized =
currentWindowSize.width >= MAX_WINDOW_SIZE.width &&