mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
* WIP * WIP * Finish combining JIT and AOT plugins Still lots of clean up that can be done in some of the more complex ones, but at least it's one file per plugin now. * Remove unused import * Fix AOT generation bugs * Move corePlugins/index.js to corePlugins.js * Convert JIT files to ESM * Move tests * Reorder core plugins to match JIT order * Update AOT apply tests * Unify utils * Combine plugin lists to one single source of truth * Finish resolving merge conflicts, fix tests Co-authored-by: Adam Wathan <adam.wathan@gmail.com>
80 lines
2.5 KiB
JavaScript
80 lines
2.5 KiB
JavaScript
import _ from 'lodash'
|
|
import escapeClassName from '../../src/util/escapeClassName'
|
|
import plugin from '../../src/plugins/boxShadow'
|
|
|
|
test('box shadow can use DEFAULT keyword and negative prefix syntax', () => {
|
|
const addedUtilities = []
|
|
|
|
const config = {
|
|
theme: {
|
|
boxShadow: {
|
|
DEFAULT: '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)',
|
|
md: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
|
|
'-': 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)',
|
|
'-md': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
|
|
},
|
|
},
|
|
variants: {
|
|
boxShadow: ['responsive'],
|
|
},
|
|
}
|
|
|
|
const getConfigValue = (path, defaultValue) => _.get(config, path, defaultValue)
|
|
const pluginApi = {
|
|
config: getConfigValue,
|
|
e: escapeClassName,
|
|
theme: (path, defaultValue) => getConfigValue(`theme.${path}`, defaultValue),
|
|
variants: (path, defaultValue) => {
|
|
if (_.isArray(config.variants)) {
|
|
return config.variants
|
|
}
|
|
|
|
return getConfigValue(`variants.${path}`, defaultValue)
|
|
},
|
|
addUtilities(utilities, options) {
|
|
addedUtilities.push({
|
|
utilities,
|
|
options,
|
|
})
|
|
},
|
|
}
|
|
|
|
plugin()(pluginApi)
|
|
|
|
expect(addedUtilities).toEqual([
|
|
{
|
|
utilities: {
|
|
'*': {
|
|
'--tw-shadow': '0 0 #0000',
|
|
},
|
|
},
|
|
options: { respectImportant: false },
|
|
},
|
|
{
|
|
utilities: {
|
|
'.shadow': {
|
|
'--tw-shadow': '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)',
|
|
'box-shadow':
|
|
'var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)',
|
|
},
|
|
'.shadow-md': {
|
|
'--tw-shadow': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
|
|
'box-shadow':
|
|
'var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)',
|
|
},
|
|
'.-shadow': {
|
|
'--tw-shadow': 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)',
|
|
'box-shadow':
|
|
'var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)',
|
|
},
|
|
'.-shadow-md': {
|
|
'--tw-shadow': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
|
|
'box-shadow':
|
|
'var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)',
|
|
},
|
|
},
|
|
options: ['responsive'],
|
|
},
|
|
])
|
|
})
|