- Add npm scripts for CSS/JS compilation (build:css, build:js, build) - Create PowerShell build automation script - Document development workflow in README - Add troubleshooting guide for build issues - Specify proper file structure and compilation process Supports Tailwind CSS v3.4.0 and esbuild bundling with source maps.
38 lines
1.2 KiB
JavaScript
38 lines
1.2 KiB
JavaScript
import transformThemeValue from './transformThemeValue'
|
|
|
|
export default function createUtilityPlugin(
|
|
themeKey,
|
|
utilityVariations = [[themeKey, [themeKey]]],
|
|
{ filterDefault = false, ...options } = {}
|
|
) {
|
|
let transformValue = transformThemeValue(themeKey)
|
|
return function ({ matchUtilities, theme }) {
|
|
for (let utilityVariation of utilityVariations) {
|
|
let group = Array.isArray(utilityVariation[0]) ? utilityVariation : [utilityVariation]
|
|
|
|
matchUtilities(
|
|
group.reduce((obj, [classPrefix, properties]) => {
|
|
return Object.assign(obj, {
|
|
[classPrefix]: (value) => {
|
|
return properties.reduce((obj, name) => {
|
|
if (Array.isArray(name)) {
|
|
return Object.assign(obj, { [name[0]]: name[1] })
|
|
}
|
|
return Object.assign(obj, { [name]: transformValue(value) })
|
|
}, {})
|
|
},
|
|
})
|
|
}, {}),
|
|
{
|
|
...options,
|
|
values: filterDefault
|
|
? Object.fromEntries(
|
|
Object.entries(theme(themeKey) ?? {}).filter(([modifier]) => modifier !== 'DEFAULT')
|
|
)
|
|
: theme(themeKey),
|
|
}
|
|
)
|
|
}
|
|
}
|
|
}
|