add defineHS()L, remove defineColorAlpha()

mixins.js

@@ -1,31 +1,28 @@
 // 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,
+// untested TODO - test
-// saturation and lightness components
+function defineHSL(mixin, name, hue, sat, light) {
-function defineColor(mixin, name, hex) {
-  const [hue, sat, light] = toHSL(hex);
   const obj = {};
-  obj[name] = hex;
+    obj[name] = name;
-  // need to convert hue to string otherwise postcss (is it postcss?) appends
+    // need to ensure hue is a string otherwise postcss (is it postcss?) appends
-  // 'px' to the property's value.
+    // 'px' to the property's value.
-  obj[`${name}__h`] = hue.toString();
+    obj[`${name}__h`] = hue.toString();
-  obj[`${name}__s`] = `${sat}%`;
+    obj[`${name}__s`] = `${sat}%`;
-  obj[`${name}__l`] = `${light}%`;
+    obj[`${name}__l`] = `${light}%`;
-  return obj;
+    return obj;
 }
 
 // defines a custom property with identifier name, along with individual hue,
-// saturation, lightness and alpha components
+// saturation and lightness components
-function defineColorAlpha(mixin, name, hex, alpha) {
+function defineHex(mixin, name, hex) {
-  const obj = defineColor(mixin, name, hex);
+  const [hue, sat, light] = toHSL(hex);
-  obj[`${name}-a`] = alpha;
+  return defineHSL(name, hue, sat, light)
-  return obj;
 }
 
 const postcssMixins = {
-  defineColor,
+  defineHSL,
-  defineColorAlpha,
+  defineHex,
 };
 
 module.exports = postcssMixins;