feat: allow boolean stagger prop values, document usage

mattrothenberg · Nov 9, 2019 · bfc60cf · bfc60cf
1 parent 413d604
commit bfc60cf
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 2 deletions.
diff --git a/src/Flipped.vue b/src/Flipped.vue
@@ -5,7 +5,7 @@ export default {
   props: {
     flipId: String,
     inverseFlipId: String,
-    stagger: String,
+    stagger: [String, Boolean],
     shouldFlip: Function,
     shouldInvert: Function,
     scale: {

diff --git a/stories/List.vue b/stories/List.vue
@@ -6,7 +6,7 @@
         @click="shuffle"
       >shuffle</button>
       <ul class="list mt-4">
-        <Flipped v-for="num in list" :key="num" :flipId="num.toString()">
+        <Flipped v-for="num in list" :key="num" :flipId="num.toString()" :stagger="stagger">
           <li>{{num}}</li>
         </Flipped>
       </ul>
@@ -28,6 +28,7 @@ import Flipped from "../src/Flipped";
 
 export default {
   name: "list",
+  props: ["stagger"],
   components: {
     Flipper,
     Flipped

diff --git a/stories/index.stories.js b/stories/index.stories.js
@@ -61,6 +61,14 @@ storiesOf("Examples", module)
       template: `<List></List>`
     };
   })
+  .add("List Shuffle (Stagger)", () => {
+    return {
+      components: {
+        List
+      },
+      template: `<List :stagger="true"></List>`
+    };
+  })
   .add("Scale", () => {
     return {
       components: {