UNPKG

1.2 kBJavaScriptView Raw
1// tooling
2import { list } from 'postcss';
3import setVariable from './set-variable';
4
5// transform @mixin at-rules
6export default function transformMixinAtrule(rule, opts) {
7 // if @mixin is supported
8 if (opts.transform.includes('@mixin')) {
9 // @mixin options
10 const { name, params } = getMixinOpts(rule);
11
12 // set the mixin as a variable on the parent of the @mixin at-rule
13 setVariable(rule.parent, `@mixin ${name}`, { params, rule }, opts);
14
15 // remove the @mixin at-rule
16 rule.remove();
17 }
18}
19
20// return the @mixin statement options (@mixin NAME, @mixin NAME(PARAMS))
21const getMixinOpts = node => {
22 // @mixin name and default params ([{ name, value }, ...])
23 const [ name, sourceParams ] = node.params.split(matchOpeningParen, 2);
24 const params = sourceParams && sourceParams.slice(0, -1).trim()
25 ? list.comma(sourceParams.slice(0, -1).trim()).map(
26 param => {
27 const parts = list.split(param, ':');
28 const paramName = parts[0].slice(1);
29 const paramValue = parts.length > 1 ? parts.slice(1).join(':') : undefined;
30
31 return { name: paramName, value: paramValue };
32 }
33 )
34 : [];
35
36 return { name, params };
37};
38
39// match an opening parenthesis
40const matchOpeningParen = '(';