diff --git a/.changeset/famous-pumpkins-exist.md b/.changeset/famous-pumpkins-exist.md new file mode 100644 index 00000000..55cad167 --- /dev/null +++ b/.changeset/famous-pumpkins-exist.md @@ -0,0 +1,5 @@ +--- +"docs": minor +--- + +feat: add docs to stories [MDS-1442] diff --git a/docs/app/stories/Avatar.stories.tsx b/docs/app/stories/Avatar.stories.tsx index c1dc3a16..0aff0ed5 100644 --- a/docs/app/stories/Avatar.stories.tsx +++ b/docs/app/stories/Avatar.stories.tsx @@ -3,9 +3,19 @@ import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { component: AvatarComponent, + title: "Moon DS/Avatar", + tags: ["autodocs"], + argTypes: { + size: { + options: ["xs", "sm", "md", "lg", "xl", "2xl"], + control: { type: "select" }, + description: "Determines the size of the avatar.", + }, + }, }; export default meta; + type Story = StoryObj; export const Avatar: Story = { diff --git a/docs/app/stories/Button.stories.tsx b/docs/app/stories/Button.stories.tsx index 6c6c68ec..4f5775f9 100644 --- a/docs/app/stories/Button.stories.tsx +++ b/docs/app/stories/Button.stories.tsx @@ -3,16 +3,56 @@ import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { component: ButtonComponent, + title: "Moon DS/Button", + tags: ["autodocs"], + argTypes: { + children: { + description: "Sets the content displayed inside the button.", + control: "text", + defaultValue: "Click me", + }, + size: { + description: "Defines the button size.", + options: ["xs", "sm", "md", "lg", "xl"], + control: { type: "select" }, + defaultValue: "md", + }, + disabled: { + description: "Disables the button when set to true.", + options: [true, false], + control: { type: "boolean" }, + defaultValue: false, + }, + fullWidth: { + description: "Expands the button to fill the container width.", + options: [true, false], + control: { type: "boolean" }, + defaultValue: false, + }, + animation: { + description: "Applies an animation effect to the button.", + options: ["pulse", "progress", "success"], + control: { type: "select" }, + defaultValue: "pulse", + }, + variant: { + description: "Sets the button style variant.", + options: ["fill", "outline", "ghost", "primary", "secondary", "tertiary"], + control: { type: "select" }, + defaultValue: "primary", + }, + }, }; export default meta; + type Story = StoryObj; export const Button: Story = { args: { - children: Click me, + children: "Click me", variant: "primary", - size: "xl", + size: "md", disabled: false, fullWidth: false, animation: "pulse", diff --git a/docs/app/stories/Chip.stories.tsx b/docs/app/stories/Chip.stories.tsx index f349c0da..882dadba 100644 --- a/docs/app/stories/Chip.stories.tsx +++ b/docs/app/stories/Chip.stories.tsx @@ -1,21 +1,40 @@ import { Chip as ChipComponent } from "@heathmont/moon-core-tw"; - import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { component: ChipComponent, + title: "Moon DS/Chip", + tags: ["autodocs"], + argTypes: { + isActive: { + control: { type: "boolean" }, + description: "Determines whether the chip is active.", + }, + size: { + options: ["sm", "md"], + control: { type: "select" }, + description: "Sets the size of the chip.", + }, + isStroke: { + control: { type: "boolean" }, + description: "Adds a border stroke to the chip when set to true.", + }, + children: { + control: "text", + description: "Content to display inside the chip.", + }, + }, }; export default meta; -type Story = StoryObj; -const args = { - isActive: true, - size: "md", - isStroke: true, - children: To the moon, -}; +type Story = StoryObj; export const Chip: Story = { - args, + args: { + isActive: true, + size: "md", + isStroke: true, + children: "To the moon", + }, }; diff --git a/docs/app/stories/Textarea.stories.tsx b/docs/app/stories/Textarea.stories.tsx index ede2d959..cf349f28 100644 --- a/docs/app/stories/Textarea.stories.tsx +++ b/docs/app/stories/Textarea.stories.tsx @@ -1,16 +1,39 @@ import { Textarea as TextareaComponent } from "@heathmont/moon-core-tw"; - import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { component: TextareaComponent, + title: "Moon DS/Textarea", + tags: ["autodocs"], + argTypes: { + error: { + control: { type: "boolean" }, + description: "Indicates whether the textarea has an error state.", + }, + disabled: { + control: { type: "boolean" }, + description: "Disables the textarea when set to true.", + }, + placeholder: { + control: "text", + description: "Displays placeholder text inside the textarea.", + }, + value: { + control: "text", + description: "Sets the value of the textarea.", + }, + }, }; export default meta; + type Story = StoryObj; export const Textarea: Story = { args: { error: false, + disabled: false, + placeholder: "Enter your text here...", + value: "", }, }; diff --git a/words.txt b/words.txt index b138ec2c..ed5efc56 100644 --- a/words.txt +++ b/words.txt @@ -69,3 +69,4 @@ truncable valuenow viewbox whis +autodocs