Enable custom spacing for inset and space-between

Author: stevecochrane

plugins/inset.js

@@ -1,13 +1,20 @@
+const numberRegex = require("./util/numberRegex");
+
 module.exports = function ({ matchUtilities, theme }) {
+  const values = theme("inset");
   const calculatedValues = {};
+  const keywords = ["auto"];
 
-  for (const property in theme("inset")) {
+  for (const property in values) {
     if (property === "px") {
       calculatedValues[property] = "1px";
     } else if (property === "full") {
       calculatedValues[property] = "100%";
-    } else if (property === "auto") {
-      calculatedValues[property] = "auto";
+    } else if (
+      keywords.includes(property) ||
+      (!numberRegex.test(property) && values[property])
+    ) {
+      calculatedValues[property] = values[property];
     } else if (property.includes("/")) {
       calculatedValues[property] = `calc(${property} * 100%)`;
     } else {

plugins/spaceBetween.js

@@ -1,9 +1,14 @@
+const numberRegex = require("./util/numberRegex");
+
 module.exports = function ({ addUtilities, matchUtilities, theme }) {
+  const values = theme("margin");
   const calculatedValues = {};
 
-  for (const property in theme("margin")) {
+  for (const property in values) {
     if (property === "px") {
       calculatedValues[property] = "1px";
+    } else if (!numberRegex.test(property) && values[property]) {
+      calculatedValues[property] = values[property];
     } else {
       calculatedValues[property] = `calc(var(--spacing) * ${property})`;
     }