@symbo.ls/scratch 2.10.253 → 2.10.257

package/dist/cjs/factory.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };

package/dist/cjs/index.js

@@ -289,7 +289,7 @@ var require_types = __commonJS({
       isNumber: () => isNumber,
       isObject: () => isObject6,
       isObjectLike: () => isObjectLike3,
-      isString: () => isString7,
+      isString: () => isString8,
       isUndefined: () => isUndefined,
       isValidHtmlTag: () => isValidHtmlTag
     });
@@ -302,7 +302,7 @@ var require_types = __commonJS({
         return false;
       return typeof arg === "object" && arg.constructor === Object;
     };
-    var isString7 = (arg) => typeof arg === "string";
+    var isString8 = (arg) => typeof arg === "string";
     var isNumber = (arg) => typeof arg === "number";
     var isFunction2 = (arg) => typeof arg === "function";
     var isBoolean = (arg) => arg === true || arg === false;
@@ -320,7 +320,7 @@ var require_types = __commonJS({
       return typeof import_globals3.window.HTMLElement === "object" ? obj instanceof import_globals3.window.HTMLElement : obj && typeof obj === "object" && obj !== null && obj.nodeType === 1 && typeof obj.nodeName === "string";
     };
     var isDefined2 = (arg) => {
-      return isObject6(arg) || isObjectLike3(arg) || isString7(arg) || isNumber(arg) || isFunction2(arg) || isArray5(arg) || isObjectLike3(arg) || isBoolean(arg) || isNull(arg);
+      return isObject6(arg) || isObjectLike3(arg) || isString8(arg) || isNumber(arg) || isFunction2(arg) || isArray5(arg) || isObjectLike3(arg) || isBoolean(arg) || isNull(arg);
     };
     var isUndefined = (arg) => {
       return arg === void 0;
@@ -329,7 +329,7 @@ var require_types = __commonJS({
       boolean: isBoolean,
       array: isArray5,
       object: isObject6,
-      string: isString7,
+      string: isString8,
       number: isNumber,
       null: isNull,
       function: isFunction2,
@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };
@@ -941,7 +951,12 @@ __export(src_exports, {
   setSVG: () => setSVG,
   setTheme: () => setTheme,
   setValue: () => setValue,
-  setVariables: () => setVariables
+  setVariables: () => setVariables,
+  transformBackgroundImage: () => transformBackgroundImage,
+  transformBorder: () => transformBorder,
+  transformShadow: () => transformShadow,
+  transformTextStroke: () => transformTextStroke,
+  transfromGap: () => transfromGap
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -1736,8 +1751,11 @@ var getColor = (value, key) => {
     if (tone) {
       if (!val[tone]) {
         const toHex = rgbArrayToHex(rgb.split(", ").map((v) => parseFloat(v)));
-        if (tone.slice(0, 1) === "-" || tone.slice(0, 1) === "+") {
-          rgb = hexToRgbArray(getColorShade(toHex, parseFloat(tone))).join(", ");
+        const abs = tone.slice(0, 1);
+        if (abs === "-" || abs === "+") {
+          rgb = hexToRgbArray(
+            getColorShade(toHex, parseFloat(tone))
+          ).join(", ");
         } else {
           const [r, g, b] = [...rgb.split(", ").map((v) => parseInt(v))];
           const hsl = rgbToHSL(r, g, b);
@@ -1755,7 +1773,7 @@ var getColor = (value, key) => {
   } else
     return CONFIG2.useVariable ? `var(${val.var})` : val.value;
 };
-var getMediaColor = (value, property, globalTheme) => {
+var getMediaColor = (value, globalTheme) => {
   const CONFIG2 = getActiveConfig();
   if (!globalTheme)
     globalTheme = CONFIG2.globalTheme;
@@ -1765,29 +1783,29 @@ var getMediaColor = (value, property, globalTheme) => {
     return;
   }
   if (value.slice(0, 2) === "--")
-    return { [property]: `var(${value})` };
+    return `var(${value})`;
   const [name] = (0, import_utils8.isArray)(value) ? value : value.split(" ");
   const { COLOR: COLOR2, GRADIENT: GRADIENT2 } = CONFIG2;
   const val = COLOR2[name] || GRADIENT2[name];
   const isObj = (0, import_utils8.isObject)(val);
   if (isObj && val.value)
-    return { [property]: getColor(value, globalTheme) };
+    return getColor(value, `@${globalTheme}`);
   else if (isObj) {
     if (globalTheme)
-      return { [property]: getColor(value, `@${globalTheme}`) };
+      return getColor(value, `@${globalTheme}`);
     else {
       const obj = {};
       for (const mediaName in val) {
         const query = CONFIG2.MEDIA[mediaName.slice(1)];
         const media = `@media screen and ${query}`;
-        obj[media] = { [property]: getColor(value, mediaName) };
+        obj[media] = getColor(value, mediaName);
       }
       return obj;
     }
   } else {
     if (CONFIG2.verbose)
       console.warn("Can't find color", value);
-    return { [property]: value };
+    return value;
   }
 };
 var setColor = (val, key, suffix) => {
@@ -2410,10 +2428,83 @@ var applyReset = (reset = {}) => {
   }
 };
 
-// src/set.js
+// src/transforms/index.js
 var import_utils25 = __toESM(require_cjs3(), 1);
+var isBorderStyle = (str) => [
+  "none",
+  "hidden",
+  "dotted",
+  "dashed",
+  "solid",
+  "double",
+  "groove",
+  "ridge",
+  "inset",
+  "outset",
+  "initial"
+].some((v) => str.includes(v));
+var transformBorder = (border) => {
+  const arr = border.split(", ");
+  return arr.map((v) => {
+    v = v.trim();
+    if (v.slice(0, 2) === "--")
+      return `var(${v})`;
+    else if (isBorderStyle(v))
+      return v || "solid";
+    else if (v.slice(-2) === "px" || v.slice(-2) === "em")
+      return v;
+    else if (getColor(v).length > 2)
+      return getColor(v);
+    return getSpacingByKey(v, "border").border;
+  }).join(" ");
+};
+var transformTextStroke = (stroke) => {
+  return stroke.split(", ").map((v) => {
+    if (v.slice(0, 2) === "--")
+      return `var(${v})`;
+    if (v.includes("px"))
+      return v;
+    else if (getColor(v))
+      return getColor(v);
+  }).join(" ");
+};
+var transformShadow = (shadows) => shadows.split("|").map((shadow) => {
+  return shadow.split(", ").map((v) => {
+    v = v.trim();
+    if (v.slice(0, 2) === "--")
+      return `var(${v})`;
+    if (getColor(v).length > 2)
+      return getColor(v);
+    if (v.includes("px") || v.slice(-2) === "em")
+      return v;
+    const arr = v.split(" ");
+    if (!arr.length)
+      return v;
+    return arr.map((v2) => getSpacingByKey(v2, "shadow").shadow).join(" ");
+  }).join(" ");
+}).join(",");
+var transformBackgroundImage = (backgroundImage, globalTheme) => {
+  const CONFIG2 = getActiveConfig();
+  return backgroundImage.split(", ").map((v) => {
+    if (v.slice(0, 2) === "--")
+      return `var(${v})`;
+    if (v.includes("url") || v.includes("gradient"))
+      return v;
+    else if (CONFIG2.GRADIENT[backgroundImage]) {
+      return {
+        backgroundImage: getMediaColor(backgroundImage, globalTheme || CONFIG2.globalTheme)
+      };
+    } else if (v.includes("/") || v.includes("http"))
+      return `url(${v})`;
+    return v;
+  }).join(" ");
+};
+var transfromGap = (gap) => (0, import_utils25.isString)(gap) && gap.split(" ").map((v) => getSpacingByKey(v, "gap").gap).join(" ");
+
+// src/set.js
+var import_utils26 = __toESM(require_cjs3(), 1);
 var setCases = (val, key) => {
-  if ((0, import_utils25.isFunction)(val))
+  if ((0, import_utils26.isFunction)(val))
     return val();
   return val;
 };

package/dist/cjs/set.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };
@@ -1506,8 +1516,11 @@ var getColor = (value, key) => {
     if (tone) {
       if (!val[tone]) {
         const toHex = rgbArrayToHex(rgb.split(", ").map((v) => parseFloat(v)));
-        if (tone.slice(0, 1) === "-" || tone.slice(0, 1) === "+") {
-          rgb = hexToRgbArray(getColorShade(toHex, parseFloat(tone))).join(", ");
+        const abs = tone.slice(0, 1);
+        if (abs === "-" || abs === "+") {
+          rgb = hexToRgbArray(
+            getColorShade(toHex, parseFloat(tone))
+          ).join(", ");
         } else {
           const [r, g, b] = [...rgb.split(", ").map((v) => parseInt(v))];
           const hsl = rgbToHSL(r, g, b);
@@ -1525,7 +1538,7 @@ var getColor = (value, key) => {
   } else
     return CONFIG2.useVariable ? `var(${val.var})` : val.value;
 };
-var getMediaColor = (value, property, globalTheme) => {
+var getMediaColor = (value, globalTheme) => {
   const CONFIG2 = getActiveConfig();
   if (!globalTheme)
     globalTheme = CONFIG2.globalTheme;
@@ -1535,29 +1548,29 @@ var getMediaColor = (value, property, globalTheme) => {
     return;
   }
   if (value.slice(0, 2) === "--")
-    return { [property]: `var(${value})` };
+    return `var(${value})`;
   const [name] = (0, import_utils8.isArray)(value) ? value : value.split(" ");
   const { COLOR: COLOR2, GRADIENT: GRADIENT2 } = CONFIG2;
   const val = COLOR2[name] || GRADIENT2[name];
   const isObj = (0, import_utils8.isObject)(val);
   if (isObj && val.value)
-    return { [property]: getColor(value, globalTheme) };
+    return getColor(value, `@${globalTheme}`);
   else if (isObj) {
     if (globalTheme)
-      return { [property]: getColor(value, `@${globalTheme}`) };
+      return getColor(value, `@${globalTheme}`);
     else {
       const obj = {};
       for (const mediaName in val) {
         const query = CONFIG2.MEDIA[mediaName.slice(1)];
         const media = `@media screen and ${query}`;
-        obj[media] = { [property]: getColor(value, mediaName) };
+        obj[media] = getColor(value, mediaName);
       }
       return obj;
     }
   } else {
     if (CONFIG2.verbose)
       console.warn("Can't find color", value);
-    return { [property]: value };
+    return value;
   }
 };
 var setColor = (val, key, suffix) => {

package/dist/cjs/system/color.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };
@@ -1201,8 +1211,11 @@ var getColor = (value, key) => {
     if (tone) {
       if (!val[tone]) {
         const toHex = rgbArrayToHex(rgb.split(", ").map((v) => parseFloat(v)));
-        if (tone.slice(0, 1) === "-" || tone.slice(0, 1) === "+") {
-          rgb = hexToRgbArray(getColorShade(toHex, parseFloat(tone))).join(", ");
+        const abs = tone.slice(0, 1);
+        if (abs === "-" || abs === "+") {
+          rgb = hexToRgbArray(
+            getColorShade(toHex, parseFloat(tone))
+          ).join(", ");
         } else {
           const [r, g, b] = [...rgb.split(", ").map((v) => parseInt(v))];
           const hsl = rgbToHSL(r, g, b);
@@ -1220,7 +1233,7 @@ var getColor = (value, key) => {
   } else
     return CONFIG2.useVariable ? `var(${val.var})` : val.value;
 };
-var getMediaColor = (value, property, globalTheme) => {
+var getMediaColor = (value, globalTheme) => {
   const CONFIG2 = getActiveConfig();
   if (!globalTheme)
     globalTheme = CONFIG2.globalTheme;
@@ -1230,29 +1243,29 @@ var getMediaColor = (value, property, globalTheme) => {
     return;
   }
   if (value.slice(0, 2) === "--")
-    return { [property]: `var(${value})` };
+    return `var(${value})`;
   const [name] = (0, import_utils8.isArray)(value) ? value : value.split(" ");
   const { COLOR: COLOR2, GRADIENT: GRADIENT2 } = CONFIG2;
   const val = COLOR2[name] || GRADIENT2[name];
   const isObj = (0, import_utils8.isObject)(val);
   if (isObj && val.value)
-    return { [property]: getColor(value, globalTheme) };
+    return getColor(value, `@${globalTheme}`);
   else if (isObj) {
     if (globalTheme)
-      return { [property]: getColor(value, `@${globalTheme}`) };
+      return getColor(value, `@${globalTheme}`);
     else {
       const obj = {};
       for (const mediaName in val) {
         const query = CONFIG2.MEDIA[mediaName.slice(1)];
         const media = `@media screen and ${query}`;
-        obj[media] = { [property]: getColor(value, mediaName) };
+        obj[media] = getColor(value, mediaName);
       }
       return obj;
     }
   } else {
     if (CONFIG2.verbose)
       console.warn("Can't find color", value);
-    return { [property]: value };
+    return value;
   }
 };
 var setColor = (val, key, suffix) => {

package/dist/cjs/system/document.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };

package/dist/cjs/system/font.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };

package/dist/cjs/system/index.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };
@@ -1502,8 +1512,11 @@ var getColor = (value, key) => {
     if (tone) {
       if (!val[tone]) {
         const toHex = rgbArrayToHex(rgb.split(", ").map((v) => parseFloat(v)));
-        if (tone.slice(0, 1) === "-" || tone.slice(0, 1) === "+") {
-          rgb = hexToRgbArray(getColorShade(toHex, parseFloat(tone))).join(", ");
+        const abs = tone.slice(0, 1);
+        if (abs === "-" || abs === "+") {
+          rgb = hexToRgbArray(
+            getColorShade(toHex, parseFloat(tone))
+          ).join(", ");
         } else {
           const [r, g, b] = [...rgb.split(", ").map((v) => parseInt(v))];
           const hsl = rgbToHSL(r, g, b);
@@ -1521,7 +1534,7 @@ var getColor = (value, key) => {
   } else
     return CONFIG2.useVariable ? `var(${val.var})` : val.value;
 };
-var getMediaColor = (value, property, globalTheme) => {
+var getMediaColor = (value, globalTheme) => {
   const CONFIG2 = getActiveConfig();
   if (!globalTheme)
     globalTheme = CONFIG2.globalTheme;
@@ -1531,29 +1544,29 @@ var getMediaColor = (value, property, globalTheme) => {
     return;
   }
   if (value.slice(0, 2) === "--")
-    return { [property]: `var(${value})` };
+    return `var(${value})`;
   const [name] = (0, import_utils8.isArray)(value) ? value : value.split(" ");
   const { COLOR: COLOR2, GRADIENT: GRADIENT2 } = CONFIG2;
   const val = COLOR2[name] || GRADIENT2[name];
   const isObj = (0, import_utils8.isObject)(val);
   if (isObj && val.value)
-    return { [property]: getColor(value, globalTheme) };
+    return getColor(value, `@${globalTheme}`);
   else if (isObj) {
     if (globalTheme)
-      return { [property]: getColor(value, `@${globalTheme}`) };
+      return getColor(value, `@${globalTheme}`);
     else {
       const obj = {};
       for (const mediaName in val) {
         const query = CONFIG2.MEDIA[mediaName.slice(1)];
         const media = `@media screen and ${query}`;
-        obj[media] = { [property]: getColor(value, mediaName) };
+        obj[media] = getColor(value, mediaName);
       }
       return obj;
     }
   } else {
     if (CONFIG2.verbose)
       console.warn("Can't find color", value);
-    return { [property]: value };
+    return value;
   }
 };
 var setColor = (val, key, suffix) => {

package/dist/cjs/system/reset.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };

package/dist/cjs/system/spacing.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };

package/dist/cjs/system/svg.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };

package/dist/cjs/system/theme.js

@@ -523,12 +523,22 @@ var require_object = __commonJS({
           continue;
         else if ((0, import_types.isObject)(objProp)) {
           detached[prop] = {};
-          deepStringify(objProp[prop], detached[prop]);
+          deepStringify(objProp, detached[prop]);
         } else if ((0, import_types.isArray)(objProp)) {
           detached[prop] = [];
-          objProp.map((v, i) => deepStringify(v, detached[prop][i]));
-        } else
+          objProp.forEach((v, i) => {
+            if ((0, import_types.isFunction)(v))
+              return;
+            if ((0, import_types.isObject)(v)) {
+              detached[prop][i] = {};
+              detachFunctionsFromObject(v, detached[prop][i]);
+            } else {
+              detached[prop][i] = v;
+            }
+          });
+        } else {
           detached[prop] = objProp;
+        }
       }
       return detached;
     };
@@ -1164,8 +1174,11 @@ var getColor = (value, key) => {
     if (tone) {
       if (!val[tone]) {
         const toHex = rgbArrayToHex(rgb.split(", ").map((v) => parseFloat(v)));
-        if (tone.slice(0, 1) === "-" || tone.slice(0, 1) === "+") {
-          rgb = hexToRgbArray(getColorShade(toHex, parseFloat(tone))).join(", ");
+        const abs = tone.slice(0, 1);
+        if (abs === "-" || abs === "+") {
+          rgb = hexToRgbArray(
+            getColorShade(toHex, parseFloat(tone))
+          ).join(", ");
         } else {
           const [r, g, b] = [...rgb.split(", ").map((v) => parseInt(v))];
           const hsl = rgbToHSL(r, g, b);