UNPKG

8.61 kBTypeScriptView Raw
1/// <reference types="webpack-env" />
2import { HooksContext } from './hooks';
3import { Addon } from './index';
4export declare enum types {
5 TAB = "tab",
6 PANEL = "panel",
7 TOOL = "tool",
8 TOOLEXTRA = "toolextra",
9 PREVIEW = "preview",
10 NOTES_ELEMENT = "notes-element"
11}
12export declare type Types = types | string;
13export declare function isSupportedType(type: Types): boolean;
14export declare type StoryId = string;
15export declare type StoryKind = string;
16export declare type StoryName = string;
17export declare type ViewMode = 'story' | 'docs';
18export interface Parameters {
19 fileName?: string;
20 options?: OptionsParameter;
21 /** The layout property defines basic styles added to the preview body where the story is rendered. If you pass 'none', no styles are applied. */
22 layout?: 'centered' | 'fullscreen' | 'padded' | 'none';
23 docsOnly?: boolean;
24 [key: string]: any;
25}
26export interface Args {
27 [key: string]: any;
28}
29export interface ArgType {
30 name?: string;
31 description?: string;
32 defaultValue?: any;
33 [key: string]: any;
34}
35export interface ArgTypes {
36 [key: string]: ArgType;
37}
38export interface StoryIdentifier {
39 id: StoryId;
40 kind: StoryKind;
41 name: StoryName;
42}
43export declare type StoryContextUpdate = Partial<StoryContext>;
44export declare type StoryContext = StoryIdentifier & {
45 [key: string]: any;
46 parameters: Parameters;
47 args: Args;
48 argTypes: ArgTypes;
49 globals: Args;
50 hooks?: HooksContext;
51 viewMode?: ViewMode;
52 originalStoryFn?: ArgsStoryFn;
53};
54export interface WrapperSettings {
55 options: OptionsParameter;
56 parameters: {
57 [key: string]: any;
58 };
59}
60export declare type Comparator<T> = ((a: T, b: T) => boolean) | ((a: T, b: T) => number);
61export declare type StorySortMethod = 'configure' | 'alphabetical';
62export interface StorySortObjectParameter {
63 method?: StorySortMethod;
64 order?: any[];
65 locales?: string;
66 includeNames?: boolean;
67}
68export declare type StorySortComparator = Comparator<[StoryId, any, Parameters, Parameters]>;
69export declare type StorySortParameter = StorySortComparator | StorySortObjectParameter;
70export interface OptionsParameter extends Object {
71 storySort?: StorySortParameter;
72 theme?: {
73 base: string;
74 brandTitle?: string;
75 };
76 [key: string]: any;
77}
78export declare type StoryGetter = (context: StoryContext) => any;
79export declare type PartialStoryFn<ReturnType = unknown> = (p?: StoryContextUpdate) => ReturnType;
80export declare type LegacyStoryFn<ReturnType = unknown> = (p?: StoryContext) => ReturnType;
81export declare type ArgsStoryFn<ReturnType = unknown> = (a?: Args, p?: StoryContext) => ReturnType;
82export declare type StoryFn<ReturnType = unknown> = LegacyStoryFn<ReturnType> | ArgsStoryFn<ReturnType>;
83export declare type StoryWrapper = (getStory: StoryGetter, context: StoryContext, settings: WrapperSettings) => any;
84export declare type MakeDecoratorResult = (...args: any) => any;
85export interface AddStoryArgs<StoryFnReturnType = unknown> {
86 id: StoryId;
87 kind: StoryKind;
88 name: StoryName;
89 storyFn: StoryFn<StoryFnReturnType>;
90 parameters: Parameters;
91}
92export interface ClientApiAddon<StoryFnReturnType = unknown> extends Addon {
93 apply: (a: StoryApi<StoryFnReturnType>, b: any[]) => any;
94}
95export interface ClientApiAddons<StoryFnReturnType> {
96 [key: string]: ClientApiAddon<StoryFnReturnType>;
97}
98export declare type ClientApiReturnFn<StoryFnReturnType> = (...args: any[]) => StoryApi<StoryFnReturnType>;
99export interface StoryApi<StoryFnReturnType = unknown> {
100 kind: StoryKind;
101 add: (storyName: StoryName, storyFn: StoryFn<StoryFnReturnType>, parameters?: Parameters) => StoryApi<StoryFnReturnType>;
102 addDecorator: (decorator: DecoratorFunction<StoryFnReturnType>) => StoryApi<StoryFnReturnType>;
103 addLoader: (decorator: LoaderFunction) => StoryApi<StoryFnReturnType>;
104 addParameters: (parameters: Parameters) => StoryApi<StoryFnReturnType>;
105 [k: string]: string | ClientApiReturnFn<StoryFnReturnType>;
106}
107export declare type DecoratorFunction<StoryFnReturnType = unknown> = (fn: PartialStoryFn<StoryFnReturnType>, c: StoryContext) => ReturnType<LegacyStoryFn<StoryFnReturnType>>;
108export declare type LoaderFunction = (c: StoryContext) => Promise<Record<string, any>>;
109export declare type DecorateStoryFunction<StoryFnReturnType = unknown> = (storyFn: LegacyStoryFn<StoryFnReturnType>, decorators: DecoratorFunction<StoryFnReturnType>[]) => LegacyStoryFn<StoryFnReturnType>;
110export interface ClientStoryApi<StoryFnReturnType = unknown> {
111 storiesOf(kind: StoryKind, module: NodeModule): StoryApi<StoryFnReturnType>;
112 addDecorator(decorator: DecoratorFunction<StoryFnReturnType>): StoryApi<StoryFnReturnType>;
113 addParameters(parameter: Parameters): StoryApi<StoryFnReturnType>;
114}
115declare type LoadFn = () => any;
116declare type RequireContext = any;
117export declare type Loadable = RequireContext | [RequireContext] | LoadFn;
118export declare type BaseDecorators<StoryFnReturnType> = Array<(story: () => StoryFnReturnType, context: StoryContext) => StoryFnReturnType>;
119export interface BaseAnnotations<Args, StoryFnReturnType> {
120 /**
121 * Dynamic data that are provided (and possibly updated by) Storybook and its addons.
122 * @see [Arg story inputs](https://storybook.js.org/docs/react/api/csf#args-story-inputs)
123 */
124 args?: Partial<Args>;
125 /**
126 * ArgTypes encode basic metadata for args, such as `name`, `description`, `defaultValue` for an arg. These get automatically filled in by Storybook Docs.
127 * @see [Control annotations](https://github.com/storybookjs/storybook/blob/91e9dee33faa8eff0b342a366845de7100415367/addons/controls/README.md#control-annotations)
128 */
129 argTypes?: ArgTypes;
130 /**
131 * Custom metadata for a story.
132 * @see [Parameters](https://storybook.js.org/docs/basics/writing-stories/#parameters)
133 */
134 parameters?: Parameters;
135 /**
136 * Wrapper components or Storybook decorators that wrap a story.
137 *
138 * Decorators defined in Meta will be applied to every story variation.
139 * @see [Decorators](https://storybook.js.org/docs/addons/introduction/#1-decorators)
140 */
141 decorators?: BaseDecorators<StoryFnReturnType>;
142}
143export interface Annotations<Args, StoryFnReturnType> extends BaseAnnotations<Args, StoryFnReturnType> {
144 /**
145 * 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.
146 * @example
147 * includeStories: ['SimpleStory', 'ComplexStory']
148 * includeStories: /.*Story$/
149 *
150 * @see [Non-story exports](https://storybook.js.org/docs/formats/component-story-format/#non-story-exports)
151 */
152 includeStories?: string[] | RegExp;
153 /**
154 * Used to exclude certain named exports. Useful when you want to have non-story exports such as mock data or ignore a few stories.
155 * @example
156 * excludeStories: ['simpleData', 'complexData']
157 * excludeStories: /.*Data$/
158 *
159 * @see [Non-story exports](https://storybook.js.org/docs/formats/component-story-format/#non-story-exports)
160 */
161 excludeStories?: string[] | RegExp;
162}
163export interface BaseMeta<ComponentType> {
164 /**
165 * Title of the story which will be presented in the navigation. **Should be unique.**
166 *
167 * Stories can be organized in a nested structure using "/" as a separator.
168 *
169 * @example
170 * export default {
171 * ...
172 * title: 'Design System/Atoms/Button'
173 * }
174 *
175 * @see [Story Hierarchy](https://storybook.js.org/docs/basics/writing-stories/#story-hierarchy)
176 */
177 title: string;
178 /**
179 * The primary component for your story.
180 *
181 * Used by addons for automatic prop table generation and display of other component metadata.
182 */
183 component?: ComponentType;
184 /**
185 * Auxiliary subcomponents that are part of the stories.
186 *
187 * Used by addons for automatic prop table generation and display of other component metadata.
188 *
189 * @example
190 * import { Button, ButtonGroup } from './components';
191 *
192 * export default {
193 * ...
194 * subcomponents: { Button, ButtonGroup }
195 * }
196 *
197 * By defining them each component will have its tab in the args table.
198 */
199 subcomponents?: Record<string, ComponentType>;
200}
201export interface BaseStory<Args, StoryFnReturnType> {
202 (args: Args, context: StoryContext): StoryFnReturnType;
203 /**
204 * Override the display name in the UI
205 */
206 storyName?: string;
207}
208export {};