Skip to content

Commit

Permalink
Properly resolve when only keys exist
Browse files Browse the repository at this point in the history
  • Loading branch information
adamwathan committed Sep 6, 2024
1 parent 7f06777 commit 91e9d29
Show file tree
Hide file tree
Showing 2 changed files with 42 additions and 14 deletions.
27 changes: 13 additions & 14 deletions packages/tailwindcss/src/compat/plugin-functions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,7 @@ function readFromCss(theme: Theme, path: string[]) {
}

// We have to turn the map into object-like structure for v3 compatibility
let obj = {}
let obj: Record<string, unknown> = {}
let useNestedObjects = false // paths.some((path) => nestedKeys.has(path))

for (let [key, value] of map) {
Expand All @@ -134,20 +134,19 @@ function readFromCss(theme: Theme, path: string[]) {
set(obj, path, value)
}

if ('DEFAULT' in obj) {
// The request looked like `theme('animation.DEFAULT')` and was turned into
// a lookup for `--animation-*` and we should extract the value for the
// `DEFAULT` key from the list of possible values
if (path[path.length - 1] === 'DEFAULT') {
return obj.DEFAULT
}
// If the request looked like `theme('animation.DEFAULT')` it would have been
// turned into a lookup for `--animation-*` so we should extract the value for
// the `DEFAULT` key from the list of possible values. If there is no
// `DEFAULT` in the list, there is no match so return `null`.
if (path[path.length - 1] === 'DEFAULT') {
return obj?.DEFAULT ?? null
}

// The request looked like `theme('animation.spin')` and was turned into a
// lookup for `--animation-spin-*` which had only one entry which means it
// should be returned directly
if (Object.keys(obj).length === 1) {
return obj.DEFAULT
}
// The request looked like `theme('animation.spin')` and was turned into a
// lookup for `--animation-spin-*` which had only one entry which means it
// should be returned directly.
if ('DEFAULT' in obj && Object.keys(obj).length === 1) {
return obj.DEFAULT
}

return obj
Expand Down
29 changes: 29 additions & 0 deletions packages/tailwindcss/src/plugin-api.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -804,6 +804,35 @@ describe('theme', async () => {
expect(fn).toHaveBeenCalledWith('blue')
})

test("`theme('*.DEFAULT')` resolves to `undefined` when all theme keys in that namespace have a suffix", async ({
expect,
}) => {
let input = css`
@tailwind utilities;
@plugin "my-plugin";
@theme {
--transition-timing-function-in: ease-in;
--transition-timing-function-out: ease-out;
}
`

let fn = vi.fn()

await compile(input, {
loadPlugin: async () => {
return plugin(({ theme }) => {
fn(theme('transitionTimingFunction.DEFAULT'))
fn(theme('transitionTimingFunction.in'))
fn(theme('transitionTimingFunction.out'))
})
},
})

expect(fn).toHaveBeenNthCalledWith(1, undefined)
expect(fn).toHaveBeenNthCalledWith(2, 'ease-in')
expect(fn).toHaveBeenNthCalledWith(3, 'ease-out')
})

test('nested theme key lookups work even for flattened keys', async ({ expect }) => {
let input = css`
@tailwind utilities;
Expand Down

0 comments on commit 91e9d29

Please sign in to comment.