diff --git a/.changeset/yellow-students-think.md b/.changeset/yellow-students-think.md new file mode 100644 index 00000000..a0715a70 --- /dev/null +++ b/.changeset/yellow-students-think.md @@ -0,0 +1,5 @@ +--- +'reactflow': minor +--- + +add node-resizer to reactflow package diff --git a/examples/vite-app/src/examples/NodeResizer/CustomResizer.tsx b/examples/vite-app/src/examples/NodeResizer/CustomResizer.tsx index a36d9f18..a61b3c3c 100644 --- a/examples/vite-app/src/examples/NodeResizer/CustomResizer.tsx +++ b/examples/vite-app/src/examples/NodeResizer/CustomResizer.tsx @@ -1,8 +1,6 @@ import { memo, FC } from 'react'; -import { Handle, Position, NodeProps } from 'reactflow'; +import { Handle, Position, NodeProps, NodeResizeControl } from 'reactflow'; -import { NodeResizeControl } from '@reactflow/node-resizer'; -import '@reactflow/node-resizer/dist/style.css'; import ResizeIcon from './ResizeIcon'; const controlStyle = { diff --git a/examples/vite-app/src/examples/NodeResizer/DefaultResizer.tsx b/examples/vite-app/src/examples/NodeResizer/DefaultResizer.tsx index 3d9649a5..6ccd655a 100644 --- a/examples/vite-app/src/examples/NodeResizer/DefaultResizer.tsx +++ b/examples/vite-app/src/examples/NodeResizer/DefaultResizer.tsx @@ -1,8 +1,5 @@ import { memo, FC } from 'react'; -import { Handle, Position, NodeProps } from 'reactflow'; -import { NodeResizer } from '@reactflow/node-resizer'; - -import '@reactflow/node-resizer/dist/style.css'; +import { Handle, Position, NodeProps, NodeResizer } from 'reactflow'; const DefaultResizerNode: FC = ({ data, selected }) => { return ( diff --git a/examples/vite-app/src/examples/NodeResizer/HorizontalResizer.tsx b/examples/vite-app/src/examples/NodeResizer/HorizontalResizer.tsx index 2798ca3f..9e89d8c6 100644 --- a/examples/vite-app/src/examples/NodeResizer/HorizontalResizer.tsx +++ b/examples/vite-app/src/examples/NodeResizer/HorizontalResizer.tsx @@ -1,8 +1,5 @@ import { memo, FC } from 'react'; -import { Handle, Position, NodeProps } from 'reactflow'; -import { NodeResizeControl } from '@reactflow/node-resizer'; - -import '@reactflow/node-resizer/dist/style.css'; +import { Handle, Position, NodeProps, NodeResizeControl } from 'reactflow'; const HorizontalResizerNode: FC = ({ data }) => { return ( diff --git a/examples/vite-app/src/examples/NodeResizer/VerticalResizer.tsx b/examples/vite-app/src/examples/NodeResizer/VerticalResizer.tsx index a3d6515e..f1230ce1 100644 --- a/examples/vite-app/src/examples/NodeResizer/VerticalResizer.tsx +++ b/examples/vite-app/src/examples/NodeResizer/VerticalResizer.tsx @@ -1,8 +1,5 @@ import { memo, FC } from 'react'; -import { Handle, Position, NodeProps } from 'reactflow'; - -import { NodeResizeControl } from '@reactflow/node-resizer'; -import '@reactflow/node-resizer/dist/style.css'; +import { Handle, Position, NodeProps, NodeResizeControl } from 'reactflow'; const CustomNode: FC = ({ id, data }) => { return ( diff --git a/examples/vite-app/src/examples/NodeResizer/index.tsx b/examples/vite-app/src/examples/NodeResizer/index.tsx index d94a8d8b..6eb61b3a 100644 --- a/examples/vite-app/src/examples/NodeResizer/index.tsx +++ b/examples/vite-app/src/examples/NodeResizer/index.tsx @@ -6,6 +6,8 @@ import CustomResizer from './CustomResizer'; import VerticalResizer from './VerticalResizer'; import HorizontalResizer from './HorizontalResizer'; +import 'reactflow/dist/style.css'; + const nodeTypes = { defaultResizer: DefaultResizer, customResizer: CustomResizer, diff --git a/packages/reactflow/package.json b/packages/reactflow/package.json index 479777d2..ab970755 100644 --- a/packages/reactflow/package.json +++ b/packages/reactflow/package.json @@ -39,6 +39,7 @@ "@reactflow/controls": "workspace:*", "@reactflow/core": "workspace:*", "@reactflow/minimap": "workspace:*", + "@reactflow/node-resizer": "workspace:*", "@reactflow/node-toolbar": "workspace:*" }, "peerDependencies": { diff --git a/packages/reactflow/src/base.css b/packages/reactflow/src/base.css index 069f6d82..9c7489c9 100644 --- a/packages/reactflow/src/base.css +++ b/packages/reactflow/src/base.css @@ -1,3 +1,4 @@ @import '@reactflow/core/dist/base.css'; @import '@reactflow/controls/dist/style.css'; @import '@reactflow/minimap/dist/style.css'; +@import '@reactflow/node-resizer/dist/style.css'; diff --git a/packages/reactflow/src/index.ts b/packages/reactflow/src/index.ts index 935883dc..9fefe1d5 100644 --- a/packages/reactflow/src/index.ts +++ b/packages/reactflow/src/index.ts @@ -3,5 +3,6 @@ export * from '@reactflow/minimap'; export * from '@reactflow/controls'; export * from '@reactflow/background'; export * from '@reactflow/node-toolbar'; +export * from '@reactflow/node-resizer'; export { ReactFlow as default } from '@reactflow/core'; diff --git a/packages/reactflow/src/style.css b/packages/reactflow/src/style.css index 96c6e6a1..38e265b7 100644 --- a/packages/reactflow/src/style.css +++ b/packages/reactflow/src/style.css @@ -1,3 +1,4 @@ @import '@reactflow/core/dist/style.css'; @import '@reactflow/controls/dist/style.css'; @import '@reactflow/minimap/dist/style.css'; +@import '@reactflow/node-resizer/dist/style.css'; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3c4975fe..a977bd11 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -284,6 +284,7 @@ importers: '@reactflow/core': workspace:* '@reactflow/eslint-config': workspace:* '@reactflow/minimap': workspace:* + '@reactflow/node-resizer': workspace:^2.1.0 '@reactflow/node-toolbar': workspace:* '@reactflow/rollup-config': workspace:* '@reactflow/tsconfig': workspace:* @@ -296,6 +297,7 @@ importers: '@reactflow/controls': link:../controls '@reactflow/core': link:../core '@reactflow/minimap': link:../minimap + '@reactflow/node-resizer': link:../node-resizer '@reactflow/node-toolbar': link:../node-toolbar devDependencies: '@reactflow/eslint-config': link:../../tooling/eslint-config