trafficlunar/blockmatic
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: make mouse events pointer events

Browse source
This commit is contained in:
trafficlunar 2025-02-11 16:38:01 +00:00
parent bd7c27b96c
commit bcc47f4eed
3 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/dialogs/open-image/BlockSelector.tsx
View file

@ -44,7 +44,7 @@ function BlockSelector({ stageWidth, searchInput, selectedBlocks, setSelectedBlo
width={stageWidth} width={stageWidth}
height={Math.ceil(Object.keys(blockData).length / blocksPerColumn) * (32 + 2)} height={Math.ceil(Object.keys(blockData).length / blocksPerColumn) * (32 + 2)}
options={{ backgroundAlpha: 0 }} options={{ backgroundAlpha: 0 }}
onMouseLeave={() => setHoverPosition(null)} onPointerLeave={() => setHoverPosition(null)}
> >
<Container> <Container>
{filteredBlocks.map((block, index) => { {filteredBlocks.map((block, index) => {

2
src/components/home/ImageComparison.tsx
View file

@ -14,7 +14,7 @@ function ImageComparison() {
return ( return (
<div <div
onMouseMove={onMouseMove} onPointerMove={onMouseMove}
className="relative select-none w-[40vw] h-[calc(40vw*217/270)] flex justify-center rounded-xl border border-zinc-200 dark:border-zinc-800 shadow-md" className="relative select-none w-[40vw] h-[calc(40vw*217/270)] flex justify-center rounded-xl border border-zinc-200 dark:border-zinc-800 shadow-md"
> >
<img <img

14
src/components/sidebar/index.tsx
View file

@ -46,16 +46,16 @@ function Sidebar() {
useEffect(() => { useEffect(() => {
if (resizing) { if (resizing) {
document.addEventListener("mousemove", onMouseMove); document.addEventListener("pointermove", onMouseMove);
document.addEventListener("mouseup", onMouseUp); document.addEventListener("pointerup", onMouseUp);
} else { } else {
document.removeEventListener("mousemove", onMouseMove); document.removeEventListener("pointermove", onMouseMove);
document.removeEventListener("mouseup", onMouseUp); document.removeEventListener("pointerup", onMouseUp);
} }
return () => { return () => {
document.removeEventListener("mousemove", onMouseMove); document.removeEventListener("pointermove", onMouseMove);
document.removeEventListener("mouseup", onMouseUp); document.removeEventListener("pointerup", onMouseUp);
}; };
}, [resizing]); }, [resizing]);
@ -87,8 +87,8 @@ function Sidebar() {
className="w-72 border-l border-zinc-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-2 pb-0 flex flex-col h-full gap-2 relative" className="w-72 border-l border-zinc-200 dark:border-zinc-800 bg-white dark:bg-zinc-950 p-2 pb-0 flex flex-col h-full gap-2 relative"
> >
<div <div
onMouseDown={onMouseDown}
className="absolute top-0 -left-2 h-full w-4 bg-zinc-300 dark:bg-zinc-800 flex justify-center items-center cursor-e-resize opacity-0 transition-opacity duration-300 delay-100 hover:opacity-100" className="absolute top-0 -left-2 h-full w-4 bg-zinc-300 dark:bg-zinc-800 flex justify-center items-center cursor-e-resize opacity-0 transition-opacity duration-300 delay-100 hover:opacity-100"
onPointerDown={onMouseDown}
> >
<GripVerticalIcon /> <GripVerticalIcon />
</div> </div>