with-style 5.0.181 → 5.0.183

package/src/style/declaration.js

@@ -5,35 +5,47 @@ import { Query } from "occam-query";
 import { EMPTY_STRING } from "../constants";
 import { contentFromQueryNodeAndTokens } from "../utilities/content";
 
-const priorityQuery = Query.fromExpression("/*/priority"),
-      propertyQuery = Query.fromExpression("/*/property"),
-      expressionQuery = Query.fromExpression("/*/expression");
+const importantQuery = Query.fromExpression("/*/important"),
+      propertyNameQuery = Query.fromExpression("/*/propertyName"),
+      propertyValuesQuery = Query.fromExpression("/*/propertyValues");
 
 export default class Declaration {
-  constructor(property, expression, priority) {
-    this.property = property;
-    this.expression = expression;
-    this.priority = priority;
+  constructor(propertyValues, propertyName, important) {
+    this.propertyValues = propertyValues;
+    this.propertyName = propertyName;
+    this.important = important;
   }
 
-  getProperty() {
-    return this.property;
+  getPropertyValues() {
+    return this.propertyValues;
   }
 
-  getExpression() {
-    return this.expression;
+  getNameProperty() {
+    return this.propertyName;
   }
 
-  getPriority() {
-    return this.priority;
+  getImportant() {
+    return this.important;
   }
 
-  checkMatches(declarations) {
+  matchPropertyName(propertyName) {
+    const matches = (this.propertyName === propertyName);
+
+    return matches;
+  }
+
+  matchDeclaration(declaration) {
+    const propertyName = declaration.getPropertyName(),
+          matches = this.matchPropertyName(propertyName); ///
+
+    return matches;
+  }
+
+  matchDeclarations(declarations) {
     const matches = declarations.some((declaration) => {
-      const property = declaration.getProperty(),
-            propertiesMatch = (property === this.property);
+      const matches = this.matchDeclaration(declaration);
 
-      if (propertiesMatch) {
+      if (matches) {
         return true;
       }
     });
@@ -43,22 +55,22 @@ export default class Declaration {
 
   asCSS(indent, last) {
     const css = last ?
-                `${indent}${this.property}: ${this.expression}${this.priority};` :
-                  `${indent}${this.property}: ${this.expression}${this.priority};\n`;
+                  `${indent}${this.propertyName}: ${this.propertyValues}${this.important};` :
+                    `${indent}${this.propertyName}: ${this.propertyValues}${this.important};\n`;
 
     return css;
   }
 
   static fromNodeAndTokens(node, tokens) {
-    const propertyContent = contentFromQueryNodeAndTokens(propertyQuery, node, tokens),
-          expressionContent = contentFromQueryNodeAndTokens(expressionQuery, node, tokens),
-          priorityContent = contentFromQueryNodeAndTokens(priorityQuery, node, tokens),
-          property = propertyContent, ///
-          expression = expressionContent, ///
-          priority = (priorityContent === null) ?
-                       EMPTY_STRING :
-                        ` ${priorityContent}`,
-          declaration = new Declaration(property, expression, priority);
+    const propertyValuesContent = contentFromQueryNodeAndTokens(propertyValuesQuery, node, tokens),
+          propertyNameContent = contentFromQueryNodeAndTokens(propertyNameQuery, node, tokens),
+          importantContent = contentFromQueryNodeAndTokens(importantQuery, node, tokens),
+          propertyValues = propertyValuesContent, ///
+          propertyName = propertyNameContent, ///
+          important = (importantContent === null) ?
+                        EMPTY_STRING :
+                         ` ${importantContent}`,
+          declaration = new Declaration(propertyValues, propertyName, important);
 
     return declaration;
   }

package/src/style/declarations.js

@@ -1,11 +1,14 @@
 "use strict";
 
 import { Query } from "occam-query";
+import { arrayUtilities } from "necessary";
 
 import Declaration from "./declaration";
 
 import { EMPTY_STRING } from "../constants";
 
+const { forwardsForEach, backwardsForEach } = arrayUtilities;
+
 const declarationQuery = Query.fromExpression("/*/declaration");
 
 export default class Declarations {
@@ -13,33 +16,13 @@ export default class Declarations {
     this.array = array;
   }
 
-  forwardsForEach(callback) {
-    const length = this.array.length,
-          firstIndex = 0,
-          lastIndex = length - 1;
-
-    for (let index = firstIndex; index <= lastIndex; index++) {
-      const declaration = this.array[index];
-
-      callback(declaration, index);
-    }
-  }
+  forwardsForEach(callback) { forwardsForEach(this.array, callback); }
 
-  backwardsForEach(callback) {
-    const length = this.array.length,
-          firstIndex = 0,
-          lastIndex = length - 1;
-
-    for (let index = lastIndex; index >= firstIndex; index--) {
-      const declaration = this.array[index];
-
-      callback(declaration, index);
-    }
-  }
+  backwardsForEach(callback) { backwardsForEach(this.array, callback); }
 
   unshift(declarations) {
     declarations.backwardsForEach((declaration) => {
-      const matches = declaration.checkMatches(this.array); ///
+      const matches = declaration.matchDeclarations(this); ///
 
       if (!matches) {
         this.array.unshift(declaration);

package/src/utilities/styles.js

@@ -27,6 +27,8 @@ ${style}`;
   });
 
   headDOMElement.appendChild(styleDOMElement);
+
+  return styleDOMElement;
 }
 
 function renderStyles() {
@@ -51,11 +53,11 @@ function generateStyle(args, className, superStyle = null) {
         node = cssParser.parse(tokens),
         style = Style.fromNodeAndTokens(node, tokens);
 
-        if (superStyle !== null) {
-          style.extends(superStyle);
-        }
+  if (superStyle !== null) {
+    style.extends(superStyle);
+  }
 
-        styleMap[className] = style;
+  styleMap[className] = style;
 }
 
 function retrieveStyle(className) {