fixup! fixup! fixup! fixup! fixup! fixup! fixup! fixup! fixup! Feat(w…

…eb-react): Introduce Footer component #DS-1368
lmc-eu · Sep 24, 2024 · 12e3a64 · 12e3a64
1 parent 04bc7eb
commit 12e3a64
Showing 1 changed file with 17 additions and 11 deletions.
diff --git a/packages/web-react/docs/stories/examples/FooterContent.stories.tsx b/packages/web-react/docs/stories/examples/FooterContent.stories.tsx
@@ -17,52 +17,58 @@ import { GridColumns } from '../../../src/types';
 export default {
   title: 'Examples/Compositions',
   argTypes: {
-    headlineWithLink: {
+    headingWithLink: {
       control: 'boolean',
+      description: 'Headings displayed as links',
     },
     nestedLinkBlocks: {
       control: 'boolean',
-      description: 'ℹ️ Nested menu in 4th column',
+      description: 'Nested menu in **1st column**',
     },
     numberOfLinkColumns: {
       control: 'select',
       options: [0, 1, 2, 3, 4],
       table: {
         defaultValue: { summary: 4 },
       },
+      description: 'Number of columns with navigation links',
     },
     showDividers: {
       control: 'boolean',
+      description: 'Show dividers between sections',
     },
     showLanguageSwitch: {
       control: 'boolean',
+      description: 'Show language switch',
     },
-    showLegalNotice: {
+    showSecondaryLinks: {
       control: 'boolean',
+      description: 'Show secondary links',
     },
     showSocialMediaLinks: {
       control: 'boolean',
+      description: 'Show social media buttons',
     },
   },
   args: {
-    headlineWithLink: false,
+    headingWithLink: false,
     nestedLinkBlocks: true,
     numberOfLinkColumns: 4,
     showDividers: true,
     showLanguageSwitch: true,
-    showLegalNotice: true,
+    showSecondaryLinks: true,
     showSocialMediaLinks: true,
   },
 };
 
 export const FooterCompositions = (args) => {
   const {
-    headlineWithLink,
+    headingWithLink,
     nestedLinkBlocks,
     numberOfLinkColumns,
     showDividers,
     showLanguageSwitch,
-    showLegalNotice,
+    showSecondaryLinks,
     showSocialMediaLinks,
   } = args;
 
@@ -75,7 +81,7 @@ export const FooterCompositions = (args) => {
   };
 
   const columnHeading = (text: string) => {
-    return headlineWithLink ? (
+    return headingWithLink ? (
       <Link href="#" className="link-secondary">
         {text}
       </Link>
@@ -280,7 +286,7 @@ export const FooterCompositions = (args) => {
           alignmentX={{ mobile: 'center', desktop: 'stretch' }}
           alignmentY="center"
           spacing="space-900"
-          marginBottom={showDividers || (!showDividers && !showLegalNotice) ? undefined : 'space-900'}
+          marginBottom={showDividers || (!showDividers && !showSecondaryLinks) ? undefined : 'space-900'}
         >
           {/* Product logo */}
           <div className={showSocialMediaLinks || showLanguageSwitch ? 'text-desktop-left' : 'text-center'}>
@@ -337,10 +343,10 @@ export const FooterCompositions = (args) => {
         </Grid>
 
         {/* Divider */}
-        {showDividers && showLegalNotice && <Divider UNSAFE_className="my-900" />}
+        {showDividers && showSecondaryLinks && <Divider UNSAFE_className="my-900" />}
 
         {/* Flex with secondary links */}
-        {showLegalNotice && (
+        {showSecondaryLinks && (
           <nav aria-label="Secondary links">
             <Flex
               elementType="ul"