From 25a8ebc40ff4ee64efb72027ae71a01255a7d8ba Mon Sep 17 00:00:00 2001
From: Jaideep <guntupallijaideep@gmail.com>
Date: Tue, 20 Jun 2023 22:14:25 +0530
Subject: [PATCH] feat: Added controls for card storybook

---
 packages/ui/components/card/card.stories.mdx | 44 ++++++++++++++------
 1 file changed, 31 insertions(+), 13 deletions(-)

diff --git a/packages/ui/components/card/card.stories.mdx b/packages/ui/components/card/card.stories.mdx
index c58d101120..69b83f88c9 100644
--- a/packages/ui/components/card/card.stories.mdx
+++ b/packages/ui/components/card/card.stories.mdx
@@ -22,19 +22,37 @@ export const tip = {
 
 
 <Canvas>
-  <Story name="Card">
-    <VariantsTable titles={['']} columnMinWidth={150}>
-      <VariantRow variant="Sidebar Card">
+  <Story name="Card"
+  args={{
+    thumbnailUrl: tip.thumbnailUrl,
+    mediaLink: tip.mediaLink,
+    title: tip.title,
+    description: tip.description,
+    learnMoreHref: tip.href,
+    learnMoreText: "learn more",
+  }}
+  argTypes={{
+    thumbnailUrl: { control: { type: 'text' } },
+    mediaLink: { control: { type: 'text' } },
+    title: { control: { type: 'text' } },
+    description: { control: { type: 'text' } },
+    learnMoreHref: { control: { type: 'text' } },
+    learnMoreText: { control: { type: 'text' } },
+  }}>
+    {({ thumbnailUrl, mediaLink, title, description, learnMoreText }) => (
+      <VariantsTable titles={['']} columnMinWidth={150}>
+        <VariantRow variant="Sidebar Card">
           <Card
-                variant="SidebarCard"
-                thumbnailUrl={tip.thumbnailUrl}
-                mediaLink={tip.mediaLink}
-                title={tip.title}
-                description={tip.description}
-                learnMore={{ href: tip.href, text: "learn more" }}
-                actionButton={{ onClick: () => console.log("Clicked") }}
-              />
-      </VariantRow>
-    </VariantsTable>
+            variant="SidebarCard"
+            thumbnailUrl={thumbnailUrl}
+            mediaLink={mediaLink}
+            title={title}
+            description={description}
+            learnMore={{ href: tip.href, text: learnMoreText }}
+            actionButton={{ onClick: () => console.log("Clicked") }}
+          />
+        </VariantRow>
+      </VariantsTable>
+    )}
   </Story>
 </Canvas>