From c30c6266d56cbf070c27b6b9c811b1678285fdaa Mon Sep 17 00:00:00 2001
From: JoltCode <joe@joecc.dev>
Date: Mon, 13 Nov 2023 23:07:06 +0000
Subject: [PATCH 1/8] feat(stories/Button): add children argType - initial
 control branch commit

---
 src/button/Button.stories.tsx | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/button/Button.stories.tsx b/src/button/Button.stories.tsx
index a4dfca3..4cef3e5 100644
--- a/src/button/Button.stories.tsx
+++ b/src/button/Button.stories.tsx
@@ -1,3 +1,12 @@
-import { Button } from "./Button.js";
+import {Button, ButtonProps} from "./Button.js";
+import {Story} from "@ladle/react";
 
-export const ButtonStory = () => <Button>Hello Button</Button>;
+export const ButtonStory: Story<ButtonProps> = (props) => <Button {...props} />;
+ButtonStory.argTypes = {
+  children: {
+    control: {
+      type: "text",
+    },
+    defaultValue: "Button",
+  }
+}

From cc127d4ce6ffd87f8f3b0e9268939449e4da0387 Mon Sep 17 00:00:00 2001
From: "pre-commit-ci[bot]"
 <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Date: Mon, 13 Nov 2023 23:08:10 +0000
Subject: [PATCH 2/8] [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci
---
 src/button/Button.stories.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/button/Button.stories.tsx b/src/button/Button.stories.tsx
index 4cef3e5..a03795e 100644
--- a/src/button/Button.stories.tsx
+++ b/src/button/Button.stories.tsx
@@ -1,5 +1,5 @@
-import {Button, ButtonProps} from "./Button.js";
-import {Story} from "@ladle/react";
+import { Button, ButtonProps } from "./Button.js";
+import { Story } from "@ladle/react";
 
 export const ButtonStory: Story<ButtonProps> = (props) => <Button {...props} />;
 ButtonStory.argTypes = {
@@ -8,5 +8,5 @@ ButtonStory.argTypes = {
       type: "text",
     },
     defaultValue: "Button",
-  }
-}
+  },
+};

From f49784a948ada55460b8d9b758a38bfe980304d6 Mon Sep 17 00:00:00 2001
From: JoltCode <joe@joecc.dev>
Date: Mon, 13 Nov 2023 23:26:14 +0000
Subject: [PATCH 3/8] feat(stories): add controls and type exports for card

---
 src/card/Card.stories.tsx | 42 +++++++++++++++++++++++++++++++--------
 src/card/Card.tsx         |  6 +++---
 2 files changed, 37 insertions(+), 11 deletions(-)

diff --git a/src/card/Card.stories.tsx b/src/card/Card.stories.tsx
index 5e912a9..3ff09a7 100644
--- a/src/card/Card.stories.tsx
+++ b/src/card/Card.stories.tsx
@@ -1,14 +1,40 @@
-import { Card } from "./Card.js";
+import {Card, CardProps} from "./Card.js";
+import {Story} from "@ladle/react";
 
-export const CardStory = () => (
+export const CardStory: Story<CardProps & {
+  title: string,
+  body: string,
+  footer: string,
+}> = (props) => (
   <Card>
-    <Card.CardTitle>Card Title</Card.CardTitle>
+    <Card.CardTitle>{props.title}</Card.CardTitle>
     <Card.CardBody>
-      lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
-      voluptatum. lorem ipsum dolor sit amet consectetur adipisicing elit.
-      Quisquam, voluptatum. lorem ipsum dolor sit amet consectetur adipisicing
-      elit. Quisquam, voluptatum.
+      {props.body}
     </Card.CardBody>
-    <Card.CardFooter>Card Footer</Card.CardFooter>
+    <Card.CardFooter>{props.footer}</Card.CardFooter>
   </Card>
 );
+
+CardStory.argTypes = {
+  title: {
+    control: {
+      type: "text",
+    },
+    defaultValue: "Card Title",
+  },
+  body: {
+    control: {
+      type: "text",
+    },
+    defaultValue: "lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,\n" +
+      "voluptatum. lorem ipsum dolor sit amet consectetur adipisicing elit.\n" +
+      "Quisquam, voluptatum. lorem ipsum dolor sit amet consectetur adipisicing\n" +
+      "elit. Quisquam, voluptatum.",
+  },
+footer: {
+    control: {
+      type: "text",
+    },
+    defaultValue: "Card Footer",
+  },
+}
\ No newline at end of file
diff --git a/src/card/Card.tsx b/src/card/Card.tsx
index 0bbfd77..b593ed0 100644
--- a/src/card/Card.tsx
+++ b/src/card/Card.tsx
@@ -15,7 +15,7 @@ export const Card = (props: CardProps) => {
   );
 };
 
-interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {}
+export interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {}
 const CardTitle = (props: CardTitleProps) => {
   const { className, ...rest } = props;
 
@@ -28,7 +28,7 @@ const CardTitle = (props: CardTitleProps) => {
 
 Card.CardTitle = CardTitle;
 
-interface CardBodyProps extends React.HTMLAttributes<HTMLDivElement> {}
+export interface CardBodyProps extends React.HTMLAttributes<HTMLDivElement> {}
 const CardBody = (props: CardBodyProps) => {
   const { className, ...rest } = props;
 
@@ -41,7 +41,7 @@ const CardBody = (props: CardBodyProps) => {
 
 Card.CardBody = CardBody;
 
-interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {}
+export interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {}
 const CardFooter = (props: CardFooterProps) => {
   const { className, ...rest } = props;
 

From fb8555d10dd1cf0ae3699b47287e3e5abaea1d09 Mon Sep 17 00:00:00 2001
From: "pre-commit-ci[bot]"
 <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Date: Mon, 13 Nov 2023 23:26:38 +0000
Subject: [PATCH 4/8] [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci
---
 src/card/Card.stories.tsx | 27 ++++++++++++++-------------
 src/card/Card.tsx         |  3 ++-
 2 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/card/Card.stories.tsx b/src/card/Card.stories.tsx
index 3ff09a7..2545960 100644
--- a/src/card/Card.stories.tsx
+++ b/src/card/Card.stories.tsx
@@ -1,16 +1,16 @@
-import {Card, CardProps} from "./Card.js";
-import {Story} from "@ladle/react";
+import { Card, CardProps } from "./Card.js";
+import { Story } from "@ladle/react";
 
-export const CardStory: Story<CardProps & {
-  title: string,
-  body: string,
-  footer: string,
-}> = (props) => (
+export const CardStory: Story<
+  CardProps & {
+    title: string;
+    body: string;
+    footer: string;
+  }
+> = (props) => (
   <Card>
     <Card.CardTitle>{props.title}</Card.CardTitle>
-    <Card.CardBody>
-      {props.body}
-    </Card.CardBody>
+    <Card.CardBody>{props.body}</Card.CardBody>
     <Card.CardFooter>{props.footer}</Card.CardFooter>
   </Card>
 );
@@ -26,15 +26,16 @@ CardStory.argTypes = {
     control: {
       type: "text",
     },
-    defaultValue: "lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,\n" +
+    defaultValue:
+      "lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,\n" +
       "voluptatum. lorem ipsum dolor sit amet consectetur adipisicing elit.\n" +
       "Quisquam, voluptatum. lorem ipsum dolor sit amet consectetur adipisicing\n" +
       "elit. Quisquam, voluptatum.",
   },
-footer: {
+  footer: {
     control: {
       type: "text",
     },
     defaultValue: "Card Footer",
   },
-}
\ No newline at end of file
+};
diff --git a/src/card/Card.tsx b/src/card/Card.tsx
index b593ed0..53593dd 100644
--- a/src/card/Card.tsx
+++ b/src/card/Card.tsx
@@ -15,7 +15,8 @@ export const Card = (props: CardProps) => {
   );
 };
 
-export interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {}
+export interface CardTitleProps
+  extends React.HTMLAttributes<HTMLHeadingElement> {}
 const CardTitle = (props: CardTitleProps) => {
   const { className, ...rest } = props;
 

From ad4936348c57aafe3d092c4ed8b07c5d8d9d0908 Mon Sep 17 00:00:00 2001
From: JoltCode <joe@joecc.dev>
Date: Fri, 17 Nov 2023 21:02:41 +0000
Subject: [PATCH 5/8] fix(tsconfig,components/Dropdown): make build pass

---
 src/dropdown/Dropdown.tsx | 3 ++-
 tsconfig.json             | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/dropdown/Dropdown.tsx b/src/dropdown/Dropdown.tsx
index 6df27e1..e8a9101 100644
--- a/src/dropdown/Dropdown.tsx
+++ b/src/dropdown/Dropdown.tsx
@@ -10,7 +10,8 @@ export const Dropdown = (props: DropdownProps) => {
   const { options, ...rest } = props;
 
   // Use destructuring to get the selected state and the setter function
-  const [selectedOption, setSelectedOption] = useState(options[0]);
+  // TODO: Finish component
+  const [_selectedOption, setSelectedOption] = useState(options[0]);
 
   return (
     <div className="relative">
diff --git a/tsconfig.json b/tsconfig.json
index 6a9f384..0d91e3c 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -2,7 +2,7 @@
   "compilerOptions": {
     "outDir": "dist",
     "target": "es2020",
-    "lib": ["es2020"],
+    "lib": ["es2020", "DOM"],
     "baseUrl": ".",
     "paths": {
       "@/*": ["src/*"],

From c9c54342e67fa15f2276189261959223b43436bd Mon Sep 17 00:00:00 2001
From: JoltCode <joe@joecc.dev>
Date: Sun, 19 Nov 2023 20:29:31 +0000
Subject: [PATCH 6/8] feat(button): add disabled prop, styling

---
 src/button/Button.stories.tsx | 6 ++++++
 src/button/Button.tsx         | 6 ++++--
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/button/Button.stories.tsx b/src/button/Button.stories.tsx
index a03795e..c860d2c 100644
--- a/src/button/Button.stories.tsx
+++ b/src/button/Button.stories.tsx
@@ -9,4 +9,10 @@ ButtonStory.argTypes = {
     },
     defaultValue: "Button",
   },
+  disabled: {
+    control: {
+      type: "boolean",
+    },
+    defaultValue: false,
+  }
 };
diff --git a/src/button/Button.tsx b/src/button/Button.tsx
index 47e0ecb..858c3aa 100644
--- a/src/button/Button.tsx
+++ b/src/button/Button.tsx
@@ -1,6 +1,8 @@
 import { cn } from "@/utils/merge.js";
 
-export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {}
+export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
+  disabled?: boolean;
+}
 
 export const Button = (props: ButtonProps) => {
   const { className, ...rest } = props;
@@ -8,7 +10,7 @@ export const Button = (props: ButtonProps) => {
   return (
     <button
       className={cn(
-        "bg-primary text-white py-3 px-6 rounded leading-[1.15]",
+        `bg-primary text-white py-3 px-6 rounded leading-[1.15] ${props.disabled ? "opacity-50 cursor-not-allowed" : ""}`,
         className,
       )}
       {...rest}

From becc1ea28ff952abb86cd96a11d3b2a26e68e47e Mon Sep 17 00:00:00 2001
From: JoltCode <joe@joecc.dev>
Date: Sun, 19 Nov 2023 20:29:52 +0000
Subject: [PATCH 7/8] chore(tailwindConfig): add secondary hex code colour

---
 tailwind.config.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/tailwind.config.js b/tailwind.config.js
index 15d975d..e4cea33 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -8,6 +8,7 @@ module.exports = {
       },
       colors: {
         primary: "#d73f3f",
+        secondary: "#2C3038"
       },
     },
   },

From 929fbb972fbfed933122014b3c9c5d462f801309 Mon Sep 17 00:00:00 2001
From: "pre-commit-ci[bot]"
 <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Date: Sun, 19 Nov 2023 21:38:16 +0000
Subject: [PATCH 8/8] [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci
---
 src/button/Button.stories.tsx | 2 +-
 src/button/Button.tsx         | 4 +++-
 tailwind.config.js            | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/button/Button.stories.tsx b/src/button/Button.stories.tsx
index c860d2c..bdc4752 100644
--- a/src/button/Button.stories.tsx
+++ b/src/button/Button.stories.tsx
@@ -14,5 +14,5 @@ ButtonStory.argTypes = {
       type: "boolean",
     },
     defaultValue: false,
-  }
+  },
 };
diff --git a/src/button/Button.tsx b/src/button/Button.tsx
index 858c3aa..168db32 100644
--- a/src/button/Button.tsx
+++ b/src/button/Button.tsx
@@ -10,7 +10,9 @@ export const Button = (props: ButtonProps) => {
   return (
     <button
       className={cn(
-        `bg-primary text-white py-3 px-6 rounded leading-[1.15] ${props.disabled ? "opacity-50 cursor-not-allowed" : ""}`,
+        `bg-primary text-white py-3 px-6 rounded leading-[1.15] ${
+          props.disabled ? "opacity-50 cursor-not-allowed" : ""
+        }`,
         className,
       )}
       {...rest}
diff --git a/tailwind.config.js b/tailwind.config.js
index e4cea33..a2bce83 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -8,7 +8,7 @@ module.exports = {
       },
       colors: {
         primary: "#d73f3f",
-        secondary: "#2C3038"
+        secondary: "#2C3038",
       },
     },
   },