diff --git a/packages/tailwindcss/src/index.ts b/packages/tailwindcss/src/index.ts index a9f1b69d8..3b5a2fb02 100644 --- a/packages/tailwindcss/src/index.ts +++ b/packages/tailwindcss/src/index.ts @@ -485,14 +485,29 @@ export function compile( // Prepend with `--` to match CSS variables path = `--${path}` - let value = - theme.resolveValue(null, [path] as any) ?? theme.namespace(path as any) ?? fallback + let map = theme.namespace(path as any) - if (value && typeof value === 'object' && value instanceof Map) { - return Object.fromEntries(value.entries()) + // Does the requested value exist in the theme + if (map.has(null)) { + // Yes, and there are multiple values in the requested theme namespace + if (map.size > 1) { + return { + DEFAULT: map.get(null), + ...Object.fromEntries(Array.from(map.entries()).filter(([key]) => key !== null)), + } + } + + // Nope, just the one + return map.get(null) } - return value + // There is at least one value in the requested theme namespace + // but no default value + if (map.size > 0) { + return Object.fromEntries(map.entries()) + } + + return fallback ?? null }, } diff --git a/packages/tailwindcss/src/utilities.test.ts b/packages/tailwindcss/src/utilities.test.ts index 627e2cb9d..7b19577c1 100644 --- a/packages/tailwindcss/src/utilities.test.ts +++ b/packages/tailwindcss/src/utilities.test.ts @@ -15765,11 +15765,6 @@ describe('legacy: matchUtilities', () => { { loadPlugin() { return ({ theme }) => { - expect(theme('size.2_5')).toEqual('2.5rem') - - // Square bracket syntax - expect(theme('size[2.5]')).toEqual('2.5rem') - // Accessing w/ CSS property syntax expect(theme('--scrollbar')).toEqual(null) expect(theme('--scrollbar-*')).toEqual({ @@ -15778,9 +15773,11 @@ describe('legacy: matchUtilities', () => { 'color-dark': 'black', 'color-light': 'white', }) + expect(theme('--scrollbar-big')).toEqual('20px') // Accessing via legacy dot notation + expect(theme('size.2_5')).toEqual('2.5rem') expect(theme('scrollbar')).toEqual({ big: '20px', 'big-properties': 'auto-hidden', @@ -15788,13 +15785,22 @@ describe('legacy: matchUtilities', () => { 'color-light': 'white', }) - expect(theme('scrollbar.big')).toEqual('20px') + expect(theme('scrollbar.big')).toEqual({ + DEFAULT: '20px', + properties: 'auto-hidden', + }) expect(theme('scrollbar.big.properties')).toEqual('auto-hidden') expect(theme('scrollbar.color')).toEqual({ light: 'white', dark: 'black', }) + + expect(theme('scrollbar.foo', 'nope')).toEqual('nope') + expect(theme('somekey', 'nope')).toEqual('nope') + + // Square bracket syntax + expect(theme('size[2.5]')).toEqual('2.5rem') } }, },