Updates to stories

jpmorganchase · Dec 17, 2024 · 21fe86c · 21fe86c
1 parent 74d9d3a
commit 21fe86c
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 8 deletions.
diff --git a/packages/lab/stories/dialog/dialog.stories.tsx b/packages/lab/stories/dialog/dialog.stories.tsx
@@ -146,7 +146,7 @@ Default.args = {
   id: "Default",
 };
 export const LongTitle = DialogTemplate.bind({});
-Default.args = {
+LongTitle.args = {
   id: "LongTitle",
   header:
     "Complete terms and conditions for using the services provided by our company",

diff --git a/packages/lab/stories/overlay/overlay.qa.stories.tsx b/packages/lab/stories/overlay/overlay.qa.stories.tsx
@@ -1,6 +1,6 @@
 import {
   Button,
-  H4,
+  H2,
   Overlay,
   OverlayPanel,
   OverlayPanelContent,
@@ -47,7 +47,11 @@ export const Default: StoryFn<QAContainerProps> = (props) => {
           <OverlayHeader
             preheader="Preheader"
             description="Description"
-            header={<H4>Guidelines for optimal use of our application</H4>}
+            header={
+              <H2 styleAs="h4">
+                Guidelines for optimal use of our application
+              </H2>
+            }
             actions={<CloseButton />}
           />
           <OverlayPanelContent>

diff --git a/packages/lab/stories/overlay/overlay.stories.tsx b/packages/lab/stories/overlay/overlay.stories.tsx
@@ -1,6 +1,6 @@
 import {
   Button,
-  H4,
+  H2,
   Overlay,
   OverlayPanel,
   OverlayPanelContent,
@@ -40,7 +40,14 @@ const HeaderTemplate: StoryFn = ({ onOpenChange, ...props }: OverlayProps) => {
           width: 500,
         }}
       >
-        <OverlayHeader header={<H4 id={id}>Header block</H4>} {...props} />
+        <OverlayHeader
+          header={
+            <H2 styleAs="h4" id={id}>
+              Header block
+            </H2>
+          }
+          {...props}
+        />
         <OverlayPanelContent>
           <StackLayout gap={1}>
             <Text>
@@ -68,11 +75,11 @@ Header.args = {};
 export const LongHeader = HeaderTemplate.bind({});
 LongHeader.args = {
   header: (
-    <H4>
+    <H2 styleAs="h4">
       Comprehensive guidelines and detailed instructions for the optimal use and
       application of our services to ensure maximum efficiency and user
       satisfaction
-    </H4>
+    </H2>
   ),
   actions: (
     <Button
@@ -121,7 +128,11 @@ export const HeaderWithCloseButton = ({ onOpenChange }: OverlayProps) => {
         <OverlayHeader
           preheader="Preheader"
           description="Description"
-          header={<H4 id={id}>Header block</H4>}
+          header={
+            <H2 styleAs="h4" id={id}>
+              Header block
+            </H2>
+          }
           actions={<CloseButton />}
         />
         <OverlayPanelContent>