fix eslint issues

examples/storybook/components/Button.vue

@@ -10,10 +10,10 @@ export default {
       default: () => () => null
     },
     color: {
-      default: "#42b983"
+      default: '#42b983'
     }
   }
-};
+}
 </script>
 
 <style>

examples/storybook/components/Layout.vue

@@ -65,7 +65,7 @@
 
 <script>
 export default {
-  name: "layout",
+  name: 'layout',
 
   data: () => ({
     drawer: null
@@ -74,7 +74,7 @@ export default {
     items: Array,
     source: String
   }
-};
+}
 </script>
 
 <style type="text/css">

examples/storybook/components/Welcome.vue

@@ -68,7 +68,7 @@ export default {
   props: {
     showApp: {
       type: Function,
-      default: () => console.log('Welcome to storybook!')
+      default: () => console.log('Welcome to storybook!') // eslint-disable-line
     }
   }
 }

examples/storybook/nuxt.config.js

@@ -1,7 +1,5 @@
 const pkg = require('./package')
 
-const nodeExternals = require('webpack-node-externals')
-
 module.exports = {
   mode: 'universal',
 

examples/storybook/stories/LineChart.story.js

@@ -5,12 +5,12 @@ import {
   text,
   color,
   array
-} from "./storybase.js"
+} from './storybase.js'
 
-import LineChart from "~/components/LineChart"
+import LineChart from '~/components/LineChart'
 
 nStoriesOfWithDefault({ LineChart })
-  .add("with some data", () => ({
+  .add('with some data', () => ({
     components: { LineChart },
     template: `
 <div>
@@ -26,14 +26,14 @@ nStoriesOfWithDefault({ LineChart })
   }" :options="{ maintainAspectRatio: false, responsive:true}"/>
 </div>`
   }))
-  .add("with knobs demo", () => {
+  .add('with knobs demo', () => {
-    const maintainAspectRatio = boolean("Aspect Ratio", false)
+    const maintainAspectRatio = boolean('Aspect Ratio', false)
-    const responsive = boolean("Responsive", true)
+    const responsive = boolean('Responsive', true)
-    const title = text("Title", "Sample chart")
+    const title = text('Title', 'Sample chart')
-    const myColor = color("Background Color", "darkred")
+    const myColor = color('Background Color', 'darkred')
 
-    const defaultValue = array("Values", [1, 2, 3, 6, 3, 8])
+    const defaultValue = array('Values', [1, 2, 3, 6, 3, 8])
-    const defaultLabel = array("Labels", [
+    const defaultLabel = array('Labels', [
       "'a'",
       "'b'",
       "'c'",
@@ -44,7 +44,7 @@ nStoriesOfWithDefault({ LineChart })
 
     return {
       components: { LineChart },
-      methods: { onResize: action("resized") },
+      methods: { onResize: action('resized') },
       template: `
         <div  style="position: relative; height:40vh; width:80vw">
         <line-chart :data="{
@@ -61,7 +61,7 @@ nStoriesOfWithDefault({ LineChart })
       `
     }
   })
-  .addVT("with Vuetify", () => {
+  .addVT('with Vuetify', () => {
     const data = { "'a'": 1, "'b'": 2, "'c'": 3 }
     return `
         <line-chart :data="{
@@ -77,7 +77,7 @@ nStoriesOfWithDefault({ LineChart })
   `
   })
   .addVT(
-  "with Vuetify2",
+    'with Vuetify2',
     `<line-chart :data="{
           labels: [1,2,3],
           datasets: [

examples/storybook/stories/Logo.story.js

@@ -1,15 +1,14 @@
 import {
   nStoriesOf,
-  action,
+  // action,
-  boolean,
+  // boolean,
-  text,
+  // text,
-  color,
+  // color,
-  array,
+  // array,
   object
-} from "./storybase.js"
+} from './storybase.js'
-
-import Logo from "~/components/Logo.vue"
 
+import Logo from '~/components/Logo.vue'
 
 // nStoriesOf({ Logo }, "Logo 1")
 // .addDecorator(story => (
@@ -23,8 +22,8 @@ import Logo from "~/components/Logo.vue"
 //   <logo :data="{  }  "/>`
 //   }))
 
-nStoriesOf({ Logo }, "Logo ")
+nStoriesOf({ Logo }, 'Logo ')
-  .add("with some data", () => ({
+  .add('with some data', () => ({
     components: { Logo },
     template: `
        <v-app dark style="min-width:400px">
@@ -34,11 +33,11 @@ nStoriesOf({ Logo }, "Logo ")
   </v-flex>
   </v-container></v-app>`
   }))
-  .addVT("with App layout", '<logo :data="{  }  "/>')
+  .addVT('with App layout', '<logo :data="{  }  "/>')
-  .addVT("with a knob", () => {
+  .addVT('with a knob', () => {
     let data = JSON.stringify(
-      object("Data", {
+      object('Data', {
-        name: "Apple",
+        name: 'Apple',
         count: 132
       })
     )

examples/storybook/stories/MyButton.story.js

@@ -1,15 +1,14 @@
 
-import { storiesOf } from '@storybook/vue';
+import { storiesOf } from '@storybook/vue'
-import MyButton from '~/components/Button.vue';
+import MyButton from '~/components/Button.vue'
-import Centered from '@storybook/addon-centered';
+import Centered from '@storybook/addon-centered'
 
-storiesOf("Button", module)
+storiesOf('Button', module)
-.addDecorator(Centered)
+  .addDecorator(Centered)
-  .add("rounded button", () => ({
+  .add('rounded button', () => ({
     template: '<my-button :rounded="true"> 👍  A Button with rounded edges</my-button>'
   }))
-  .add("normal button", () => ({
+  .add('normal button', () => ({
     components: { MyButton },
     template: '<my-button :rounded="false">A Button with square edges</my-button>'
-  }));
+  }))
-

examples/storybook/stories/Welcome.story.js

@@ -1,15 +1,15 @@
 
-import { storiesOf } from '@storybook/vue';
+import { storiesOf } from '@storybook/vue'
-import { action } from '@storybook/addon-actions';
+// import { action } from '@storybook/addon-actions'
-import { linkTo } from '@storybook/addon-links';
+import { linkTo } from '@storybook/addon-links'
 
-import Welcome from '~/components/Welcome.vue';
+import Welcome from '~/components/Welcome.vue'
 
 storiesOf('Welcome', module).add('to Storybook', () => ({
-  render: h => h(Welcome),
+  render: h => h(Welcome)
 }))
-  .add("with Link To Button", () => ({
+  .add('with Link To Button', () => ({
     components: { Welcome },
     template: '<div align=center><welcome :showApp="action" /></div>',
-    methods: { action: linkTo("Button") }
+    methods: { action: linkTo('Button') }
-  }));
+  }))

examples/storybook/stories/collection.story.js

@@ -1,10 +1,10 @@
 /* eslint-disable react/react-in-jsx-scope */
 
-import Vuex from 'vuex';
+import Vuex from 'vuex'
-import { storiesOf } from '@storybook/vue';
+import { storiesOf } from '@storybook/vue'
-import { action } from '@storybook/addon-actions';
+import { action } from '@storybook/addon-actions'
-import { linkTo } from '@storybook/addon-links';
+import { linkTo } from '@storybook/addon-links'
-import { withNotes } from '@storybook/addon-notes';
+import { withNotes } from '@storybook/addon-notes'
 import {
   withKnobs,
   text,
@@ -14,37 +14,34 @@ import {
   select,
   color,
   date,
-  button,
+  button
-} from '@storybook/addon-knobs/vue';
+} from '@storybook/addon-knobs/vue'
 
-import MyButton from '~/components/Button.vue';
+import MyButton from '~/components/Button.vue'
 
-
+// storiesOf('App', module).add('App', () => ({
-//storiesOf('App', module).add('App', () => ({
 //  render: h => h(App),
-//}));
+// }));
-
-
 
 storiesOf('Features/Method for rendering Vue', module)
   .add('render', () => ({
-    render: h => h('div', ['renders a div with some text in it..']),
+    render: h => h('div', ['renders a div with some text in it..'])
   }))
   .add('render + component', () => ({
     render(h) {
-      return h(MyButton, { props: { color: 'pink' } }, ['renders component: MyButton']);
+      return h(MyButton, { props: { color: 'pink' } }, ['renders component: MyButton'])
-    },
+    }
   }))
   .add('template', () => ({
     template: `
       <div>
         <h1>A template</h1>
         <p>rendered in vue in storybook</p>
-      </div>`,
+      </div>`
   }))
   .add('template + component', () => ({
     components: { MyButton },
-    template: '<my-button>MyButton rendered in a template</my-button>',
+    template: '<my-button>MyButton rendered in a template</my-button>'
   }))
   .add('template + methods', () => ({
     components: { MyButton },
@@ -54,14 +51,14 @@ storiesOf('Features/Method for rendering Vue', module)
         <my-button :rounded="true" :handle-click="action">MyButton rendered in a template + props & methods</my-button>
       </p>`,
     methods: {
-      action: linkTo('Button'),
+      action: linkTo('Button')
-    },
+    }
   }))
   .add('JSX', () => ({
     components: { MyButton },
     render() {
-      return <my-button>MyButton rendered with JSX</my-button>;
+      return <my-button>MyButton rendered with JSX</my-button>
-    },
+    }
   }))
   .add('vuex + actions', () => ({
     components: { MyButton },
@@ -71,15 +68,15 @@ storiesOf('Features/Method for rendering Vue', module)
       mutations: {
         increment(state) {
           state.count += 1; // eslint-disable-line
-          action('vuex state')(state);
+          action('vuex state')(state)
-        },
+        }
-      },
+      }
     }),
     methods: {
       log() {
-        this.$store.commit('increment');
+        this.$store.commit('increment')
-      },
+      }
-    },
+    }
   }))
   .add('whatever you want', () => ({
     components: { MyButton },
@@ -90,15 +87,15 @@ storiesOf('Features/Method for rendering Vue', module)
       mutations: {
         increment(state) {
           state.count += 1; // eslint-disable-line
-          action('vuex state')(state);
+          action('vuex state')(state)
-        },
+        }
-      },
+      }
     }),
     methods: {
       log() {
-        this.$store.commit('increment');
+        this.$store.commit('increment')
-      },
+      }
-    },
+    }
   }))
   .add('pre-registered component', () => ({
     /* By pre-registering component in config.js,
@@ -108,63 +105,62 @@ storiesOf('Features/Method for rendering Vue', module)
       <p>
         <em>This component was pre-registered in .storybook/config.js</em><br/>
         <my-button>MyButton rendered in a template</my-button>
-      </p>`,
+      </p>`
-  }));
+  }))
 
-
+storiesOf('Features/Decorator for Vue', module)
-  storiesOf('Features/Decorator for Vue', module)
   .addDecorator(story => {
     // Decorated with story function
-    const WrapButton = story();
+    const WrapButton = story()
     return {
       components: { WrapButton },
       template: '<div :style="{ border: borderStyle }"><wrap-button/></div>',
       data() {
-        return { borderStyle: 'medium solid red' };
+        return { borderStyle: 'medium solid red' }
-      },
+      }
-    };
+    }
   })
   .addDecorator(() => ({
     // Decorated with `story` component
     template: '<div :style="{ border: borderStyle }"><story/></div>',
     data() {
       return {
-        borderStyle: 'medium solid blue',
+        borderStyle: 'medium solid blue'
-      };
+      }
-    },
+    }
   }))
   .add('template', () => ({
-    template: '<my-button>MyButton with template</my-button>',
+    template: '<my-button>MyButton with template</my-button>'
   }))
   .add('render', () => ({
     render(h) {
-      return h(MyButton, { props: { color: 'pink' } }, ['renders component: MyButton']);
+      return h(MyButton, { props: { color: 'pink' } }, ['renders component: MyButton'])
-    },
+    }
-  }));
+  }))
 
 storiesOf('Features/Addon Actions', module)
   .add('Action only', () => ({
     template: '<my-button :handle-click="log">Click me to log the action</my-button>',
     methods: {
-      log: action('log1'),
+      log: action('log1')
-    },
+    }
   }))
   .add('Action and method', () => ({
     template: '<my-button :handle-click="log">Click me to log the action</my-button>',
     methods: {
       log: e => {
-        e.preventDefault();
+        e.preventDefault()
-        action('log2')(e.target);
+        action('log2')(e.target)
-      },
+      }
-    },
+    }
-  }));
+  }))
 
 storiesOf('Features/Addon Notes', module)
   .add(
     'Simple note',
     withNotes({ text: 'My notes on some bold text' })(() => ({
       template:
-        '<p><strong>Etiam vulputate elit eu venenatis eleifend. Duis nec lectus augue. Morbi egestas diam sed vulputate mollis. Fusce egestas pretium vehicula. Integer sed neque diam. Donec consectetur velit vitae enim varius, ut placerat arcu imperdiet. Praesent sed faucibus arcu. Nullam sit amet nibh a enim eleifend rhoncus. Donec pretium elementum leo at fermentum. Nulla sollicitudin, mauris quis semper tempus, sem metus tristique diam, efficitur pulvinar mi urna id urna.</strong></p>',
+        '<p><strong>Etiam vulputate elit eu venenatis eleifend. Duis nec lectus augue. Morbi egestas diam sed vulputate mollis. Fusce egestas pretium vehicula. Integer sed neque diam. Donec consectetur velit vitae enim varius, ut placerat arcu imperdiet. Praesent sed faucibus arcu. Nullam sit amet nibh a enim eleifend rhoncus. Donec pretium elementum leo at fermentum. Nulla sollicitudin, mauris quis semper tempus, sem metus tristique diam, efficitur pulvinar mi urna id urna.</strong></p>'
     }))
   )
   .add(
@@ -176,50 +172,50 @@ storiesOf('Features/Addon Notes', module)
       <em>It's not all that important to be honest, but..</em>
 
       Emojis are great, I love emojis, in fact I like using them in my Component notes too! 😇
-    `,
+    `
     })(() => ({
-      template: '<p>🤔😳😯😮<br/>😄😩😓😱<br/>🤓😑😶😊</p>',
+      template: '<p>🤔😳😯😮<br/>😄😩😓😱<br/>🤓😑😶😊</p>'
     }))
-  );
+  )
 
 storiesOf('Features/  Addon Knobs', module)
   .addDecorator(withKnobs)
   .add('Simple', () => {
-    const name = text('Name', 'John Doe');
+    const name = text('Name', 'John Doe')
-    const age = number('Age', 44);
+    const age = number('Age', 44)
-    const content = `I am ${name} and I'm ${age} years old.`;
+    const content = `I am ${name} and I'm ${age} years old.`
 
     return {
-      template: `<div>${content}</div>`,
+      template: `<div>${content}</div>`
-    };
+    }
   })
   .add('All knobs', () => {
-    const name = text('Name', 'Jane');
+    const name = text('Name', 'Jane')
     const stock = number('Stock', 20, {
       range: true,
       min: 0,
       max: 30,
-      step: 5,
+      step: 5
-    });
+    })
     const fruits = {
       apples: 'Apple',
       bananas: 'Banana',
-      cherries: 'Cherry',
+      cherries: 'Cherry'
-    };
+    }
-    const fruit = select('Fruit', fruits, 'apple');
+    const fruit = select('Fruit', fruits, 'apple')
-    const price = number('Price', 2.25);
+    const price = number('Price', 2.25)
 
-    const colour = color('Border', 'deeppink');
+    const colour = color('Border', 'deeppink')
-    const today = date('Today', new Date('Jan 20 2017'));
+    const today = date('Today', new Date('Jan 20 2017'))
-    const items = array('Items', ['Laptop', 'Book', 'Whiskey']);
+    const items = array('Items', ['Laptop', 'Book', 'Whiskey'])
-    const nice = boolean('Nice', true);
+    const nice = boolean('Nice', true)
 
     const stockMessage = stock
       ? `I have a stock of ${stock} ${fruit}, costing &dollar;${price} each.`
-      : `I'm out of ${fruit}${nice ? ', Sorry!' : '.'}`;
+      : `I'm out of ${fruit}${nice ? ', Sorry!' : '.'}`
-    const salutation = nice ? 'Nice to meet you!' : 'Leave me alone!';
+    const salutation = nice ? 'Nice to meet you!' : 'Leave me alone!'
 
-    button('Arbitrary action', action('You clicked it!'));
+    button('Arbitrary action', action('You clicked it!'))
 
     return {
       template: `
@@ -233,8 +229,8 @@ storiesOf('Features/  Addon Knobs', module)
             </ul>
             <p>${salutation}</p>
           </div>
-        `,
+        `
-    };
+    }
-  });
+  })
 
 /* eslint-enable react/react-in-jsx-scope */

examples/storybook/stories/storybase.js

@@ -1,5 +1,5 @@
-import { storiesOf } from "@storybook/vue"
+import { storiesOf } from '@storybook/vue'
-import { action } from "@storybook/addon-actions"
+import { action } from '@storybook/addon-actions'
 import {
   withKnobs,
   text,
@@ -11,11 +11,11 @@ import {
   date,
   object,
   button
-} from "@storybook/addon-knobs/vue"
+} from '@storybook/addon-knobs/vue'
 // import { withSmartKnobs } from "storybook-addon-smart-knobs"
 // import { withInfo } from "@storybook/addon-info"
-import centered from "@storybook/addon-centered"
+import centered from '@storybook/addon-centered'
-import { linkTo } from "@storybook/addon-links"
+import { linkTo } from '@storybook/addon-links'
 
 /**
  * Template function for Vuetify
@@ -44,7 +44,7 @@ const nStoriesOf = (cmp, name = Object.keys(cmp)[0], params = {}) => {
     .addDecorator(withKnobs)
 
   if (params.withDefault) {
-    x.add("Default", () => ({
+    x.add('Default', () => ({
       render: h => h(Object.values(cmp)[0])
     }))
   }
@@ -63,14 +63,12 @@ const nStoriesOf = (cmp, name = Object.keys(cmp)[0], params = {}) => {
  * @param {*} name
  */
 const nStoriesOfWithDefault = (cmp, name = Object.keys(cmp)[0]) =>
-  nStoriesOf(cmp, name, { withDefault: "withDefault" })
+  nStoriesOf(cmp, name, { withDefault: 'withDefault' })
 
 export {
   nStoriesOf,
   nStoriesOfWithDefault,
   action,
-  withSmartKnobs,
-  withInfo,
   linkTo,
   withKnobs,
   text,

examples/storybook/stories/vuetify.story.js

@@ -1,116 +1,113 @@
-import Vue from "vue";
+import { storiesOf } from '@storybook/vue'
-import { storiesOf } from "@storybook/vue";
+// import { linkTo } from '@storybook/addon-links'
-import { linkTo } from "@storybook/addon-links";
 
-import VuetifyLogo from "~/components/VuetifyLogo.vue";
+import VuetifyLogo from '~/components/VuetifyLogo.vue'
-import Layout from "~/components/Layout.vue";
+// import Layout from '~/components/Layout.vue'
 
-import Centered from '@storybook/addon-centered';
+import Centered from '@storybook/addon-centered'
 
 storiesOf('Vuetify/Logo', module)
   .addDecorator(Centered)
   .add('Logo', () => ({
-    render: h => h(VuetifyLogo),
+    render: h => h(VuetifyLogo)
-  }));
+  }))
 
 const menuItems = [
   {
-    action: "local_activity",
+    action: 'local_activity',
-    title: "Attractions",
+    title: 'Attractions',
-    items: [{ title: "List Item" }]
+    items: [{ title: 'List Item' }]
   },
   {
-    action: "restaurant",
+    action: 'restaurant',
-    title: "Dining",
+    title: 'Dining',
     active: true,
     items: [
-      { title: "Breakfast & brunch" },
+      { title: 'Breakfast & brunch' },
-      { title: "New American" },
+      { title: 'New American' },
-      { title: "Sushi" }
+      { title: 'Sushi' }
     ]
   },
   {
-    action: "school",
+    action: 'school',
-    title: "Education",
+    title: 'Education',
-    items: [{ title: "List Item" }]
+    items: [{ title: 'List Item' }]
   },
   {
-    action: "directions_run",
+    action: 'directions_run',
-    title: "Family",
+    title: 'Family',
-    items: [{ title: "List Item" }]
+    items: [{ title: 'List Item' }]
   },
   {
-    action: "healing",
+    action: 'healing',
-    title: "Health",
+    title: 'Health',
-    items: [{ title: "List Item" }]
+    items: [{ title: 'List Item' }]
   },
   {
-    action: "content_cut",
+    action: 'content_cut',
-    title: "Office",
+    title: 'Office',
-    items: [{ title: "List Item" }]
+    items: [{ title: 'List Item' }]
   },
   {
-    action: "local_offer",
+    action: 'local_offer',
-    title: "Promotions",
+    title: 'Promotions',
-    items: [{ title: "List Item" }]
+    items: [{ title: 'List Item' }]
   }
-];
+]
 
 const menuItemsAlt = [
   {
-    action: "inbox",
+    action: 'inbox',
-    title: "Mailbox"
+    title: 'Mailbox'
   },
   {
-    action: "note",
+    action: 'note',
-    title: "My Address"
+    title: 'My Address'
   },
   {
-    action: "assignment",
+    action: 'assignment',
-    title: "In Progress",
+    title: 'In Progress',
     active: true,
     items: [
-      { title: "Consolidation" },
+      { title: 'Consolidation' },
-      { title: "Repacking" },
+      { title: 'Repacking' },
-      { title: "Shipping" }
+      { title: 'Shipping' }
     ]
   },
   {
-    action: "playlist_add_check",
+    action: 'playlist_add_check',
-    title: "Registration"
+    title: 'Registration'
   },
   {
-    action: "account_circle",
+    action: 'account_circle',
-    title: "Account"
+    title: 'Account'
   },
   {
-    action: "view_headline",
+    action: 'view_headline',
-    title: "Shipped"
+    title: 'Shipped'
   }
-];
+]
 
-
+storiesOf('Vuetify/V-Btn', module)
-
+  .add('Square Button', () => ({
-storiesOf("Vuetify/V-Btn", module)
-  .add("Square Button", () => ({
     components: {},
     data() {
       return {
         items: menuItems
-      };
+      }
     },
     template:
       '<v-btn color="success">Success</v-btn>'
   }))
-  .add("with rounded button", () => ({
+  .add('with rounded button', () => ({
     components: {},
     data() {
       return {
         items: menuItemsAlt
-      };
+      }
     },
     template:
       `<v-btn color="warning" large round  dark>
 Rounded button
     </v-btn>`
-  }));
+  }))