@symbo.ls/scratch 2.11.228 → 2.11.229

package/dist/cjs/index.js

@@ -1422,6 +1422,7 @@ __export(src_exports, {
   hexToRgbArray: () => hexToRgbArray,
   hexToRgba: () => hexToRgba,
   hslToRgb: () => hslToRgb,
+  isScalingUnit: () => isScalingUnit,
   mixTwoColors: () => mixTwoColors,
   mixTwoRgb: () => mixTwoRgb,
   mixTwoRgba: () => mixTwoRgba,
@@ -1495,6 +1496,7 @@ __export(utils_exports, {
   hexToRgbArray: () => hexToRgbArray,
   hexToRgba: () => hexToRgba,
   hslToRgb: () => hslToRgb,
+  isScalingUnit: () => isScalingUnit,
   mixTwoColors: () => mixTwoColors,
   mixTwoRgb: () => mixTwoRgb,
   mixTwoRgba: () => mixTwoRgba,
@@ -1512,6 +1514,11 @@ __export(utils_exports, {
   setVariables: () => setVariables
 });
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs(), 1);
 var import_utils = __toESM(require_cjs2(), 1);
@@ -2026,9 +2033,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {
@@ -2238,7 +2246,7 @@ var applySequenceVars = (FACTORY2, options = {}) => {
 };
 var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   const CONFIG2 = getActiveConfig();
-  const { UNIT: UNIT2, MEDIA: MEDIA2, TIMING: TIMING2, CSS_VARS: CSS_VARS2 } = CONFIG2;
+  const { UNIT: UNIT2, MEDIA: MEDIA2, CSS_VARS: CSS_VARS2 } = CONFIG2;
   const mediaName = media.slice(1);
   const unit = FACTORY2.unit || UNIT2.default;
   const { mediaRegenerate } = FACTORY2;
@@ -2255,7 +2263,7 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   }
   for (const key in sequence) {
     const item = sequence[key];
-    const value = (FACTORY2.type === TIMING2.type ? sequence[key].val : scales[key]) + unit;
+    const value = (isScalingUnit(unit) ? scales[key] : sequence[key].val) + unit;
     if (!query && CONFIG2.verbose)
       console.warn("Can't find query ", query);
     let underMediaQuery = CSS_VARS2[`@media ${query}`];
@@ -2264,7 +2272,6 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
     underMediaQuery[item.variable] = `var(${item.variable + "_" + mediaName})`;
     CSS_VARS2[item.variable + "_" + mediaName] = value;
   }
-  console.log(CSS_VARS2);
 };
 
 // src/utils/sprite.js

package/dist/cjs/set.js

@@ -1593,6 +1593,11 @@ var setActiveConfig = (newConfig) => {
 // src/system/color.js
 var import_utils9 = __toESM(require_cjs(), 1);
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs2(), 1);
 var import_utils2 = __toESM(require_cjs(), 1);
@@ -1781,9 +1786,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {
@@ -1985,7 +1991,7 @@ var applySequenceVars = (FACTORY2, options = {}) => {
 };
 var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   const CONFIG2 = getActiveConfig();
-  const { UNIT: UNIT2, MEDIA: MEDIA2, TIMING: TIMING2, CSS_VARS: CSS_VARS2 } = CONFIG2;
+  const { UNIT: UNIT2, MEDIA: MEDIA2, CSS_VARS: CSS_VARS2 } = CONFIG2;
   const mediaName = media.slice(1);
   const unit = FACTORY2.unit || UNIT2.default;
   const { mediaRegenerate } = FACTORY2;
@@ -2002,7 +2008,7 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   }
   for (const key in sequence) {
     const item = sequence[key];
-    const value = (FACTORY2.type === TIMING2.type ? sequence[key].val : scales[key]) + unit;
+    const value = (isScalingUnit(unit) ? scales[key] : sequence[key].val) + unit;
     if (!query && CONFIG2.verbose)
       console.warn("Can't find query ", query);
     let underMediaQuery = CSS_VARS2[`@media ${query}`];
@@ -2011,7 +2017,6 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
     underMediaQuery[item.variable] = `var(${item.variable + "_" + mediaName})`;
     CSS_VARS2[item.variable + "_" + mediaName] = value;
   }
-  console.log(CSS_VARS2);
 };
 
 // src/utils/sprite.js

package/dist/cjs/system/index.js

@@ -1611,6 +1611,11 @@ var getActiveConfig = (def) => {
   return FACTORY[def || FACTORY.active];
 };
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs2(), 1);
 var import_utils2 = __toESM(require_cjs(), 1);
@@ -1804,9 +1809,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {
@@ -2008,7 +2014,7 @@ var applySequenceVars = (FACTORY2, options = {}) => {
 };
 var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   const CONFIG2 = getActiveConfig();
-  const { UNIT: UNIT2, MEDIA: MEDIA2, TIMING: TIMING2, CSS_VARS: CSS_VARS2 } = CONFIG2;
+  const { UNIT: UNIT2, MEDIA: MEDIA2, CSS_VARS: CSS_VARS2 } = CONFIG2;
   const mediaName = media.slice(1);
   const unit = FACTORY2.unit || UNIT2.default;
   const { mediaRegenerate } = FACTORY2;
@@ -2025,7 +2031,7 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   }
   for (const key in sequence) {
     const item = sequence[key];
-    const value = (FACTORY2.type === TIMING2.type ? sequence[key].val : scales[key]) + unit;
+    const value = (isScalingUnit(unit) ? scales[key] : sequence[key].val) + unit;
     if (!query && CONFIG2.verbose)
       console.warn("Can't find query ", query);
     let underMediaQuery = CSS_VARS2[`@media ${query}`];
@@ -2034,7 +2040,6 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
     underMediaQuery[item.variable] = `var(${item.variable + "_" + mediaName})`;
     CSS_VARS2[item.variable + "_" + mediaName] = value;
   }
-  console.log(CSS_VARS2);
 };
 
 // src/utils/sprite.js

package/dist/cjs/system/shadow.js

@@ -1584,6 +1584,11 @@ var getActiveConfig = (def) => {
 // src/system/color.js
 var import_utils9 = __toESM(require_cjs(), 1);
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs2(), 1);
 var import_utils2 = __toESM(require_cjs(), 1);
@@ -1746,9 +1751,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {

package/dist/cjs/system/spacing.js

@@ -1602,6 +1602,11 @@ var getActiveConfig = (def) => {
   return FACTORY[def || FACTORY.active];
 };
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs2(), 1);
 var import_utils4 = __toESM(require_cjs(), 1);
@@ -1651,9 +1656,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {
@@ -1847,7 +1853,7 @@ var applySequenceVars = (FACTORY2, options = {}) => {
 };
 var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   const CONFIG2 = getActiveConfig();
-  const { UNIT: UNIT2, MEDIA: MEDIA2, TIMING: TIMING2, CSS_VARS: CSS_VARS2 } = CONFIG2;
+  const { UNIT: UNIT2, MEDIA: MEDIA2, CSS_VARS: CSS_VARS2 } = CONFIG2;
   const mediaName = media.slice(1);
   const unit = FACTORY2.unit || UNIT2.default;
   const { mediaRegenerate } = FACTORY2;
@@ -1864,7 +1870,7 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   }
   for (const key in sequence) {
     const item = sequence[key];
-    const value = (FACTORY2.type === TIMING2.type ? sequence[key].val : scales[key]) + unit;
+    const value = (isScalingUnit(unit) ? scales[key] : sequence[key].val) + unit;
     if (!query && CONFIG2.verbose)
       console.warn("Can't find query ", query);
     let underMediaQuery = CSS_VARS2[`@media ${query}`];
@@ -1873,7 +1879,6 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
     underMediaQuery[item.variable] = `var(${item.variable + "_" + mediaName})`;
     CSS_VARS2[item.variable + "_" + mediaName] = value;
   }
-  console.log(CSS_VARS2);
 };
 
 // src/utils/sprite.js

package/dist/cjs/system/timing.js

@@ -1596,6 +1596,11 @@ var getActiveConfig = (def) => {
   return FACTORY[def || FACTORY.active];
 };
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs2(), 1);
 var import_utils4 = __toESM(require_cjs(), 1);
@@ -1645,9 +1650,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {

package/dist/cjs/system/typography.js

@@ -1584,6 +1584,11 @@ var getActiveConfig = (def) => {
   return FACTORY[def || FACTORY.active];
 };
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs2(), 1);
 var import_utils2 = __toESM(require_cjs(), 1);
@@ -1644,9 +1649,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {
@@ -1848,7 +1854,7 @@ var applySequenceVars = (FACTORY2, options = {}) => {
 };
 var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   const CONFIG2 = getActiveConfig();
-  const { UNIT: UNIT2, MEDIA: MEDIA2, TIMING: TIMING2, CSS_VARS: CSS_VARS2 } = CONFIG2;
+  const { UNIT: UNIT2, MEDIA: MEDIA2, CSS_VARS: CSS_VARS2 } = CONFIG2;
   const mediaName = media.slice(1);
   const unit = FACTORY2.unit || UNIT2.default;
   const { mediaRegenerate } = FACTORY2;
@@ -1865,7 +1871,7 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   }
   for (const key in sequence) {
     const item = sequence[key];
-    const value = (FACTORY2.type === TIMING2.type ? sequence[key].val : scales[key]) + unit;
+    const value = (isScalingUnit(unit) ? scales[key] : sequence[key].val) + unit;
     if (!query && CONFIG2.verbose)
       console.warn("Can't find query ", query);
     let underMediaQuery = CSS_VARS2[`@media ${query}`];
@@ -1874,7 +1880,6 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
     underMediaQuery[item.variable] = `var(${item.variable + "_" + mediaName})`;
     CSS_VARS2[item.variable + "_" + mediaName] = value;
   }
-  console.log(CSS_VARS2);
 };
 
 // src/utils/sprite.js

package/dist/cjs/transforms/index.js

@@ -1592,6 +1592,11 @@ var getActiveConfig = (def) => {
 // src/system/color.js
 var import_utils9 = __toESM(require_cjs(), 1);
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs2(), 1);
 var import_utils2 = __toESM(require_cjs(), 1);
@@ -1759,9 +1764,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {

package/dist/cjs/utils/index.js

@@ -1373,6 +1373,7 @@ __export(utils_exports, {
   hexToRgbArray: () => hexToRgbArray,
   hexToRgba: () => hexToRgba,
   hslToRgb: () => hslToRgb,
+  isScalingUnit: () => isScalingUnit,
   mixTwoColors: () => mixTwoColors,
   mixTwoRgb: () => mixTwoRgb,
   mixTwoRgba: () => mixTwoRgba,
@@ -1391,6 +1392,11 @@ __export(utils_exports, {
 });
 module.exports = __toCommonJS(utils_exports);
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/color.js
 var import_globals = __toESM(require_cjs(), 1);
 var import_utils = __toESM(require_cjs2(), 1);
@@ -1879,9 +1885,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {
@@ -2091,7 +2098,7 @@ var applySequenceVars = (FACTORY2, options = {}) => {
 };
 var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   const CONFIG2 = getActiveConfig();
-  const { UNIT: UNIT2, MEDIA: MEDIA2, TIMING: TIMING2, CSS_VARS: CSS_VARS2 } = CONFIG2;
+  const { UNIT: UNIT2, MEDIA: MEDIA2, CSS_VARS: CSS_VARS2 } = CONFIG2;
   const mediaName = media.slice(1);
   const unit = FACTORY2.unit || UNIT2.default;
   const { mediaRegenerate } = FACTORY2;
@@ -2108,7 +2115,7 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   }
   for (const key in sequence) {
     const item = sequence[key];
-    const value = (FACTORY2.type === TIMING2.type ? sequence[key].val : scales[key]) + unit;
+    const value = (isScalingUnit(unit) ? scales[key] : sequence[key].val) + unit;
     if (!query && CONFIG2.verbose)
       console.warn("Can't find query ", query);
     let underMediaQuery = CSS_VARS2[`@media ${query}`];
@@ -2117,7 +2124,6 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
     underMediaQuery[item.variable] = `var(${item.variable + "_" + mediaName})`;
     CSS_VARS2[item.variable + "_" + mediaName] = value;
   }
-  console.log(CSS_VARS2);
 };
 
 // src/utils/sprite.js

package/dist/cjs/utils/sequence.js

@@ -1564,6 +1564,11 @@ var getActiveConfig = (def) => {
   return FACTORY[def || FACTORY.active];
 };
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/sequence.js
 var numToLetterMap = {
   "-6": "U",
@@ -1608,9 +1613,10 @@ var setSequenceValue = (props, sequenceProps) => {
   sequenceProps.vars[variable] = scaling + sequenceProps.unit;
 };
 var setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps;
+  const { base, type, unit } = sequenceProps;
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit;
   if (key === 0)
-    return "1em";
+    return defaultVal;
   const prefix = "--" + (type && type.replace(".", "-"));
   const ratioVar = `${prefix}-ratio`;
   if (key > 0) {

package/dist/cjs/utils/unit.js

@@ -0,0 +1,28 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/utils/unit.js
+var unit_exports = {};
+__export(unit_exports, {
+  isScalingUnit: () => isScalingUnit
+});
+module.exports = __toCommonJS(unit_exports);
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};

package/dist/cjs/utils/var.js

@@ -1557,6 +1557,11 @@ var import_utils3 = __toESM(require_cjs());
 // ../utils/src/scaling.js
 var import_utils2 = __toESM(require_cjs());
 
+// src/utils/unit.js
+var isScalingUnit = (unit) => {
+  return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
+};
+
 // src/utils/sequence.js
 var getSubratioDifference = (base, ratio) => {
   const diff = base * ratio - base;
@@ -1620,7 +1625,7 @@ var applySequenceVars = (FACTORY2, options = {}) => {
 };
 var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   const CONFIG2 = getActiveConfig();
-  const { UNIT: UNIT2, MEDIA: MEDIA2, TIMING: TIMING2, CSS_VARS: CSS_VARS2 } = CONFIG2;
+  const { UNIT: UNIT2, MEDIA: MEDIA2, CSS_VARS: CSS_VARS2 } = CONFIG2;
   const mediaName = media.slice(1);
   const unit = FACTORY2.unit || UNIT2.default;
   const { mediaRegenerate } = FACTORY2;
@@ -1637,7 +1642,7 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
   }
   for (const key in sequence) {
     const item = sequence[key];
-    const value = (FACTORY2.type === TIMING2.type ? sequence[key].val : scales[key]) + unit;
+    const value = (isScalingUnit(unit) ? scales[key] : sequence[key].val) + unit;
     if (!query && CONFIG2.verbose)
       console.warn("Can't find query ", query);
     let underMediaQuery = CSS_VARS2[`@media ${query}`];
@@ -1646,5 +1651,4 @@ var applyMediaSequenceVars = (FACTORY2, media, options = {}) => {
     underMediaQuery[item.variable] = `var(${item.variable + "_" + mediaName})`;
     CSS_VARS2[item.variable + "_" + mediaName] = value;
   }
-  console.log(CSS_VARS2);
 };

package/package.json

@@ -2,7 +2,7 @@
   "name": "@symbo.ls/scratch",
   "description": "Φ / CSS framework and methodology.",
   "author": "symbo.ls",
-  "version": "2.11.228",
+  "version": "2.11.229",
   "files": [
     "src",
     "dist"
@@ -29,5 +29,5 @@
     "@symbo.ls/utils": "latest",
     "color-contrast-checker": "^1.5.0"
   },
-  "gitHead": "56d2e29e73842899b56b329d61abf5f75e27cc7c"
+  "gitHead": "3ccc5fb6cb32e86462f774d7bac671a94e963e48"
 }

package/src/utils/index.js

@@ -1,5 +1,6 @@
 'use strict'
 
+export * from './unit.js'
 export * from './color.js'
 export * from './theme.js'
 export * from './font.js'

package/src/utils/sequence.js

@@ -3,6 +3,7 @@
 import { isString } from '@domql/utils'
 import { toDashCase } from '@symbo.ls/utils'
 import { getActiveConfig } from '../factory.js'
+import { isScalingUnit } from './unit.js'
 
 export const numToLetterMap = {
   '-6': 'U',
@@ -49,8 +50,11 @@ const setSequenceValue = (props, sequenceProps) => {
 }
 
 export const setScalingVar = (key, sequenceProps) => {
-  const { type } = sequenceProps
-  if (key === 0) return '1em'
+  const { base, type, unit } = sequenceProps
+
+  const defaultVal = (isScalingUnit(unit) ? 1 : base) + unit
+
+  if (key === 0) return defaultVal
 
   const prefix = '--' + (type && type.replace('.', '-'))
   const ratioVar = `${prefix}-ratio`

package/src/utils/unit.js

@@ -0,0 +1,5 @@
+'use strict'
+
+export const isScalingUnit = unit => {
+  return unit === 'em' || unit === 'rem' || unit === 'vw' || unit === 'vh' || unit === 'vmax' || unit === 'vmin'
+}

package/src/utils/var.js

@@ -3,6 +3,7 @@
 import { isObjectLike } from '@domql/utils'
 import { getActiveConfig } from '../factory.js'
 import { getSubratio } from './sequence.js'
+import { isScalingUnit } from './unit.js'
 
 export const setVariables = (result, key) => {
   const CONFIG = getActiveConfig()
@@ -68,7 +69,7 @@ export const applySequenceVars = (FACTORY, options = {}) => {
 
 export const applyMediaSequenceVars = (FACTORY, media, options = {}) => {
   const CONFIG = getActiveConfig()
-  const { UNIT, MEDIA, TIMING, CSS_VARS } = CONFIG
+  const { UNIT, MEDIA, CSS_VARS } = CONFIG
 
   const mediaName = media.slice(1)
 
@@ -91,9 +92,9 @@ export const applyMediaSequenceVars = (FACTORY, media, options = {}) => {
   for (const key in sequence) {
     const item = sequence[key]
 
-    const value = (FACTORY.type === TIMING.type
-      ? sequence[key].val
-      : scales[key]
+    const value = (isScalingUnit(unit)
+      ? scales[key]
+      : sequence[key].val
     ) + unit
 
     if (!query && CONFIG.verbose) console.warn('Can\'t find query ', query)
@@ -104,6 +105,4 @@ export const applyMediaSequenceVars = (FACTORY, media, options = {}) => {
     underMediaQuery[item.variable] = `var(${item.variable + '_' + mediaName})`
     CSS_VARS[item.variable + '_' + mediaName] = value
   }
-
-  console.log(CSS_VARS)
 }