From 14a58238be00c991c01cde4d9fd375d5b1226e3c Mon Sep 17 00:00:00 2001
From: Brian McGee <brian@bmcgee.ie>
Date: Mon, 26 May 2025 18:04:13 +0100
Subject: [PATCH] feat(ui): refine Button stories

Add separate examples of start and end icon
---
 .../src/components/Button/Button.stories.tsx   | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/pkgs/clan-app/ui/src/components/Button/Button.stories.tsx b/pkgs/clan-app/ui/src/components/Button/Button.stories.tsx
index ff2b579a0..c270a936a 100644
--- a/pkgs/clan-app/ui/src/components/Button/Button.stories.tsx
+++ b/pkgs/clan-app/ui/src/components/Button/Button.stories.tsx
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from "@kachurun/storybook-solid";
 import { Button, ButtonProps } from "./Button";
-import FlashIcon from "@/icons/flash.svg";
+import Icon from "../icon";
 
 const meta: Meta<ButtonProps> = {
   title: "Components/Button",
@@ -12,12 +12,10 @@ export default meta;
 type Story = StoryObj<ButtonProps>;
 
 const children = "click me";
-const startIcon = <FlashIcon width={16} height={16} viewBox="0 0 48 48" />;
 
 export const Default: Story = {
   args: {
     children,
-    startIcon,
   },
 };
 
@@ -41,3 +39,17 @@ export const Ghost: Story = {
     variant: "ghost",
   },
 };
+
+export const StartIcon: Story = {
+  args: {
+    ...Default.args,
+    startIcon: <Icon size={12} icon="Flash" />,
+  },
+};
+
+export const EndIcon: Story = {
+  args: {
+    ...Default.args,
+    endIcon: <Icon size={12} icon="Flash" />,
+  },
+};