trafficlunar/blockmatic
1
0
Fork 0
mirror of https://github.com/trafficlunar/blockmatic.git synced 2026-06-28 14:44:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: resizable tool settings window

Browse source
This commit is contained in:
trafficlunar 2024-12-31 19:39:52 +00:00
parent c8cccd8bf7
commit acfd638d2c
4 changed files with 77 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/components/canvas/Canvas.tsx
View file

@ -267,24 +267,30 @@ function Canvas() {
};
useEffect(() => {
const container = stageContainerRef.current;
if (!container) return;
const resizeCanvas = () => {
if (stageContainerRef.current) {
setStageSize({
width: stageContainerRef.current.offsetWidth,
height: stageContainerRef.current.offsetHeight,
});
}
setStageSize({
width: container.offsetWidth,
height: container.offsetHeight,
});
};
const resizeObserver = new ResizeObserver(resizeCanvas);
resizeObserver.observe(container);
resizeCanvas();
return () => resizeObserver.disconnect();
}, [stageContainerRef]);
useEffect(() => {
setBlocks(welcomeBlocksData);
window.addEventListener("resize", resizeCanvas);
window.addEventListener("keydown", onKeyDown);
window.addEventListener("keyup", onKeyUp);
return () => {
window.removeEventListener("resize", resizeCanvas);
window.removeEventListener("keydown", onKeyDown);
window.removeEventListener("keyup", onKeyUp);
};