Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Conversation

@dyc3
Copy link
Contributor

@dyc3 dyc3 commented Oct 29, 2025

Summary

fixes #7913

Test Plan

added a new negative test, updated existing snapshots

Docs

@changeset-bot
Copy link

changeset-bot bot commented Oct 29, 2025

🦋 Changeset detected

Latest commit: 7da217f

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 13 packages
Name Type
@biomejs/biome Patch
@biomejs/cli-win32-x64 Patch
@biomejs/cli-win32-arm64 Patch
@biomejs/cli-darwin-x64 Patch
@biomejs/cli-darwin-arm64 Patch
@biomejs/cli-linux-x64 Patch
@biomejs/cli-linux-arm64 Patch
@biomejs/cli-linux-x64-musl Patch
@biomejs/cli-linux-arm64-musl Patch
@biomejs/wasm-web Patch
@biomejs/wasm-bundler Patch
@biomejs/wasm-nodejs Patch
@biomejs/backend-jsonrpc Patch

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

@github-actions github-actions bot added A-Parser Area: parser A-Formatter Area: formatter A-Tooling Area: internal tools L-CSS Language: CSS L-Grit Language: GritQL labels Oct 29, 2025
@github-actions
Copy link
Contributor

Parser conformance results on

js/262

Test result main count This PR count Difference
Total 50763 50763 0
Passed 49559 49559 0
Failed 1162 1162 0
Panics 42 42 0
Coverage 97.63% 97.63% 0.00%

jsx/babel

Test result main count This PR count Difference
Total 40 40 0
Passed 37 37 0
Failed 3 3 0
Panics 0 0 0
Coverage 92.50% 92.50% 0.00%

symbols/microsoft

Test result main count This PR count Difference
Total 6316 6316 0
Passed 2105 2105 0
Failed 4211 4211 0
Panics 0 0 0
Coverage 33.33% 33.33% 0.00%

ts/babel

Test result main count This PR count Difference
Total 835 835 0
Passed 742 742 0
Failed 93 93 0
Panics 0 0 0
Coverage 88.86% 88.86% 0.00%

ts/microsoft

Test result main count This PR count Difference
Total 18805 18805 0
Passed 14057 14057 0
Failed 4747 4747 0
Panics 1 1 0
Coverage 74.75% 74.75% 0.00%

@codspeed-hq
Copy link

codspeed-hq bot commented Oct 29, 2025

CodSpeed Performance Report

Merging #7918 will not alter performance

Comparing dyc3/add-tw-slot-rule (7da217f) with main (6d95a67)1

Summary

✅ 29 untouched
⏩ 111 skipped2

Footnotes

  1. No successful run was found on main (57bd662) during the generation of this report, so 6d95a67 was used instead as the comparison base. There might be some changes unrelated to this pull request in this report.

  2. 111 benchmarks were skipped, so the baseline results were used instead. If they were deleted from the codebase, click here and archive them to remove them from the performance reports.

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Oct 29, 2025

Walkthrough

This pull request adds parsing, formatting, and lexer support for the @slot Tailwind CSS v4 at-rule directive. Changes include adding a new TwSlotAtRule syntax node to the CSS grammar, implementing a lexer keyword mapping for "slot", creating a parser function to handle the at-rule structure, developing a formatter rule to output the directive, and updating related infrastructure including generated bindings and Grit pattern mappings. A changeset entry documents the patch-level fix for handling @slot when tailwindDirectives is enabled.

Possibly related PRs

  • biomejs/biome#7164 — Introduces broad Tailwind v4 at-rule support framework that this PR builds upon
  • biomejs/biome#7241 — Implements formatters and parser integration patterns for other Tailwind nodes that this PR follows
  • biomejs/biome#7510 — Establishes the generated mapping infrastructure that this PR extends with TwSlotAtRule

Suggested reviewers

  • ematipico

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 27.27% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
✅ Passed checks (4 passed)
Check name Status Explanation
Title Check ✅ Passed The PR title "fix(parse/css): add @slot tailwind at rule" directly and accurately summarises the main objective of the changeset. The changes across lexer, parser, formatter, and grammar files all contribute to adding support for the @slot Tailwind directive, which is precisely what the title conveys. The title is specific, concise, and appropriately scoped without unnecessary noise.
Linked Issues Check ✅ Passed The PR successfully implements the core requirements from issue #7913. Lexer support for the "slot" keyword has been added [css_kinds_src.rs], the parser now includes a dedicated parse_slot_at_rule function [tailwind.rs, at_rule/mod.rs], formatter support is implemented [slot_at_rule.rs, generated.rs], and grammar definitions updated [css.ungram]. These changes provide comprehensive support for @slot at-rules when tailwindDirectives is enabled, directly addressing the user's compatibility needs.
Out of Scope Changes Check ✅ Passed All modifications are directly scoped to implementing @slot support: lexer keyword recognition, parser integration following existing Tailwind at-rule patterns, formatter implementation, grammar definitions, Grit mappings, test files, and the changeset documentation. No extraneous changes or refactoring unrelated to the stated objective are present. Each file modification serves the specific purpose of enabling @slot parsing and formatting.
Description Check ✅ Passed The PR description references the linked issue (#7913) and mentions that a new negative test was added with existing snapshots updated, which aligns with the changeset. Although the description is minimal, it provides sufficient context linking the fix to the reported issue and acknowledges testing efforts, making it appropriately related to the code changes.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch dyc3/add-tw-slot-rule

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🧹 Nitpick comments (1)
crates/biome_css_formatter/src/generated.rs (1)

5753-5786: Add a tiny rustdoc blurb to the real rule (not here).

Generated file is fine. Please add a brief rustdoc on FormatTwSlotAtRule in tailwind/statements/slot_at_rule.rs describing that it formats Tailwind v4 @slot and any spacing/semicolon policy. Keeps docs consistent with other rules. As per coding guidelines.

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 57bd662 and 7da217f.

⛔ Files ignored due to path filters (8)
  • crates/biome_css_factory/src/generated/node_factory.rs is excluded by !**/generated/**, !**/generated/** and included by **
  • crates/biome_css_factory/src/generated/syntax_factory.rs is excluded by !**/generated/**, !**/generated/** and included by **
  • crates/biome_css_parser/tests/css_test_suite/error/tailwind/when-disabled/slot.css.snap is excluded by !**/*.snap and included by **
  • crates/biome_css_parser/tests/css_test_suite/ok/tailwind/custom-variants/block-slot.css.snap is excluded by !**/*.snap and included by **
  • crates/biome_css_syntax/src/generated/kind.rs is excluded by !**/generated/**, !**/generated/** and included by **
  • crates/biome_css_syntax/src/generated/macros.rs is excluded by !**/generated/**, !**/generated/** and included by **
  • crates/biome_css_syntax/src/generated/nodes.rs is excluded by !**/generated/**, !**/generated/** and included by **
  • crates/biome_css_syntax/src/generated/nodes_mut.rs is excluded by !**/generated/**, !**/generated/** and included by **
📒 Files selected for processing (12)
  • .changeset/some-walls-decide.md (1 hunks)
  • crates/biome_css_formatter/src/css/any/at_rule.rs (1 hunks)
  • crates/biome_css_formatter/src/generated.rs (1 hunks)
  • crates/biome_css_formatter/src/tailwind/statements/mod.rs (1 hunks)
  • crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs (1 hunks)
  • crates/biome_css_parser/src/lexer/mod.rs (1 hunks)
  • crates/biome_css_parser/src/syntax/at_rule/mod.rs (2 hunks)
  • crates/biome_css_parser/src/syntax/at_rule/tailwind.rs (1 hunks)
  • crates/biome_css_parser/tests/css_test_suite/error/tailwind/when-disabled/slot.css (1 hunks)
  • crates/biome_grit_patterns/src/grit_target_language/css_target_language/generated_mappings.rs (1 hunks)
  • xtask/codegen/css.ungram (2 hunks)
  • xtask/codegen/src/css_kinds_src.rs (2 hunks)
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{rs,toml}

📄 CodeRabbit inference engine (CONTRIBUTING.md)

Format Rust and TOML files before committing (e.g., via just f)

Files:

  • crates/biome_css_formatter/src/tailwind/statements/mod.rs
  • crates/biome_css_formatter/src/css/any/at_rule.rs
  • crates/biome_grit_patterns/src/grit_target_language/css_target_language/generated_mappings.rs
  • crates/biome_css_parser/src/syntax/at_rule/tailwind.rs
  • crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs
  • crates/biome_css_parser/src/lexer/mod.rs
  • xtask/codegen/src/css_kinds_src.rs
  • crates/biome_css_parser/src/syntax/at_rule/mod.rs
  • crates/biome_css_formatter/src/generated.rs
**/*.rs

📄 CodeRabbit inference engine (CONTRIBUTING.md)

Document rules, assists, and their options with inline rustdoc in the Rust source

Files:

  • crates/biome_css_formatter/src/tailwind/statements/mod.rs
  • crates/biome_css_formatter/src/css/any/at_rule.rs
  • crates/biome_grit_patterns/src/grit_target_language/css_target_language/generated_mappings.rs
  • crates/biome_css_parser/src/syntax/at_rule/tailwind.rs
  • crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs
  • crates/biome_css_parser/src/lexer/mod.rs
  • xtask/codegen/src/css_kinds_src.rs
  • crates/biome_css_parser/src/syntax/at_rule/mod.rs
  • crates/biome_css_formatter/src/generated.rs
.changeset/*.md

📄 CodeRabbit inference engine (CONTRIBUTING.md)

.changeset/*.md: In changeset files, only use #### or ##### headers
Changesets should describe user-facing changes; internal-only changes do not need changesets
Use past tense for what you did in the changeset description and present tense for current behavior
For bug fixes, start the changeset description with a link to the issue (e.g., Fixed #1234: ...)
When referencing a rule or assist in a changeset, include a link to the rule/assist page on the website
Include a code block in the changeset when applicable to illustrate the change
End every sentence in a changeset with a full stop (.)

Files:

  • .changeset/some-walls-decide.md
🧠 Learnings (5)
📚 Learning: 2025-10-15T09:22:15.851Z
Learnt from: CR
PR: biomejs/biome#0
File: crates/biome_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-10-15T09:22:15.851Z
Learning: Applies to crates/biome_formatter/src/cst.rs : Create FormatHtmlSyntaxNode in cst.rs implementing FormatRule<HtmlSyntaxNode> and AsFormat/IntoFormat for HtmlSyntaxNode using the provided plumbing

Applied to files:

  • crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs
  • crates/biome_css_formatter/src/generated.rs
📚 Learning: 2025-10-15T09:22:46.002Z
Learnt from: CR
PR: biomejs/biome#0
File: crates/biome_js_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-10-15T09:22:46.002Z
Learning: Applies to crates/biome_js_formatter/**/*.rs : Import and use the `FormatNode` trait for AST nodes

Applied to files:

  • crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs
  • crates/biome_css_formatter/src/generated.rs
📚 Learning: 2025-10-15T09:22:46.002Z
Learnt from: CR
PR: biomejs/biome#0
File: crates/biome_js_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-10-15T09:22:46.002Z
Learning: Applies to crates/biome_js_formatter/**/*.rs : Implement the `Format` trait for your node type and use `JsFormatter` with `write!`/`format_args!` to define formatting

Applied to files:

  • crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs
📚 Learning: 2025-10-15T09:22:15.851Z
Learnt from: CR
PR: biomejs/biome#0
File: crates/biome_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-10-15T09:22:15.851Z
Learning: Applies to crates/biome_formatter/src/lib.rs : Implement FormatLanguage for HtmlFormatLanguage with associated types: SyntaxLanguage=HtmlLanguage, Context=HtmlFormatContext, FormatRule=FormatHtmlSyntaxNode

Applied to files:

  • crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs
  • crates/biome_css_formatter/src/generated.rs
📚 Learning: 2025-10-15T09:22:15.851Z
Learnt from: CR
PR: biomejs/biome#0
File: crates/biome_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-10-15T09:22:15.851Z
Learning: Applies to crates/biome_formatter/src/lib.rs : Expose a documented public function `format_node(options: HtmlFormatOptions, root: &HtmlSyntaxNode) -> FormatResult<Formatted<HtmlFormatContext>>` delegating to `biome_formatter::format_node`

Applied to files:

  • crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs
🧬 Code graph analysis (2)
crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs (1)
crates/biome_css_syntax/src/generated/nodes.rs (16)
  • slot_token (7230-7232)
  • semicolon_token (347-349)
  • semicolon_token (1553-1555)
  • semicolon_token (1684-1686)
  • semicolon_token (2234-2236)
  • semicolon_token (2788-2790)
  • semicolon_token (3444-3446)
  • semicolon_token (6489-6491)
  • semicolon_token (6624-6626)
  • semicolon_token (6912-6914)
  • semicolon_token (6957-6959)
  • semicolon_token (7051-7053)
  • semicolon_token (7146-7148)
  • semicolon_token (7192-7194)
  • semicolon_token (7233-7235)
  • semicolon_token (7281-7283)
crates/biome_css_parser/src/syntax/at_rule/mod.rs (2)
crates/biome_css_parser/src/syntax/at_rule/tailwind.rs (1)
  • parse_slot_at_rule (252-262)
crates/biome_css_parser/src/syntax/parse_error.rs (1)
  • tailwind_disabled (236-241)
🔇 Additional comments (13)
crates/biome_grit_patterns/src/grit_target_language/css_target_language/generated_mappings.rs (1)

214-214: LGTM!

The mapping for TwSlotAtRule is correctly placed and follows the established pattern for other Tailwind at-rules.

.changeset/some-walls-decide.md (1)

1-5: Changeset looks good!

Follows all the coding guidelines: uses past tense, links to the issue, ends with a full stop, and clearly describes the user-facing fix.

crates/biome_css_formatter/src/css/any/at_rule.rs (1)

40-40: LGTM!

The formatting delegation for TwSlotAtRule is correctly positioned and follows the established pattern.

crates/biome_css_parser/tests/css_test_suite/error/tailwind/when-disabled/slot.css (1)

1-1: Test case looks appropriate.

This negative test correctly validates error handling when @slot is used without tailwindDirectives enabled.

crates/biome_css_formatter/src/tailwind/statements/mod.rs (1)

8-8: LGTM!

The module declaration is correctly placed alphabetically and follows the established pattern.

xtask/codegen/src/css_kinds_src.rs (2)

131-131: LGTM!

The "slot" keyword is correctly placed within the Tailwind CSS 4.0 keywords section.


513-513: LGTM!

The TW_SLOT_AT_RULE node is correctly positioned within the Tailwind CSS 4.0 nodes section.

crates/biome_css_parser/src/syntax/at_rule/mod.rs (2)

50-51: LGTM!

The import of parse_slot_at_rule is correctly placed alphabetically amongst the other Tailwind at-rule parsers.


165-169: LGTM!

The T![slot] case correctly follows the established pattern for Tailwind at-rules, with proper feature gating and error handling.

crates/biome_css_parser/src/lexer/mod.rs (1)

942-942: LGTM!

The keyword mapping for slot is correctly placed within the Tailwind CSS 4.0 keywords section and follows the established pattern.

xtask/codegen/css.ungram (1)

663-663: LGTM!

The grammar definition for @slot is clean and follows the established pattern for simple Tailwind at-rules. The placement in the AnyCssAtRule union is consistent, and the syntax definition correctly captures the directive structure.

Also applies to: 1979-1983

crates/biome_css_parser/src/syntax/at_rule/tailwind.rs (1)

250-262: LGTM!

The parser implementation mirrors the pattern used for other simple Tailwind at-rules (e.g., @reference). The logic is straightforward: token check, marker start, bump, require semicolon, and complete. Perfect for a directive with no parameters.

crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs (1)

1-16: LGTM!

The formatter follows Biome's established patterns for formatting rules. The implementation extracts the two required tokens via as_fields() and emits them in sequence—exactly what's needed for this simple directive.

Comment on lines +5753 to +5786
impl FormatRule<biome_css_syntax::TwSlotAtRule>
for crate::tailwind::statements::slot_at_rule::FormatTwSlotAtRule
{
type Context = CssFormatContext;
#[inline(always)]
fn fmt(&self, node: &biome_css_syntax::TwSlotAtRule, f: &mut CssFormatter) -> FormatResult<()> {
FormatNodeRule::<biome_css_syntax::TwSlotAtRule>::fmt(self, node, f)
}
}
impl AsFormat<CssFormatContext> for biome_css_syntax::TwSlotAtRule {
type Format<'a> = FormatRefWithRule<
'a,
biome_css_syntax::TwSlotAtRule,
crate::tailwind::statements::slot_at_rule::FormatTwSlotAtRule,
>;
fn format(&self) -> Self::Format<'_> {
FormatRefWithRule::new(
self,
crate::tailwind::statements::slot_at_rule::FormatTwSlotAtRule::default(),
)
}
}
impl IntoFormat<CssFormatContext> for biome_css_syntax::TwSlotAtRule {
type Format = FormatOwnedWithRule<
biome_css_syntax::TwSlotAtRule,
crate::tailwind::statements::slot_at_rule::FormatTwSlotAtRule,
>;
fn into_format(self) -> Self::Format {
FormatOwnedWithRule::new(
self,
crate::tailwind::statements::slot_at_rule::FormatTwSlotAtRule::default(),
)
}
}
Copy link
Contributor

Choose a reason for hiding this comment

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

🛠️ Refactor suggestion | 🟠 Major

🧩 Analysis chain

Solid wiring for @slot — formatter glue matches the house style.

Impls for FormatRule, AsFormat, and IntoFormat mirror neighbouring Tailwind at‑rules. Ordering alongside TwReference/TwSource also looks tidy. Nice one.

Run a quick cross‑check to ensure the rule type exists and the module is exported:


🏁 Script executed:

#!/bin/bash
set -euo pipefail

# Formatter rule type present?
rg -nS "FormatTwSlotAtRule" crates -C2

# Syntax node present?
rg -nS "\bTwSlotAtRule\b" crates -C3

# Module wired in tailwind statements?
rg -nS "mod\s+slot_at_rule|pub\(crate\)\s+mod\s+slot_at_rule" crates/biome_css_formatter/src/tailwind/statements -C1

Length of output: 23745


Verification passed—all three checks confirmed.

FormatTwSlotAtRule is properly defined, TwSlotAtRule syntax node exists throughout the crate, and the module is correctly exported at crates/biome_css_formatter/src/tailwind/statements/mod.rs. The generated.rs impls wire up cleanly alongside sibling Tailwind at-rules.

One remaining item per coding guidelines: add inline rustdoc to crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs to document what FormatTwSlotAtRule does.

🤖 Prompt for AI Agents
crates/biome_css_formatter/src/generated.rs lines 5753-5786: add an inline
rustdoc comment in
crates/biome_css_formatter/src/tailwind/statements/slot_at_rule.rs for the
FormatTwSlotAtRule type explaining its purpose and behavior; specifically, place
a /// doc comment immediately above the FormatTwSlotAtRule definition that
concisely states that it formats TwSlotAtRule Tailwind at-rules into the crate's
CSS output, notes any important formatting behaviors or context types used
(CssFormatContext), and optionally gives a short usage example or reference to
the generated impls; keep the comment brief and idiomatic Rust doc style.

@dyc3
Copy link
Contributor Author

dyc3 commented Oct 29, 2025

I ran the relevant tests locally and they pass. The CI failure looks unrelated to this PR.

@dyc3 dyc3 merged commit 7165d06 into main Oct 29, 2025
16 of 18 checks passed
@dyc3 dyc3 deleted the dyc3/add-tw-slot-rule branch October 29, 2025 15:37
@github-actions github-actions bot mentioned this pull request Oct 29, 2025
Conaclos pushed a commit that referenced this pull request Nov 1, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

A-Formatter Area: formatter A-Parser Area: parser A-Tooling Area: internal tools L-CSS Language: CSS L-Grit Language: GritQL

Projects

None yet

Development

Successfully merging this pull request may close these issues.

💅 Support @slot in tailwindcss v4

3 participants