@visualli/react 0.1.1 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@visualli/react",
3
- "version": "0.1.1",
3
+ "version": "0.1.2",
4
4
  "description": "React canvas renderer for .visualli files \u2014 built on @visualli/core",
5
5
  "repository": {
6
6
  "type": "git",
@@ -25,10 +25,12 @@
25
25
  "build": "tsup",
26
26
  "typecheck": "tsc --noEmit"
27
27
  },
28
+ "peerDependencies": {
29
+ "react": "^18.0.0",
30
+ "react-dom": "^18.0.0"
31
+ },
28
32
  "dependencies": {
29
33
  "@visualli/core": "*",
30
- "react": "^18.0.0",
31
- "react-dom": "^18.0.0",
32
34
  "zustand": "^4.5.2",
33
35
  "konva": "^9.3.6",
34
36
  "react-konva": "^18.2.10"
@@ -797,7 +797,10 @@ export default function VisualliCanvas(props: VisualliCanvasProps) {
797
797
  const handleStageContextMenu = useCallback((e: Konva.KonvaEventObject<MouseEvent>) => {
798
798
  e.evt.preventDefault();
799
799
  if (navStack.length <= 1) { setCanvasContextMenu(null); return; }
800
- setCanvasContextMenu({ x: e.evt.clientX, y: e.evt.clientY });
800
+ const rect = containerRef.current?.getBoundingClientRect();
801
+ const localX = rect ? e.evt.clientX - rect.left : e.evt.clientX;
802
+ const localY = rect ? e.evt.clientY - rect.top : e.evt.clientY;
803
+ setCanvasContextMenu({ x: localX, y: localY });
801
804
  }, [navStack.length]);
802
805
 
803
806
  // Touch passthrough
@@ -987,7 +990,7 @@ export default function VisualliCanvas(props: VisualliCanvasProps) {
987
990
  role="menu"
988
991
  aria-label="Canvas options"
989
992
  style={{
990
- position: 'fixed',
993
+ position: 'absolute',
991
994
  zIndex: 60,
992
995
  pointerEvents: 'auto',
993
996
  left: `${Math.min(canvasContextMenu.x, Math.max(8, (canvasSizeRef.current.width || 800) - 152))}px`,
@@ -1041,7 +1044,7 @@ export default function VisualliCanvas(props: VisualliCanvasProps) {
1041
1044
  <div
1042
1045
  data-node-tooltip="true"
1043
1046
  style={{
1044
- position: 'fixed',
1047
+ position: 'absolute',
1045
1048
  zIndex: 50,
1046
1049
  left: safeLeft,
1047
1050
  top: safeTop,