cssstyle 5.2.0 → 5.3.0

package/lib/properties/backgroundSize.js

@@ -2,52 +2,91 @@
 
 const parsers = require("../parsers");
 
-module.exports.parse = function parse(v) {
+const property = "background-size";
+const shorthand = "background";
+
+module.exports.parse = function parse(v, opt = {}) {
+  const { globalObject } = opt;
   if (v === "") {
     return v;
   }
   const values = parsers.splitValue(v, {
     delimiter: ","
   });
-  const keywordsRatio = ["contain", "cover"];
-  const keywordsRepeat = ["auto"];
-  const keywords = [...keywordsRatio, ...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.parseMeasurement(part, true) || parsers.parseKeyword(part, keywords);
-        if (val) {
-          parsedValue = val;
+  for (const val of values) {
+    const value = parsers.parsePropertyValue(property, val, {
+      globalObject,
+      inArray: true
+    });
+    if (Array.isArray(value) && value.length) {
+      if (value.length === 1) {
+        const [{ isNumber, name, type, value: itemValue }] = value;
+        switch (type) {
+          case "Calc": {
+            if (isNumber) {
+              return;
+            }
+            parsedValues.push(`${name}(${itemValue})`);
+            break;
+          }
+          case "GlobalKeyword":
+          case "Identifier": {
+            parsedValues.push(name);
+            break;
+          }
+          default: {
+            const parsedValue = parsers.parseLengthPercentage(value);
+            if (!parsedValue) {
+              return;
+            }
+            parsedValues.push(parsedValue);
+          }
         }
-        break;
-      }
-      case 2:
-      default: {
-        const [part1, part2] = parts;
-        const val1 =
-          parsers.parseMeasurement(part1, true) || parsers.parseKeyword(part1, keywordsRepeat);
-        const val2 =
-          parsers.parseMeasurement(part2, true) || parsers.parseKeyword(part2, keywordsRepeat);
-        if (val1 && val2) {
-          if (val2 === "auto") {
-            parsedValue = val1;
-          } else {
-            parsedValue = `${val1} ${val2}`;
+      } else {
+        const [val1, val2] = value;
+        const parts = [];
+        if (val1.type === "Calc" && !val1.isNumber) {
+          parts.push(`${val1.name}(${val1.value})`);
+        } else if (val1.type === "Identifier") {
+          parts.push(val1.name);
+        } else if (val1.type === "Dimension") {
+          parts.push(`${val1.value}${val1.unit}`);
+        } else if (val1.type === "Percentage") {
+          parts.push(`${val1.value}%`);
+        } else {
+          return;
+        }
+        switch (val2.type) {
+          case "Calc": {
+            if (val2.isNumber) {
+              return;
+            }
+            parts.push(`${val2.name}(${val2.value})`);
+            break;
+          }
+          case "Dimension": {
+            parts.push(`${val2.value}${val2.unit}`);
+            break;
+          }
+          case "Identifier": {
+            if (val2.name !== "auto") {
+              parts.push(val2.name);
+            }
+            break;
+          }
+          case "Percentage": {
+            parts.push(`${val2.value}%`);
+            break;
+          }
+          default: {
+            return;
           }
         }
+        parsedValues.push(parts.join(" "));
       }
-    }
-    if (parsedValue) {
-      parsedValues.push(parsedValue);
-    } else {
-      return;
+    } else if (typeof value === "string") {
+      parsedValues.push(value);
     }
   }
   if (parsedValues.length) {
@@ -55,25 +94,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-size", v);
+      this._setProperty(shorthand, "");
+      this._setProperty(property, v);
     } else {
-      this._setProperty("background-size", 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-size");
+    return this.getPropertyValue(property);
   },
   enumerable: true,
   configurable: true

package/lib/properties/border.js

@@ -4,6 +4,18 @@ const parsers = require("../parsers");
 const borderWidth = require("./borderWidth");
 const borderStyle = require("./borderStyle");
 const borderColor = require("./borderColor");
+const borderTop = require("./borderTop");
+const borderRight = require("./borderRight");
+const borderBottom = require("./borderBottom");
+const borderLeft = require("./borderLeft");
+
+const property = "border";
+
+module.exports.initialValues = new Map([
+  ["border-width", "medium"],
+  ["border-style", "none"],
+  ["border-color", "currentcolor"]
+]);
 
 module.exports.shorthandFor = new Map([
   ["border-width", borderWidth],
@@ -11,36 +23,141 @@ module.exports.shorthandFor = new Map([
   ["border-color", borderColor]
 ]);
 
+module.exports.positionShorthandFor = new Map([
+  ["border-top", borderTop],
+  ["border-right", borderRight],
+  ["border-bottom", borderBottom],
+  ["border-left", borderLeft]
+]);
+
+module.exports.parse = function parse(v, opt = {}) {
+  const { globalObject } = opt;
+  if (v === "" || parsers.hasVarFunc(v)) {
+    return v;
+  }
+  const values = parsers.splitValue(v);
+  const parsedValues = new Map();
+  for (const val of values) {
+    const value = parsers.parsePropertyValue(property, val, {
+      globalObject,
+      inArray: true
+    });
+    if (Array.isArray(value) && value.length === 1) {
+      const [{ isNumber, name, type, value: itemValue }] = value;
+      switch (type) {
+        case "Calc": {
+          if (isNumber || parsedValues.has("border-width")) {
+            return;
+          }
+          parsedValues.set("border-width", `${name}(${itemValue})`);
+          break;
+        }
+        case "Dimension":
+        case "Number": {
+          if (parsedValues.has("border-width")) {
+            return;
+          }
+          const parsedValue = parsers.parseLength(value, {
+            min: 0
+          });
+          if (!parsedValue) {
+            return;
+          }
+          parsedValues.set("border-width", parsedValue);
+          break;
+        }
+        case "Function": {
+          if (parsedValues.has("border-color")) {
+            return;
+          }
+          const parsedValue = parsers.parseColor(value);
+          if (!parsedValue) {
+            return;
+          }
+          parsedValues.set("border-color", parsedValue);
+          break;
+        }
+        case "GlobalKeyword": {
+          return name;
+        }
+        case "Hash": {
+          if (parsedValues.has("border-color")) {
+            return;
+          }
+          const parsedValue = parsers.parseColor(`#${itemValue}`);
+          if (!parsedValue) {
+            return;
+          }
+          parsedValues.set("border-color", parsedValue);
+          break;
+        }
+        case "Identifier": {
+          if (parsers.isValidPropertyValue("border-width", name)) {
+            if (parsedValues.has("border-width")) {
+              return;
+            }
+            parsedValues.set("border-width", name);
+            break;
+          } else if (parsers.isValidPropertyValue("border-style", name)) {
+            if (parsedValues.has("border-style")) {
+              return;
+            }
+            parsedValues.set("border-style", name);
+            break;
+          } else if (parsers.isValidPropertyValue("border-color", name)) {
+            if (parsedValues.has("border-color")) {
+              return;
+            }
+            parsedValues.set("border-color", name);
+            break;
+          }
+          return;
+        }
+        default: {
+          return;
+        }
+      }
+    } else {
+      return;
+    }
+  }
+  if (parsedValues.size) {
+    const keys = module.exports.shorthandFor.keys();
+    const obj = {
+      "border-width": "medium"
+    };
+    for (const key of keys) {
+      if (parsedValues.has(key)) {
+        const parsedValue = parsedValues.get(key);
+        if (parsedValue !== module.exports.initialValues.get(key)) {
+          obj[key] = parsedValues.get(key);
+          if (obj["border-width"] && obj["border-width"] === "medium") {
+            delete obj["border-width"];
+          }
+        }
+      }
+    }
+    return obj;
+  }
+};
+
 module.exports.definition = {
   set(v) {
     v = parsers.prepareValue(v, this._global);
-    if (/^none$/i.test(v)) {
-      v = "";
-    }
     if (parsers.hasVarFunc(v)) {
-      for (const [key] of module.exports.shorthandFor) {
-        this._setProperty(key, "");
-      }
-      this._setProperty("border", v);
+      this._borderSetter(property, v, "");
     } else {
-      this._midShorthandSetter("border", v, module.exports.shorthandFor, [
-        "top",
-        "right",
-        "bottom",
-        "left"
-      ]);
+      const val = module.exports.parse(v, {
+        globalObject: this._global
+      });
+      if (val || typeof val === "string") {
+        const priority = this._priorities.get(property) ?? "";
+        this._borderSetter(property, val, priority);
+      }
     }
   },
   get() {
-    let val = this.getPropertyValue("border");
-    if (parsers.hasVarFunc(val)) {
-      return val;
-    }
-    val = this._shorthandGetter("border", module.exports.shorthandFor);
-    if (parsers.hasVarFunc(val)) {
-      return "";
-    }
-    return val;
+    return this.getPropertyValue(property);
   },
   enumerable: true,
   configurable: true

package/lib/properties/borderBottom.js

@@ -1,39 +1,155 @@
 "use strict";
 
 const parsers = require("../parsers");
-const borderTopWidth = require("./borderTopWidth");
-const borderTopStyle = require("./borderTopStyle");
-const borderTopColor = require("./borderTopColor");
+const borderBottomWidth = require("./borderBottomWidth");
+const borderBottomStyle = require("./borderBottomStyle");
+const borderBottomColor = require("./borderBottomColor");
+
+const property = "border-bottom";
+const shorthand = "border";
+
+module.exports.initialValues = new Map([
+  ["border-bottom-width", "medium"],
+  ["border-bottom-style", "none"],
+  ["border-bottom-color", "currentcolor"]
+]);
 
 module.exports.shorthandFor = new Map([
-  ["border-bottom-width", borderTopWidth],
-  ["border-bottom-style", borderTopStyle],
-  ["border-bottom-color", borderTopColor]
+  ["border-bottom-width", borderBottomWidth],
+  ["border-bottom-style", borderBottomStyle],
+  ["border-bottom-color", borderBottomColor]
 ]);
 
+module.exports.parse = function parse(v, opt = {}) {
+  const { globalObject } = opt;
+  if (v === "") {
+    return v;
+  }
+  const values = parsers.splitValue(v);
+  const parsedValues = new Map();
+  for (const val of values) {
+    const value = parsers.parsePropertyValue(property, val, {
+      globalObject,
+      inArray: true
+    });
+    if (Array.isArray(value) && value.length === 1) {
+      const [{ isNumber, name, type, value: itemValue }] = value;
+      switch (type) {
+        case "Calc": {
+          if (isNumber || parsedValues.has("border-bottom-width")) {
+            return;
+          }
+          parsedValues.set("border-bottom-width", `${name}(${itemValue})`);
+          break;
+        }
+        case "Dimension":
+        case "Number": {
+          if (parsedValues.has("border-bottom-width")) {
+            return;
+          }
+          const parsedValue = parsers.parseLength(value, {
+            min: 0
+          });
+          if (!parsedValue) {
+            return;
+          }
+          parsedValues.set("border-bottom-width", parsedValue);
+          break;
+        }
+        case "Function": {
+          if (parsedValues.has("border-bottom-color")) {
+            return;
+          }
+          const parsedValue = parsers.parseColor(value);
+          if (!parsedValue) {
+            return;
+          }
+          parsedValues.set("border-bottom-color", parsedValue);
+          break;
+        }
+        case "GlobalKeyword": {
+          return name;
+        }
+        case "Hash": {
+          if (parsedValues.has("border-bottom-color")) {
+            return;
+          }
+          const parsedValue = parsers.parseColor(`#${itemValue}`);
+          if (!parsedValue) {
+            return;
+          }
+          parsedValues.set("border-bottom-color", parsedValue);
+          break;
+        }
+        case "Identifier": {
+          if (parsers.isValidPropertyValue("border-bottom-width", name)) {
+            if (parsedValues.has("border-bottom-width")) {
+              return;
+            }
+            parsedValues.set("border-bottom-width", name);
+            break;
+          } else if (parsers.isValidPropertyValue("border-bottom-style", name)) {
+            if (parsedValues.has("border-bottom-style")) {
+              return;
+            }
+            parsedValues.set("border-bottom-style", name);
+            break;
+          } else if (parsers.isValidPropertyValue("border-bottom-color", name)) {
+            if (parsedValues.has("border-bottom-color")) {
+              return;
+            }
+            parsedValues.set("border-bottom-color", name);
+            break;
+          }
+          return;
+        }
+        default: {
+          return;
+        }
+      }
+    } else {
+      return;
+    }
+  }
+  if (parsedValues.size) {
+    const keys = module.exports.shorthandFor.keys();
+    const obj = {
+      "border-bottom-width": "medium"
+    };
+    for (const key of keys) {
+      if (parsedValues.has(key)) {
+        const parsedValue = parsedValues.get(key);
+        if (parsedValue !== module.exports.initialValues.get(key)) {
+          obj[key] = parsedValues.get(key);
+          if (obj["border-bottom-width"] && obj["border-bottom-width"] === "medium") {
+            delete obj["border-bottom-width"];
+          }
+        }
+      }
+    }
+    return obj;
+  }
+};
+
 module.exports.definition = {
   set(v) {
     v = parsers.prepareValue(v, this._global);
     if (parsers.hasVarFunc(v)) {
-      for (const [key] of module.exports.shorthandFor) {
-        this._setProperty(key, "");
-      }
-      this._setProperty("border", "");
-      this._setProperty("border-bottom", v);
+      this._borderSetter(property, v, "");
     } else {
-      this._shorthandSetter("border-bottom", v, module.exports.shorthandFor);
+      const val = module.exports.parse(v, {
+        globalObject: this._global
+      });
+      if (val || typeof val === "string") {
+        const shorthandPriority = this._priorities.get(shorthand);
+        const prior = this._priorities.get(property) ?? "";
+        const priority = shorthandPriority && prior ? "" : prior;
+        this._borderSetter(property, val, priority);
+      }
     }
   },
   get() {
-    let val = this.getPropertyValue("border-bottom");
-    if (parsers.hasVarFunc(val)) {
-      return val;
-    }
-    val = this._shorthandGetter("border-bottom", module.exports.shorthandFor);
-    if (parsers.hasVarFunc(val)) {
-      return "";
-    }
-    return val;
+    return this.getPropertyValue(property);
   },
   enumerable: true,
   configurable: true

package/lib/properties/borderBottomColor.js

@@ -2,33 +2,58 @@
 
 const parsers = require("../parsers");
 
-module.exports.parse = function parse(v) {
-  const val = parsers.parseColor(v);
-  if (val) {
-    return val;
-  }
-  return parsers.parseKeyword(v);
-};
+const property = "border-bottom-color";
+const lineShorthand = "border-color";
+const positionShorthand = "border-bottom";
+const shorthand = "border";
 
-module.exports.isValid = function isValid(v) {
-  if (v === "" || typeof parsers.parseKeyword(v) === "string") {
-    return true;
+module.exports.parse = function parse(v, opt = {}) {
+  const { globalObject } = opt;
+  if (v === "") {
+    return v;
+  }
+  const value = parsers.parsePropertyValue(property, v, {
+    globalObject,
+    inArray: true
+  });
+  if (Array.isArray(value) && value.length === 1) {
+    const [{ name, type }] = value;
+    switch (type) {
+      case "GlobalKeyword": {
+        return name;
+      }
+      default: {
+        return parsers.parseColor(value);
+      }
+    }
+  } else if (typeof value === "string") {
+    return value;
   }
-  return parsers.isValidColor(v);
 };
 
 module.exports.definition = {
   set(v) {
     v = parsers.prepareValue(v, this._global);
     if (parsers.hasVarFunc(v)) {
-      this._setProperty("border", "");
-      this._setProperty("border-bottom", "");
-      this._setProperty("border-color", "");
+      this._borderSetter(property, v, "");
+    } else {
+      const val = module.exports.parse(v, {
+        globalObject: this._global
+      });
+      if (typeof val === "string") {
+        const shorthandPriority = this._priorities.get(shorthand);
+        const linePriority = this._priorities.get(lineShorthand);
+        const positionPriority = this._priorities.get(positionShorthand);
+        let priority = this._priorities.get(property) ?? "";
+        if ((shorthandPriority || linePriority || positionPriority) && priority) {
+          priority = "";
+        }
+        this._borderSetter(property, val, priority);
+      }
     }
-    this._setProperty("border-bottom-color", module.exports.parse(v));
   },
   get() {
-    return this.getPropertyValue("border-bottom-color");
+    return this.getPropertyValue(property);
   },
   enumerable: true,
   configurable: true

package/lib/properties/borderBottomStyle.js

@@ -2,48 +2,57 @@
 
 const parsers = require("../parsers");
 
-module.exports.parse = function parse(v) {
-  const keywords = [
-    "none",
-    "hidden",
-    "dotted",
-    "dashed",
-    "solid",
-    "double",
-    "groove",
-    "ridge",
-    "inset",
-    "outset"
-  ];
-  return parsers.parseKeyword(v, keywords);
-};
+const property = "border-bottom-style";
+const lineShorthand = "border-style";
+const positionShorthand = "border-bottom";
+const shorthand = "border";
 
-module.exports.isValid = function isValid(v) {
+module.exports.parse = function parse(v, opt = {}) {
+  const { globalObject } = opt;
   if (v === "") {
-    return true;
+    return v;
+  }
+  const value = parsers.parsePropertyValue(property, v, {
+    globalObject,
+    inArray: true
+  });
+  if (Array.isArray(value) && value.length === 1) {
+    const [{ name, type }] = value;
+    switch (type) {
+      case "GlobalKeyword":
+      case "Identifier": {
+        return name;
+      }
+      default:
+    }
+  } else if (typeof value === "string") {
+    return value;
   }
-  return typeof module.exports.parse(v) === "string";
 };
 
 module.exports.definition = {
   set(v) {
     v = parsers.prepareValue(v, this._global);
-    const val = module.exports.parse(v);
-    if (val === "none" || val === "hidden") {
-      this._setProperty("border-bottom-style", "");
-      this._setProperty("border-bottom-color", "");
-      this._setProperty("border-bottom-width", "");
-      return;
-    }
     if (parsers.hasVarFunc(v)) {
-      this._setProperty("border", "");
-      this._setProperty("border-bottom", "");
-      this._setProperty("border-style", "");
+      this._borderSetter(property, v, "");
+    } else {
+      const val = module.exports.parse(v, {
+        globalObject: this._global
+      });
+      if (typeof val === "string") {
+        const shorthandPriority = this._priorities.get(shorthand);
+        const linePriority = this._priorities.get(lineShorthand);
+        const positionPriority = this._priorities.get(positionShorthand);
+        let priority = this._priorities.get(property) ?? "";
+        if ((shorthandPriority || linePriority || positionPriority) && priority) {
+          priority = "";
+        }
+        this._borderSetter(property, val, priority);
+      }
     }
-    this._setProperty("border-bottom-style", val);
   },
   get() {
-    return this.getPropertyValue("border-bottom-style");
+    return this.getPropertyValue(property);
   },
   enumerable: true,
   configurable: true