-
Couldn't load subscription status.
- Fork 874
feat(joint-react): sync with @joint/react-plus + general updates #3077
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: master
Are you sure you want to change the base?
feat(joint-react): sync with @joint/react-plus + general updates #3077
Conversation
| export namespace highlighters { | ||
|
|
||
| import HighlighterView = dia.HighlighterView; | ||
| type HighlighterView = dia.HighlighterView; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This typing should be the same, but I had to change from that legacy Import to type because of a bundling issue.
| sourceMarker?: dia.SVGMarkerJSON; | ||
| targetMarker?: dia.SVGMarkerJSON; | ||
| sourceMarker?: dia.SVGMarkerJSON | null; | ||
| targetMarker?: dia.SVGMarkerJSON | null; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I added this type, because it return null in some cases.
| "eslint-plugin-jest": "^28.8.3", | ||
| "eslint-plugin-jsdoc": "^50.6.9", | ||
| "eslint-plugin-react": "^7.37.4", | ||
| "eslint-plugin-react-hooks": "5.1.0", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
update to latest versions.
| "react": "^18.2.0", | ||
| "react-dom": "^18.2.0", | ||
| "react": "19.1.1", | ||
| "react-dom": "19.1.1", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
also we have to keep this in sync, otherwise we will have issues with resolutions. So I Updated react, react-dom and react types versions accross monorepo.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR refactors the joint-react package to align with @joint/react-plus by simplifying the architecture and introducing controlled mode. The main changes include removing PaperProvider, adding controlled/uncontrolled modes to GraphProvider, and implementing performance optimizations.
Key changes:
- Removed
PaperProviderin favor of imperative API exposed on component refs - Added controlled mode support with
onElementsChange/onLinksChangeprops - Renamed
initialElements/initialLinkstoelements/linksfor consistency
Reviewed Changes
Copilot reviewed 209 out of 211 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/joint-vitest-plugin-mock-svg/package.json | Updated React/TypeScript dependencies to exact versions |
| packages/joint-react/vite.config.ts | Removed eslint disable comment, added @ts-expect-error |
| packages/joint-react/tsconfig.json | Modernized TypeScript config with bundler resolution |
| packages/joint-react/src/utils/* | Major refactoring of utilities including new scheduler, object utilities |
| packages/joint-react/src/hooks/* | Replaced useUpdateElement with useCellActions, updated store hooks |
| packages/joint-react/src/components/* | Updated to use new prop names and imperative API |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
9c4386a to
1086542
Compare
1086542 to
5311d16
Compare
… for managing elements and links
…implifying logic in various components
Description
This PR refactors
joint-react(and related packages) to simplify the architecture and prepare for@joint/plus-reactintegration.The main changes include the removal of
PaperProvider, the introduction of controlled mode inGraphProvider, and multiple performance optimizations.🚩 Major Changes
1. Controlled Mode in
GraphProviderdia.Graphremains the source of truth.onElementsChange/onLinksChangeprops are provided, React state becomes the source of truth.Enables integration with Redux, Zustand, or
useState.2.
PaperProviderRemovalPaperProviderlayer has been completely removed.All paper-related methods and refs are now accessible via the new imperative API exposed on the component ref.
This simplifies the render tree and eliminates redundant provider nesting.
3. API Changes
initialElements→elementsinitialLinks→linksMap-based caching; now uses plain arrays for better iteration performance.useImperativeApihook for managing refs and access to paper/graph internals.4. Store & Performance
use-element-viewsand render paths.5. Developer Experience
eslint,@types/react,typescript, etc.) and peer dependency ranges.Motivation and Context
This refactor simplifies both the runtime and mental model:
@joint/plus-reactecosystem.Screenshots
N/A — internal behavioral changes only.