Migrated Storybook notation from CSF2 to CSF3 (#3412)

* Migrate web action-buttons directory to CSF3 notation

* Migrate web chat directory to CSF3 notation

* Migrate web common directory to CSF3 notation

* Migrate web layout directory to CSF3 notation

* Migrate web modals directory to CSF3 notation

* Migrate web ui directory to CSF3 notation

* Migrate web video directory to CSF3 notation

* Migrate web stories directory to CSF3 notation
This commit is contained in:
kame
2023-11-07 12:35:05 +09:00
committed by GitHub
parent b08511b9d1
commit 4f078e1ee4
44 changed files with 975 additions and 789 deletions

View File

@@ -1,11 +1,10 @@
import React from 'react';
import { ComponentStory, ComponentMeta } from '@storybook/react';
import { StoryFn, Meta } from '@storybook/react';
import { ChatUserBadge } from './ChatUserBadge';
import { ModerationBadge } from './ModerationBadge';
import { AuthedUserBadge } from './AuthedUserBadge';
import { BotUserBadge } from './BotUserBadge';
export default {
const meta = {
title: 'owncast/Chat/Messages/User Flag',
component: ChatUserBadge,
argTypes: {
@@ -14,36 +13,43 @@ export default {
control: { type: 'select' },
},
},
} as ComponentMeta<typeof ChatUserBadge>;
} satisfies Meta<typeof ChatUserBadge>;
const Template: ComponentStory<typeof ChatUserBadge> = args => <ChatUserBadge {...args} />;
const ModerationTemplate: ComponentStory<typeof ModerationBadge> = args => (
<ModerationBadge {...args} />
);
export default meta;
const AuthedTemplate: ComponentStory<typeof ModerationBadge> = args => (
<AuthedUserBadge {...args} />
);
const ModerationTemplate: StoryFn<typeof ModerationBadge> = args => <ModerationBadge {...args} />;
const BotTemplate: ComponentStory<typeof BotUserBadge> = args => <BotUserBadge {...args} />;
const AuthedTemplate: StoryFn<typeof ModerationBadge> = args => <AuthedUserBadge {...args} />;
export const Authenticated = AuthedTemplate.bind({});
Authenticated.args = {
userColor: '3',
const BotTemplate: StoryFn<typeof BotUserBadge> = args => <BotUserBadge {...args} />;
export const Authenticated = {
render: AuthedTemplate,
args: {
userColor: '3',
},
};
export const Moderator = ModerationTemplate.bind({});
Moderator.args = {
userColor: '5',
export const Moderator = {
render: ModerationTemplate,
args: {
userColor: '5',
},
};
export const Bot = BotTemplate.bind({});
Bot.args = {
userColor: '7',
export const Bot = {
render: BotTemplate,
args: {
userColor: '7',
},
};
export const Generic = Template.bind({});
Generic.args = {
badge: '?',
userColor: '6',
export const Generic = {
args: {
badge: '?',
userColor: '6',
},
};