Skip to content

refactor(editor): replace lucide-react with inline SVG icons#3106

Open
joaopcm wants to merge 2 commits intojoaopcm/editor-examples-appfrom
joaopcm/editor-examples-app-v1
Open

refactor(editor): replace lucide-react with inline SVG icons#3106
joaopcm wants to merge 2 commits intojoaopcm/editor-examples-appfrom
joaopcm/editor-examples-app-v1

Conversation

@joaopcm
Copy link
Member

@joaopcm joaopcm commented Mar 23, 2026

Summary

  • Replace lucide-react peer dependency with 29 inline SVG icon components in packages/editor/src/ui/icons.tsx
  • Remove lucide-react from editor's peerDependencies, making the package self-contained
  • Export icons from @react-email/editor/ui so consumers can reuse them

Test plan

  • pnpm --filter @react-email/editor build passes
  • pnpm --filter @react-email/editor test passes (318/318)
  • pnpm lint:fix passes
  • No lucide-react imports remain in packages/editor/src/
  • Visual check: icons render identically in examples app

Summary by cubic

Replaced lucide-react with 29 inline SVG icon components, split into individual files under @react-email/editor/ui/icons and re-exported from @react-email/editor/ui. This removes the lucide-react peer dependency and makes @react-email/editor self-contained.

  • Refactors

    • Added 29 icon components under packages/editor/src/ui/icons/ with a barrel index.ts.
    • Switched all icon imports to ../icons across bubble menus, link forms, image link forms, and slash commands.
    • Re-exported icons from @react-email/editor/ui for consumer reuse.
  • Migration

    • You no longer need to install lucide-react when using @react-email/editor.
    • If you were importing editor icons via lucide-react, switch to @react-email/editor/ui (e.g., import { BoldIcon } from '@react-email/editor/ui').

Written for commit fbb9226. Summary will update on new commits.

Remove lucide-react peer dependency by inlining static SVG components
extracted from Lucide's icon set. Icons exported from @react-email/editor/ui
for consumer use.
@changeset-bot
Copy link

changeset-bot bot commented Mar 23, 2026

⚠️ No Changeset found

Latest commit: fbb9226

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@vercel
Copy link
Contributor

vercel bot commented Mar 23, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
react-email Ready Ready Preview, Comment Mar 23, 2026 11:16pm
react-email-demo Ready Ready Preview, Comment Mar 23, 2026 11:16pm

Request Review

Copy link
Contributor

@cubic-dev-ai cubic-dev-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No issues found across 23 files

Confidence score: 5/5

  • Automated review surfaced no issues in the provided summaries.
  • No files require special attention.

One TSX component per icon file under src/ui/icons/. No shared
abstractions — each file is a self-contained SVG component.
@pkg-pr-new
Copy link

pkg-pr-new bot commented Mar 23, 2026

Open in StackBlitz

npm i https://pkg.pr.new/@react-email/editor@3106

commit: 7ac3316

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants