creevey 0.8.0-beta.0 → 0.9.0-beta.0

package/lib/esm/server/worker/worker.js

@@ -8,7 +8,7 @@ import { Key, until } from 'selenium-webdriver';
 import { isImageError } from '../../types';
 import { subscribeOn, emitTestMessage, emitWorkerMessage } from '../messages';
 import chaiImage from './chai-image';
-import { getBrowser, switchStory } from '../selenium';
+import { closeBrowser, getBrowser, switchStory } from '../selenium';
 import { CreeveyReporter, TeamcityReporter } from './reporter';
 import { addTestsFromStories } from './helpers';
 import { logger } from '../logger';
@@ -49,6 +49,7 @@ export default async function worker(config, options) {
   let retries = 0;
   let images = {};
   let error = undefined;
+  const screenshots = [];
   const testScope = [];
 
   function runHandler(failures) {
@@ -173,13 +174,23 @@ export default async function worker(config, options) {
 
   mocha.cleanReferencesAfterRun(false);
   chai.use(chaiImage(getExpected, config.diffOptions));
+  if ((await getBrowser(config, options.browser)) == null) return;
   await addTestsFromStories(mocha.suite, config, {
     browser: options.browser,
     watch: options.ui,
-    debug: options.debug
+    debug: options.debug,
+    port: options.port
   });
-  const browserConfig = config.browsers[options.browser];
-  const browser = await getBrowser(config, browserConfig);
+
+  try {
+    var _await$getBrowser;
+
+    await ((_await$getBrowser = await getBrowser(config, options.browser)) === null || _await$getBrowser === void 0 ? void 0 : _await$getBrowser.getCurrentUrl());
+  } catch (_) {
+    await closeBrowser();
+  }
+
+  const browser = await getBrowser(config, options.browser);
   const sessionId = (_await$browser$getSes = await (browser === null || browser === void 0 ? void 0 : browser.getSession())) === null || _await$browser$getSes === void 0 ? void 0 : _await$browser$getSes.getId();
   if (browser == null) return;
   const interval = setInterval(() => void browser.getCurrentUrl().then(url => {
@@ -194,6 +205,7 @@ export default async function worker(config, options) {
     this.expect = chai.expect;
     this.browserName = options.browser;
     this.testScope = testScope;
+    this.screenshots = screenshots;
   });
   mocha.suite.beforeEach(switchStory);
   subscribeOn('test', message => {

package/lib/esm/shared.js

@@ -1,4 +1,4 @@
-import { mapValues, mergeWith } from 'lodash';
+import { mapValues, mergeWith, cloneDeepWith } from 'lodash';
 // NOTE: Copy-paste from storybook/api
 export const combineParameters = (...parameterSets) => // eslint-disable-next-line @typescript-eslint/no-unsafe-return
 mergeWith({}, ...parameterSets, (_, srcValue) => {
@@ -13,10 +13,64 @@ export const denormalizeStoryParameters = ({
   stories
 }) => {
   return mapValues(stories, storyData => {
-    var _kindParameters$story;
+    var _globalParameters$cre, _kindParameters$story, _kindParameters$story2;
 
-    return { ...storyData,
-      parameters: combineParameters(globalParameters, (_kindParameters$story = kindParameters[storyData.kind]) !== null && _kindParameters$story !== void 0 ? _kindParameters$story : {}, storyData.parameters)
-    };
+    storyData.parameters.creevey = combineParameters((_globalParameters$cre = globalParameters.creevey) !== null && _globalParameters$cre !== void 0 ? _globalParameters$cre : {}, (_kindParameters$story = (_kindParameters$story2 = kindParameters[storyData.kind]) === null || _kindParameters$story2 === void 0 ? void 0 : _kindParameters$story2.creevey) !== null && _kindParameters$story !== void 0 ? _kindParameters$story : {}, storyData.parameters.creevey);
+    return storyData;
   });
+};
+export const isSerializedRegExp = exp => {
+  return typeof exp === 'object' && exp !== null && Reflect.get(exp, '__regexp') === true;
+};
+export const serializeRegExp = exp => {
+  const {
+    source,
+    flags
+  } = exp;
+  return {
+    __regexp: true,
+    source,
+    flags
+  };
+};
+export const deserializeRegExp = ({
+  source,
+  flags
+}) => {
+  return new RegExp(source, flags);
+};
+export const serializeRawStories = stories => {
+  return mapValues(stories, storyData => {
+    const creevey = storyData.parameters.creevey;
+
+    if ((creevey === null || creevey === void 0 ? void 0 : creevey.skip) !== undefined) {
+      creevey.skip = cloneDeepWith(creevey.skip, value => {
+        if (value instanceof RegExp) {
+          return serializeRegExp(value);
+        }
+
+        return undefined;
+      });
+    }
+
+    return storyData;
+  });
+};
+export const deserializeRawStories = stories => {
+  return mapValues(stories, deserializeStory);
+};
+export const deserializeStory = story => {
+  const creevey = story.parameters.creevey;
+
+  if ((creevey === null || creevey === void 0 ? void 0 : creevey.skip) !== undefined) {
+    creevey.skip = cloneDeepWith(creevey.skip, value => {
+      if (isSerializedRegExp(value)) {
+        return deserializeRegExp(value);
+      }
+
+      return undefined;
+    });
+  }
+
+  return story;
 };

package/lib/esm/types.js

@@ -29,6 +29,9 @@ export function isProcessMessage(message) {
 export function isWorkerMessage(message) {
   return isProcessMessage(message) && message.scope == 'worker';
 }
+export function isStoriesMessage(message) {
+  return isProcessMessage(message) && message.scope == 'stories';
+}
 export function isTestMessage(message) {
   return isProcessMessage(message) && message.scope == 'test';
 }

package/lib/types/cli.d.ts

@@ -1 +1 @@
-#!/usr/bin/env node
+#!/usr/bin/env node

package/lib/types/client/addon/Manager.d.ts

@@ -1,37 +1,37 @@
-import { API } from '@storybook/api';
-import { SetStoriesPayload } from '@storybook/api/dist/ts3.9/lib/stories';
-import { CreeveyStatus, CreeveyUpdate, TestData, TestStatus, StoriesRaw } from '../../types';
-import { CreeveyClientApi } from '../shared/creeveyClientApi';
-export declare class CreeveyManager {
-    storybookApi: API;
-    storyId: string;
-    activeBrowser: string;
-    selectedTestId: string;
-    status: CreeveyStatus;
-    creeveyApi: CreeveyClientApi | null;
-    stories: StoriesRaw;
-    updateStatusListeners: Array<(update: CreeveyUpdate) => void>;
-    changeTestListeners: Array<(testId: string) => void>;
-    constructor(storybookApi: API);
-    initAll: () => Promise<void>;
-    onUpdateStatus(listener: (update: CreeveyUpdate) => void): () => void;
-    onChangeTest(listener: (testId: string) => void): () => void;
-    handleCreeveyUpdate: (update: CreeveyUpdate) => void;
-    getCurrentTest: () => TestData | undefined;
-    onStoryRendered: (storyId: string) => void;
-    onStart: () => void;
-    onStop: () => void;
-    onImageApprove: (id: string, retry: number, image: string) => void;
-    onStartAllStoryTests: () => void;
-    onStartAllTests: () => void;
-    onSetStories: (data: SetStoriesPayload) => void;
-    setActiveBrowser: (browser: string) => void;
-    setSelectedTestId: (testId: string) => void;
-    getStoryTests: (storyId: string) => TestData[];
-    getBrowsers: () => string[];
-    getTestsByStoryIdAndBrowser: (browser: string) => TestData[];
-    getTabTitle: (browser: string) => string;
-    setPanelsTitle: () => void;
-    addStatusesToSideBar(): Promise<void>;
-    addStatusToStoryName(name: string, status: TestStatus | undefined, skip: string | boolean): string;
-}
+import { API } from '@storybook/api';
+import { SetStoriesPayload } from '@storybook/api/dist/ts3.9/lib/stories';
+import { CreeveyStatus, CreeveyUpdate, TestData, TestStatus, StoriesRaw } from '../../types';
+import { CreeveyClientApi } from '../shared/creeveyClientApi';
+export declare class CreeveyManager {
+    storybookApi: API;
+    storyId: string;
+    activeBrowser: string;
+    selectedTestId: string;
+    status: CreeveyStatus;
+    creeveyApi: CreeveyClientApi | null;
+    stories: StoriesRaw;
+    updateStatusListeners: Array<(update: CreeveyUpdate) => void>;
+    changeTestListeners: Array<(testId: string) => void>;
+    constructor(storybookApi: API);
+    initAll: () => Promise<void>;
+    onUpdateStatus(listener: (update: CreeveyUpdate) => void): () => void;
+    onChangeTest(listener: (testId: string) => void): () => void;
+    handleCreeveyUpdate: (update: CreeveyUpdate) => void;
+    getCurrentTest: () => TestData | undefined;
+    onStoryRendered: (storyId: string) => void;
+    onStart: () => void;
+    onStop: () => void;
+    onImageApprove: (id: string, retry: number, image: string) => void;
+    onStartAllStoryTests: () => void;
+    onStartAllTests: () => void;
+    onSetStories: (data: SetStoriesPayload) => void;
+    setActiveBrowser: (browser: string) => void;
+    setSelectedTestId: (testId: string) => void;
+    getStoryTests: (storyId: string) => TestData[];
+    getBrowsers: () => string[];
+    getTestsByStoryIdAndBrowser: (browser: string) => TestData[];
+    getTabTitle: (browser: string) => string;
+    setPanelsTitle: () => void;
+    addStatusesToSideBar(): Promise<void>;
+    addStatusToStoryName(name: string, status: TestStatus | undefined, skip: string | boolean): string;
+}

package/lib/types/client/addon/components/Addon.d.ts

@@ -1,8 +1,8 @@
-import { CreeveyManager } from '../Manager';
-interface AddonProps {
-    active?: boolean;
-    browser: string;
-    manager: CreeveyManager;
-}
-export declare const Addon: ({ active, browser, manager }: AddonProps) => JSX.Element | null;
-export {};
+import { CreeveyManager } from '../Manager';
+interface AddonProps {
+    active?: boolean;
+    browser: string;
+    manager: CreeveyManager;
+}
+export declare const Addon: ({ active, browser, manager }: AddonProps) => JSX.Element | null;
+export {};

package/lib/types/client/addon/components/Icons.d.ts

@@ -1,7 +1,7 @@
-interface IconProps {
-    width?: number;
-    height?: number;
-}
-export declare const NextIcon: ({ width, height }: IconProps) => JSX.Element;
-export declare const ForwardIcon: ({ width, height }: IconProps) => JSX.Element;
-export {};
+interface IconProps {
+    width?: number;
+    height?: number;
+}
+export declare const NextIcon: ({ width, height }: IconProps) => JSX.Element;
+export declare const ForwardIcon: ({ width, height }: IconProps) => JSX.Element;
+export {};

package/lib/types/client/addon/components/Panel.d.ts

@@ -1,9 +1,9 @@
-import { TestData } from '../../../types';
-interface PanelProps {
-    tests: TestData[];
-    selectedTestId: string;
-    onChangeTest: (testId: string) => void;
-    onImageApprove: (id: string, retry: number, image: string) => void;
-}
-export declare const Panel: ({ tests, selectedTestId, onChangeTest, onImageApprove }: PanelProps) => JSX.Element;
-export {};
+import { TestData } from '../../../types';
+interface PanelProps {
+    tests: TestData[];
+    selectedTestId: string;
+    onChangeTest: (testId: string) => void;
+    onImageApprove: (id: string, retry: number, image: string) => void;
+}
+export declare const Panel: ({ tests, selectedTestId, onChangeTest, onImageApprove }: PanelProps) => JSX.Element;
+export {};

package/lib/types/client/addon/components/TestSelect.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
-import { TestData } from '../../../types';
-interface TestSelectProps {
-    tests: TestData[];
-    selectedTestId: string;
-    onChangeTest: (testId: string) => void;
-}
-export default function TestSelect(props: TestSelectProps): JSX.Element;
-export {};
+/// <reference types="react" />
+import { TestData } from '../../../types';
+interface TestSelectProps {
+    tests: TestData[];
+    selectedTestId: string;
+    onChangeTest: (testId: string) => void;
+}
+export default function TestSelect(props: TestSelectProps): JSX.Element;
+export {};

package/lib/types/client/addon/components/Tools.d.ts

@@ -1,6 +1,6 @@
-import { CreeveyManager } from '../Manager';
-interface ToolsProps {
-    manager: CreeveyManager;
-}
-export declare const Tools: ({ manager }: ToolsProps) => JSX.Element | null;
-export {};
+import { CreeveyManager } from '../Manager';
+interface ToolsProps {
+    manager: CreeveyManager;
+}
+export declare const Tools: ({ manager }: ToolsProps) => JSX.Element | null;
+export {};

package/lib/types/client/addon/decorator.d.ts

@@ -1 +1 @@
-export declare const decorators: import("@storybook/addons").MakeDecoratorResult[];
+export declare const decorators: import("@storybook/addons").MakeDecoratorResult[];

package/lib/types/client/addon/preset.d.ts

@@ -1,22 +1,24 @@
-/// <reference types="webpack-dev-server" />
-import { Configuration } from 'webpack';
-export declare function config(entry?: string[]): string[];
-export declare function managerEntries(entry?: string[]): string[];
-declare global {
-    const __CREEVEY_SERVER_PORT__: number;
-    const __CREEVEY_CLIENT_PORT__: number | null;
-}
-export interface CreeveyAddonOptions {
-    creeveyConfigPath?: string;
-    creeveyPreExtract?: string;
-    creeveyPort?: number;
-    clientPort?: number;
-    configType: string;
-    configDir: string;
-    outputDir: string;
-    skipExtract?: boolean;
-    presets?: {
-        apply: <T>(preset: string) => Promise<T | undefined>;
-    };
-}
-export declare function managerWebpack(config: Configuration, options: CreeveyAddonOptions): Promise<Configuration>;
+/// <reference types="webpack-dev-server" />
+import { Configuration } from 'webpack';
+export declare function config(entry?: string[]): string[];
+export declare function managerEntries(entry?: string[]): string[];
+declare global {
+    const __CREEVEY_SERVER_HOST__: string;
+    const __CREEVEY_SERVER_PORT__: number;
+    const __CREEVEY_CLIENT_PORT__: number | null;
+}
+export interface CreeveyAddonOptions {
+    creeveyConfigPath?: string;
+    creeveyPreExtract?: string;
+    creeveyHost?: string;
+    creeveyPort?: number;
+    clientPort?: number;
+    configType: string;
+    configDir: string;
+    outputDir: string;
+    skipExtract?: boolean;
+    presets?: {
+        apply: <T>(preset: string) => Promise<T | undefined>;
+    };
+}
+export declare function managerWebpack(config: Configuration, options: CreeveyAddonOptions): Promise<Configuration>;

package/lib/types/client/addon/readyForCapture.d.ts

@@ -0,0 +1,6 @@
+declare global {
+    interface Window {
+        __CREEVEY_SET_READY_FOR_CAPTURE__?: () => void;
+    }
+}
+export declare function readyForCapture(): void;

package/lib/types/client/addon/register.d.ts

@@ -1,3 +1,3 @@
-import { API } from '@storybook/api';
-export declare const ADDON_ID = "creevey";
-export declare function registerCreeveyPanels(storybookApi: API): Promise<void>;
+import { API } from '@storybook/api';
+export declare const ADDON_ID = "creevey";
+export declare function registerCreeveyPanels(storybookApi: API): Promise<void>;

package/lib/types/client/addon/utils.d.ts

@@ -1,2 +1,2 @@
-import { TestStatus } from '../../types';
-export declare function getEmojiByTestStatus(status: TestStatus | undefined, skip?: string | boolean): string;
+import { TestStatus } from '../../types';
+export declare function getEmojiByTestStatus(status: TestStatus | undefined, skip?: string | boolean): string;

package/lib/types/client/addon/withCreevey.d.ts

@@ -1,13 +1,24 @@
-import { MakeDecoratorResult, Channel } from '@storybook/addons';
-import { StorybookGlobals } from '../../types';
-declare global {
-    interface Window {
-        __CREEVEY_SELECT_STORY__: (storyId: string, kind: string, name: string, shouldWaitForReady: boolean, callback: (error?: string) => void) => void;
-        __CREEVEY_UPDATE_GLOBALS__: (globals: StorybookGlobals) => void;
-        __CREEVEY_INSERT_IGNORE_STYLES__: (ignoreElements: string[]) => HTMLStyleElement;
-        __CREEVEY_REMOVE_IGNORE_STYLES__: (ignoreStyles: HTMLStyleElement) => void;
-        __CREEVEY_SET_READY_FOR_CAPTURE__?: () => void;
-        __STORYBOOK_ADDONS_CHANNEL__: Channel;
-    }
-}
-export declare function withCreevey(): MakeDecoratorResult;
+import type { PreviewWeb } from '@storybook/preview-web';
+import type { AnyFramework } from '@storybook/csf';
+import type { StoryStore } from '@storybook/client-api';
+import { MakeDecoratorResult, Channel } from '@storybook/addons';
+import { CaptureOptions, StoriesRaw, StorybookGlobals } from '../../types';
+declare global {
+    interface Window {
+        __CREEVEY_SERVER_HOST__: string;
+        __CREEVEY_SERVER_PORT__: number;
+        __CREEVEY_WORKER_ID__: number;
+        __CREEVEY_GET_STORIES__: () => Promise<StoriesRaw | void>;
+        __CREEVEY_SELECT_STORY__: (storyId: string, kind: string, name: string, shouldWaitForReady: boolean, callback: (response: [error?: string | null, isCaptureCalled?: boolean]) => void) => void;
+        __CREEVEY_UPDATE_GLOBALS__: (globals: StorybookGlobals) => void;
+        __CREEVEY_INSERT_IGNORE_STYLES__: (ignoreElements: string[]) => HTMLStyleElement;
+        __CREEVEY_REMOVE_IGNORE_STYLES__: (ignoreStyles: HTMLStyleElement) => void;
+        __CREEVEY_HAS_PLAY_COMPLETED_YET__: (callback: (isPlayCompleted: boolean) => void) => void;
+        __CREEVEY_SET_READY_FOR_CAPTURE__?: () => void;
+        __STORYBOOK_ADDONS_CHANNEL__: Channel;
+        __STORYBOOK_STORY_STORE__: StoryStore<AnyFramework>;
+        __STORYBOOK_PREVIEW__: PreviewWeb<AnyFramework>;
+    }
+}
+export declare function withCreevey(): MakeDecoratorResult;
+export declare function capture(options?: CaptureOptions): Promise<void>;

package/lib/types/client/shared/components/ImagesView/BlendView.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { ViewPropsWithTheme } from './ImagesView';
-export declare const BlendView: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ViewPropsWithTheme, "theme">>;
+import React from 'react';
+import { ViewPropsWithTheme } from './ImagesView';
+export declare const BlendView: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ViewPropsWithTheme, "theme">>;

package/lib/types/client/shared/components/ImagesView/ImagesView.d.ts

@@ -1,25 +1,25 @@
-/// <reference types="react" />
-import { Images, ImagesViewMode } from '../../../../types';
-import { Theme } from '@storybook/theming';
-export declare const themeBorderColors: {
-    actual: string;
-    expect: string;
-    diff: string;
-};
-export declare function getBorderColor(theme: Theme, color: string): string;
-interface ViewProps {
-    actual: string;
-    diff: string;
-    expect: string;
-}
-export interface ViewPropsWithTheme extends ViewProps {
-    theme: Theme;
-}
-interface ImagesViewProps {
-    url: string;
-    image: Images;
-    canApprove: boolean;
-    mode: ImagesViewMode;
-}
-export declare function ImagesView({ url, image, canApprove, mode }: ImagesViewProps): JSX.Element;
-export {};
+/// <reference types="react" />
+import { Images, ImagesViewMode } from '../../../../types';
+import { Theme } from '@storybook/theming';
+export declare const themeBorderColors: {
+    actual: string;
+    expect: string;
+    diff: string;
+};
+export declare function getBorderColor(theme: Theme, color: string): string;
+interface ViewProps {
+    actual: string;
+    diff: string;
+    expect: string;
+}
+export interface ViewPropsWithTheme extends ViewProps {
+    theme: Theme;
+}
+interface ImagesViewProps {
+    url: string;
+    image: Images;
+    canApprove: boolean;
+    mode: ImagesViewMode;
+}
+export declare function ImagesView({ url, image, canApprove, mode }: ImagesViewProps): JSX.Element;
+export {};

package/lib/types/client/shared/components/ImagesView/SideBySideView.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { ViewPropsWithTheme } from './ImagesView';
-export declare const SideBySideView: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ViewPropsWithTheme, "theme">>;
+import React from 'react';
+import { ViewPropsWithTheme } from './ImagesView';
+export declare const SideBySideView: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ViewPropsWithTheme, "theme">>;

package/lib/types/client/shared/components/ImagesView/SlideView.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { ViewPropsWithTheme } from './ImagesView';
-export declare const SlideView: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ViewPropsWithTheme, "theme">>;
+import React from 'react';
+import { ViewPropsWithTheme } from './ImagesView';
+export declare const SlideView: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ViewPropsWithTheme, "theme">>;

package/lib/types/client/shared/components/ImagesView/SwapView.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { ViewPropsWithTheme } from './ImagesView';
-export declare const SwapView: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ViewPropsWithTheme, "theme">>;
+import React from 'react';
+import { ViewPropsWithTheme } from './ImagesView';
+export declare const SwapView: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ViewPropsWithTheme, "theme">>;

package/lib/types/client/shared/components/ImagesView/index.d.ts

@@ -1,5 +1,5 @@
-export { ImagesView } from './ImagesView';
-export { BlendView } from './BlendView';
-export { SideBySideView } from './SideBySideView';
-export { SlideView } from './SlideView';
-export { SwapView } from './SwapView';
+export { ImagesView } from './ImagesView';
+export { BlendView } from './BlendView';
+export { SideBySideView } from './SideBySideView';
+export { SlideView } from './SlideView';
+export { SwapView } from './SwapView';

package/lib/types/client/shared/components/PageFooter/PageFooter.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
-export interface PageFooterProps {
-    canApprove: boolean;
-    retriesCount: number;
-    retry: number;
-    onRetryChange: (retry: number) => void;
-    onApprove: () => void;
-}
-export declare function PageFooter({ canApprove, retriesCount, retry, onRetryChange, onApprove, }: PageFooterProps): JSX.Element;
+/// <reference types="react" />
+export interface PageFooterProps {
+    canApprove: boolean;
+    retriesCount: number;
+    retry: number;
+    onRetryChange: (retry: number) => void;
+    onApprove: () => void;
+}
+export declare function PageFooter({ canApprove, retriesCount, retry, onRetryChange, onApprove, }: PageFooterProps): JSX.Element;

package/lib/types/client/shared/components/PageFooter/Paging.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
-export interface PagingProps {
-    activePage: number;
-    onPageChange: (pageNumber: number) => void;
-    pagesCount: number;
-}
-export declare type ItemType = number | '.' | 'forward';
-export declare function Paging(props: PagingProps): JSX.Element;
+/// <reference types="react" />
+export interface PagingProps {
+    activePage: number;
+    onPageChange: (pageNumber: number) => void;
+    pagesCount: number;
+}
+export declare type ItemType = number | '.' | 'forward';
+export declare function Paging(props: PagingProps): JSX.Element;

package/lib/types/client/shared/components/PageHeader/ImagePreview.d.ts

@@ -1,12 +1,12 @@
-import React from 'react';
-import { Theme } from '@storybook/theming';
-interface ImageSwapProps {
-    url: string;
-    isActive: boolean;
-    onClick: (imageName: string) => void;
-    imageName: string;
-    theme: Theme;
-    error?: boolean;
-}
-export declare const ImagePreview: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ImageSwapProps, "theme">>;
-export {};
+import React from 'react';
+import { Theme } from '@storybook/theming';
+interface ImageSwapProps {
+    url: string;
+    isActive: boolean;
+    onClick: (imageName: string) => void;
+    imageName: string;
+    theme: Theme;
+    error?: boolean;
+}
+export declare const ImagePreview: React.SFC<import("emotion-theming/types/helper").AddOptionalTo<ImageSwapProps, "theme">>;
+export {};

package/lib/types/client/shared/components/PageHeader/PageHeader.d.ts

@@ -1,17 +1,17 @@
-/// <reference types="react" />
-import { ImagesViewMode, Images } from '../../../../types';
-interface PageHeaderProps {
-    title: string[];
-    images?: Partial<{
-        [name: string]: Images;
-    }>;
-    errorMessage?: string | null;
-    showViewModes: boolean;
-    showTitle?: boolean;
-    viewMode: ImagesViewMode;
-    imagesWithError?: string[];
-    onImageChange: (name: string) => void;
-    onViewModeChange: (viewMode: ImagesViewMode) => void;
-}
-export declare function PageHeader({ title, images, errorMessage, showViewModes, showTitle, viewMode, imagesWithError, onImageChange, onViewModeChange, }: PageHeaderProps): JSX.Element | null;
-export {};
+/// <reference types="react" />
+import { ImagesViewMode, Images } from '../../../../types';
+interface PageHeaderProps {
+    title: string[];
+    images?: Partial<{
+        [name: string]: Images;
+    }>;
+    errorMessage?: string | null;
+    showViewModes: boolean;
+    showTitle?: boolean;
+    viewMode: ImagesViewMode;
+    imagesWithError?: string[];
+    onImageChange: (name: string) => void;
+    onViewModeChange: (viewMode: ImagesViewMode) => void;
+}
+export declare function PageHeader({ title, images, errorMessage, showViewModes, showTitle, viewMode, imagesWithError, onImageChange, onViewModeChange, }: PageHeaderProps): JSX.Element | null;
+export {};