@storybook/react-native 6.0.1-beta.0 → 6.0.1-beta.10

package/scripts/mocks/file-extensions/FakeComponent.tsx

@@ -0,0 +1 @@
+export const FakeComponent = () => null;

package/scripts/mocks/file-extensions/FakeStory.stories.tsx

@@ -0,0 +1,10 @@
+import { FakeComponent } from './FakeComponent';
+
+export default {
+  title: 'components/FakeComponent',
+  component: FakeComponent,
+};
+
+export const Basic = {
+  args: {},
+};

package/scripts/mocks/file-extensions/main.ts

@@ -0,0 +1,13 @@
+import type { StorybookConfig } from '@storybook/core-common';
+
+const config: StorybookConfig = {
+  stories: ['./FakeStory.stories.tsx'],
+  addons: [
+    '@storybook/addon-ondevice-notes',
+    '@storybook/addon-ondevice-controls',
+    '@storybook/addon-ondevice-backgrounds',
+    '@storybook/addon-ondevice-actions',
+  ],
+};
+
+export default config;

package/scripts/mocks/file-extensions/preview.tsx

@@ -0,0 +1,23 @@
+import { View, StyleSheet } from 'react-native';
+import { withBackgrounds } from '@storybook/addon-ondevice-backgrounds';
+
+export const decorators = [
+  (StoryFn) => (
+    <View style={styles.container}>
+      <StoryFn />
+    </View>
+  ),
+  withBackgrounds,
+];
+export const parameters = {
+  my_param: 'anything',
+  backgrounds: [
+    { name: 'plain', value: 'white', default: true },
+    { name: 'warm', value: 'hotpink' },
+    { name: 'cool', value: 'deepskyblue' },
+  ],
+};
+
+const styles = StyleSheet.create({
+  container: { padding: 8, flex: 1 },
+});

package/scripts/mocks/preview-files/js/preview.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { withBackgrounds } from '@storybook/addon-ondevice-backgrounds';
+
+export const decorators = [
+  (StoryFn) => (
+    <View style={styles.container}>
+      <StoryFn />
+    </View>
+  ),
+  withBackgrounds,
+];
+export const parameters = {
+  my_param: 'anything',
+  backgrounds: [
+    { name: 'plain', value: 'white', default: true },
+    { name: 'warm', value: 'hotpink' },
+    { name: 'cool', value: 'deepskyblue' },
+  ],
+};
+
+const styles = StyleSheet.create({
+  container: { padding: 8, flex: 1 },
+});

package/scripts/mocks/preview-files/jsx/preview.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { withBackgrounds } from '@storybook/addon-ondevice-backgrounds';
+
+export const decorators = [
+  (StoryFn) => (
+    <View style={styles.container}>
+      <StoryFn />
+    </View>
+  ),
+  withBackgrounds,
+];
+export const parameters = {
+  my_param: 'anything',
+  backgrounds: [
+    { name: 'plain', value: 'white', default: true },
+    { name: 'warm', value: 'hotpink' },
+    { name: 'cool', value: 'deepskyblue' },
+  ],
+};
+
+const styles = StyleSheet.create({
+  container: { padding: 8, flex: 1 },
+});

package/scripts/mocks/preview-files/ts/preview.ts

@@ -0,0 +1,9 @@
+export const decorators: any = [];
+export const parameters = {
+  my_param: 'anything',
+  backgrounds: [
+    { name: 'plain', value: 'white', default: true },
+    { name: 'warm', value: 'hotpink' },
+    { name: 'cool', value: 'deepskyblue' },
+  ],
+};

package/scripts/mocks/preview-files/tsx/preview.tsx

@@ -0,0 +1,9 @@
+export const decorators: any = [];
+export const parameters = {
+    my_param: 'anything',
+    backgrounds: [
+        { name: 'plain', value: 'white', default: true },
+        { name: 'warm', value: 'hotpink' },
+        { name: 'cool', value: 'deepskyblue' },
+    ],
+};

package/scripts/mocks/wrong-extension-preview/FakeComponent.tsx

@@ -0,0 +1 @@
+export const FakeComponent = () => null;

package/scripts/mocks/wrong-extension-preview/FakeStory.stories.tsx

@@ -0,0 +1,10 @@
+import { FakeComponent } from './FakeComponent';
+
+export default {
+  title: 'components/FakeComponent',
+  component: FakeComponent,
+};
+
+export const Basic = {
+  args: {},
+};

package/scripts/mocks/wrong-extension-preview/main.js

@@ -0,0 +1,9 @@
+module.exports = {
+  stories: ['./FakeStory.stories.tsx'],
+  addons: [
+    '@storybook/addon-ondevice-notes',
+    '@storybook/addon-ondevice-controls',
+    '@storybook/addon-ondevice-backgrounds',
+    '@storybook/addon-ondevice-actions',
+  ],
+};

package/scripts/mocks/wrong-extension-preview/preview.txt

@@ -0,0 +1,24 @@
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { withBackgrounds } from '@storybook/addon-ondevice-backgrounds';
+
+export const decorators = [
+  (StoryFn) => (
+    <View style={styles.container}>
+      <StoryFn />
+    </View>
+  ),
+  withBackgrounds,
+];
+export const parameters = {
+  my_param: 'anything',
+  backgrounds: [
+    { name: 'plain', value: 'white', default: true },
+    { name: 'warm', value: 'hotpink' },
+    { name: 'cool', value: 'deepskyblue' },
+  ],
+};
+
+const styles = StyleSheet.create({
+  container: { padding: 8, flex: 1 },
+});

package/scripts/watcher.js

@@ -1,17 +1,20 @@
 const chokidar = require('chokidar');
 const path = require('path');
 
-const { writeRequires, getMain, getPreviewExists } = require('./loader');
+const { writeRequires, getMain, getFilePathExtension } = require('./loader');
 
 const { getArguments } = require('./handle-args');
 
 const args = getArguments();
 const log = console.log.bind(console);
 
-const watchPaths = ['./main.js'];
+const mainExt = getFilePathExtension(args, 'main');
+const previewExt = getFilePathExtension(args, 'preview');
 
-if (getPreviewExists(args)) {
-  watchPaths.push('./preview.js');
+const watchPaths = [`./main.${mainExt}`];
+
+if (previewExt) {
+  watchPaths.push(`./preview.${previewExt}`);
 }
 
 const updateRequires = (event, watchPath) => {

package/dist/preview/Preview.d.ts

@@ -1,55 +0,0 @@
-/// <reference types="webpack-env" />
-/// <reference types="node" />
-import Channel from '@storybook/channels';
-import { ClientApi, ConfigApi, StoryStore } from '@storybook/client-api';
-import { Loadable } from '@storybook/core-client';
-import { theme } from './components/Shared/theme';
-interface InitialSelection {
-    /**
-     * Kind is the default export name or the storiesOf("name") name
-     */
-    kind: string;
-    /**
-     * Name is the named export or the .add("name") name
-     */
-    name: string;
-}
-export declare type Params = {
-    onDeviceUI?: boolean;
-    resetStorybook?: boolean;
-    disableWebsockets?: boolean;
-    query?: string;
-    host?: string;
-    port?: number;
-    secured?: boolean;
-    initialSelection?: InitialSelection;
-    shouldPersistSelection?: boolean;
-    tabOpen?: number;
-    isUIHidden?: boolean;
-    shouldDisableKeyboardAvoidingView?: boolean;
-    keyboardAvoidingViewVerticalOffset?: number;
-} & {
-    theme?: typeof theme;
-};
-export default class Preview {
-    _clientApi: ClientApi;
-    _storyStore: StoryStore;
-    _addons: any;
-    _channel: Channel;
-    _decorators: any[];
-    _asyncStorageStoryId: string;
-    _configApi: ConfigApi;
-    configure: (loadable: Loadable, m: NodeModule, showDeprecationWarning: boolean) => void;
-    constructor();
-    api: () => ClientApi;
-    getStorybookUI: (params?: Partial<Params>) => () => JSX.Element;
-    _setInitialStory: (initialSelection?: InitialSelection, shouldPersistSelection?: boolean) => Promise<void>;
-    _getInitialStory: (initialSelection?: InitialSelection, shouldPersistSelection?: boolean) => Promise<import("@storybook/client-api").PublishedStoreItem>;
-    _getStory(storyId: string): import("@storybook/client-api").PublishedStoreItem;
-    _selectStoryEvent({ storyId }: {
-        storyId: string;
-    }, shouldPersistSelection: any): void;
-    _selectStory(story: any): void;
-    _checkStory(storyId: string): import("@storybook/client-api").PublishedStoreItem;
-}
-export {};

package/dist/preview/Preview.js

@@ -1,117 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import AsyncStorage from '@react-native-async-storage/async-storage';
-import { addons } from '@storybook/addons';
-import Channel from '@storybook/channels';
-import { ClientApi, ConfigApi, StoryStore } from '@storybook/client-api';
-import Events from '@storybook/core-events';
-import { toId } from '@storybook/csf';
-import { ThemeProvider } from 'emotion-theming';
-import React from 'react';
-import OnDeviceUI from './components/OnDeviceUI';
-import { theme } from './components/Shared/theme';
-import { loadCsf } from './loadCsf';
-const STORAGE_KEY = 'lastOpenedStory';
-export default class Preview {
-    constructor() {
-        this.api = () => {
-            return this._clientApi;
-        };
-        this.getStorybookUI = (params = {}) => {
-            const { initialSelection, shouldPersistSelection = true } = params;
-            this._setInitialStory(initialSelection, shouldPersistSelection);
-            this._channel.on(Events.SET_CURRENT_STORY, (d) => {
-                this._selectStoryEvent(d, shouldPersistSelection);
-            });
-            const { _storyStore } = this;
-            addons.loadAddons(this._clientApi);
-            const appliedTheme = Object.assign(Object.assign({}, theme), params.theme);
-            return () => (React.createElement(ThemeProvider, { theme: appliedTheme },
-                React.createElement(OnDeviceUI, { storyStore: _storyStore, isUIHidden: params.isUIHidden, tabOpen: params.tabOpen, shouldDisableKeyboardAvoidingView: params.shouldDisableKeyboardAvoidingView, keyboardAvoidingViewVerticalOffset: params.keyboardAvoidingViewVerticalOffset })));
-        };
-        this._setInitialStory = (initialSelection, shouldPersistSelection = true) => __awaiter(this, void 0, void 0, function* () {
-            const story = yield this._getInitialStory(initialSelection, shouldPersistSelection);
-            if (story) {
-                this._selectStory(story);
-            }
-        });
-        this._getInitialStory = (initialSelection, shouldPersistSelection = true) => __awaiter(this, void 0, void 0, function* () {
-            let story = null;
-            const initialSelectionId = initialSelection
-                ? toId(initialSelection.kind, initialSelection.name)
-                : undefined;
-            if (initialSelection && initialSelectionId && this._checkStory(initialSelectionId)) {
-                story = initialSelectionId;
-            }
-            else if (shouldPersistSelection) {
-                try {
-                    let value = this._asyncStorageStoryId;
-                    if (!value) {
-                        value = JSON.parse(yield AsyncStorage.getItem(STORAGE_KEY));
-                        this._asyncStorageStoryId = value;
-                    }
-                    if (this._checkStory(value)) {
-                        story = value;
-                    }
-                }
-                catch (e) {
-                    //
-                }
-            }
-            if (story) {
-                return this._getStory(story);
-            }
-            const stories = this._storyStore.raw();
-            if (stories && stories.length) {
-                return this._getStory(stories[0].id);
-            }
-            return null;
-        });
-        const channel = new Channel({ async: true });
-        this._decorators = [];
-        this._storyStore = new StoryStore({ channel });
-        this._clientApi = new ClientApi({ storyStore: this._storyStore });
-        this._configApi = new ConfigApi({ storyStore: this._storyStore });
-        this._channel = channel;
-        const configure = loadCsf({
-            clientApi: this._clientApi,
-            storyStore: this._storyStore,
-            configApi: this._configApi,
-        });
-        this.configure = (...args) => configure('react-native', ...args);
-        addons.setChannel(channel);
-    }
-    _getStory(storyId) {
-        return this._storyStore.fromId(storyId);
-    }
-    _selectStoryEvent({ storyId }, shouldPersistSelection) {
-        if (storyId) {
-            if (shouldPersistSelection) {
-                AsyncStorage.setItem(STORAGE_KEY, JSON.stringify(storyId)).catch(() => { });
-            }
-            const story = this._getStory(storyId);
-            this._selectStory(story);
-        }
-    }
-    _selectStory(story) {
-        this._storyStore.setSelection({ storyId: story.id, viewMode: 'story' });
-        this._channel.emit(Events.SELECT_STORY, story);
-    }
-    _checkStory(storyId) {
-        if (!storyId) {
-            return null;
-        }
-        const story = this._getStory(storyId);
-        if (story === null || story.storyFn === null) {
-            return null;
-        }
-        return story;
-    }
-}

package/dist/preview/global.d.ts

@@ -1,8 +0,0 @@
-export {};
-declare global {
-    namespace NodeJS {
-        interface Global {
-            previousExports: Map<any, string>;
-        }
-    }
-}

package/dist/preview/index.d.ts

@@ -1 +0,0 @@
-export { default } from './Preview';

package/dist/preview/index.js

@@ -1 +0,0 @@
-export { default } from './Preview';

package/dist/preview/loadCsf.d.ts

@@ -1,16 +0,0 @@
-/// <reference types="webpack-env" />
-/// <reference types="node" />
-import { ClientApi, ConfigApi, StoryStore } from '@storybook/client-api';
-import './global';
-export interface RequireContext {
-    keys: () => string[];
-    (id: string): any;
-    resolve(id: string): string;
-}
-export declare type LoadableFunction = () => void | any[];
-export declare type Loadable = RequireContext | RequireContext[] | LoadableFunction;
-export declare const loadCsf: ({ clientApi, storyStore, configApi, }: {
-    clientApi: ClientApi;
-    storyStore: StoryStore;
-    configApi: ConfigApi;
-}) => (framework: string, loadable: Loadable, m: NodeModule, showDeprecationWarning?: boolean) => void;

package/dist/preview/loadCsf.js

@@ -1,175 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { logger } from '@storybook/client-logger';
-import { isExportStory, storyNameFromExport, toId } from '@storybook/csf';
-import './global';
-const deprecatedStoryAnnotationWarning = () => logger.log(`
-    CSF .story annotations deprecated; annotate story functions directly:
-    - StoryFn.story.name => StoryFn.storyName
-    - StoryFn.story.(parameters|decorators) => StoryFn.(parameters|decorators)
-    See https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#hoisted-csf-annotations for details and codemod.
-`);
-const duplicateKindWarning = (kindName) => {
-    logger.warn(`Duplicate title: '${kindName}'
-    Duplicate title used in multiple files; use unique titles or a primary file for a component with re-exported stories.
-
-    https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-support-for-duplicate-kinds
-  `);
-};
-global.previousExports = new Map();
-const loadStories = (loadable, framework, { clientApi, storyStore }) => () => {
-    // Make sure we don't try to define a kind more than once within the same load
-    const loadedKinds = new Set();
-    let reqs = null;
-    // todo discuss / improve type check
-    if (Array.isArray(loadable)) {
-        reqs = loadable;
-    }
-    else if (loadable.keys) {
-        reqs = [loadable];
-    }
-    let currentExports = new Map();
-    // reqs is not null when require context is used,
-    // this comes from storybook core client and will never be true in RN
-    // keeping this here only to get an idea how the core version could be re-used
-    if (reqs) {
-        reqs.forEach((req) => {
-            req.keys().forEach((filename) => {
-                try {
-                    const fileExports = req(filename);
-                    currentExports.set(fileExports, 
-                    // todo discuss: types infer that this is RequireContext; no checks needed?
-                    // NOTE: turns out `babel-plugin-require-context-hook` doesn't implement this (yet)
-                    typeof req.resolve === 'function' ? req.resolve(filename) : filename);
-                }
-                catch (error) {
-                    logger.warn(`Unexpected error while loading ${filename}: ${error}`);
-                }
-            });
-        });
-    }
-    else {
-        const exported = loadable();
-        if (Array.isArray(exported)) {
-            const csfExports = exported.filter((obj) => obj.default != null);
-            currentExports = new Map(csfExports.map((fileExports) => [fileExports, null]));
-        }
-        else {
-            logger.warn(`Loader function passed to 'configure' should return void or an array of module exports that all contain a 'default' export. Received: ${JSON.stringify(exported)}`);
-        }
-    }
-    const removed = Array.from(global.previousExports.keys()).filter((exp) => !currentExports.has(exp));
-    removed.forEach((exp) => {
-        if (exp.default) {
-            storyStore.removeStoryKind(exp.default.title);
-        }
-    });
-    const added = Array.from(currentExports.keys()).filter((exp) => !global.previousExports.has(exp));
-    added.forEach((fileExports) => {
-        // An old-style story file
-        if (!fileExports.default) {
-            return;
-        }
-        if (!fileExports.default.title) {
-            throw new Error(`Unexpected default export without title: ${JSON.stringify(fileExports.default)}`);
-        }
-        const { default: meta, __namedExportsOrder } = fileExports, namedExports = __rest(fileExports, ["default", "__namedExportsOrder"]);
-        let exports = namedExports;
-        // prefer a user/loader provided `__namedExportsOrder` array if supplied
-        // we do this as es module exports are always ordered alphabetically
-        // see https://github.com/storybookjs/storybook/issues/9136
-        if (Array.isArray(__namedExportsOrder)) {
-            exports = {};
-            __namedExportsOrder.forEach((name) => {
-                if (namedExports[name]) {
-                    exports[name] = namedExports[name];
-                }
-            });
-        }
-        const { title: kindName, id: componentId, parameters: kindParameters, decorators: kindDecorators, loaders: kindLoaders = [], component, subcomponents, args: kindArgs, argTypes: kindArgTypes, } = meta;
-        if (loadedKinds.has(kindName)) {
-            duplicateKindWarning(kindName);
-        }
-        loadedKinds.add(kindName);
-        // We pass true here to avoid the warning about HMR. It's cool clientApi, we got this
-        // todo discuss: TS now wants a NodeModule; should we fix this differently?
-        const kind = clientApi.storiesOf(kindName, true);
-        // we should always have a framework, rest optional
-        kind.addParameters(Object.assign(Object.assign({ framework,
-            component,
-            subcomponents, fileName: currentExports.get(fileExports) }, kindParameters), { args: kindArgs, argTypes: kindArgTypes }));
-        // todo add type
-        (kindDecorators || []).forEach((decorator) => {
-            kind.addDecorator(decorator);
-        });
-        kindLoaders.forEach((loader) => {
-            kind.addLoader(loader);
-        });
-        const storyExports = Object.keys(exports);
-        if (storyExports.length === 0) {
-            logger.warn(`
-          Found a story file for "${kindName}" but no exported stories.
-          Check the docs for reference: https://storybook.js.org/docs/formats/component-story-format/
-        `);
-            return;
-        }
-        storyExports.forEach((key) => {
-            if (isExportStory(key, meta)) {
-                const storyFn = exports[key];
-                const { story } = storyFn;
-                const name = story === null || story === void 0 ? void 0 : story.name;
-                const { storyName = name } = storyFn;
-                // storyFn.x and storyFn.story.x get merged with
-                // storyFn.x taking precedence in the merge
-                const parameters = Object.assign(Object.assign({}, story === null || story === void 0 ? void 0 : story.parameters), storyFn.parameters);
-                const decorators = [...(storyFn.decorators || []), ...((story === null || story === void 0 ? void 0 : story.decorators) || [])];
-                const loaders = [...(storyFn.loaders || []), ...((story === null || story === void 0 ? void 0 : story.loaders) || [])];
-                const args = Object.assign(Object.assign({}, story === null || story === void 0 ? void 0 : story.args), storyFn.args);
-                const argTypes = Object.assign(Object.assign({}, story === null || story === void 0 ? void 0 : story.argTypes), storyFn.argTypes);
-                if (story) {
-                    logger.debug('deprecated story', story);
-                    deprecatedStoryAnnotationWarning();
-                }
-                const exportName = storyNameFromExport(key);
-                const storyParams = Object.assign(Object.assign({}, parameters), { __id: toId(componentId || kindName, exportName), decorators,
-                    loaders,
-                    args,
-                    argTypes });
-                kind.add(storyName || exportName, storyFn, storyParams);
-            }
-        });
-    });
-    global.previousExports = currentExports;
-};
-const configureDeprecationWarning = () => logger.log(`\`configure()\` is deprecated and will be removed in Storybook 7.0. 
-Please use the \`stories\` field of \`main.js\` to load stories.
-Read more at https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-configure`);
-export const loadCsf = ({ clientApi, storyStore, configApi, }) => 
-/**
- * Load a collection of stories. If it has a default export, assume that it is a module-style
- * file and process its named exports as stories. If not, assume it's an old-style
- * storiesof file and require it.
- *
- * @param {*} framework - name of framework in use, e.g. "react"
- * @param {*} loadable a require.context `req`, an array of `req`s, or a loader function that returns void or an array of exports
- * @param {*} m - ES module object for hot-module-reloading (HMR)
- * @param {boolean} showDeprecationWarning - show the deprecation warning (default true)
- */
-(framework, loadable, m, showDeprecationWarning = true) => {
-    if (showDeprecationWarning) {
-        configureDeprecationWarning();
-    }
-    if (typeof m === 'string') {
-        throw new Error(`Invalid module '${m}'. Did you forget to pass \`module\` as the second argument to \`configure\`"?`);
-    }
-    configApi.configure(loadStories(loadable, framework, { clientApi, storyStore }), m);
-};

package/dist/types-6.0.d.ts

@@ -1,34 +0,0 @@
-import { Annotations, Args as DefaultArgs, BaseMeta, BaseStory } from '@storybook/addons';
-import { ComponentProps, ComponentType, JSXElementConstructor, ReactElement } from 'react';
-export declare type StoryFnReactReturnType = ReactElement<unknown>;
-export type { Args, ArgTypes, Parameters, StoryContext } from '@storybook/addons';
-declare type ReactComponent = ComponentType<any>;
-declare type ReactReturnType = StoryFnReactReturnType;
-/**
- * Metadata to configure the stories for a component.
- *
- * @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
- */
-export declare type Meta<Args = DefaultArgs> = BaseMeta<ReactComponent> & Annotations<Args, ReactReturnType>;
-/**
- * Story function that represents a component example.
- *
- * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
- */
-export declare type Story<Args = DefaultArgs> = BaseStory<Args, ReactReturnType> & Annotations<Args, ReactReturnType>;
-/**
- * For the common case where a component's stories are simple components that receives args as props:
- *
- * ```tsx
- * export default { ... } as ComponentMeta<typeof Button>;
- * ```
- */
-export declare type ComponentMeta<T extends keyof JSX.IntrinsicElements | JSXElementConstructor<any>> = Meta<ComponentProps<T>>;
-/**
- * For the common case where a story is a simple component that receives args as props:
- *
- * ```tsx
- * const Template: ComponentStory<typeof Button> = (args) => <Button {...args} />
- * ```
- */
-export declare type ComponentStory<T extends keyof JSX.IntrinsicElements | JSXElementConstructor<any>> = Story<ComponentProps<T>>;