From 0d0e538fad23669111d5d7c456cacae4ba1367f0 Mon Sep 17 00:00:00 2001
From: Oleg Proskurin <regx@usul.su>
Date: Thu, 13 Jul 2017 17:36:21 +0300
Subject: [PATCH 1/2] API extension

---
 app/react/src/client/preview/client_api.js | 26 ++++++++++++++--------
 1 file changed, 17 insertions(+), 9 deletions(-)

diff --git a/app/react/src/client/preview/client_api.js b/app/react/src/client/preview/client_api.js
index 0e166971d34b..616939cd1812 100644
--- a/app/react/src/client/preview/client_api.js
+++ b/app/react/src/client/preview/client_api.js
@@ -41,15 +41,6 @@ export default class ClientApi {
       kind,
     };
 
-    // apply addons
-    Object.keys(this._addons).forEach(name => {
-      const addon = this._addons[name];
-      api[name] = (...args) => {
-        addon.apply(api, args);
-        return api;
-      };
-    });
-
     api.add = (storyName, getStory) => {
       if (typeof storyName !== 'string') {
         throw new Error(`Invalid or missing storyName provided for a "${kind}" story.`);
@@ -79,6 +70,23 @@ export default class ClientApi {
       return api;
     };
 
+    const initExp = /^_init/;
+
+    // apply addons
+    Object.keys(this._addons).filter(name => !name.match(initExp)).forEach(name => {
+      const addon = this._addons[name];
+      api[name] = (...args) => {
+        addon.apply(api, args);
+        return api;
+      };
+    });
+
+    // init addons
+    Object.keys(this._addons).filter(name => name.match(initExp)).forEach(name => {
+      const addon = this._addons[name];
+      addon.apply(api);
+    });
+
     return api;
   }
 

From cafd8f32266eeacbd82c51e13d592303a496c467 Mon Sep 17 00:00:00 2001
From: Oleg Proskurin <regx@usul.su>
Date: Thu, 13 Jul 2017 17:37:18 +0300
Subject: [PATCH 2/2] Add example to kitchen sink

---
 examples/cra-kitchen-sink/.storybook/config.js | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/examples/cra-kitchen-sink/.storybook/config.js b/examples/cra-kitchen-sink/.storybook/config.js
index d1ed22531245..e6a81581e62a 100644
--- a/examples/cra-kitchen-sink/.storybook/config.js
+++ b/examples/cra-kitchen-sink/.storybook/config.js
@@ -1,3 +1,4 @@
+import React from 'react';
 import { configure, setAddon } from '@storybook/react';
 import { setOptions } from '@storybook/addon-options';
 import infoAddon from '@storybook/addon-info';
@@ -16,6 +17,12 @@ setOptions({
 
 setAddon(infoAddon);
 
+setAddon({
+  _initBackground() {
+    this.add('Toc',() => <div> Info about <b>{this.kind}:</b> it's just a very simple example!</div>)
+  }
+})
+
 function loadStories() {
   require('../src/stories');
 }