// eslint-disable-next-line import/no-extraneous-dependencies const toHSL = require('hex-to-hsl'); // defines a custom property with identifier name, along with individual hue, // saturation and lightness components function defineColor(mixin, name, hex) { const [hue, sat, light] = toHSL(hex); const obj = {}; obj[name] = hex; // need to convert hue to string otherwise postcss (is it postcss?) appends // 'px' to the property's value. obj[`${name}-h`] = hue.toString(); obj[`${name}-s`] = `${sat}%`; obj[`${name}-l`] = `${light}%`; return obj; } // defines a custom property with identifier name, along with individual hue, // saturation, lightness and alpha components function defineColorAlpha(mixin, name, hex, alpha) { const obj = defineColor(mixin, name, hex); obj[`${name}-a`] = alpha; return obj; } const postcssMixins = { defineColor, defineColorAlpha, }; module.exports = postcssMixins;