import * as _storybook_types from '@storybook/types'; import { Renderer, StoryId, StoryRenderOptions, ViewMode, PreparedStory, RenderToCanvas, RenderContextCallbacks, DocsContextProps, CSFFile, ModuleExports, ResolvedModuleExportType, ModuleExport, ResolvedModuleExportFromType, StoryName, StoryContextForLoaders, IndexEntry, StoryIndex, ModuleImportFn, ProjectAnnotations, Globals, Args } from '@storybook/types'; export { DocsContextProps, DocsRenderFunction, ProjectAnnotations as WebProjectAnnotations } from '@storybook/types'; export { c as composeConfigs } from './composeConfigs-62a04721.js'; import { Channel } from '@storybook/channels'; import { S as StoryStore, d as StorySpecifier } from './StoryStore-f7424ddf.js'; import 'synchronous-promise'; import './hooks-655fa363.js'; type RenderType = 'story' | 'docs'; /** * A "Render" represents the rendering of a single entry to a single location * * The implemenations of render are used for two key purposes: * - Tracking the state of the rendering as it moves between preparing, rendering and tearing down. * - Tracking what is rendered to know if a change requires re-rendering or teardown + recreation. */ interface Render { type: RenderType; id: StoryId; isPreparing: () => boolean; isEqual: (other: Render) => boolean; disableKeyListeners: boolean; teardown?: (options: { viewModeChanged: boolean; }) => Promise; torndown: boolean; renderToElement: (canvasElement: TRenderer['canvasElement'], renderStoryToElement?: any, options?: StoryRenderOptions) => Promise; } type RenderPhase = 'preparing' | 'loading' | 'rendering' | 'playing' | 'played' | 'completed' | 'aborted' | 'errored'; declare class StoryRender implements Render { channel: Channel; store: StoryStore; private renderToScreen; private callbacks; id: StoryId; viewMode: ViewMode; renderOptions: StoryRenderOptions; type: RenderType; story?: PreparedStory; phase?: RenderPhase; private abortController?; private canvasElement?; private notYetRendered; disableKeyListeners: boolean; private teardownRender; torndown: boolean; constructor(channel: Channel, store: StoryStore, renderToScreen: RenderToCanvas, callbacks: RenderContextCallbacks, id: StoryId, viewMode: ViewMode, renderOptions?: StoryRenderOptions, story?: PreparedStory); private runPhase; prepare(): Promise; isEqual(other: Render): boolean; isPreparing(): boolean; isPending(): boolean; renderToElement(canvasElement: TRenderer['canvasElement']): Promise; private storyContext; render({ initial, forceRemount, }?: { initial?: boolean; forceRemount?: boolean; }): Promise; rerender(): Promise; remount(): Promise; cancelRender(): void; teardown(): Promise; } declare class DocsContext implements DocsContextProps { channel: Channel; protected store: StoryStore; renderStoryToElement: DocsContextProps['renderStoryToElement']; private componentStoriesValue; private storyIdToCSFFile; private exportToStory; private exportsToCSFFile; private nameToStoryId; private attachedCSFFile?; private primaryStory?; constructor(channel: Channel, store: StoryStore, renderStoryToElement: DocsContextProps['renderStoryToElement'], /** The CSF files known (via the index) to be refererenced by this docs file */ csfFiles: CSFFile[]); referenceCSFFile(csfFile: CSFFile): void; attachCSFFile(csfFile: CSFFile): void; referenceMeta(metaExports: ModuleExports, attach: boolean): void; get projectAnnotations(): _storybook_types.NormalizedProjectAnnotations; private resolveAttachedModuleExportType; private resolveModuleExport; resolveOf(moduleExportOrType: ModuleExport | TType, validTypes?: TType[]): ResolvedModuleExportFromType; storyIdByName: (storyName: StoryName) => string; componentStories: () => PreparedStory[]; storyById: (storyId?: StoryId) => PreparedStory; getStoryContext: (story: PreparedStory) => StoryContextForLoaders; loadStory: (id: StoryId) => Promise>; } /** * A CsfDocsRender is a render of a docs entry that is rendered based on a CSF file. * * The expectation is the primary CSF file which is the `importPath` for the entry will * define a story which may contain the actual rendered JSX code for the template in the * `docs.page` parameter. * * Use cases: * - Autodocs, where there is no story, and we fall back to the globally defined template. * - *.stories.mdx files, where the MDX compiler produces a CSF file with a `.parameter.docs.page` * parameter containing the compiled content of the MDX file. */ declare class CsfDocsRender implements Render { protected channel: Channel; protected store: StoryStore; entry: IndexEntry; private callbacks; readonly type: RenderType; readonly subtype = "csf"; readonly id: StoryId; story?: PreparedStory; rerender?: () => Promise; teardownRender?: (options: { viewModeChanged?: boolean; }) => Promise; torndown: boolean; readonly disableKeyListeners = false; preparing: boolean; csfFiles?: CSFFile[]; constructor(channel: Channel, store: StoryStore, entry: IndexEntry, callbacks: RenderContextCallbacks); isPreparing(): boolean; prepare(): Promise; isEqual(other: Render): boolean; docsContext(renderStoryToElement: DocsContextProps['renderStoryToElement']): DocsContext; renderToElement(canvasElement: TRenderer['canvasElement'], renderStoryToElement: DocsContextProps['renderStoryToElement']): Promise; teardown({ viewModeChanged }?: { viewModeChanged?: boolean; }): Promise; } /** * A MdxDocsRender is a render of a docs entry that comes from a true MDX file, * that is a `.mdx` file that doesn't get compiled to a CSF file. * * A MDX render can reference (import) zero or more CSF files that contain stories. * * Use cases: * - *.mdx file that may or may not reference a specific CSF file with `` */ declare class MdxDocsRender implements Render { protected channel: Channel; protected store: StoryStore; entry: IndexEntry; private callbacks; readonly type: RenderType; readonly subtype = "mdx"; readonly id: StoryId; private exports?; rerender?: () => Promise; teardownRender?: (options: { viewModeChanged?: boolean; }) => Promise; torndown: boolean; readonly disableKeyListeners = false; preparing: boolean; csfFiles?: CSFFile[]; constructor(channel: Channel, store: StoryStore, entry: IndexEntry, callbacks: RenderContextCallbacks); isPreparing(): boolean; prepare(): Promise; isEqual(other: Render): boolean; docsContext(renderStoryToElement: DocsContextProps['renderStoryToElement']): DocsContext; renderToElement(canvasElement: TRenderer['canvasElement'], renderStoryToElement: DocsContextProps['renderStoryToElement']): Promise; teardown({ viewModeChanged }?: { viewModeChanged?: boolean; }): Promise; } type MaybePromise = Promise | T; declare class Preview { protected channel: Channel; /** * @deprecated will be removed in 8.0, please use channel instead */ serverChannel?: Channel; storyStore: StoryStore; getStoryIndex?: () => StoryIndex; importFn?: ModuleImportFn; renderToCanvas?: RenderToCanvas; storyRenders: StoryRender[]; previewEntryError?: Error; constructor(channel?: Channel); initialize({ getStoryIndex, importFn, getProjectAnnotations, }: { getStoryIndex?: () => StoryIndex; importFn: ModuleImportFn; getProjectAnnotations: () => MaybePromise>; }): Promise; setupListeners(): void; getProjectAnnotationsOrRenderError(getProjectAnnotations: () => MaybePromise>): Promise>; initializeWithProjectAnnotations(projectAnnotations: ProjectAnnotations): Promise; setInitialGlobals(): Promise; emitGlobals(): void; getStoryIndexFromServer(): Promise; initializeWithStoryIndex(storyIndex: StoryIndex): PromiseLike; onGetProjectAnnotationsChanged({ getProjectAnnotations, }: { getProjectAnnotations: () => MaybePromise>; }): Promise; onStoryIndexChanged(): Promise; onStoriesChanged({ importFn, storyIndex, }: { importFn?: ModuleImportFn; storyIndex?: StoryIndex; }): Promise; onUpdateGlobals({ globals }: { globals: Globals; }): Promise; onUpdateArgs({ storyId, updatedArgs }: { storyId: StoryId; updatedArgs: Args; }): Promise; onResetArgs({ storyId, argNames }: { storyId: string; argNames?: string[]; }): Promise; onForceReRender(): Promise; onForceRemount({ storyId }: { storyId: StoryId; }): Promise; renderStoryToElement(story: PreparedStory, element: TRenderer['canvasElement'], callbacks: RenderContextCallbacks, options: StoryRenderOptions): () => Promise; teardownRender(render: StoryRender | CsfDocsRender | MdxDocsRender, { viewModeChanged }?: { viewModeChanged?: boolean; }): Promise; extract(options?: { includeDocsOnly: boolean; }): Promise>>; renderPreviewEntryError(reason: string, err: Error): void; } interface SelectionSpecifier { storySpecifier: StorySpecifier; viewMode: ViewMode; args?: Args; globals?: Args; } interface Selection { storyId: StoryId; viewMode: ViewMode; } interface SelectionStore { selectionSpecifier: SelectionSpecifier | null; selection?: Selection; setSelection(selection: Selection): void; setQueryParams(queryParams: qs.ParsedQs): void; } interface View { prepareForStory(story: PreparedStory): TStorybookRoot; prepareForDocs(): TStorybookRoot; showErrorDisplay(err: { message?: string; stack?: string; }): void; showNoPreview(): void; showPreparingStory(options?: { immediate: boolean; }): void; showPreparingDocs(options?: { immediate: boolean; }): void; showMain(): void; showDocs(): void; showStory(): void; showStoryDuringRender(): void; } type PossibleRender = StoryRender | CsfDocsRender | MdxDocsRender; declare class PreviewWithSelection extends Preview { selectionStore: SelectionStore; view: View; currentSelection?: Selection; currentRender?: PossibleRender; constructor(selectionStore: SelectionStore, view: View); setupListeners(): void; setInitialGlobals(): Promise; initializeWithStoryIndex(storyIndex: StoryIndex): PromiseLike; selectSpecifiedStory(): Promise; onGetProjectAnnotationsChanged({ getProjectAnnotations, }: { getProjectAnnotations: () => MaybePromise>; }): Promise; onStoriesChanged({ importFn, storyIndex, }: { importFn?: ModuleImportFn; storyIndex?: StoryIndex; }): Promise; onKeydown(event: KeyboardEvent): void; onSetCurrentStory(selection: { storyId: StoryId; viewMode?: ViewMode; }): Promise; onUpdateQueryParams(queryParams: any): void; onUpdateGlobals({ globals }: { globals: Globals; }): Promise; onUpdateArgs({ storyId, updatedArgs }: { storyId: StoryId; updatedArgs: Args; }): Promise; onPreloadStories({ ids }: { ids: string[]; }): Promise; renderSelection({ persistedArgs }?: { persistedArgs?: Args; }): Promise; teardownRender(render: PossibleRender, { viewModeChanged }?: { viewModeChanged?: boolean; }): Promise; extract(options?: { includeDocsOnly: boolean; }): Promise>>; mainStoryCallbacks(storyId: StoryId): { showMain: () => void; showError: (err: { title: string; description: string; }) => void; showException: (err: Error) => void; }; renderPreviewEntryError(reason: string, err: Error): void; renderMissingStory(): void; renderStoryLoadingException(storySpecifier: StorySpecifier, err: Error): void; renderException(storyId: StoryId, error: Error): void; renderError(storyId: StoryId, { title, description }: { title: string; description: string; }): void; } declare class PreviewWeb extends PreviewWithSelection { constructor(); } declare function simulateDOMContentLoaded(): void; declare function simulatePageLoad($container: any): void; export { DocsContext, Preview, PreviewWeb, PreviewWithSelection, simulateDOMContentLoaded, simulatePageLoad };