It would be great if there was a Type module which can determine the type of values and other things.
It could be as simple as:
postcss.type('1rem'); // 'length'
postcss.type('red'); // 'color'
postcss.type('.something'); // 'class'
postcss.type('#id'); // 'id'
postcss.type('calc(10rem * 10rem)'); // 'function'
postcss.type('@media {}'); // 'atrule'
postcss.type('1rem') === 'length'; // trueThe above may not be too vague – even though those are the correct CSS types. It can be even more informative by giving more type information:
postcss.type('1rem'); // ['length', 'rem']
postcss.type('red'); // ['color', 'keyword']
postcss.type('.something'); // ['selector', 'class']
postcss.type('#id'); // ['selector', 'id']
postcss.type('calc(10rem * 10rem)'); // ['function', 'calc']
postcss.type('@media {}'); // ['atrule', 'media']
postcss.type('1rem').includes('length'); // trueFinally, another option is to return rich type information:
postcss.type('1rem'); // { types: ['value', 'length'], name: 'rem' }
postcss.type('red'); // { types: ['value', 'color'], name: 'red' }
postcss.type('.something'); // { types: ['selector', 'class'], name: 'something' }
postcss.type('#something'); // { types: ['selector', 'id'], name: 'something' }
postcss.type('calc(10rem * 10rem)'); // { types: ['value', 'function'], name: 'calc' }
postcss.type('@media {}'); // { types: ['atrule'], name: 'media' }
postcss.type('1rem').types.includes('length'); // trueThe atrule may seem unnecessary, but it could prove to be useful in the form of convenience.
It would be great if there was a
Typemodule which can determine the type of values and other things.It could be as simple as:
The above may not be too vague – even though those are the correct CSS types. It can be even more informative by giving more type information:
Finally, another option is to return rich type information:
The
atrulemay seem unnecessary, but it could prove to be useful in the form of convenience.