cssstyle - npm Package Compare versions

Comparing version 4.6.0 to 5.0.0

lib/CSSStyleDeclaration.js

@@ -8,2 +8,3 @@ /**
 const allExtraProperties = require("./allExtraProperties");
+const { shorthandProperties } = require("./shorthandProperties");
 const allProperties = require("./generated/allProperties");
@@ -125,3 +126,3 @@ const implementedProperties = require("./generated/implementedProperties");
     }
-    const properties = [];
+    const properties = new Map();
     for (let i = 0; i < this._length; i++) {
@@ -132,8 +133,16 @@ const property = this[i];
       if (priority === "important") {
-        properties.push(`${property}: ${value} !${priority};`);
+        properties.set(property, `${property}: ${value} !${priority};`);
       } else {
-        properties.push(`${property}: ${value};`);
+        if (shorthandProperties.has(property)) {
+          const longhandProperties = shorthandProperties.get(property);
+          for (const [longhandProperty] of longhandProperties) {
+            if (properties.has(longhandProperty) && !this.getPropertyPriority(longhandProperty)) {
+              properties.delete(longhandProperty);
+            }
+          }
+        }
+        properties.set(property, `${property}: ${value};`);
       }
     }
-    return properties.join(" ");
+    return [...properties.values()].join(" ");
   }
@@ -279,3 +288,3 @@
     if (isCustomProperty) {
-      this._setProperty(property, value);
+      this._setProperty(property, value, priority);
       return;
@@ -282,0 +291,0 @@ }

lib/generated/implementedProperties.js

 "use strict";
-// autogenerated - 2025-06-25
+// autogenerated - 2025-07-14
 // https://www.w3.org/Style/CSS/all-properties.en.html
 
 module.exports = new Set([
+  "-webkit-border-after-color",
+  "-webkit-border-before-color",
+  "-webkit-border-end-color",
+  "-webkit-border-start-color",
+  "-webkit-column-rule-color",
+  "-webkit-tap-highlight-color",
+  "-webkit-text-emphasis-color",
+  "-webkit-text-fill-color",
+  "-webkit-text-stroke-color",
   "background",
   "background-attachment",
+  "background-clip",
   "background-color",
   "background-image",
+  "background-origin",
   "background-position",
   "background-repeat",
+  "background-size",
   "border",
@@ -69,12 +81,3 @@ "border-bottom",
   "top",
-  "-webkit-border-after-color",
-  "-webkit-border-before-color",
-  "-webkit-border-end-color",
-  "-webkit-border-start-color",
-  "-webkit-column-rule-color",
-  "-webkit-tap-highlight-color",
-  "-webkit-text-emphasis-color",
-  "-webkit-text-fill-color",
-  "-webkit-text-stroke-color",
   "width"
 ]);

lib/parsers.js

@@ -86,2 +86,3 @@ /**
   /^(?:a?(?:cos|sin|tan)|abs|atan2|calc|clamp|exp|hypot|log|max|min|mod|pow|rem|round|sign|sqrt)\(/;
+const gradientRegEx = /^(?:repeating-)?(?:conic|linear|radial)-gradient\(/;
 const functionRegEx = /^([a-z][a-z\d]*(?:-[a-z\d]+)*)\(/i;
@@ -433,3 +434,3 @@
   }
-  if (varRegEx.test(val)) {
+  if (gradientRegEx.test(val) && varRegEx.test(val)) {
     return val;
@@ -440,26 +441,7 @@ }
   }
-  const values = splitValue(val, {
-    delimiter: ",",
-    preserveComment: varContainedRegEx.test(val)
-  });
-  let isImage = Boolean(values.length);
-  for (let i = 0; i < values.length; i++) {
-    const image = values[i];
-    if (image === "") {
-      return "";
-    }
-    if (isGradient(image) || /^(?:none|inherit)$/i.test(image)) {
-      continue;
-    }
-    const imageUrl = exports.parseUrl(image);
-    if (imageUrl) {
-      values[i] = imageUrl;
-    } else {
-      isImage = false;
-      break;
-    }
+  // FIXME: need to resolve color values within gradients
+  if (isGradient(val)) {
+    return val;
   }
-  if (isImage) {
-    return values.join(", ");
-  }
+  return exports.parseUrl(val);
 };
@@ -466,0 +448,0 @@

lib/properties/background.js

 "use strict";
-// FIXME:
-// * support multiple backgrounds
-// * also fix longhands
 
 const parsers = require("../parsers");
-const strings = require("../utils/strings");
 const backgroundImage = require("./backgroundImage");
 const backgroundPosition = require("./backgroundPosition");
+const backgroundSize = require("./backgroundSize");
 const backgroundRepeat = require("./backgroundRepeat");
+const backgroundOrigin = require("./backgroundOrigin");
+const backgroundClip = require("./backgroundClip");
 const backgroundAttachment = require("./backgroundAttachment");
 const backgroundColor = require("./backgroundColor");
 
-const shorthandFor = new Map([
+module.exports.shorthandFor = new Map([
   ["background-image", backgroundImage],
   ["background-position", backgroundPosition],
+  ["background-size", backgroundSize],
   ["background-repeat", backgroundRepeat],
+  ["background-origin", backgroundOrigin],
+  ["background-clip", backgroundClip],
   ["background-attachment", backgroundAttachment],
@@ -22,29 +24,358 @@ ["background-color", backgroundColor]
 
+const initialValues = new Map([
+  ["background-image", "none"],
+  ["background-position", "0% 0%"],
+  ["background-size", "auto"],
+  ["background-repeat", "repeat"],
+  ["background-origin", "padding-box"],
+  ["background-clip", "border-box"],
+  ["background-attachment", "scroll"],
+  ["background-color", "transparent"]
+]);
+
+module.exports.parse = function parse(v) {
+  const values = parsers.splitValue(v, {
+    delimiter: ","
+  });
+  const bgValues = [];
+  const l = values.length;
+  for (let i = 0; i < l; i++) {
+    let bg = {
+      "background-image": initialValues.get("background-image"),
+      "background-position": initialValues.get("background-position"),
+      "background-size": initialValues.get("background-size"),
+      "background-repeat": initialValues.get("background-repeat"),
+      "background-origin": initialValues.get("background-origin"),
+      "background-clip": initialValues.get("background-clip"),
+      "background-attachment": initialValues.get("background-attachment"),
+      "background-color": initialValues.get("background-color")
+    };
+    if (l > 1 && i !== l - 1) {
+      bg = {
+        "background-image": initialValues.get("background-image"),
+        "background-position": initialValues.get("background-position"),
+        "background-size": initialValues.get("background-size"),
+        "background-repeat": initialValues.get("background-repeat"),
+        "background-origin": initialValues.get("background-origin"),
+        "background-clip": initialValues.get("background-clip"),
+        "background-attachment": initialValues.get("background-attachment")
+      };
+    }
+    const bgPosition = [];
+    const bgSize = [];
+    const bgRepeat = [];
+    const bgBox = [];
+    const bgParts = parsers.splitValue(values[i], {
+      delimiter: "/"
+    });
+    if (!bgParts.length || bgParts.length > 2) {
+      return;
+    }
+    const [bgPart1, bgPart2 = ""] = bgParts;
+    const parts1 = parsers.splitValue(bgPart1);
+    for (const part of parts1) {
+      let partValid = false;
+      for (const [property, value] of module.exports.shorthandFor) {
+        if (value.isValid(part)) {
+          partValid = true;
+          switch (property) {
+            case "background-clip":
+            case "background-origin": {
+              const parsedValue = value.parse(part);
+              if (parsedValue) {
+                bgBox.push(parsedValue);
+              }
+              break;
+            }
+            case "background-color": {
+              if (i !== values.length - 1) {
+                return;
+              }
+              const parsedValue = value.parse(part);
+              if (parsedValue) {
+                bg[property] = parsedValue;
+              }
+              break;
+            }
+            case "background-position": {
+              const parsedValue = value.parse(part);
+              if (parsedValue) {
+                bgPosition.push(parsedValue);
+              }
+              break;
+            }
+            case "background-repeat": {
+              const parsedValue = value.parse(part);
+              if (parsedValue) {
+                bgRepeat.push(parsedValue);
+              }
+              break;
+            }
+            case "background-size": {
+              break;
+            }
+            default: {
+              const parsedValue = value.parse(part);
+              if (parsedValue) {
+                bg[property] = parsedValue;
+              }
+            }
+          }
+        }
+      }
+      if (!partValid) {
+        return;
+      }
+    }
+    if (bgPart2) {
+      const parts2 = parsers.splitValue(bgPart2);
+      for (const part of parts2) {
+        let partValid = false;
+        for (const [property, value] of module.exports.shorthandFor) {
+          if (value.isValid(part)) {
+            partValid = true;
+            switch (property) {
+              case "background-clip":
+              case "background-origin": {
+                const parsedValue = value.parse(part);
+                if (parsedValue) {
+                  bgBox.push(parsedValue);
+                }
+                break;
+              }
+              case "background-color": {
+                if (i !== l - 1) {
+                  return;
+                }
+                const parsedValue = value.parse(part);
+                if (parsedValue) {
+                  bg[property] = parsedValue;
+                }
+                break;
+              }
+              case "background-position": {
+                break;
+              }
+              case "background-repeat": {
+                const parsedValue = value.parse(part);
+                if (parsedValue) {
+                  bgRepeat.push(parsedValue);
+                }
+                break;
+              }
+              case "background-size": {
+                const parsedValue = value.parse(part);
+                if (parsedValue) {
+                  bgSize.push(parsedValue);
+                }
+                break;
+              }
+              default: {
+                const parsedValue = value.parse(part);
+                if (parsedValue) {
+                  bg[property] = parsedValue;
+                }
+              }
+            }
+          }
+        }
+        if (!partValid) {
+          return;
+        }
+      }
+    }
+    if (bgPosition.length) {
+      const { parse: parser } = module.exports.shorthandFor.get("background-position");
+      const value = parser(bgPosition.join(" "));
+      if (value) {
+        bg["background-position"] = value;
+      }
+    }
+    if (bgSize.length) {
+      const { parse: parser } = module.exports.shorthandFor.get("background-size");
+      const value = parser(bgSize.join(" "));
+      if (value) {
+        bg["background-size"] = value;
+      }
+    }
+    if (bgRepeat.length) {
+      const { parse: parser } = module.exports.shorthandFor.get("background-repeat");
+      const value = parser(bgRepeat.join(" "));
+      if (value) {
+        bg["background-repeat"] = value;
+      }
+    }
+    if (bgBox.length) {
+      switch (bgBox.length) {
+        case 1: {
+          const [value] = bgBox;
+          bg["background-origin"] = value;
+          bg["background-clip"] = value;
+          break;
+        }
+        case 2: {
+          const [value1, value2] = bgBox;
+          bg["background-origin"] = value1;
+          bg["background-clip"] = value2;
+          break;
+        }
+        default: {
+          return;
+        }
+      }
+    }
+    bgValues.push(bg);
+  }
+  return bgValues;
+};
+
 module.exports.definition = {
   set(v) {
     v = parsers.prepareValue(v, this._global);
-    if (/^none$/i.test(v)) {
-      for (const [key] of shorthandFor) {
+    if (v === "" || parsers.hasVarFunc(v)) {
+      for (const [key] of module.exports.shorthandFor) {
         this._setProperty(key, "");
       }
-      this._setProperty("background", strings.asciiLowercase(v));
-    } else if (parsers.hasVarFunc(v)) {
-      for (const [key] of shorthandFor) {
-        this._setProperty(key, "");
-      }
       this._setProperty("background", v);
     } else {
-      this._shorthandSetter("background", v, shorthandFor);
+      const bgValues = module.exports.parse(v);
+      if (!Array.isArray(bgValues)) {
+        return;
+      }
+      const bgMap = new Map([
+        ["background-image", []],
+        ["background-position", []],
+        ["background-size", []],
+        ["background-repeat", []],
+        ["background-origin", []],
+        ["background-clip", []],
+        ["background-attachment", []],
+        ["background-color", []]
+      ]);
+      const backgrounds = [];
+      for (const bgValue of bgValues) {
+        const bg = [];
+        for (const [property, value] of Object.entries(bgValue)) {
+          if (value) {
+            const arr = bgMap.get(property);
+            arr.push(value);
+            bgMap.set(property, arr);
+            if (value !== initialValues.get(property)) {
+              if (property === "background-size") {
+                bg.push(`/ ${value}`);
+              } else {
+                bg.push(value);
+              }
+            } else if (property === "background-image") {
+              if (v === "none") {
+                bg.push(value);
+              }
+            } else if (property === "background-color") {
+              if (v === "transparent") {
+                bg.push(value);
+              }
+            }
+          }
+        }
+        backgrounds.push(bg.join(" "));
+      }
+      for (const [property, value] of bgMap) {
+        this._setProperty(property, value.join(", "));
+      }
+      this._setProperty("background", backgrounds.join(", "));
     }
   },
   get() {
-    let val = this.getPropertyValue("background");
-    if (parsers.hasVarFunc(val)) {
-      return val;
+    const v = this.getPropertyValue("background");
+    if (parsers.hasVarFunc(v)) {
+      return v;
     }
-    val = this._shorthandGetter("background", shorthandFor);
-    if (parsers.hasVarFunc(val)) {
+    const bgMap = new Map();
+    let l = 0;
+    for (const [property] of module.exports.shorthandFor) {
+      const val = this.getPropertyValue(property);
+      if (property === "background-image") {
+        if (
+          val === "none" &&
+          v === "none" &&
+          this.getPropertyValue("background-color") === "transparent"
+        ) {
+          return val;
+        }
+        if (val !== initialValues.get(property)) {
+          const imgValues = parsers.splitValue(val, {
+            delimiter: ","
+          });
+          l = imgValues.length;
+          bgMap.set(property, imgValues);
+        }
+      } else if (property === "background-color") {
+        if (val !== initialValues.get(property) || v.includes(val)) {
+          bgMap.set(property, [val]);
+        }
+      } else if (val !== initialValues.get(property)) {
+        bgMap.set(
+          property,
+          parsers.splitValue(val, {
+            delimiter: ","
+          })
+        );
+      }
+    }
+    if (l === 0) {
+      const [background] = bgMap.get("background-color");
+      if (background) {
+        return background;
+      }
       return "";
     }
-    return val;
+    const bgValues = [];
+    for (let i = 0; i < l; i++) {
+      bgValues[i] = [];
+    }
+    for (const [property, values] of bgMap) {
+      for (let i = 0; i < l; i++) {
+        switch (property) {
+          case "background-color": {
+            if (i === l - 1) {
+              const value = values[0];
+              if (parsers.hasVarFunc(value)) {
+                return "";
+              }
+              if (value && value !== initialValues.get(property)) {
+                const bgValue = bgValues[i];
+                bgValue.push(value);
+              }
+            }
+            break;
+          }
+          case "background-size": {
+            const value = values[i];
+            if (parsers.hasVarFunc(value)) {
+              return "";
+            }
+            if (value && value !== initialValues.get(property)) {
+              const bgValue = bgValues[i];
+              bgValue.push(`/ ${value}`);
+            }
+            break;
+          }
+          default: {
+            const value = values[i];
+            if (parsers.hasVarFunc(value)) {
+              return "";
+            }
+            if (value && value !== initialValues.get(property)) {
+              const bgValue = bgValues[i];
+              bgValue.push(value);
+            }
+          }
+        }
+      }
+    }
+    const backgrounds = [];
+    for (const bgValue of bgValues) {
+      backgrounds.push(bgValue.join(" "));
+    }
+    return backgrounds.join(", ");
   },
@@ -51,0 +382,0 @@ enumerable: true,

lib/properties/backgroundAttachment.js

@@ -6,4 +6,21 @@ "use strict";
 module.exports.parse = function parse(v) {
+  if (v === "") {
+    return v;
+  }
+  const values = parsers.splitValue(v, {
+    delimiter: ","
+  });
   const keywords = ["fixed", "scroll", "local"];
-  return parsers.parseKeyword(v, keywords);
+  const parsedValues = [];
+  for (const value of values) {
+    const parsedValue = parsers.parseKeyword(value, keywords);
+    if (parsedValue) {
+      parsedValues.push(parsedValue);
+    } else {
+      return;
+    }
+  }
+  if (parsedValues.length) {
+    return parsedValues.join(", ");
+  }
 };
@@ -10,0 +27,0 @@

lib/properties/backgroundImage.js

@@ -6,7 +6,24 @@ "use strict";
 module.exports.parse = function parse(v) {
-  return parsers.parseImage(v);
+  if (v === "") {
+    return v;
+  }
+  const values = parsers.splitValue(v, {
+    delimiter: ","
+  });
+  const parsedValues = [];
+  for (const value of values) {
+    const parsedValue = parsers.parseImage(value);
+    if (parsedValue) {
+      parsedValues.push(parsedValue);
+    } else {
+      return;
+    }
+  }
+  if (parsedValues.length) {
+    return parsedValues.join(", ");
+  }
 };
 
 module.exports.isValid = function isValid(v) {
-  if (v === "" || typeof parsers.parseKeyword(v, ["none"]) === "string") {
+  if (v === "") {
     return true;
@@ -13,0 +30,0 @@ }

lib/properties/backgroundPosition.js

@@ -6,24 +6,148 @@ "use strict";
 module.exports.parse = function parse(v) {
-  const parts = parsers.splitValue(v);
-  if (!parts.length || parts.length > 2) {
-    return;
+  if (v === "") {
+    return v;
   }
-  const validKeywordsX = ["left", "center", "right"];
-  const validKeywordsY = ["top", "center", "bottom"];
-  if (parts.length === 1) {
-    const dim = parsers.parseMeasurement(parts[0]);
-    if (dim) {
-      return dim;
+  const values = parsers.splitValue(v, {
+    delimiter: ","
+  });
+  const keyX = ["left", "right"];
+  const keyY = ["top", "bottom"];
+  const keywordsX = ["center", ...keyX];
+  const keywordsY = ["center", ...keyY];
+  const keywords = ["center", ...keyX, ...keyY];
+  const parsedValues = [];
+  for (const value of values) {
+    const parts = parsers.splitValue(value);
+    if (!parts.length || parts.length > 4) {
+      return;
     }
-    const validKeywords = new Set([...validKeywordsX, ...validKeywordsY]);
-    return parsers.parseKeyword(v, [...validKeywords]);
-  }
-  const [partX, partY] = parts;
-  const posX = parsers.parseMeasurement(partX) || parsers.parseKeyword(partX, validKeywordsX);
-  if (posX) {
-    const posY = parsers.parseMeasurement(partY) || parsers.parseKeyword(partY, validKeywordsY);
-    if (posY) {
-      return `${posX} ${posY}`;
+    let parsedValue = "";
+    switch (parts.length) {
+      case 1: {
+        const [part] = parts;
+        const val = parsers.parseMeasurement(part) || parsers.parseKeyword(part, keywords);
+        if (val) {
+          if (val === "center") {
+            parsedValue = `${val} ${val}`;
+          } else if (val === "top" || val === "bottom") {
+            parsedValue = `center ${val}`;
+          } else {
+            parsedValue = `${val} center`;
+          }
+        }
+        break;
+      }
+      case 2: {
+        const [part1, part2] = parts;
+        const val1 = parsers.parseMeasurement(part1) || parsers.parseKeyword(part1, keywords);
+        const val2 = parsers.parseMeasurement(part2) || parsers.parseKeyword(part2, keywords);
+        if (val1 && val2) {
+          if (keywordsY.includes(val1) && keywordsX.includes(val2)) {
+            parsedValue = `${val2} ${val1}`;
+          } else if (keywordsX.includes(val1)) {
+            if (val2 === "center" || !keywordsX.includes(val2)) {
+              parsedValue = `${val1} ${val2}`;
+            }
+          } else if (keywordsY.includes(val2)) {
+            if (!keywordsY.includes(val1)) {
+              parsedValue = `${val1} ${val2}`;
+            }
+          } else if (!keywordsY.includes(val1) && !keywordsX.includes(val2)) {
+            parsedValue = `${val1} ${val2}`;
+          }
+        }
+        break;
+      }
+      case 3: {
+        const [part1, part2, part3] = parts;
+        const val1 = parsers.parseKeyword(part1, keywords);
+        const val2 = parsers.parseMeasurement(part2) || parsers.parseKeyword(part2, keywords);
+        const val3 = parsers.parseMeasurement(part3) || parsers.parseKeyword(part3, keywords);
+        if (val1 && val2 && val3) {
+          let posX = "";
+          let offX = "";
+          let posY = "";
+          let offY = "";
+          if (keywordsX.includes(val1)) {
+            if (keyY.includes(val2)) {
+              if (!keywords.includes(val3)) {
+                posX = val1;
+                posY = val2;
+                offY = val3;
+              }
+            } else if (keyY.includes(val3)) {
+              if (!keywords.includes(val2)) {
+                posX = val1;
+                offX = val2;
+                posY = val3;
+              }
+            }
+          } else if (keywordsY.includes(val1)) {
+            if (keyX.includes(val2)) {
+              if (!keywords.includes(val3)) {
+                posX = val2;
+                offX = val3;
+                posY = val1;
+              }
+            } else if (keyX.includes(val3)) {
+              if (!keywords.includes(val2)) {
+                posX = val3;
+                posY = val1;
+                offY = val2;
+              }
+            }
+          }
+          if (posX && posY) {
+            if (offX) {
+              parsedValue = `${posX} ${offX} ${posY}`;
+            } else if (offY) {
+              parsedValue = `${posX} ${posY} ${offY}`;
+            }
+          }
+        }
+        break;
+      }
+      case 4:
+      default: {
+        const [part1, part2, part3, part4] = parts;
+        const val1 = parsers.parseKeyword(part1, keywords);
+        const val2 = parsers.parseMeasurement(part2);
+        const val3 = parsers.parseKeyword(part3, keywords);
+        const val4 = parsers.parseMeasurement(part4);
+        if (val1 && val2 && val3 && val4) {
+          let posX = "";
+          let offX = "";
+          let posY = "";
+          let offY = "";
+          if (keywordsX.includes(val1) && keyY.includes(val3)) {
+            posX = val1;
+            offX = val2;
+            posY = val3;
+            offY = val4;
+          } else if (keyX.includes(val1) && keywordsY.includes(val3)) {
+            posX = val1;
+            offX = val2;
+            posY = val3;
+            offY = val4;
+          } else if (keyY.includes(val1) && keywordsX.includes(val3)) {
+            posX = val3;
+            offX = val4;
+            posY = val1;
+            offY = val2;
+          }
+          if (posX && offX && posY && offY) {
+            parsedValue = `${posX} ${offX} ${posY} ${offY}`;
+          }
+        }
+      }
     }
+    if (parsedValue) {
+      parsedValues.push(parsedValue);
+    } else {
+      return;
+    }
   }
+  if (parsedValues.length) {
+    return parsedValues.join(", ");
+  }
 };
@@ -30,0 +154,0 @@

lib/properties/backgroundRepeat.js

@@ -6,4 +6,54 @@ "use strict";
 module.exports.parse = function parse(v) {
-  const keywords = ["repeat", "repeat-x", "repeat-y", "no-repeat", "space", "round"];
-  return parsers.parseKeyword(v, keywords);
+  if (v === "") {
+    return v;
+  }
+  const values = parsers.splitValue(v, {
+    delimiter: ","
+  });
+  const keywordsAxis = ["repeat-x", "repeat-y"];
+  const keywordsRepeat = ["repeat", "no-repeat", "space", "round"];
+  const keywords = [...keywordsAxis, ...keywordsRepeat];
+  const parsedValues = [];
+  for (const value of values) {
+    const parts = parsers.splitValue(value);
+    if (!parts.length || parts.length > 2) {
+      return;
+    }
+    let parsedValue = "";
+    switch (parts.length) {
+      case 1: {
+        const [part] = parts;
+        const val = parsers.parseKeyword(part, keywords);
+        if (val) {
+          parsedValue = val;
+        }
+        break;
+      }
+      case 2:
+      default: {
+        const [part1, part2] = parts;
+        const val1 = parsers.parseKeyword(part1, keywordsRepeat);
+        const val2 = parsers.parseKeyword(part2, keywordsRepeat);
+        if (val1 && val2) {
+          if (val1 === "repeat" && val2 === "no-repeat") {
+            parsedValue = "repeat-x";
+          } else if (val1 === "no-repeat" && val2 === "repeat") {
+            parsedValue = "repeat-y";
+          } else if (val1 === val2) {
+            parsedValue = val1;
+          } else {
+            parsedValue = `${val1} ${val2}`;
+          }
+        }
+      }
+    }
+    if (parsedValue) {
+      parsedValues.push(parsedValue);
+    } else {
+      return;
+    }
+  }
+  if (parsedValues.length) {
+    return parsedValues.join(", ");
+  }
 };
@@ -10,0 +60,0 @@

lib/properties/border.js

@@ -8,3 +8,3 @@ "use strict";
 
-const shorthandFor = new Map([
+module.exports.shorthandFor = new Map([
   ["border-width", borderWidth],
@@ -22,3 +22,3 @@ ["border-style", borderStyle],
     if (parsers.hasVarFunc(v)) {
-      for (const [key] of shorthandFor) {
+      for (const [key] of module.exports.shorthandFor) {
         this._setProperty(key, "");
@@ -28,3 +28,8 @@ }
     } else {
-      this._midShorthandSetter("border", v, shorthandFor, ["top", "right", "bottom", "left"]);
+      this._midShorthandSetter("border", v, module.exports.shorthandFor, [
+        "top",
+        "right",
+        "bottom",
+        "left"
+      ]);
     }
@@ -37,3 +42,3 @@ },
     }
-    val = this._shorthandGetter("border", shorthandFor);
+    val = this._shorthandGetter("border", module.exports.shorthandFor);
     if (parsers.hasVarFunc(val)) {
@@ -40,0 +45,0 @@ return "";

lib/properties/borderBottom.js

@@ -8,3 +8,3 @@ "use strict";
 
-const shorthandFor = new Map([
+module.exports.shorthandFor = new Map([
   ["border-bottom-width", borderTopWidth],
@@ -19,3 +19,3 @@ ["border-bottom-style", borderTopStyle],
     if (parsers.hasVarFunc(v)) {
-      for (const [key] of shorthandFor) {
+      for (const [key] of module.exports.shorthandFor) {
         this._setProperty(key, "");
@@ -26,3 +26,3 @@ }
     } else {
-      this._shorthandSetter("border-bottom", v, shorthandFor);
+      this._shorthandSetter("border-bottom", v, module.exports.shorthandFor);
     }
@@ -35,3 +35,3 @@ },
     }
-    val = this._shorthandGetter("border-bottom", shorthandFor);
+    val = this._shorthandGetter("border-bottom", module.exports.shorthandFor);
     if (parsers.hasVarFunc(val)) {
@@ -38,0 +38,0 @@ return "";

lib/properties/borderLeft.js

@@ -8,3 +8,3 @@ "use strict";
 
-const shorthandFor = new Map([
+module.exports.shorthandFor = new Map([
   ["border-left-width", borderTopWidth],
@@ -19,3 +19,3 @@ ["border-left-style", borderTopStyle],
     if (parsers.hasVarFunc(v)) {
-      for (const [key] of shorthandFor) {
+      for (const [key] of module.exports.shorthandFor) {
         this._setProperty(key, "");
@@ -26,3 +26,3 @@ }
     } else {
-      this._shorthandSetter("border-left", v, shorthandFor);
+      this._shorthandSetter("border-left", v, module.exports.shorthandFor);
     }
@@ -35,3 +35,3 @@ },
     }
-    val = this._shorthandGetter("border-left", shorthandFor);
+    val = this._shorthandGetter("border-left", module.exports.shorthandFor);
     if (parsers.hasVarFunc(val)) {
@@ -38,0 +38,0 @@ return "";

lib/properties/borderRight.js

@@ -8,3 +8,3 @@ "use strict";
 
-const shorthandFor = new Map([
+module.exports.shorthandFor = new Map([
   ["border-right-width", borderTopWidth],
@@ -19,3 +19,3 @@ ["border-right-style", borderTopStyle],
     if (parsers.hasVarFunc(v)) {
-      for (const [key] of shorthandFor) {
+      for (const [key] of module.exports.shorthandFor) {
         this._setProperty(key, "");
@@ -26,3 +26,3 @@ }
     } else {
-      this._shorthandSetter("border-right", v, shorthandFor);
+      this._shorthandSetter("border-right", v, module.exports.shorthandFor);
     }
@@ -35,3 +35,3 @@ },
     }
-    val = this._shorthandGetter("border-right", shorthandFor);
+    val = this._shorthandGetter("border-right", module.exports.shorthandFor);
     if (parsers.hasVarFunc(val)) {
@@ -38,0 +38,0 @@ return "";

lib/properties/borderTop.js

@@ -8,3 +8,3 @@ "use strict";
 
-const shorthandFor = new Map([
+module.exports.shorthandFor = new Map([
   ["border-top-width", borderTopWidth],
@@ -19,3 +19,3 @@ ["border-top-style", borderTopStyle],
     if (parsers.hasVarFunc(v)) {
-      for (const [key] of shorthandFor) {
+      for (const [key] of module.exports.shorthandFor) {
         this._setProperty(key, "");
@@ -26,3 +26,3 @@ }
     } else {
-      this._shorthandSetter("border-top", v, shorthandFor);
+      this._shorthandSetter("border-top", v, module.exports.shorthandFor);
     }
@@ -35,3 +35,3 @@ },
     }
-    val = this._shorthandGetter("border-top", shorthandFor);
+    val = this._shorthandGetter("border-top", module.exports.shorthandFor);
     if (parsers.hasVarFunc(val)) {
@@ -38,0 +38,0 @@ return "";

lib/properties/flex.js

@@ -8,3 +8,3 @@ "use strict";
 
-const shorthandFor = new Map([
+module.exports.shorthandFor = new Map([
   ["flex-grow", flexGrow],
@@ -29,3 +29,3 @@ ["flex-shrink", flexShrink],
   }
-  const obj = parsers.parseShorthand(v, shorthandFor);
+  const obj = parsers.parseShorthand(v, module.exports.shorthandFor);
   if (obj) {
@@ -56,6 +56,6 @@ const flex = {
     if (parsers.hasVarFunc(v)) {
-      this._shorthandSetter("flex", "", shorthandFor);
+      this._shorthandSetter("flex", "", module.exports.shorthandFor);
       this._setProperty("flex", v);
     } else {
-      this._shorthandSetter("flex", module.exports.parse(v), shorthandFor);
+      this._shorthandSetter("flex", module.exports.parse(v), module.exports.shorthandFor);
     }
@@ -68,3 +68,3 @@ },
     }
-    val = this._shorthandGetter("flex", shorthandFor);
+    val = this._shorthandGetter("flex", module.exports.shorthandFor);
     if (parsers.hasVarFunc(val)) {
@@ -71,0 +71,0 @@ return "";

lib/properties/font.js

@@ -11,3 +11,3 @@ "use strict";
 
-const shorthandFor = new Map([
+module.exports.shorthandFor = new Map([
   ["font-style", fontStyle],
@@ -63,3 +63,3 @@ ["font-variant", fontVariant],
             case "font-size": {
-              const value = shorthandFor.get(property);
+              const value = module.exports.shorthandFor.get(property);
               if (value.isValid(part)) {
@@ -81,4 +81,3 @@ font[property] = value.parse(part);
   } else {
-    // FIXME: Switch to toReversed() when we can drop Node.js 18 support.
-    const revParts = [...parsers.splitValue(fontBlockA.trim())].reverse();
+    const revParts = parsers.splitValue(fontBlockA.trim()).toReversed();
     const revFontFamily = [];
@@ -102,3 +101,3 @@ const properties = ["font-style", "font-variant", "font-weight", "line-height"];
               case "line-height": {
-                const value = shorthandFor.get(property);
+                const value = module.exports.shorthandFor.get(property);
                 if (value.isValid(part)) {
@@ -144,3 +143,3 @@ font[property] = value.parse(part);
     if (v === "" || parsers.hasVarFunc(v)) {
-      for (const [key] of shorthandFor) {
+      for (const [key] of module.exports.shorthandFor) {
         this._setProperty(key, "");
@@ -155,3 +154,3 @@ }
       const str = new Set();
-      for (const [key] of shorthandFor) {
+      for (const [key] of module.exports.shorthandFor) {
         const val = obj[key];
@@ -178,3 +177,3 @@ if (typeof val === "string") {
     const str = new Set();
-    for (const [key] of shorthandFor) {
+    for (const [key] of module.exports.shorthandFor) {
       const v = this.getPropertyValue(key);
@@ -181,0 +180,0 @@ if (parsers.hasVarFunc(v)) {

package.json

@@ -9,3 +9,3 @@ {
   ],
-  "version": "4.6.0",
+  "version": "5.0.0",
   "homepage": "https://github.com/jsdom/cssstyle",
@@ -71,4 +71,4 @@ "maintainers": [
   "engines": {
-    "node": ">=18"
+    "node": ">=20"
   }
 }

No alert changes

Improved metrics

Total package byte prevSize

262114

20.92%

Number of package files

90

4.65%

Lines of code

8935

19.18%

No dependency changes