Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add tags annotation at all levels #52

Merged
merged 2 commits into from
Oct 27, 2022
Merged

Add tags annotation at all levels #52

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5b59926
Add tag annotation at all levels
tmeasday Oct 26, 2022
d2acbe4
Don't allow tags at the project level (for now)
tmeasday Oct 26, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 13 additions & 7 deletions src/story.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ const Button = (props: ButtonArgs) => 'Button';
const simple: XMeta = {
title: 'simple',
component: Button,
tags: ['foo', 'bar'],
decorators: [(storyFn, context) => `withDecorator(${storyFn(context)})`],
parameters: { a: () => null, b: NaN, c: Symbol('symbol') },
loaders: [() => Promise.resolve({ d: '3' })],
Expand All @@ -43,6 +44,7 @@ const simple: XMeta = {
const strict: XMeta<ButtonArgs> = {
title: 'simple',
component: Button,
tags: ['foo', 'bar'],
decorators: [(storyFn, context) => `withDecorator(${storyFn(context)})`],
parameters: { a: () => null, b: NaN, c: Symbol('symbol') },
loaders: [() => Promise.resolve({ d: '3' })],
Expand All @@ -56,32 +58,36 @@ const Simple: XStory = () => 'Simple';
const CSF1Story: XStory = () => 'Named Story';
CSF1Story.story = {
name: 'Another name for story',
decorators: [(storyFn) => `Wrapped(${storyFn()}`],
tags: ['foo', 'bar'],
decorators: [storyFn => `Wrapped(${storyFn()}`],
parameters: { a: [1, '2', {}], b: undefined, c: Button },
loaders: [() => Promise.resolve({ d: '3' })],
args: { a: 1 },
};

const CSF2Story: XStory = () => 'Named Story';
CSF2Story.storyName = 'Another name for story';
CSF2Story.decorators = [(storyFn) => `Wrapped(${storyFn()}`];
CSF2Story.tags = ['foo', 'bar'];
CSF2Story.decorators = [storyFn => `Wrapped(${storyFn()}`];
CSF2Story.parameters = { a: [1, '2', {}], b: undefined, c: Button };
CSF2Story.loaders = [() => Promise.resolve({ d: '3' })];
CSF2Story.args = { a: 1 };

const CSF3Story: XStory = {
render: (args) => 'Named Story',
render: args => 'Named Story',
name: 'Another name for story',
decorators: [(storyFn) => `Wrapped(${storyFn()}`],
tags: ['foo', 'bar'],
decorators: [storyFn => `Wrapped(${storyFn()}`],
parameters: { a: [1, '2', {}], b: undefined, c: Button },
loaders: [() => Promise.resolve({ d: '3' })],
args: { a: 1 },
};

const CSF3StoryStrict: XStory<ButtonArgs> = {
render: (args) => 'Named Story',
render: args => 'Named Story',
name: 'Another name for story',
decorators: [(storyFn) => `Wrapped(${storyFn()}`],
tags: ['foo', 'bar'],
decorators: [storyFn => `Wrapped(${storyFn()}`],
parameters: { a: [1, '2', {}], b: undefined, c: Button },
loaders: [() => Promise.resolve({ d: '3' })],
args: { x: '1' },
Expand Down Expand Up @@ -113,7 +119,7 @@ test('ArgsFromMeta will infer correct args from render/loader/decorators', () =>
loader2: `${args.loaderArg2}`,
});

const renderer: ArgsStoryFn<XFramework, { theme: string }> = (args) => `${args.theme}`;
const renderer: ArgsStoryFn<XFramework, { theme: string }> = args => `${args.theme}`;

const meta = {
component: Button,
Expand Down
18 changes: 16 additions & 2 deletions src/story.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ export type StoryName = string;
/** @deprecated */
export type StoryKind = ComponentTitle;

export type Tag = string;

export interface StoryIdentifier {
componentId: ComponentId;
title: ComponentTitle;
Expand All @@ -21,6 +23,8 @@ export interface StoryIdentifier {
name: StoryName;
/** @deprecated */
story: StoryName;

tags: Tag[];
}

export type Parameters = { [name: string]: any };
Expand Down Expand Up @@ -290,12 +294,17 @@ export interface ComponentAnnotations<TFramework extends AnyFramework = AnyFrame
* By defining them each component will have its tab in the args table.
*/
subcomponents?: Record<string, TFramework['component']>;

/**
* Function that is executed after the story is rendered.
*/
play?: PlayFunction<TFramework, TArgs>;
};

/**
* Named tags for a story, used to filter stories in different contexts.
*/
tags?: Tag[];
}

export type StoryAnnotations<
TFramework extends AnyFramework = AnyFramework,
Expand All @@ -317,6 +326,11 @@ export type StoryAnnotations<
*/
play?: PlayFunction<TFramework, TArgs>;

/**
* Named tags for a story, used to filter stories in different contexts.
*/
tags?: Tag[];

/** @deprecated */
story?: Omit<StoryAnnotations<TFramework, TArgs>, 'story'>;
} & ({} extends TRequiredArgs ? { args?: TRequiredArgs } : { args: TRequiredArgs });
Expand Down