feat: add docs to stories [MDS-1442]

.changeset/famous-pumpkins-exist.md

@@ -0,0 +1,5 @@
+---
+"docs": minor
+---
+
+feat: add docs to stories [MDS-1442]

docs/app/stories/Avatar.stories.tsx

@@ -3,9 +3,19 @@ import type { Meta, StoryObj } from "@storybook/react";
 
 const meta: Meta<typeof AvatarComponent> = {
   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<typeof AvatarComponent>;
 
 export const Avatar: Story = {

docs/app/stories/Button.stories.tsx

@@ -3,16 +3,56 @@ import type { Meta, StoryObj } from "@storybook/react";
 
 const meta: Meta<typeof ButtonComponent> = {
   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<typeof ButtonComponent>;
 
 export const Button: Story = {
   args: {
-    children: <span>Click me</span>,
+    children: "Click me",
     variant: "primary",
-    size: "xl",
+    size: "md",
     disabled: false,
     fullWidth: false,
     animation: "pulse",

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<typeof ChipComponent> = {
   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<typeof ChipComponent>;
 
-const args = {
-  isActive: true,
-  size: "md",
-  isStroke: true,
-  children: <span>To the moon</span>,
-};
+type Story = StoryObj<typeof ChipComponent>;
 
 export const Chip: Story = {
-  args,
+  args: {
+    isActive: true,
+    size: "md",
+    isStroke: true,
+    children: "To the moon",
+  },
 };

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<typeof TextareaComponent> = {
   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<typeof TextareaComponent>;
 
 export const Textarea: Story = {
   args: {
     error: false,
+    disabled: false,
+    placeholder: "Enter your text here...",
+    value: "",
   },
 };

words.txt

@@ -69,3 +69,4 @@ truncable
 valuenow
 viewbox
 whis
+autodocs