setup setAddon

start new dev branch for addons support

Author: usulpro

.storybook/addons.js

@@ -1,4 +1,4 @@
-import '../setup/register';
+import '../setAddon/register'; 
 import '@kadira/storybook-addon-knobs/register'
 import '@kadira/storybook/addons';
-import '@kadira/storybook-addon-options/register';
+import '@kadira/storybook-addon-options/register';

.storybook/config.js

@@ -1,8 +1,10 @@
 import * as storybook from '@kadira/storybook';
 import { setOptions } from '@kadira/storybook-addon-options';
 import infoAddon from '@kadira/react-storybook-addon-info';
+import querryAddon from '../setAddon';
 
 storybook.setAddon(infoAddon);
+storybook.setAddon(querryAddon);
 
 setOptions({
     name: 'React Theming',

develop/stories/index.js

@@ -8,9 +8,6 @@ import { muiTheme } from 'storybook-addon-material-ui';
 import { WithNotes } from '@kadira/storybook-addon-notes';
 import { withKnobs, text, boolean, number } from '@kadira/storybook-addon-knobs';
 
-//import decorator from '../../src/store/decorator';
-import { addonDecorator, globalDecorator } from '../../setup/';
-
 import App from '../App';
 import Header from '../Header';
 import Intro from '../Intro';
@@ -29,7 +26,6 @@ reqThemes.keys().forEach((filename) => {
  *  You can pass a single object or an array of themes
  */
 
-globalDecorator('Global decorator');
 
 storiesOf('No decorator', module)
     .add('Example1', () => (
@@ -42,9 +38,10 @@ storiesOf('No decorator', module)
             <Button title="no decor 2" />
         </div>
     ))
+    .querry()
+
 
 storiesOf('Podda App1', module)
-    .addDecorator(addonDecorator('Decor111'))
     .add('Example1', () => (
         <div className="example-component">
             <Button title="Example 1" />
@@ -57,7 +54,6 @@ storiesOf('Podda App1', module)
     ));
 
 storiesOf('Podda App2', module)
-    .addDecorator(addonDecorator('Decor222'))
     .add('Example3', () => (
         <div className="example-component">
             <Button title="Example 3" />

setAddon/addon_querry.js

@@ -0,0 +1,20 @@
+import React from 'react';
+
+const querryManager = {
+    qIndex: 0,
+    getInd() {
+        return querryManager.qIndex++;
+    },
+}
+
+const addons = {
+   querry() {
+       this.add('querry addon', () => (
+         <div>
+           It is a test querry addon {`#${querryManager.getInd()}`}
+         </div>
+       ))
+   }
+}
+
+export default addons;

setAddon/config.js

@@ -0,0 +1,9 @@
+const ADDON_ID = 'querry';
+export default {
+    ADDON_ID,
+    ADDON_TITLE: 'Q',
+    PANEL_ID: `${ADDON_ID}/no_panels_here`,
+    EVENT_ID_INIT: `${ADDON_ID}/q/init`,
+    EVENT_ID_DATA: `${ADDON_ID}/q/data`,
+    CSS_CLASS: 'addon-querry',
+};

setAddon/index.js

@@ -0,0 +1,2 @@
+import querryAddon from './addon_querry';
+export default querryAddon ;

setAddon/register.js

@@ -0,0 +1,15 @@
+import { register } from '../src';
+//import addonApi from './api';
+import config from './config';
+//import defaultData from './defaultData';
+//import panelRoutes from './panelRoutes';
+
+const panelSettings = {
+    initData: 'QQQ - this is init data',
+    config,
+    queryParams: {
+        chapters: 'no',
+    },
+};
+
+register(panelSettings);