diff --git a/apps/storybook/stories/text-area.stories.tsx b/apps/storybook/stories/text-area.stories.tsx new file mode 100644 index 00000000..14d4acdb --- /dev/null +++ b/apps/storybook/stories/text-area.stories.tsx @@ -0,0 +1,144 @@ +import React, { useState } from 'react'; +import type { ComponentMeta } from '@storybook/react'; +import type { TextAreaResize } from '@tih/ui'; +import { TextArea } from '@tih/ui'; + +const textAreaResize: ReadonlyArray = [ + 'vertical', + 'horizontal', + 'none', + 'both', +]; + +export default { + argTypes: { + autoComplete: { + control: 'text', + }, + disabled: { + control: 'boolean', + }, + errorMessage: { + control: 'text', + }, + isLabelHidden: { + control: 'boolean', + }, + label: { + control: 'text', + }, + name: { + control: 'text', + }, + placeholder: { + control: 'text', + }, + readOnly: { + control: 'boolean', + }, + required: { + control: 'boolean', + }, + resize: { + control: { type: 'select' }, + options: textAreaResize, + }, + rows: { + control: 'number', + }, + }, + component: TextArea, + title: 'TextArea', +} as ComponentMeta; + +export const Basic = { + args: { + label: 'Comment', + placeholder: 'Type your comment here', + }, +}; + +export function HiddenLabel() { + const [value, setValue] = useState(''); + + return ( +