chore(examples): only use bundle

This commit is contained in:
moklick
2022-08-09 18:55:32 +02:00
parent affae72f7e
commit 0f835a2961
48 changed files with 194 additions and 513 deletions
+3 -3
View File
@@ -1,6 +1,6 @@
import React, { memo, FC, CSSProperties } from 'react';
import { Handle, NodeProps, Position } from '@react-flow/core';
import { Handle, NodeProps, Position } from '@react-flow/bundle';
const infoStyle: CSSProperties = { fontSize: 11 };
const idStyle: CSSProperties = {
@@ -14,12 +14,12 @@ const idStyle: CSSProperties = {
const DebugNode: FC<NodeProps> = ({ zIndex, xPos, yPos, id }) => {
return (
<>
<Handle type='target' position={Position.Top} />
<Handle type="target" position={Position.Top} />
<div style={idStyle}>{id}</div>
<div style={infoStyle}>
x:{Math.round(xPos || 0)} y:{Math.round(yPos || 0)} z:{zIndex}
</div>
<Handle type='source' position={Position.Bottom} />
<Handle type="source" position={Position.Bottom} />
</>
);
};
+8 -16
View File
@@ -9,17 +9,15 @@ import {
MarkerType,
useNodesState,
useEdgesState,
} from '@react-flow/core';
import { Controls } from '@react-flow/controls';
import { Background } from '@react-flow/background';
import { MiniMap } from '@react-flow/minimap';
Controls,
MiniMap,
Background,
} from '@react-flow/bundle';
import DebugNode from './DebugNode';
const onNodeDrag = (_: MouseEvent, node: Node, nodes: Node[]) =>
console.log('drag', node, nodes);
const onNodeDragStop = (_: MouseEvent, node: Node, nodes: Node[]) =>
console.log('drag stop', node, nodes);
const onNodeDrag = (_: MouseEvent, node: Node, nodes: Node[]) => console.log('drag', node, nodes);
const onNodeDragStop = (_: MouseEvent, node: Node, nodes: Node[]) => console.log('drag stop', node, nodes);
const onNodeClick = (_: MouseEvent, node: Node) => console.log('click', node);
const onEdgeClick = (_: MouseEvent, edge: Edge) => console.log('click', edge);
@@ -150,14 +148,8 @@ const Subflow = () => {
const [nodes, setNodes, onNodesChange] = useNodesState(initialNodes);
const [edges, setEdges, onEdgesChange] = useEdgesState(initialEdges);
const onConnect = useCallback(
(connection: Connection) => setEdges((eds) => addEdge(connection, eds)),
[setEdges]
);
const onInit = useCallback(
(reactFlowInstance: ReactFlowInstance) => setRfInstance(reactFlowInstance),
[]
);
const onConnect = useCallback((connection: Connection) => setEdges((eds) => addEdge(connection, eds)), [setEdges]);
const onInit = useCallback((reactFlowInstance: ReactFlowInstance) => setRfInstance(reactFlowInstance), []);
const updatePos = () => {
setNodes((nds) => {