chore(examples): only use bundle

examples/nextjs/pages/CustomNode/ColorSelectorNode.tsx

@@ -1,11 +1,5 @@
 import React, { memo, FC, CSSProperties } from 'react';
-import {
-  Handle,
-  Position,
-  NodeProps,
-  Connection,
-  Edge,
-} from '@react-flow/renderer';
+import { Handle, Position, NodeProps, Connection, Edge } from '@react-flow/bundle';
 
 const targetHandleStyle: CSSProperties = { background: '#555' };
 const sourceHandleStyleA: CSSProperties = { ...targetHandleStyle, top: 10 };
@@ -15,27 +9,16 @@ const sourceHandleStyleB: CSSProperties = {
   top: 'auto',
 };
 
-const onConnect = (params: Connection | Edge) =>
-  console.log('handle onConnect', params);
+const onConnect = (params: Connection | Edge) => console.log('handle onConnect', params);
 
 const ColorSelectorNode: FC<NodeProps> = ({ data, isConnectable }) => {
   return (
     <>
-      <Handle
-        type="target"
-        position={Position.Left}
-        style={targetHandleStyle}
-        onConnect={onConnect}
-      />
+      <Handle type="target" position={Position.Left} style={targetHandleStyle} onConnect={onConnect} />
       <div>
         Custom Color Picker Node: <strong>{data.color}</strong>
       </div>
-      <input
-        className="nodrag"
-        type="color"
-        onChange={data.onChange}
-        defaultValue={data.color}
-      />
+      <input className="nodrag" type="color" onChange={data.onChange} defaultValue={data.color} />
       <Handle
         type="source"
         position={Position.Right}
@@ -46,13 +29,7 @@ const ColorSelectorNode: FC<NodeProps> = ({ data, isConnectable }) => {
           console.log('You trigger mousedown event', e);
         }}
       />
-      <Handle
-        type="source"
-        position={Position.Right}
-        id="b"
-        style={sourceHandleStyleB}
-        isConnectable={isConnectable}
-      />
+      <Handle type="source" position={Position.Right} id="b" style={sourceHandleStyleB} isConnectable={isConnectable} />
     </>
   );
 };

examples/nextjs/pages/CustomNode/index.tsx

@@ -11,7 +11,7 @@ import {
   Connection,
   useNodesState,
   useEdgesState,
-} from '@react-flow/renderer';
+} from '@react-flow/bundle';
 
 import ColorSelectorNode from './ColorSelectorNode';
 
@@ -120,9 +120,7 @@ const CustomNodeFlow = () => {
   }, []);
 
   const onConnect = (connection: Connection) =>
-    setEdges((eds) =>
-      addEdge({ ...connection, animated: true, style: { stroke: '#fff' } }, eds)
-    );
+    setEdges((eds) => addEdge({ ...connection, animated: true, style: { stroke: '#fff' } }, eds));
 
   return (
     <ReactFlow