fix(tailwind): stop silently dropping space-/divide- utilities#3593
Open
yashs33244 wants to merge 1 commit into
Open
fix(tailwind): stop silently dropping space-/divide- utilities#3593yashs33244 wants to merge 1 commit into
yashs33244 wants to merge 1 commit into
Conversation
Utilities like space-y-4 and divide-y compile to a nested rule whose body css-tree leaves as an unparsed Raw block child. find() can't descend into Raw, so isRuleInlinable/isPartInlinable judged them inlinable; makeInlineStylesFor then found no declarations and emitted an empty style, dropping the rule and its class entirely. Treat a Raw block child as non-inlinable so the rule is kept in the <style> block.
Contributor
|
@yashs33244 is attempting to deploy a commit to the resend Team on Vercel. A member of the Team first needs to authorize it. |
🦋 Changeset detectedLatest commit: 7543b8b 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 |
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
No issues found across 4 files
Confidence score: 5/5
- Automated review surfaced no issues in the provided summaries.
- No files require special attention.
Auto-approved: Fix for silently dropped Tailwind nested-rule utilities; isolated to CSS inlining logic with added regression test.
Re-trigger cubic
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
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.
What
Tailwind utilities whose CSS compiles to a nested rule are silently dropped from the output:
space-y-*,space-x-*,divide-y,divide-x, anddivide-<color>. Putting them on an element produces no inline style, no<style>rule, and the class is removed too, so the spacing/dividers just disappear.These utilities compile to e.g.
.space-y-4 { :where(& > :not(:last-child)) { … } }. css-tree leaves that nested body as a single unparsedRawblock child, andfind()cannot descend into aRawnode, soisRuleInlinable/isPartInlinablesee no pseudo-selector and judge the rule inlinable.makeInlineStylesForthen finds noDeclarationnodes in theRawand yields an empty style - the rule is dropped.Fix
Treat a
Rawnode that is a direct block child as non-inlinable in both helpers, so the rule is kept and emitted in the<head><style>block (with the class preserved) instead of vanishing. The check is on block children specifically, not anyRaw, so avar()fallback likeline-height: var(--tw-leading, var(--…))(which css-tree also represents asRaw, but inside a declaration value) is unaffected and still inlines.Added a regression test asserting
space-y-4/divide-yland in the non-inlinable set instead of being dropped. All 126 tailwind tests pass;text-lg,bg-red-500, and&:hoverutilities still inline as before.Summary by cubic
Stop dropping Tailwind nested-rule utilities like
space-y-*,space-x-*, anddivide-*. These are now kept as non-inlinable rules so the class stays on the element and CSS is emitted in the<head>.Rawblock children as non-inlinable inis-rule-inlinableandis-part-inlinable.space-y-4/divide-y; other inlining behavior remains unchanged.Written for commit 7543b8b. Summary will update on new commits.