@storybook/addon-docs 7.0.0-alpha.5 → 7.0.0-alpha.50

package/dist/esm/preset.js

@@ -1,132 +0,0 @@
-import fs from 'fs-extra';
-import remarkSlug from 'remark-slug';
-import remarkExternalLinks from 'remark-external-links';
-import global from 'global';
-import { logger } from '@storybook/node-logger';
-import { loadCsf } from '@storybook/csf-tools'; // for frameworks that are not working with react, we need to configure
-// the jsx to transpile mdx, for now there will be a flag for that
-// for more complex solutions we can find alone that we need to add '@babel/plugin-transform-react-jsx'
-
-function createBabelOptions({
-  babelOptions,
-  mdxBabelOptions,
-  configureJSX
-}) {
-  const babelPlugins = mdxBabelOptions?.plugins || babelOptions?.plugins || [];
-  const jsxPlugin = [require.resolve('@babel/plugin-transform-react-jsx'), {
-    pragma: 'React.createElement',
-    pragmaFrag: 'React.Fragment'
-  }];
-  const plugins = configureJSX ? [...babelPlugins, jsxPlugin] : babelPlugins;
-  return Object.assign({
-    // don't use the root babelrc by default (users can override this in mdxBabelOptions)
-    babelrc: false,
-    configFile: false
-  }, babelOptions, mdxBabelOptions, {
-    plugins
-  });
-}
-
-export async function webpack(webpackConfig = {}, options) {
-  const resolvedBabelLoader = require.resolve('babel-loader');
-
-  const {
-    module = {}
-  } = webpackConfig; // it will reuse babel options that are already in use in storybook
-  // also, these babel options are chained with other presets.
-
-  const {
-    babelOptions,
-    mdxBabelOptions,
-    configureJSX = true,
-    sourceLoaderOptions = {
-      injectStoryParameters: true
-    },
-    transcludeMarkdown = false
-  } = options;
-  const mdxLoaderOptions = {
-    skipCsf: true,
-    remarkPlugins: [remarkSlug, remarkExternalLinks]
-  };
-  const mdxVersion = global.FEATURES?.previewMdx2 ? 'MDX2' : 'MDX1';
-  logger.info(`Addon-docs: using ${mdxVersion}`);
-  const mdxLoader = global.FEATURES?.previewMdx2 ? require.resolve('@storybook/mdx2-csf/loader') : require.resolve('@storybook/mdx1-csf/loader'); // set `sourceLoaderOptions` to `null` to disable for manual configuration
-
-  const sourceLoader = sourceLoaderOptions ? [{
-    test: /\.(stories|story)\.[tj]sx?$/,
-    loader: require.resolve('@storybook/source-loader'),
-    options: Object.assign({}, sourceLoaderOptions, {
-      inspectLocalDependencies: true
-    }),
-    enforce: 'pre'
-  }] : [];
-  let rules = module.rules || [];
-
-  if (transcludeMarkdown) {
-    rules = [...rules.filter(rule => rule.test?.toString() !== '/\\.md$/'), {
-      test: /\.md$/,
-      use: [{
-        loader: resolvedBabelLoader,
-        options: createBabelOptions({
-          babelOptions,
-          mdxBabelOptions,
-          configureJSX
-        })
-      }, {
-        loader: mdxLoader,
-        options: mdxLoaderOptions
-      }]
-    }];
-  }
-
-  const result = Object.assign({}, webpackConfig, {
-    module: Object.assign({}, module, {
-      rules: [...rules, {
-        test: /(stories|story)\.mdx$/,
-        use: [{
-          loader: resolvedBabelLoader,
-          options: createBabelOptions({
-            babelOptions,
-            mdxBabelOptions,
-            configureJSX
-          })
-        }, {
-          loader: mdxLoader
-        }]
-      }, {
-        test: /\.mdx$/,
-        exclude: /(stories|story)\.mdx$/,
-        use: [{
-          loader: resolvedBabelLoader,
-          options: createBabelOptions({
-            babelOptions,
-            mdxBabelOptions,
-            configureJSX
-          })
-        }, {
-          loader: mdxLoader,
-          options: mdxLoaderOptions
-        }]
-      }, ...sourceLoader]
-    })
-  });
-  return result;
-}
-export const storyIndexers = async indexers => {
-  const mdxIndexer = async (fileName, opts) => {
-    let code = (await fs.readFile(fileName, 'utf-8')).toString(); // @ts-ignore
-
-    const {
-      compile
-    } = global.FEATURES?.previewMdx2 ? await import('@storybook/mdx2-csf') : await import('@storybook/mdx1-csf');
-    code = await compile(code, {});
-    return loadCsf(code, Object.assign({}, opts, {
-      fileName
-    })).parse();
-  };
-
-  return [{
-    test: /(stories|story)\.mdx$/,
-    indexer: mdxIndexer
-  }, ...(indexers || [])];
-};

package/dist/esm/preview.js

@@ -1,6 +0,0 @@
-export const parameters = {
-  docs: {
-    getContainer: async () => (await import('./blocks')).DocsContainer,
-    getPage: async () => (await import('./blocks')).DocsPage
-  }
-};

package/dist/esm/shared.js

@@ -1,11 +0,0 @@
-export const ADDON_ID = 'storybook/docs';
-export const PANEL_ID = `${ADDON_ID}/panel`;
-export const PARAM_KEY = `docs`;
-export const SNIPPET_RENDERED = `${ADDON_ID}/snippet-rendered`;
-export let SourceType;
-
-(function (SourceType) {
-  SourceType["AUTO"] = "auto";
-  SourceType["CODE"] = "code";
-  SourceType["DYNAMIC"] = "dynamic";
-})(SourceType || (SourceType = {}));

package/dist/types/blocks/Anchor.d.ts

@@ -1,6 +0,0 @@
-import { FC } from 'react';
-export declare const anchorBlockIdFromId: (storyId: string) => string;
-export interface AnchorProps {
-    storyId: string;
-}
-export declare const Anchor: FC<AnchorProps>;

package/dist/types/blocks/ArgsTable.d.ts

@@ -1,33 +0,0 @@
-import { FC } from 'react';
-import { SortType } from '@storybook/components';
-import { PropDescriptor } from '@storybook/store';
-import { StrictArgTypes } from '@storybook/csf';
-import { DocsContextProps } from './DocsContext';
-import { Component } from './types';
-interface BaseProps {
-    include?: PropDescriptor;
-    exclude?: PropDescriptor;
-    sort?: SortType;
-}
-declare type OfProps = BaseProps & {
-    of: '.' | '^' | Component;
-};
-declare type ComponentsProps = BaseProps & {
-    components: {
-        [label: string]: Component;
-    };
-};
-declare type StoryProps = BaseProps & {
-    story: '.' | '^' | string;
-    showComponent?: boolean;
-};
-declare type ArgsTableProps = BaseProps | OfProps | ComponentsProps | StoryProps;
-export declare const extractComponentArgTypes: (component: Component, { id, storyById }: DocsContextProps, include?: PropDescriptor, exclude?: PropDescriptor) => StrictArgTypes;
-export declare const getComponent: (props: ArgsTableProps, { id, storyById }: DocsContextProps) => Component;
-export declare const StoryTable: FC<StoryProps & {
-    component: Component;
-    subcomponents: Record<string, Component>;
-}>;
-export declare const ComponentsTable: FC<ComponentsProps>;
-export declare const ArgsTable: FC<ArgsTableProps>;
-export {};

package/dist/types/blocks/Canvas.d.ts

@@ -1,9 +0,0 @@
-import { FC } from 'react';
-import { PreviewProps as PurePreviewProps } from '@storybook/components';
-import { SourceState } from './Source';
-export { SourceState };
-declare type CanvasProps = PurePreviewProps & {
-    withSource?: SourceState;
-    mdxSource?: string;
-};
-export declare const Canvas: FC<CanvasProps>;

package/dist/types/blocks/Description.d.ts

@@ -1,20 +0,0 @@
-import { FunctionComponent } from 'react';
-import { DescriptionProps as PureDescriptionProps } from '@storybook/components';
-import { DocsContextProps } from './DocsContext';
-import { Component } from './types';
-export declare enum DescriptionType {
-    INFO = "info",
-    NOTES = "notes",
-    DOCGEN = "docgen",
-    LEGACY_5_2 = "legacy-5.2",
-    AUTO = "auto"
-}
-interface DescriptionProps {
-    of?: '.' | Component;
-    type?: DescriptionType;
-    markdown?: string;
-    children?: string;
-}
-export declare const getDescriptionProps: ({ of, type, markdown, children }: DescriptionProps, { id, storyById }: DocsContextProps<any>) => PureDescriptionProps;
-declare const DescriptionContainer: FunctionComponent<DescriptionProps>;
-export { DescriptionContainer as Description };

package/dist/types/blocks/DocsContainer.d.ts

@@ -1,7 +0,0 @@
-import { FunctionComponent } from 'react';
-import { AnyFramework } from '@storybook/csf';
-import { DocsContextProps } from './DocsContext';
-export interface DocsContainerProps<TFramework extends AnyFramework = AnyFramework> {
-    context: DocsContextProps<TFramework>;
-}
-export declare const DocsContainer: FunctionComponent<DocsContainerProps>;

package/dist/types/blocks/DocsContext.d.ts

@@ -1,5 +0,0 @@
-import { Context } from 'react';
-import type { DocsContextProps } from '@storybook/preview-web';
-import type { AnyFramework } from '@storybook/csf';
-export type { DocsContextProps };
-export declare const DocsContext: Context<DocsContextProps<AnyFramework>>;

package/dist/types/blocks/DocsPage.d.ts

@@ -1,2 +0,0 @@
-import { FC } from 'react';
-export declare const DocsPage: FC;

package/dist/types/blocks/DocsStory.d.ts

@@ -1,3 +0,0 @@
-import { FunctionComponent } from 'react';
-import { DocsStoryProps } from './types';
-export declare const DocsStory: FunctionComponent<DocsStoryProps>;

package/dist/types/blocks/Heading.d.ts

@@ -1,6 +0,0 @@
-import { FunctionComponent } from 'react';
-export interface HeadingProps {
-    children: JSX.Element | string;
-    disableAnchor?: boolean;
-}
-export declare const Heading: FunctionComponent<HeadingProps>;

package/dist/types/blocks/Meta.d.ts

@@ -1,9 +0,0 @@
-import { FC } from 'react';
-import { BaseAnnotations } from '@storybook/csf';
-declare type MetaProps = BaseAnnotations;
-/**
- * This component is used to declare component metadata in docs
- * and gets transformed into a default export underneath the hood.
- */
-export declare const Meta: FC<MetaProps>;
-export {};

package/dist/types/blocks/Preview.d.ts

@@ -1,3 +0,0 @@
-import { ComponentProps } from 'react';
-import { Canvas } from './Canvas';
-export declare const Preview: (props: ComponentProps<typeof Canvas>) => JSX.Element;

package/dist/types/blocks/Primary.d.ts

@@ -1,6 +0,0 @@
-import { FC } from 'react';
-interface PrimaryProps {
-    name?: string;
-}
-export declare const Primary: FC<PrimaryProps>;
-export {};

package/dist/types/blocks/Props.d.ts

@@ -1,3 +0,0 @@
-import { ComponentProps } from 'react';
-import { ArgsTable } from './ArgsTable';
-export declare const Props: (props: ComponentProps<typeof ArgsTable>) => JSX.Element;

package/dist/types/blocks/Source.d.ts

@@ -1,38 +0,0 @@
-import { ComponentProps, FC } from 'react';
-import { Source as PureSource } from '@storybook/components';
-import { DocsContextProps } from './DocsContext';
-import { SourceContextProps } from './SourceContainer';
-export declare enum SourceState {
-    OPEN = "open",
-    CLOSED = "closed",
-    NONE = "none"
-}
-interface CommonProps {
-    language?: string;
-    dark?: boolean;
-    format?: PureSourceProps['format'];
-    code?: string;
-}
-declare type SingleSourceProps = {
-    id: string;
-} & CommonProps;
-declare type MultiSourceProps = {
-    ids: string[];
-} & CommonProps;
-declare type CodeProps = {
-    code: string;
-} & CommonProps;
-declare type NoneProps = CommonProps;
-declare type SourceProps = SingleSourceProps | MultiSourceProps | CodeProps | NoneProps;
-declare type SourceStateProps = {
-    state: SourceState;
-};
-declare type PureSourceProps = ComponentProps<typeof PureSource>;
-export declare const getSourceProps: (props: SourceProps, docsContext: DocsContextProps<any>, sourceContext: SourceContextProps) => PureSourceProps & SourceStateProps;
-/**
- * Story source doc block renders source code if provided,
- * or the source for a story if `storyId` is provided, or
- * the source for the current story if nothing is provided.
- */
-export declare const Source: FC<PureSourceProps>;
-export {};

package/dist/types/blocks/SourceContainer.d.ts

@@ -1,14 +0,0 @@
-import { FC, Context } from 'react';
-import type { SyntaxHighlighterFormatTypes } from '@storybook/components';
-import type { StoryId } from '@storybook/api';
-export interface SourceItem {
-    code: string;
-    format: SyntaxHighlighterFormatTypes;
-}
-export declare type StorySources = Record<StoryId, SourceItem>;
-export interface SourceContextProps {
-    sources: StorySources;
-    setSource?: (id: StoryId, item: SourceItem) => void;
-}
-export declare const SourceContext: Context<SourceContextProps>;
-export declare const SourceContainer: FC<{}>;

package/dist/types/blocks/Stories.d.ts

@@ -1,7 +0,0 @@
-import { FunctionComponent } from 'react';
-interface StoriesProps {
-    title?: JSX.Element | string;
-    includePrimary?: boolean;
-}
-export declare const Stories: FunctionComponent<StoriesProps>;
-export {};

package/dist/types/blocks/Story.d.ts

@@ -1,28 +0,0 @@
-import { FunctionComponent, ReactNode, ElementType, ComponentProps } from 'react';
-import { Story as PureStory } from '@storybook/components';
-import { StoryId, StoryAnnotations, AnyFramework } from '@storybook/csf';
-import type { Story as StoryType } from '@storybook/store';
-import { DocsContextProps } from './DocsContext';
-export declare const storyBlockIdFromId: (storyId: string) => string;
-declare type PureStoryProps = ComponentProps<typeof PureStory>;
-declare type CommonProps = StoryAnnotations & {
-    height?: string;
-    inline?: boolean;
-};
-declare type StoryDefProps = {
-    name: string;
-    children: ReactNode;
-};
-declare type StoryRefProps = {
-    id?: string;
-};
-declare type StoryImportProps = {
-    name: string;
-    story: ElementType;
-};
-export declare type StoryProps = (StoryDefProps | StoryRefProps | StoryImportProps) & CommonProps;
-export declare const lookupStoryId: (storyName: string, { mdxStoryNameToKey, mdxComponentAnnotations }: DocsContextProps) => string;
-export declare const getStoryId: (props: StoryProps, context: DocsContextProps) => StoryId;
-export declare const getStoryProps: <TFramework extends AnyFramework>({ height, inline }: StoryProps, story: StoryType<TFramework>) => PureStoryProps;
-declare const Story: FunctionComponent<StoryProps>;
-export { Story };

package/dist/types/blocks/Subheading.d.ts

@@ -1,3 +0,0 @@
-import { FunctionComponent } from 'react';
-import { HeadingProps } from './Heading';
-export declare const Subheading: FunctionComponent<HeadingProps>;

package/dist/types/blocks/Subtitle.d.ts

@@ -1,6 +0,0 @@
-import { FunctionComponent } from 'react';
-interface SubtitleProps {
-    children?: JSX.Element | string;
-}
-export declare const Subtitle: FunctionComponent<SubtitleProps>;
-export {};

package/dist/types/blocks/Title.d.ts

@@ -1,8 +0,0 @@
-import { FunctionComponent } from 'react';
-import { DocsContextProps } from './DocsContext';
-interface TitleProps {
-    children?: JSX.Element | string;
-}
-export declare const extractTitle: ({ title }: DocsContextProps) => string;
-export declare const Title: FunctionComponent<TitleProps>;
-export {};

package/dist/types/blocks/Wrapper.d.ts

@@ -1,2 +0,0 @@
-import { FunctionComponent } from 'react';
-export declare const Wrapper: FunctionComponent;

package/dist/types/blocks/enhanceSource.d.ts

@@ -1,3 +0,0 @@
-import type { Parameters } from '@storybook/addons';
-import type { Story } from '@storybook/store';
-export declare const enhanceSource: (story: Story<any>) => Parameters;

package/dist/types/blocks/index.d.ts

@@ -1,24 +0,0 @@
-export { ColorPalette, ColorItem, IconGallery, IconItem, Typeset } from '@storybook/components';
-export * from './Anchor';
-export * from './ArgsTable';
-export * from './Canvas';
-export * from './Description';
-export * from './DocsContext';
-export * from './DocsPage';
-export * from './DocsContainer';
-export * from './DocsStory';
-export * from './Heading';
-export * from './Meta';
-export * from './Preview';
-export * from './Primary';
-export * from './Props';
-export * from './Source';
-export * from './SourceContainer';
-export * from './Stories';
-export * from './Story';
-export * from './Subheading';
-export * from './Subtitle';
-export * from './Title';
-export * from './Wrapper';
-export * from './types';
-export * from './mdx';

package/dist/types/blocks/mdx.d.ts

@@ -1,20 +0,0 @@
-import { FC } from 'react';
-import { DocsContextProps } from './DocsContext';
-export declare const assertIsFn: (val: any) => any;
-export declare const AddContext: FC<DocsContextProps>;
-interface CodeOrSourceMdxProps {
-    className?: string;
-}
-export declare const CodeOrSourceMdx: FC<CodeOrSourceMdxProps>;
-interface AnchorMdxProps {
-    href: string;
-    target: string;
-}
-export declare const AnchorMdx: FC<AnchorMdxProps>;
-interface HeaderMdxProps {
-    as: string;
-    id: string;
-}
-export declare const HeaderMdx: FC<HeaderMdxProps>;
-export declare const HeadersMdx: {};
-export {};

package/dist/types/blocks/types.d.ts

@@ -1,13 +0,0 @@
-export declare const CURRENT_SELECTION = ".";
-export declare const PRIMARY_STORY = "^";
-export declare type Component = any;
-export interface StoryData {
-    id?: string;
-    kind?: string;
-    name?: string;
-    parameters?: any;
-}
-export declare type DocsStoryProps = StoryData & {
-    expanded?: boolean;
-    withToolbar?: boolean;
-};

package/dist/types/blocks/useStory.d.ts

@@ -1,5 +0,0 @@
-import type { StoryId, AnyFramework } from '@storybook/csf';
-import type { Story } from '@storybook/store';
-import { DocsContextProps } from './DocsContext';
-export declare function useStory<TFramework extends AnyFramework = AnyFramework>(storyId: StoryId, context: DocsContextProps<TFramework>): Story<TFramework> | void;
-export declare function useStories<TFramework extends AnyFramework = AnyFramework>(storyIds: StoryId[], context: DocsContextProps<TFramework>): (Story<TFramework> | void)[];

package/dist/types/blocks/utils.d.ts

@@ -1,3 +0,0 @@
-import { Component } from './types';
-export declare const getComponentName: (component: Component) => string;
-export declare function scrollToElement(element: any, block?: string): void;

package/dist/types/index.d.ts

@@ -1 +0,0 @@
-export * from './blocks';

package/dist/types/manager.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/preset.d.ts

@@ -1,12 +0,0 @@
-import type { Options, StoryIndexer } from '@storybook/core-common';
-declare type BabelParams = {
-    babelOptions?: any;
-    mdxBabelOptions?: any;
-    configureJSX?: boolean;
-};
-export declare function webpack(webpackConfig: any, options: Options & BabelParams & {
-    sourceLoaderOptions: any;
-    transcludeMarkdown: boolean;
-}): Promise<any>;
-export declare const storyIndexers: (indexers?: StoryIndexer[]) => Promise<StoryIndexer[]>;
-export {};

package/dist/types/preview.d.ts

@@ -1,6 +0,0 @@
-export declare const parameters: {
-    docs: {
-        getContainer: () => Promise<import("react").FunctionComponent<import("./blocks").DocsContainerProps<import("@storybook/csf").AnyFramework>>>;
-        getPage: () => Promise<import("react").FC<{}>>;
-    };
-};

package/dist/types/shared.d.ts

@@ -1,24 +0,0 @@
-export declare const ADDON_ID = "storybook/docs";
-export declare const PANEL_ID: string;
-export declare const PARAM_KEY = "docs";
-export declare const SNIPPET_RENDERED: string;
-export declare enum SourceType {
-    /**
-     * AUTO is the default
-     *
-     * Use the CODE logic if:
-     * - the user has set a custom source snippet in `docs.source.code` story parameter
-     * - the story is not an args-based story
-     *
-     * Use the DYNAMIC rendered snippet if the story is an args story
-     */
-    AUTO = "auto",
-    /**
-     * Render the code extracted by source-loader
-     */
-    CODE = "code",
-    /**
-     * Render dynamically-rendered source snippet from the story's virtual DOM (currently React only)
-     */
-    DYNAMIC = "dynamic"
-}

package/manager.js

@@ -1 +0,0 @@
-import './dist/esm/manager';

package/mdx-compiler-plugin.js

@@ -1 +0,0 @@
-module.exports = require('@storybook/mdx1-csf').createCompiler;

package/register.js

@@ -1,6 +0,0 @@
-import { once } from '@storybook/client-logger';
-import './manager';
-
-once.warn(
-  'register.js is deprecated see https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-registerjs'
-);