From 20d6685d90cb8985f51f89088090d9ab1d232983 Mon Sep 17 00:00:00 2001 From: Jordan Pittman Date: Thu, 28 Aug 2025 10:51:57 -0400 Subject: [PATCH 1/2] Hide `__CSS_VALUES__` from completions in matchUtilities MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This is an internal field we use to transport data about theme options from CSS throug hte JS plugin API. It wasn’t supposed to show up in suggestions but we forgot to remove it from them. --- packages/tailwindcss/src/compat/plugin-api.ts | 4 +++ packages/tailwindcss/src/intellisense.test.ts | 35 +++++++++++++++++++ 2 files changed, 39 insertions(+) diff --git a/packages/tailwindcss/src/compat/plugin-api.ts b/packages/tailwindcss/src/compat/plugin-api.ts index c52693ef073e..42b1c6176734 100644 --- a/packages/tailwindcss/src/compat/plugin-api.ts +++ b/packages/tailwindcss/src/compat/plugin-api.ts @@ -472,6 +472,10 @@ export function buildPluginApi({ // work even with legacy configs and plugins valueKeys.delete('__BARE_VALUE__') + // The `__CSS_VALUES__` key is a special key used by the theme function + // to transport `@theme` metadata about values from CSS + valueKeys.delete('__CSS_VALUES__') + // The `DEFAULT` key is represented as `null` in the utility API if (valueKeys.has('DEFAULT')) { valueKeys.delete('DEFAULT') diff --git a/packages/tailwindcss/src/intellisense.test.ts b/packages/tailwindcss/src/intellisense.test.ts index f9aca65ce0c0..32893b1a0c8e 100644 --- a/packages/tailwindcss/src/intellisense.test.ts +++ b/packages/tailwindcss/src/intellisense.test.ts @@ -712,3 +712,38 @@ test('matchVariant', async () => { expect(v1.name).toEqual('foo') expect(v1.values).toEqual(['a', 'b']) }) + +test('matchUtilities discards internal only helpers from suggestions when using the theme function', async () => { + let input = css` + @import 'tailwindcss/utilities'; + @plugin "./plugin.js"; + + @theme { + --color-red: red; + } + ` + + let design = await __unstable__loadDesignSystem(input, { + loadStylesheet: async (_, base) => ({ + path: '', + base, + content: '@tailwind utilities;', + }), + loadModule: async () => ({ + path: '', + base: '', + module: plugin(({ matchUtilities, theme }) => { + matchUtilities({ foo: (val) => ({ color: val }) }, { values: theme('colors') }) + matchUtilities({ bar: (val) => ({ color: val }) }, { values: theme('transitionDuration') }) + }), + }), + }) + + let classNames = design.getClassList().map((e) => e[0]) + + expect(classNames).not.toContain('foo-__BARE_VALUE__') + expect(classNames).not.toContain('bar-__BARE_VALUE__') + + expect(classNames).not.toContain('foo-__CSS_VALUES__') + expect(classNames).not.toContain('bar-__CSS_VALUES__') +}) From 581c7739c82ceafc9505d52b5f451a428e04bcb2 Mon Sep 17 00:00:00 2001 From: Jordan Pittman Date: Thu, 28 Aug 2025 11:07:36 -0400 Subject: [PATCH 2/2] Update changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 86205ef4ea0b..22d88df1e14f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Discard matched variants with non-string values ([#18799](https://github.com/tailwindlabs/tailwindcss/pull/18799)) - Show suggestions for known `matchVariant` values ([#18798](https://github.com/tailwindlabs/tailwindcss/pull/18798)) - Replace deprecated `clip` with `clip-path` in `sr-only` ([#18769](https://github.com/tailwindlabs/tailwindcss/pull/18769)) +- Hide internal fields from completions in `matchUtilities` ([#18820](https://github.com/tailwindlabs/tailwindcss/pull/18820)) - Upgrade: Migrate `aria` theme keys to `@custom-variant` ([#18815](https://github.com/tailwindlabs/tailwindcss/pull/18815)) - Upgrade: Migrate `data` theme keys to `@custom-variant` ([#18816](https://github.com/tailwindlabs/tailwindcss/pull/18816)) - Upgrade: Migrate `supports` theme keys to `@custom-variant` ([#18817](https://github.com/tailwindlabs/tailwindcss/pull/18817))