only deliver necessary component options

egoist · egoist · commit d6482af01b73 · 2017-02-25T22:51:00.000+08:00
diff --git a/play/MyButton.play.js b/play/MyButton.play.js
@@ -1,15 +1,19 @@
 import Vue from 'vue'
+import Vuex from 'vuex'
 import {play} from '../src/play'
 import MyButton from './MyButton.vue'
 
 Vue.component('my-button', MyButton)
 
 play('Button')
   .add('with text', {
-    template: `<my-button :handle-click="log">text</my-button>`,
+    template: `<my-button :handle-click="log">{{ $store.state.count }}</my-button>`,
+    store: new Vuex.Store({
+      state: {count: 0}
+    }),
     methods: {
       log() {
-        this.$log(new Date())
+        this.$store.state.count++
       }
     }
   })
diff --git a/play/index.js b/play/index.js
@@ -1,6 +1,11 @@
 import MyButton from './MyButton.vue'
 import Box from './Box.vue'
 
+import Vuex from 'vuex'
+import Vue from 'vue'
+
+Vue.use(Vuex)
+
 const load = requireContext => {
   return requireContext.keys().map(requireContext)
 }
diff --git a/src/preview.js b/src/preview.js
@@ -44,11 +44,25 @@ export default function () {
       }
       parent.postMessage({
         type: 'SET_SPOTS',
-        payload: JSON.stringify(spots)
+        payload: JSON.stringify(purify(spots))
       }, location.origin)
     },
     render(h) {
       return h('div', {attrs: {id: 'app'}}, [h(this.current)])
     }
   })
 }
+
+function purify(spots) {
+  const result = {}
+  for (const name in spots) {
+    result[name] = spots[name].map(spot => ({
+      scenario: spot.scenario,
+      component: {
+        example: spot.component.example,
+        template: spot.component.template
+      }
+    }))
+  }
+  return result
+}
