Fix style
This commit is contained in:
parent
62a9894a53
commit
1a5c09c14d
3 changed files with 51 additions and 42 deletions
|
|
@ -11,9 +11,9 @@ function textAlign() {
|
|||
|
||||
function display() {
|
||||
return defineClasses({
|
||||
'block': { 'display': 'block' },
|
||||
'inline': { 'display': 'inline' },
|
||||
'inline-block': { 'display': 'inline-block' },
|
||||
block: { display: 'block' },
|
||||
inline: { display: 'inline' },
|
||||
'inline-block': { display: 'inline-block' },
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -26,9 +26,7 @@ function borderStyle() {
|
|||
}
|
||||
|
||||
test('an empty variants list generates a @variants at-rule with no parameters', () => {
|
||||
const result = generateModules([
|
||||
{ name: 'textAlign', generator: textAlign },
|
||||
], {
|
||||
const result = generateModules([{ name: 'textAlign', generator: textAlign }], {
|
||||
textAlign: [],
|
||||
})
|
||||
|
||||
|
|
@ -43,9 +41,7 @@ test('an empty variants list generates a @variants at-rule with no parameters',
|
|||
})
|
||||
|
||||
test('a `false` variants list generates no output', () => {
|
||||
const result = generateModules([
|
||||
{ name: 'textAlign', generator: textAlign },
|
||||
], {
|
||||
const result = generateModules([{ name: 'textAlign', generator: textAlign }], {
|
||||
textAlign: false,
|
||||
})
|
||||
|
||||
|
|
@ -53,9 +49,7 @@ test('a `false` variants list generates no output', () => {
|
|||
})
|
||||
|
||||
test('specified variants are included in the @variants at-rule', () => {
|
||||
const result = generateModules([
|
||||
{ name: 'textAlign', generator: textAlign },
|
||||
], {
|
||||
const result = generateModules([{ name: 'textAlign', generator: textAlign }], {
|
||||
textAlign: ['responsive', 'hover'],
|
||||
})
|
||||
|
||||
|
|
@ -71,25 +65,28 @@ test('specified variants are included in the @variants at-rule', () => {
|
|||
|
||||
test('options must provide variants for every module', () => {
|
||||
expect(() => {
|
||||
generateModules([
|
||||
{ name: 'textAlign', generator: textAlign },
|
||||
{ name: 'display', generator: display },
|
||||
], {
|
||||
textAlign: [],
|
||||
})
|
||||
generateModules(
|
||||
[{ name: 'textAlign', generator: textAlign }, { name: 'display', generator: display }],
|
||||
{
|
||||
textAlign: [],
|
||||
}
|
||||
)
|
||||
}).toThrow()
|
||||
})
|
||||
|
||||
test('variants can be different for each module', () => {
|
||||
const result = generateModules([
|
||||
{ name: 'textAlign', generator: textAlign },
|
||||
{ name: 'display', generator: display },
|
||||
{ name: 'borderStyle', generator: borderStyle },
|
||||
], {
|
||||
textAlign: [],
|
||||
display: false,
|
||||
borderStyle: ['responsive', 'hover', 'focus']
|
||||
})
|
||||
const result = generateModules(
|
||||
[
|
||||
{ name: 'textAlign', generator: textAlign },
|
||||
{ name: 'display', generator: display },
|
||||
{ name: 'borderStyle', generator: borderStyle },
|
||||
],
|
||||
{
|
||||
textAlign: [],
|
||||
display: false,
|
||||
borderStyle: ['responsive', 'hover', 'focus'],
|
||||
}
|
||||
)
|
||||
|
||||
const expected = `
|
||||
@variants {
|
||||
|
|
@ -108,18 +105,24 @@ test('variants can be different for each module', () => {
|
|||
})
|
||||
|
||||
test('generators can reference the generatorOptions object', () => {
|
||||
const result = generateModules([{
|
||||
name: 'parameterized',
|
||||
generator: (generatorParams) => {
|
||||
return defineClasses({
|
||||
'foo': { 'color': generatorParams.color },
|
||||
})
|
||||
const result = generateModules(
|
||||
[
|
||||
{
|
||||
name: 'parameterized',
|
||||
generator: generatorParams => {
|
||||
return defineClasses({
|
||||
foo: { color: generatorParams.color },
|
||||
})
|
||||
},
|
||||
},
|
||||
],
|
||||
{
|
||||
parameterized: [],
|
||||
},
|
||||
{
|
||||
color: 'blue',
|
||||
}
|
||||
}], {
|
||||
parameterized: [],
|
||||
}, {
|
||||
color: 'blue'
|
||||
})
|
||||
)
|
||||
|
||||
const expected = `
|
||||
@variants {
|
||||
|
|
|
|||
|
|
@ -14,7 +14,11 @@ export default function(config) {
|
|||
return
|
||||
}
|
||||
|
||||
const utilities = generateModules(utilityModules, unwrappedConfig.options.modules, unwrappedConfig)
|
||||
const utilities = generateModules(
|
||||
utilityModules,
|
||||
unwrappedConfig.options.modules,
|
||||
unwrappedConfig
|
||||
)
|
||||
|
||||
if (_.get(unwrappedConfig, 'options.important', false)) {
|
||||
utilities.walkDecls(decl => (decl.important = true))
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import wrapWithVariants from '../util/wrapWithVariants'
|
|||
|
||||
export default function(modules, moduleOptions, generatorOptions = {}) {
|
||||
modules.forEach(module => {
|
||||
if (! _.has(moduleOptions, module.name)) {
|
||||
if (!_.has(moduleOptions, module.name)) {
|
||||
throw new Error(`Module \`${module.name}\` is missing from moduleOptions.`)
|
||||
}
|
||||
})
|
||||
|
|
@ -12,7 +12,9 @@ export default function(modules, moduleOptions, generatorOptions = {}) {
|
|||
return postcss.root({
|
||||
nodes: _(modules)
|
||||
.reject(module => moduleOptions[module.name] === false)
|
||||
.flatMap(module => wrapWithVariants(module.generator(generatorOptions), moduleOptions[module.name]))
|
||||
.value()
|
||||
.flatMap(module =>
|
||||
wrapWithVariants(module.generator(generatorOptions), moduleOptions[module.name])
|
||||
)
|
||||
.value(),
|
||||
})
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue