cssstyle 5.2.1 → 5.3.0

package/lib/properties/backgroundOrigin.js

@@ -2,21 +2,35 @@
 
 const parsers = require("../parsers");
 
-module.exports.parse = function parse(v) {
+const property = "background-origin";
+const shorthand = "background";
+
+module.exports.parse = function parse(v, opt = {}) {
+  const { globalObject } = opt;
   if (v === "") {
     return v;
   }
-  const values = parsers.splitValue(v, {
-    delimiter: ","
-  });
-  const keywords = ["border-box", "padding-box", "content-box"];
+  const values = parsers.splitValue(v, { delimiter: "," });
   const parsedValues = [];
-  for (const value of values) {
-    const parsedValue = parsers.parseKeyword(value, keywords);
-    if (parsedValue) {
-      parsedValues.push(parsedValue);
-    } else {
-      return;
+  for (const val of values) {
+    const value = parsers.parsePropertyValue(property, val, {
+      globalObject,
+      inArray: true
+    });
+    if (Array.isArray(value) && value.length === 1) {
+      const [{ name, type }] = value;
+      switch (type) {
+        case "GlobalKeyword":
+        case "Identifier": {
+          parsedValues.push(name);
+          break;
+        }
+        default: {
+          return;
+        }
+      }
+    } else if (typeof value === "string") {
+      parsedValues.push(value);
     }
   }
   if (parsedValues.length) {
@@ -24,25 +38,26 @@ module.exports.parse = function parse(v) {
   }
 };
 
-module.exports.isValid = function isValid(v) {
-  if (v === "") {
-    return true;
-  }
-  return typeof module.exports.parse(v) === "string";
-};
-
 module.exports.definition = {
   set(v) {
     v = parsers.prepareValue(v, this._global);
     if (parsers.hasVarFunc(v)) {
-      this._setProperty("background", "");
-      this._setProperty("background-origin", v);
+      this._setProperty(shorthand, "");
+      this._setProperty(property, v);
     } else {
-      this._setProperty("background-origin", module.exports.parse(v));
+      const val = module.exports.parse(v, {
+        globalObject: this._global
+      });
+      if (typeof val === "string") {
+        const shorthandPriority = this._priorities.get(shorthand);
+        const prior = this._priorities.get(property) ?? "";
+        const priority = shorthandPriority && prior ? "" : prior;
+        this._setProperty(property, val, priority);
+      }
     }
   },
   get() {
-    return this.getPropertyValue("background-origin");
+    return this.getPropertyValue(property);
   },
   enumerable: true,
   configurable: true

package/lib/properties/backgroundPosition.js

@@ -2,148 +2,164 @@
 
 const parsers = require("../parsers");
 
-module.exports.parse = function parse(v) {
+const property = "background-position";
+const shorthand = "background";
+const keyX = ["left", "right"];
+const keyY = ["top", "bottom"];
+const keywordsX = ["center", ...keyX];
+const keywordsY = ["center", ...keyY];
+const keywords = ["center", ...keyX, ...keyY];
+
+module.exports.parse = function parse(v, opt = {}) {
+  const { globalObject } = opt;
   if (v === "") {
     return v;
   }
   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;
-    }
-    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`;
+  for (const val of values) {
+    const value = parsers.parsePropertyValue(property, val, {
+      globalObject,
+      inArray: true
+    });
+    if (Array.isArray(value) && value.length) {
+      let parsedValue = "";
+      switch (value.length) {
+        case 1: {
+          const [part1] = value;
+          const val1 =
+            part1.type === "Identifier" ? part1.name : parsers.parseLengthPercentage([part1]);
+          if (val1) {
+            if (val1 === "center") {
+              parsedValue = `${val1} ${val1}`;
+            } else if (val1 === "top" || val1 === "bottom") {
+              parsedValue = `center ${val1}`;
+            } else {
+              parsedValue = `${val1} center`;
+            }
           }
+          break;
         }
-        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)) {
+        case 2: {
+          const [part1, part2] = value;
+          const val1 =
+            part1.type === "Identifier" ? part1.name : parsers.parseLengthPercentage([part1]);
+          const val2 =
+            part2.type === "Identifier" ? part2.name : parsers.parseLengthPercentage([part2]);
+          if (val1 && val2) {
+            if (keywordsX.includes(val1) && keywordsY.includes(val2)) {
               parsedValue = `${val1} ${val2}`;
-            }
-          } else if (keywordsY.includes(val2)) {
-            if (!keywordsY.includes(val1)) {
+            } else 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}`;
             }
-          } else if (!keywordsY.includes(val1) && !keywordsX.includes(val2)) {
-            parsedValue = `${val1} ${val2}`;
           }
+          break;
         }
-        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;
+        case 3: {
+          const [part1, part2, part3] = value;
+          const val1 = part1.type === "Identifier" && part1.name;
+          const val2 =
+            part2.type === "Identifier" ? part2.name : parsers.parseLengthPercentage([part2]);
+          const val3 =
+            part3.type === "Identifier" ? part3.name : parsers.parseLengthPercentage([part3]);
+          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 (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;
+                }
               }
             }
-          } 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}`;
               }
             }
           }
-          if (posX && posY) {
-            if (offX) {
-              parsedValue = `${posX} ${offX} ${posY}`;
-            } else if (offY) {
-              parsedValue = `${posX} ${posY} ${offY}`;
+          break;
+        }
+        case 4: {
+          const [part1, part2, part3, part4] = value;
+          const val1 = part1.type === "Identifier" && part1.name;
+          const val2 = parsers.parseLengthPercentage([part2]);
+          const val3 = part3.type === "Identifier" && part3.name;
+          const val4 = parsers.parseLengthPercentage([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}`;
             }
           }
+          break;
         }
-        break;
+        default:
       }
-      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 (parsedValue) {
-      parsedValues.push(parsedValue);
-    } else {
-      return;
+    } else if (typeof value === "string") {
+      parsedValues.push(value);
     }
   }
   if (parsedValues.length) {
@@ -151,25 +167,26 @@ module.exports.parse = function parse(v) {
   }
 };
 
-module.exports.isValid = function isValid(v) {
-  if (v === "") {
-    return true;
-  }
-  return typeof module.exports.parse(v) === "string";
-};
-
 module.exports.definition = {
   set(v) {
     v = parsers.prepareValue(v, this._global);
     if (parsers.hasVarFunc(v)) {
-      this._setProperty("background", "");
-      this._setProperty("background-position", v);
+      this._setProperty(shorthand, "");
+      this._setProperty(property, v);
     } else {
-      this._setProperty("background-position", module.exports.parse(v));
+      const val = module.exports.parse(v, {
+        globalObject: this._global
+      });
+      if (typeof val === "string") {
+        const shorthandPriority = this._priorities.get(shorthand);
+        const prior = this._priorities.get(property) ?? "";
+        const priority = shorthandPriority && prior ? "" : prior;
+        this._setProperty(property, val, priority);
+      }
     }
   },
   get() {
-    return this.getPropertyValue("background-position");
+    return this.getPropertyValue(property);
   },
   enumerable: true,
   configurable: true

package/lib/properties/backgroundRepeat.js

@@ -2,54 +2,60 @@
 
 const parsers = require("../parsers");
 
-module.exports.parse = function parse(v) {
+const property = "background-repeat";
+const shorthand = "background";
+
+module.exports.parse = function parse(v, opt = {}) {
+  const { globalObject } = opt;
   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) {
+  for (const val of values) {
+    const value = parsers.parsePropertyValue(property, val, {
+      globalObject,
+      inArray: true
+    });
+    if (Array.isArray(value) && value.length) {
+      let parsedValue = "";
+      switch (value.length) {
+        case 1: {
+          const [part1] = value;
+          const val1 = part1.type === "Identifier" && part1.name;
+          if (val1) {
             parsedValue = val1;
-          } else {
-            parsedValue = `${val1} ${val2}`;
           }
+          break;
         }
+        case 2: {
+          const [part1, part2] = value;
+          const val1 = part1.type === "Identifier" && part1.name;
+          const val2 = part2.type === "Identifier" && part2.name;
+          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}`;
+            }
+          }
+          break;
+        }
+        default:
       }
-    }
-    if (parsedValue) {
-      parsedValues.push(parsedValue);
-    } else {
-      return;
+      if (parsedValue) {
+        parsedValues.push(parsedValue);
+      } else {
+        return;
+      }
+    } else if (typeof value === "string") {
+      parsedValues.push(value);
     }
   }
   if (parsedValues.length) {
@@ -57,25 +63,26 @@ module.exports.parse = function parse(v) {
   }
 };
 
-module.exports.isValid = function isValid(v) {
-  if (v === "") {
-    return true;
-  }
-  return typeof module.exports.parse(v) === "string";
-};
-
 module.exports.definition = {
   set(v) {
     v = parsers.prepareValue(v, this._global);
     if (parsers.hasVarFunc(v)) {
-      this._setProperty("background", "");
-      this._setProperty("background-repeat", v);
+      this._setProperty(shorthand, "");
+      this._setProperty(property, v);
     } else {
-      this._setProperty("background-repeat", module.exports.parse(v));
+      const val = module.exports.parse(v, {
+        globalObject: this._global
+      });
+      if (typeof val === "string") {
+        const shorthandPriority = this._priorities.get(shorthand);
+        const prior = this._priorities.get(property) ?? "";
+        const priority = shorthandPriority && prior ? "" : prior;
+        this._setProperty(property, val, priority);
+      }
     }
   },
   get() {
-    return this.getPropertyValue("background-repeat");
+    return this.getPropertyValue(property);
   },
   enumerable: true,
   configurable: true