with-style 5.0.203 → 5.0.206

package/src/style/keyframes.js

@@ -0,0 +1,55 @@
+"use strict";
+
+import { Query } from "occam-query";
+
+import Keyframe from "./keyframe";
+
+import { EMPTY_STRING, TWO_SPACES } from "../constants";
+import { contentFromQueryNodeAndTokens } from "../utilities/content";
+
+const keyframeQuery = Query.fromExpression("/keyframes/keyframe"),
+      identifierQuery = Query.fromExpression("/keyframes/@identifier");
+
+export default class Keyframes {
+  constructor(array, identifier) {
+    this.array = array;
+    this.identifier = identifier;
+  }
+
+  getIdentifier() {
+    return this.identifier;
+  }
+
+  asCSS(indent) {
+    indent = indent + TWO_SPACES;
+
+    const keyframesCSS = this.array.reduce((keyframesCSS, keyframe) => {
+            const keyframeCSS = keyframe.asCSS(indent);
+
+            keyframesCSS += keyframeCSS;
+
+            return keyframesCSS;
+          }, EMPTY_STRING),
+          css = `@keyframes ${this.identifier} {
+${keyframesCSS}}
+
+`;
+
+    return css;
+  }
+
+  static fromNodeAndTokens(node, tokens) {
+    const keyframeNodes = keyframeQuery.execute(node),
+          array = keyframeNodes.map((keyframeNode) => {
+            const node = keyframeNode, ///
+                  keyframe = Keyframe.fromNodeAndTokens(node, tokens);
+
+            return keyframe;
+          }),
+          identifierContent = contentFromQueryNodeAndTokens(identifierQuery, node, tokens),
+          identifier = identifierContent, ///
+          keyframes = new Keyframes(array, identifier);
+
+    return keyframes;
+  }
+}

package/src/style/keyframess.js

@@ -0,0 +1,48 @@
+"use strict";
+
+import { Query } from "occam-query";
+
+import Keyframes from "./keyframes";
+
+import { EMPTY_STRING } from "../constants";
+
+const keyframesQuery = Query.fromExpression("/stylesheet/keyframes");
+
+export default class Keyframess {
+  constructor(array) {
+    this.array = array;
+  }
+
+  unshift(keyframess) {
+    ///
+  }
+
+  forEach(callback) {
+    this.array.forEach(callback);
+  }
+
+  asCSS(className, indent) {
+    const css = this.array.reduce((css, keyframes) => {
+      const keyframesCSS = keyframes.asCSS(indent);
+
+      css += keyframesCSS;
+
+      return css;
+    }, EMPTY_STRING);
+
+    return css;
+  }
+
+  static fromNodeAndTokens(node, tokens) {
+    const keyframesNodes = keyframesQuery.execute(node),
+          array = keyframesNodes.map((keyframesNode) => {
+            const node = keyframesNode, ///
+                  keyframes = Keyframes.fromNodeAndTokens(node, tokens);
+
+            return keyframes;
+          }),
+          keyframess = new Keyframess(array);
+
+    return keyframess;
+  }
+}

package/src/style.js

@@ -2,13 +2,15 @@
 
 import Medias from "./style/medias";
 import RuleSets from "./style/ruleSets";
+import Keyframess from "./style/keyframess";
 import Declarations from "./style/declarations";
 
 import { EMPTY_STRING } from "./constants";
 
 export default class Style {
-  constructor(declarations, ruleSets, medias) {
+  constructor(declarations, keyframess, ruleSets, medias) {
     this.declarations = declarations;
+    this.keyframess = keyframess;
     this.ruleSets = ruleSets;
     this.medias = medias;
   }
@@ -17,6 +19,10 @@ export default class Style {
     return this.declarations;
   }
 
+  getKeyframess() {
+    return this.keyframess;
+  }
+
   getRuleSets() {
     return this.ruleSets;
   }
@@ -27,14 +33,16 @@ export default class Style {
 
   extends(superStyle) {
     const declarations = superStyle.getDeclarations(),
+          keyframess = superStyle.getKeyframess(),
           ruleSets = superStyle.getRuleSets(),
           medias = superStyle.getMedias();
 
-    this.unshift(declarations, ruleSets, medias);
+    this.unshift(declarations, keyframess, ruleSets, medias);
   }
 
-  unshift(declarations, ruleSets, medias) {
+  unshift(declarations, keyframess, ruleSets, medias) {
     this.declarations.unshift(declarations);
+    this.keyframess.unshift(keyframess);
     this.ruleSets.unshift(ruleSets);
     this.medias.unshift(medias);
   }
@@ -42,18 +50,20 @@ export default class Style {
   asCSS(className) {
     const indent = EMPTY_STRING,
           declarationsCSS = this.declarations.asCSS(className, indent),
+          keyframessCSS = this.keyframess.asCSS(className, indent),
           ruleSetsCSS = this.ruleSets.asCSS(className, indent),
           mediasCSS = this.medias.asCSS(className, indent),
-          css = `${declarationsCSS}${ruleSetsCSS}${mediasCSS}`;
+          css = `${declarationsCSS}${keyframessCSS}${ruleSetsCSS}${mediasCSS}`;
 
     return css;
   }
 
   static fromNodeAndTokens(node, tokens) {
     const declarations = Declarations.fromNodeAndTokens(node, tokens),
+          keyframess = Keyframess.fromNodeAndTokens(node, tokens),
           ruleSets = RuleSets.fromNodeAndTokens(node, tokens),
           medias = Medias.fromNodeAndTokens(node, tokens),
-          style = new Style(declarations, ruleSets, medias);
+          style = new Style(declarations, keyframess, ruleSets, medias);
 
     return style;
   }