LogalDeveloper/owncast
0
Fork 0
Code Activity

Migrated Storybook notation from CSF2 to CSF3 (#3412)

Browse Source 
* 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
Download Patch File Download Diff File Expand all files Collapse all files

62
web/components/chat/ChatTextField/ChatTextField.stories.tsx
View File

@@ -1,5 +1,4 @@
import React from 'react';
import { ComponentStory, ComponentMeta } from '@storybook/react';
import { StoryFn, Meta } from '@storybook/react';
import { RecoilRoot } from 'recoil';
import { ChatTextField } from './ChatTextField';
import Mockup from '../../../stories/assets/mocks/chatinput-mock.png';
@@ -28,7 +27,7 @@ const mocks = {
],
};
export default {
const meta = {
title: 'owncast/Chat/Input text field',
component: ChatTextField,
parameters: {
@@ -48,43 +47,54 @@ export default {
},
},
},
} as ComponentMeta<typeof ChatTextField>;
} satisfies Meta<typeof ChatTextField>;
const Template: ComponentStory<typeof ChatTextField> = args => (
export default meta;
const Template: StoryFn<typeof ChatTextField> = args => (
<RecoilRoot>
<ChatTextField {...args} />
</RecoilRoot>
);
export const Example = Template.bind({});
Example.args = {
enabled: true,
export const Example = {
render: Template,
args: {
enabled: true,
},
};
export const LongerMessage = Template.bind({});
LongerMessage.args = {
enabled: true,
defaultText:
'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
};
export const LongerMessage = {
render: Template,
LongerMessage.parameters = {
docs: {
description: {
story: 'Should display two lines of text and scroll to display more.',
args: {
enabled: true,
defaultText:
'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
},
parameters: {
docs: {
description: {
story: 'Should display two lines of text and scroll to display more.',
},
},
},
};
export const DisabledChat = Template.bind({});
DisabledChat.args = {
enabled: false,
};
export const DisabledChat = {
render: Template,
DisabledChat.parameters = {
docs: {
description: {
story: 'Should not allow you to type anything and should state that chat is disabled.',
args: {
enabled: false,
},
parameters: {
docs: {
description: {
story: 'Should not allow you to type anything and should state that chat is disabled.',
},
},
},
};