diff --git a/app/server/src/client/preview/index.ts b/app/server/src/client/preview/index.ts index 8ac0b89aa036..9a5ac6ebbda1 100644 --- a/app/server/src/client/preview/index.ts +++ b/app/server/src/client/preview/index.ts @@ -3,7 +3,7 @@ import { ClientStoryApi, Loadable } from '@storybook/addons'; import './globals'; import { renderMain as render } from './render'; -import { StoryFnServerReturnType, IStorybookSection, ConfigureOptionsArgs } from './types'; +import { StoryFnServerReturnType, IStorybookSection } from './types'; const framework = 'server'; diff --git a/app/server/src/client/preview/render.ts b/app/server/src/client/preview/render.ts index 477897e12885..58ad7fad6602 100644 --- a/app/server/src/client/preview/render.ts +++ b/app/server/src/client/preview/render.ts @@ -20,17 +20,22 @@ const buildStoryArgs = (args: Args, argTypes: ArgTypes) => { const argType = argTypes[key]; const { control } = argType; const controlType = control && control.type.toLowerCase(); + const argValue = storyArgs[key]; switch (controlType) { case 'date': // For cross framework & language support we pick a consistent representation of Dates as strings - storyArgs[key] = new Date(storyArgs[key]).toISOString(); + storyArgs[key] = new Date(argValue).toISOString(); break; case 'array': { // use the supplied separator when seriazlizing an array as a string const separator = control.separator || ','; - storyArgs[key] = storyArgs[key].join(separator); + storyArgs[key] = argValue.join(separator); break; } + case 'object': + // send objects as JSON strings + storyArgs[key] = JSON.stringify(argValue); + break; default: } }); diff --git a/app/server/src/client/preview/types.ts b/app/server/src/client/preview/types.ts index 23bdf5b3a12c..8238b46d042d 100644 --- a/app/server/src/client/preview/types.ts +++ b/app/server/src/client/preview/types.ts @@ -18,7 +18,3 @@ export interface ShowErrorArgs { title: string; description: string; } - -export interface ConfigureOptionsArgs { - fetchStoryHtml: FetchStoryHtmlType; -} diff --git a/app/server/src/lib/compiler/types.ts b/app/server/src/lib/compiler/types.ts index 0de8dbd14f2b..7b08af446bc8 100644 --- a/app/server/src/lib/compiler/types.ts +++ b/app/server/src/lib/compiler/types.ts @@ -27,5 +27,3 @@ export interface StorybookSection { stories: StorybookStory[]; [x: string]: any; } - -export type Decorator = (section: StorybookSection) => StorybookSection; diff --git a/examples/server-kitchen-sink/stories/addon-controls.stories.json b/examples/server-kitchen-sink/stories/addon-controls.stories.json index 81c463682f71..522fa1818e14 100644 --- a/examples/server-kitchen-sink/stories/addon-controls.stories.json +++ b/examples/server-kitchen-sink/stories/addon-controls.stories.json @@ -34,7 +34,8 @@ "colour": "deeppink", "today": "Jan 20 2017 GMT+0", "items": ["Laptop", "Book", "Whiskey"], - "nice": true + "nice": true, + "other": {"hair": "brown", "eyes": "blue"} }, "argTypes": { "stock": { "control": { "type": "range", "min": 0, "max": 30, "step": 5} }, diff --git a/examples/server-kitchen-sink/views/addons/controls/all.pug b/examples/server-kitchen-sink/views/addons/controls/all.pug index 13a59d74c7b9..50fb62d4c276 100644 --- a/examples/server-kitchen-sink/views/addons/controls/all.pug +++ b/examples/server-kitchen-sink/views/addons/controls/all.pug @@ -6,6 +6,7 @@ - style = `border: 2px dotted ${colour}; padding: 8px 22px; border-radius: 8px`; - today = new Date(today); - items = items.split(','); +- other = JSON.parse(other) div(style=`${style}`) h1 My name is #{name}, @@ -15,4 +16,8 @@ div(style=`${style}`) ul each item in items li= item + p Other things about me: + ul + each key in Object.keys(other) + li= `${key}: ${other[key]}` p #{salutation} \ No newline at end of file