fix(react-email): preserve source order when inlining duplicate Tailwind class rules - #3688
Draft
bukinoshita wants to merge 2 commits into
Draft
fix(react-email): preserve source order when inlining duplicate Tailwind class rules#3688bukinoshita wants to merge 2 commits into
bukinoshita wants to merge 2 commits into
Conversation
…r-independent Resolve var() references per declaration against cloned variable values with recursive nested resolution, instead of relying on shared in-place node mutation whose result depended on the order rules were processed. Co-authored-by: Bu Kinoshita <bukinoshita@users.noreply.github.com>
…ind class rules extractRulesPerClass groups rules per class, so flattening the grouped map values dropped the original stylesheet order across classes. With interleaved duplicate class definitions (e.g. .box, .other, .box) that conflict on the same property, this let an unrelated class clobber a later override. Rules now carry a global source-order index and every consumer sorts by it before generating styles, restoring correct cascade precedence for inlined styles and emitted non-inlinable <style> rules. Co-authored-by: Bu Kinoshita <bukinoshita@users.noreply.github.com>
Contributor
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
🦋 Changeset detectedLatest commit: b924d99 The changes in this PR will be included in the next version bump. This PR includes changesets to release 3 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
commit: |
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
1 issue found across 14 files
Confidence score: 3/5
- In
packages/react-email/src/components/tailwind/utils/css/resolve-variable-functions.ts, cyclic local variable resolution can strip the caller’s fallback (e.g.,var(--loop, red)), which may produce incorrect final CSS values instead of safe defaults; preserve the outervar()when recursion hitsseen(or propagate the failure) so fallback behavior remains intact.
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="packages/react-email/src/components/tailwind/utils/css/resolve-variable-functions.ts">
<violation number="1" location="packages/react-email/src/components/tailwind/utils/css/resolve-variable-functions.ts:55">
P2: Cyclic local variables lose the caller’s `var()` fallback. Avoid replacing an outer reference when its recursive expansion hits `seen` (or propagate that failure), so `var(--loop, red)` remains available after custom-property declarations are removed.</violation>
</file>
Reply with feedback, questions, or to request a fix.
Re-trigger cubic
| new Set([...seen, variableName]), | ||
| ); | ||
|
|
||
| funcParentListItem.data = unwrapValue(clonedValue); |
Contributor
There was a problem hiding this comment.
P2: Cyclic local variables lose the caller’s var() fallback. Avoid replacing an outer reference when its recursive expansion hits seen (or propagate that failure), so var(--loop, red) remains available after custom-property declarations are removed.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At packages/react-email/src/components/tailwind/utils/css/resolve-variable-functions.ts, line 55:
<comment>Cyclic local variables lose the caller’s `var()` fallback. Avoid replacing an outer reference when its recursive expansion hits `seen` (or propagate that failure), so `var(--loop, red)` remains available after custom-property declarations are removed.</comment>
<file context>
@@ -0,0 +1,58 @@
+ new Set([...seen, variableName]),
+ );
+
+ funcParentListItem.data = unwrapValue(clonedValue);
+ },
+ });
</file context>
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
2 participants
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.
Summary by cubic
extractRulesPerClass()and sort withsort-rules-by-orderbefore inlining or emitting non-inlinable rules.inlineStyles(),<Tailwind>(non-inlinable<style>), and the clone path.resolve-variable-functionsto inline var() from local declarations or custom property initial values.Written for commit b924d99. Summary will update on new commits.