Merge pull request #298 from department-of-veterans-affairs/feature/1…

…99-roettger-AlertStorybook [Feature] Add Alert Storybook Stories
department-of-veterans-affairs · Apr 23, 2024 · 692f3b3 · 692f3b3
2 parents 039a07c + b49cb43
commit 692f3b3
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 13 deletions.
diff --git a/packages/components/src/components/Alert/Alert.stories.tsx b/packages/components/src/components/Alert/Alert.stories.tsx
@@ -45,28 +45,69 @@ export const Info: Story = {
     header: 'Header',
     description: 'Description',
     children: children,
+    analytics: {
+      onExpand: () => console.log('expanded'),
+      onCollapse: () => console.log('collapsed'),
+    },
     primaryButton: {
       label: 'Button Text',
-      onPress: () => {
-        null
-      },
+      onPress: () => console.log('primary press'),
     },
     secondaryButton: {
       label: 'Button Text',
-      onPress: () => {
-        null
-      },
+      onPress: () => console.log('secondary press'),
     },
   },
 }
 
-export const Expandable: Story = {
+export const _Success: Story = {
   args: {
-    variant: 'info',
+    variant: 'success',
+    header: 'Header',
+    description: 'Description',
+    children: children,
+    analytics: {
+      onExpand: () => console.log('expanded'),
+      onCollapse: () => console.log('collapsed'),
+    },
+    primaryButton: {
+      label: 'Button Text',
+      onPress: () => console.log('primary press'),
+    },
+    secondaryButton: {
+      label: 'Button Text',
+      onPress: () => console.log('secondary press'),
+    },
+  },
+}
+
+export const __Warning: Story = {
+  args: {
+    variant: 'warning',
+    header: 'Header',
+    description: 'Description',
+    children: children,
+    analytics: {
+      onExpand: () => console.log('expanded'),
+      onCollapse: () => console.log('collapsed'),
+    },
+    primaryButton: {
+      label: 'Button Text',
+      onPress: () => console.log('primary press'),
+    },
+    secondaryButton: {
+      label: 'Button Text',
+      onPress: () => console.log('secondary press'),
+    },
+  },
+}
+
+export const ___Error: Story = {
+  args: {
+    variant: 'error',
     header: 'Header',
     description: 'Description',
     children: children,
-    expandable: true,
     analytics: {
       onExpand: () => console.log('expanded'),
       onCollapse: () => console.log('collapsed'),

diff --git a/packages/components/src/components/Alert/Alert.tsx b/packages/components/src/components/Alert/Alert.tsx
@@ -60,10 +60,7 @@ export type AlertProps = {
     }
 )
 
-/**
- * Work in progress:
- * Displays content in a box styled as an alert
- */
+/** [View guidance for the Alert component on the VA Mobile Documentation Site](https://department-of-veterans-affairs.github.io/va-mobile-app/design/Components/Buttons%20and%20links/Alert) */
 export const Alert: FC<AlertProps> = ({
   variant,
   header,