///
import { HooksContext } from './hooks';
import { Addon } from './index';
export declare enum types {
TAB = "tab",
PANEL = "panel",
TOOL = "tool",
TOOLEXTRA = "toolextra",
PREVIEW = "preview",
NOTES_ELEMENT = "notes-element"
}
export declare type Types = types | string;
export declare function isSupportedType(type: Types): boolean;
export declare type StoryId = string;
export declare type StoryKind = string;
export declare type StoryName = string;
export declare type ViewMode = 'story' | 'docs';
export interface Parameters {
fileName?: string;
options?: OptionsParameter;
/** The layout property defines basic styles added to the preview body where the story is rendered. If you pass 'none', no styles are applied. */
layout?: 'centered' | 'fullscreen' | 'padded' | 'none';
docsOnly?: boolean;
[key: string]: any;
}
export interface Args {
[key: string]: any;
}
export interface ArgType {
name?: string;
description?: string;
defaultValue?: any;
[key: string]: any;
}
export interface ArgTypes {
[key: string]: ArgType;
}
export interface StoryIdentifier {
id: StoryId;
kind: StoryKind;
name: StoryName;
}
export declare type StoryContextUpdate = Partial;
export declare type StoryContext = StoryIdentifier & {
[key: string]: any;
parameters: Parameters;
args: Args;
argTypes: ArgTypes;
globals: Args;
hooks?: HooksContext;
viewMode?: ViewMode;
originalStoryFn?: ArgsStoryFn;
};
export interface WrapperSettings {
options: OptionsParameter;
parameters: {
[key: string]: any;
};
}
export declare type Comparator = ((a: T, b: T) => boolean) | ((a: T, b: T) => number);
export declare type StorySortMethod = 'configure' | 'alphabetical';
export interface StorySortObjectParameter {
method?: StorySortMethod;
order?: any[];
locales?: string;
includeNames?: boolean;
}
export declare type StorySortComparator = Comparator<[StoryId, any, Parameters, Parameters]>;
export declare type StorySortParameter = StorySortComparator | StorySortObjectParameter;
export interface OptionsParameter extends Object {
storySort?: StorySortParameter;
theme?: {
base: string;
brandTitle?: string;
};
[key: string]: any;
}
export declare type StoryGetter = (context: StoryContext) => any;
export declare type PartialStoryFn = (p?: StoryContextUpdate) => ReturnType;
export declare type LegacyStoryFn = (p?: StoryContext) => ReturnType;
export declare type ArgsStoryFn = (a?: Args, p?: StoryContext) => ReturnType;
export declare type StoryFn = LegacyStoryFn | ArgsStoryFn;
export declare type StoryWrapper = (getStory: StoryGetter, context: StoryContext, settings: WrapperSettings) => any;
export declare type MakeDecoratorResult = (...args: any) => any;
export interface AddStoryArgs {
id: StoryId;
kind: StoryKind;
name: StoryName;
storyFn: StoryFn;
parameters: Parameters;
}
export interface ClientApiAddon extends Addon {
apply: (a: StoryApi, b: any[]) => any;
}
export interface ClientApiAddons {
[key: string]: ClientApiAddon;
}
export declare type ClientApiReturnFn = (...args: any[]) => StoryApi;
export interface StoryApi {
kind: StoryKind;
add: (storyName: StoryName, storyFn: StoryFn, parameters?: Parameters) => StoryApi;
addDecorator: (decorator: DecoratorFunction) => StoryApi;
addLoader: (decorator: LoaderFunction) => StoryApi;
addParameters: (parameters: Parameters) => StoryApi;
[k: string]: string | ClientApiReturnFn;
}
export declare type DecoratorFunction = (fn: PartialStoryFn, c: StoryContext) => ReturnType>;
export declare type LoaderFunction = (c: StoryContext) => Promise>;
export declare type DecorateStoryFunction = (storyFn: LegacyStoryFn, decorators: DecoratorFunction[]) => LegacyStoryFn;
export interface ClientStoryApi {
storiesOf(kind: StoryKind, module: NodeModule): StoryApi;
addDecorator(decorator: DecoratorFunction): StoryApi;
addParameters(parameter: Parameters): StoryApi;
}
declare type LoadFn = () => any;
declare type RequireContext = any;
export declare type Loadable = RequireContext | [RequireContext] | LoadFn;
export declare type BaseDecorators = Array<(story: () => StoryFnReturnType, context: StoryContext) => StoryFnReturnType>;
export interface BaseAnnotations {
/**
* Dynamic data that are provided (and possibly updated by) Storybook and its addons.
* @see [Arg story inputs](https://storybook.js.org/docs/react/api/csf#args-story-inputs)
*/
args?: Partial;
/**
* ArgTypes encode basic metadata for args, such as `name`, `description`, `defaultValue` for an arg. These get automatically filled in by Storybook Docs.
* @see [Control annotations](https://github.com/storybookjs/storybook/blob/91e9dee33faa8eff0b342a366845de7100415367/addons/controls/README.md#control-annotations)
*/
argTypes?: ArgTypes;
/**
* Custom metadata for a story.
* @see [Parameters](https://storybook.js.org/docs/basics/writing-stories/#parameters)
*/
parameters?: Parameters;
/**
* Wrapper components or Storybook decorators that wrap a story.
*
* Decorators defined in Meta will be applied to every story variation.
* @see [Decorators](https://storybook.js.org/docs/addons/introduction/#1-decorators)
*/
decorators?: BaseDecorators;
}
export interface Annotations extends BaseAnnotations {
/**
* Used to only include certain named exports as stories. Useful when you want to have non-story exports such as mock data or ignore a few stories.
* @example
* includeStories: ['SimpleStory', 'ComplexStory']
* includeStories: /.*Story$/
*
* @see [Non-story exports](https://storybook.js.org/docs/formats/component-story-format/#non-story-exports)
*/
includeStories?: string[] | RegExp;
/**
* Used to exclude certain named exports. Useful when you want to have non-story exports such as mock data or ignore a few stories.
* @example
* excludeStories: ['simpleData', 'complexData']
* excludeStories: /.*Data$/
*
* @see [Non-story exports](https://storybook.js.org/docs/formats/component-story-format/#non-story-exports)
*/
excludeStories?: string[] | RegExp;
}
export interface BaseMeta {
/**
* Title of the story which will be presented in the navigation. **Should be unique.**
*
* Stories can be organized in a nested structure using "/" as a separator.
*
* @example
* export default {
* ...
* title: 'Design System/Atoms/Button'
* }
*
* @see [Story Hierarchy](https://storybook.js.org/docs/basics/writing-stories/#story-hierarchy)
*/
title: string;
/**
* The primary component for your story.
*
* Used by addons for automatic prop table generation and display of other component metadata.
*/
component?: ComponentType;
/**
* Auxiliary subcomponents that are part of the stories.
*
* Used by addons for automatic prop table generation and display of other component metadata.
*
* @example
* import { Button, ButtonGroup } from './components';
*
* export default {
* ...
* subcomponents: { Button, ButtonGroup }
* }
*
* By defining them each component will have its tab in the args table.
*/
subcomponents?: Record;
}
export interface BaseStory {
(args: Args, context: StoryContext): StoryFnReturnType;
/**
* Override the display name in the UI
*/
storyName?: string;
}
export {};