Skip to content

fix(css-vars): resolve var(--name, default) via adapter inside style fn bodies#392

Merged
skovhus merged 2 commits intomainfrom
cursor/resolve-var-fallback-via-adapter-9b03
Apr 20, 2026
Merged

fix(css-vars): resolve var(--name, default) via adapter inside style fn bodies#392
skovhus merged 2 commits intomainfrom
cursor/resolve-var-fallback-via-adapter-9b03

Conversation

@skovhus
Copy link
Copy Markdown
Owner

@skovhus skovhus commented Apr 20, 2026

var(--x, default) calls embedded inside AST nodes (e.g. style function template literals like flexShrink: \var(--x, ${expr})`) were never passed to adapter.resolveValue, so the original var(...)` text was kept as-is. The walker now recurses into AST template literals, calls the adapter, and drops the default value when the adapter resolves the var.

Open in Web Open in Cursor 

…ST nodes

The var() rewriter only walked plain string values in style objects, so var()
calls embedded inside a TemplateLiteral AST node (e.g. inside a styleFn body
like `flexShrink: \`var(--x, ${expr})\``) were never passed to
adapter.resolveValue. When the adapter resolves a var, the default value is now
dropped — the resolved StyleX token supersedes the runtime fallback.

Co-authored-by: Kenneth Skovhus <skovhus@users.noreply.github.com>
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Apr 20, 2026

PR Preview Action v1.8.1

🚀 View preview at
https://skovhus.github.io/styled-components-to-stylex-codemod/pr-preview/pr-392/

Built to branch gh-pages at 2026-04-20 15:47 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

@skovhus skovhus marked this pull request as ready for review April 20, 2026 15:30
Copy link
Copy Markdown

@chatgpt-codex-connector chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 3dd6ab4c0c

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread src/internal/transform-css-vars.ts Outdated
Comment thread src/internal/lower-rules/finalize-decl.ts Outdated
- Strip placeholder sentinels from var() fallbacks before forwarding to
  adapter.resolveValue. Adapters that inspect ctx.fallback were receiving
  synthetic '__SC_TPL_EXPR_*' markers when the var()'s default contained a
  template interpolation, which could mis-resolve dynamic style-function values.
- Apply varsToDrop to every rewritten bucket (extraStyleObjects, variantBuckets)
  and styleFnDecls, not just the base styleObj. When the adapter returns
  dropDefinition: true for a var defined inside a non-base bucket, the local
  '--name: ...' definition was previously left behind, contradicting the
  adapter contract.

Co-authored-by: Kenneth Skovhus <skovhus@users.noreply.github.com>
@skovhus skovhus merged commit dd91f59 into main Apr 20, 2026
6 checks passed
@skovhus skovhus deleted the cursor/resolve-var-fallback-via-adapter-9b03 branch April 20, 2026 16:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants