Open
Conversation
|
Contributor
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
commit: |
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
gabrielmfern
changed the title
gabrielmfern
force-pushed
the
feat/container-extension
branch
from
6716022 to
6844cce
Compare
gabrielmfern
force-pushed
the
feat/container-extension
branch
from
6844cce to
fd35809
Compare
gabrielmfern
changed the title
Adds a Container extension that auto-wraps editor content in a centered, max-width container. It renders as <Container> from @react-email/components during email serialization and as a styled <div class="node-container"> in the editor view. A ProseMirror plugin ensures the container is always present, handling both fresh editors and migration of existing documents. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Remove the hardcoded <Container> wrapper from EmailTheming's BaseTemplate and the default template — the Container node's renderToReactEmail now handles it. Also wires up style resolution by adding 'container' to getThemeComponentKey and RESET_NODE_TYPES. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
gabrielmfern
force-pushed
the
feat/container-extension
branch
from
df2f3be to
7cd127f
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The base template had a container, but the editor's view didn't when using this package normally, and the dashboard does because it does it manually. To fix this we could either make a new Editor component, or make it into an extension.
To move it to an extension it auto inserts itself into the Editor's content on creation. It then defines its own node view that can then be styles through the injected CSS from EmailTheming, and for the email template through composeReactEmail without having to provide an Editor component to the user.
It also used two
<Section>s to do (from my understanding) what the<Container>component already does, so it also replaces that.Summary by cubic
Adds a
containerEmailNode that auto-wraps editor content in a centered, max‑width container and renders to email with@react-email/componentsContainer. It keepsglobalContentat the root and works for new and existing docs.New Features
containernode toStarterKitwith a ProseMirror plugin that ensures one container exists and auto‑wraps content while keepingglobalContenttop‑level.Container(width: 100%, maxWidth from styles) and to the editor as<div class="node-container" data-type="container">.Refactors
<Body>now directly renders children with body styles.containerto the component key and reset types so container styles resolve through the node.Written for commit 7cd127f. Summary will update on new commits.