Pass child props

mbj36 · Aug 26, 2018 · 2a6992e · 2a6992e
1 parent 68b5838
commit 2a6992e
Show file tree

Hide file tree

Showing 10 changed files with 233 additions and 28 deletions.
diff --git a/src/components/Menu/bubble.vue b/src/components/Menu/bubble.vue
@@ -0,0 +1,27 @@
+<template>
+    <div>
+        <Menu v-bind="propsToPass">
+            <slot></slot>
+        </Menu>
+    </div>
+</template>
+
+<script>
+    import Menu from '../Menu';
+    export default {
+      components: {
+        Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
+      }
+    };
+</script>
diff --git a/src/components/Menu/elastic.vue b/src/components/Menu/elastic.vue
@@ -0,0 +1,27 @@
+<template>
+    <div>
+        <Menu v-bind="propsToPass">
+            <slot></slot>
+        </Menu>
+    </div>
+</template>
+
+<script>
+    import Menu from '../Menu';
+    export default {
+      components: {
+        Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
+      }
+    };
+</script>
diff --git a/src/components/Menu/fallDown.vue b/src/components/Menu/fallDown.vue
@@ -0,0 +1,27 @@
+<template>
+    <div>
+        <Menu v-bind="propsToPass">
+            <slot></slot>
+        </Menu>
+    </div>
+</template>
+
+<script>
+    import Menu from '../Menu';
+    export default {
+      components: {
+        Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
+      }
+    };
+</script>
diff --git a/src/components/Menu/push.vue b/src/components/Menu/push.vue
@@ -0,0 +1,27 @@
+<template>
+    <div>
+        <Menu v-bind="propsToPass">
+            <slot></slot>
+        </Menu>
+    </div>
+</template>
+
+<script>
+    import Menu from '../Menu';
+    export default {
+      components: {
+        Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
+      }
+    };
+</script>
diff --git a/src/components/Menu/pushRotate.vue b/src/components/Menu/pushRotate.vue
@@ -0,0 +1,27 @@
+<template>
+    <div>
+        <Menu v-bind="propsToPass">
+            <slot></slot>
+        </Menu>
+    </div>
+</template>
+
+<script>
+    import Menu from '../Menu';
+    export default {
+      components: {
+        Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
+      }
+    };
+</script>
diff --git a/src/components/Menu/reveal.vue b/src/components/Menu/reveal.vue
@@ -0,0 +1,27 @@
+<template>
+    <div>
+        <Menu v-bind="propsToPass">
+            <slot></slot>
+        </Menu>
+    </div>
+</template>
+
+<script>
+    import Menu from '../Menu';
+    export default {
+      components: {
+        Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
+      }
+    };
+</script>
diff --git a/src/components/Menu/scaleDown.vue b/src/components/Menu/scaleDown.vue
@@ -0,0 +1,27 @@
+<template>
+    <div>
+        <Menu v-bind="propsToPass">
+            <slot></slot>
+        </Menu>
+    </div>
+</template>
+
+<script>
+    import Menu from '../Menu';
+    export default {
+      components: {
+        Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
+      }
+    };
+</script>
diff --git a/src/components/Menu/scaleRotate.vue b/src/components/Menu/scaleRotate.vue
@@ -0,0 +1,27 @@
+<template>
+    <div>
+        <Menu v-bind="propsToPass">
+            <slot></slot>
+        </Menu>
+    </div>
+</template>
+
+<script>
+    import Menu from '../Menu';
+    export default {
+      components: {
+        Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
+      }
+    };
+</script>
diff --git a/src/components/Menu/slide.vue b/src/components/Menu/slide.vue
@@ -15,35 +15,13 @@
       data() {
         return {
           propsToPass: {
-            isOpen: this.isOpen,
-            right: this.right,
-            width: this.width,
-            disableEsc: this.disableEsc,
-            noOverlay: this.noOverlay
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
           }
         };
-      },
-      props: {
-        isOpen: {
-          type: Boolean,
-          required: false
-        },
-        right: {
-          type: Boolean,
-          required: false
-        },
-        width: {
-          type: [String],
-          required: false
-        },
-        disableEsc: {
-          type: Boolean,
-          required: false
-        },
-        noOverlay: {
-          type: Boolean,
-          required: false
-        }
       }
     };
 </script>
diff --git a/src/components/Menu/stack.vue b/src/components/Menu/stack.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <Menu>
+        <Menu v-bind="propsToPass">
             <slot></slot>
         </Menu>
     </div>
@@ -11,6 +11,17 @@
     export default {
       components: {
         Menu: Menu
+      },
+      data() {
+        return {
+          propsToPass: {
+            isOpen: this.$attrs.isOpen,
+            right: this.$attrs.right,
+            width: this.$attrs.width,
+            disableEsc: this.$attrs.disableEsc,
+            noOverlay: this.$attrs.noOverlay
+          }
+        };
       }
     };
 </script>