Skip to content

feat(render): add withRenderOptions to enable templates to access render options as props #2417

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.

Sign up for GitHub

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

Jump to bottom
Open
wants to merge 2 commits into
base: canary
Choose a base branch
from
Open

feat(render): add withRenderOptions to enable templates to access render options as props #2417

wants to merge 2 commits into from
+230 −2

Conversation

emiliosheinz
Copy link

@emiliosheinz emiliosheinz commented Aug 11, 2025 •
edited
Loading

Summary

This PR introduces a higher-order function withRenderOptions that enables email templates to access render options directly as props. This allows components to adapt their behavior and output based on the rendering context.

Changes

  • Added withRenderOptions higher-order component that marks components to receive render options
  • Implemented injectRenderOptions utility to automatically pass options to wrapped components during rendering
  • Updated both browser and node render functions to inject options before rendering
  • Added comprehensive tests for all render environments (browser, node, edge)
  • Exported new types (PropsWithRenderOptions) and utilities from package entry points

Example Usage

import { withRenderOptions } from '@react-email/render';
import { Html, Text } from '@react-email/components';

type MyTemplateProps = { name: string };

export const MyTemplate = withRenderOptions<MyTemplateProps>(({ name, renderOptions }) => {
  // Check if rendering as plain text
  if (renderOptions?.plainText) {
    return `Hello ${name}! This is the plain text version.`;
  }

  // Default HTML rendering
  return (
    <Html>
      <Text>Hello {name}!</Text>
      <Text>This is the HTML version with styling.</Text>
    </Html>
  );
});

@changeset-bot changeset-bot
Copy link

changeset-bot bot commented Aug 11, 2025 •
edited
Loading

⚠️ No Changeset found

Latest commit: db6fab1

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 Vercel
Copy link

vercel bot commented Aug 11, 2025

@emiliosheinz is attempting to deploy a commit to the resend Team on Vercel.

A member of the Team first needs to authorize it.

@pkg-pr-new pkg.pr.new
Copy link

pkg-pr-new bot commented Aug 11, 2025 •
edited
Loading

Open in StackBlitz

npm i https://pkg.pr.new/resend/react-email/@react-email/render@2417

commit: db6fab1

@emiliosheinz emiliosheinz force-pushed the feat/pass-options-to-rendered-component branch 3 times, most recently from 9be3427 to 293bfa2 Compare August 15, 2025 00:08
@emiliosheinz
feat(render): add withRenderOptions higher-order function
7e6ef4b 
This commit introduces `withRenderOptions`, a higher-order function that enables email templates to access render options (like plainText mode) directly as props. This allows templates to conditionally render different content based on the rendering context.

Key changes:

- Added `withRenderOptions` higher-order function that marks components to receive render options
- Implemented `injectRenderOptions` to automatically pass options to wrapped components during rendering
- Updated both browser and node render functions to inject options before rendering
- Added comprehensive tests for both wrapped and unwrapped components
- Exported new types and utilities from package entry points
@emiliosheinz emiliosheinz force-pushed the feat/pass-options-to-rendered-component branch from 293bfa2 to 7e6ef4b Compare August 15, 2025 00:14
@emiliosheinz emiliosheinz changed the title feat(render): pass render options to rendered component feat(render): add withRenderOptions to enable templates to access render options directly as props Aug 15, 2025
@emiliosheinz emiliosheinz changed the title feat(render): add withRenderOptions to enable templates to access render options directly as props feat(render): add withRenderOptions to enable templates to access render options as props Aug 15, 2025
@emiliosheinz emiliosheinz marked this pull request as ready for review August 15, 2025 00:22
@emiliosheinz emiliosheinz requested a review from a team as a code owner August 15, 2025 00:22
@emiliosheinz emiliosheinz requested review from joaopcm and removed request for a team August 15, 2025 00:22
@emiliosheinz emiliosheinz force-pushed the feat/pass-options-to-rendered-component branch from 706c35b to db6fab1 Compare August 15, 2025 00:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@joaopcm joaopcm Awaiting requested review from joaopcm joaopcm is a code owner automatically assigned from resend/engineering

At least 1 approving review is required to merge this pull request.

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
1 participant
@emiliosheinz