-
Notifications
You must be signed in to change notification settings - Fork 40
Update to support react 19 #20
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
Conversation
|
Linting and formatting, adding the new example we now have 3 separate eslint configs, not working well in the editor and manually running the fix would make the diff of this even harder to follow. Let's focus on this after getting this in: |
|
We should probably add a release runner for this, another followup: |
artf
left a comment
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.
Awesome 🚀

Progress Checklist
grapesjs-react"react": "^18.0.0 || ^19.0.0".cjsas maingrapesjs-react- ci: add release runners #22React Version Peer Changes
Updated the React version in the
@grapesjs/reactpublic-facing package to be floating:{ "name": "@grapesjs/react", "version": "1.0.0", "devDependencies": {}, "peerDependencies": { "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0", "grapesjs": "^0.22.5" } }Code Changes Made
Removed direct references to
Reactin the codebaseAllows better tree-shaking of types to rely on the users peer react.
Ensured React nodes are always returned instead of null
This stops common errors like
cannot read property .A of undefinedalso related to (ref: vercel/next.js#64753).Manually cast providers with proper types
This stops type errors when using the editor with children:
Fixed portal children creation
Build changes
react/jsx-runtimehas been excluded from the build of@grapesjs/react, and changed tocjsformat fromumdfor the main entry:vite.config.ts
export default defineConfig({ plugins: [ react(), dts({ insertTypesEntry: true, }), ], build: { lib: { entry: path.resolve(__dirname, "src/index.ts"), name: "MyLib", - formats: ["es", "umd"], + formats: ["es", "cjs"], fileName: (format) => `index${format === "es" ? "" : `.${format}`}.js`, }, rollupOptions: { - external: ["react", "react-dom" ], + external: ["react", "react-dom", "react/jsx-runtime"], output: { exports: "named", globals: { react: "React", "react-dom": "ReactDOM", + "react/jsx-runtime": "react/jsx-runtime", }, }, }, }, });package.json
{ "name": "@grapesjs/react", "version": "1.0.0", "type": "module", "files": [ "dist" ], - "main": "./dist/index.umd.js", + "main": "./dist/index.cjs.js",Monorepo Setup