@windstream/react-shared-components 0.1.70 → 0.1.71

package/src/contentful/blocks/footer/Footer.stories.tsx

@@ -1,204 +1,204 @@
-import { Footer } from "./index";
-import { DocsPage } from "@shared/stories/DocsTemplate";
-import type { Meta, StoryObj } from "@storybook/react";
-
-// ─── Mock Data ────────────────────────────────────────────────────────────────
-const mockBody = `<p><strong>Kinetic's multi-Gig Fiber upload speeds</strong> are faster than advertised cable upload speeds, excluding areas where cable providers offer symmetrical upload speeds for service tiers 1 Gig and above. Speed comparison based upon publicly available advertised speeds in Kinetic's footprint as of February 2026.</p>
-<br/><p><strong>99.9% Network Reliability:</strong> Kinetic Network Reliability based on monthly service availability scores from March 2023 to Dec. 2025 as measured by the Kinetic Network Operations Center using the formula Available Customer Hours divided by Total Customer Hours (Available Customer Hours plus Customer Outage Hours). Customer Outage Hours does not include planned maintenance, emergency events (hurricanes, winter storms, mass flooding, etc.).</p>
-<br/><p><strong>100% Fiber excludes some multitenant units.</strong></p>
-<br/><p><strong>The Kinetic Promise</strong> - relies on reasonable effort to confirm Wi-Fi works in living spaces where customer grants technician access. Wi-Fi coverage &amp; performance vary by layout, building materials, interference, &amp; device capability. Not a guarantee of uniform coverage, speed, or error-free service. Add. equipment or wiring may be required &amp; incur charges; certain areas/devices (e.g., detached structures or outdoor spaces) may be excluded. Customer may cancel any time.</p>`;
-
-const mockCopyrights = `<strong>Uniti2101</strong><br/><strong>Riverfront Drive</strong><br/><strong>Little Rock, Arkansas 72202</strong><br/><br/>`;
-
-const meta: Meta<typeof Footer> = {
-  title: "Contentful Blocks/Footer",
-  component: Footer,
-  tags: ["autodocs"],
-  parameters: {
-    layout: "fullscreen",
-    docs: {
-      page: DocsPage,
-      description: {
-        component:
-          "Contentful footer block with body, links, copyrights, and terms.",
-      },
-    },
-  },
-  argTypes: {
-    body: {
-      control: "text",
-      description: "HTML string for disclaimer or promotional body content at top of footer",
-    },
-    copyrights: {
-      control: "text",
-      description: "HTML string for copyright description text rendered below the year",
-    },
-    terms: {
-      control: "text",
-      description: "Company name shown after © year symbol",
-    },
-    links: {
-      control: "object",
-      description: "Navigation link groups rendered as columns",
-    },
-    bottomLinks: {
-      control: "object",
-      description: "Legal bottom links rendered inline with bullet separators",
-    },
-    maxWidth: {
-      control: "boolean",
-      description: "Constrains footer content to max-width centered layout",
-    },
-    onClick: {
-      action: "clicked",
-      description: "Callback fired when any footer link is clicked",
-    },
-  },
-  args: {
-    body: mockBody,
-    copyrights: mockCopyrights,
-    terms: "All rights reserved Uniti Group, Inc.",
-    maxWidth: true,
-    links: [
-      {
-        title: "Explore",
-        items: {
-          items: [
-            { buttonLabel: "Fiber Internet", href: "/fiber-internet", showButtonAs: "text" },
-            { buttonLabel: "High-Speed Internet", href: "/high-speed-internet", showButtonAs: "text" },
-            { buttonLabel: "Whole Home Wi-Fi", href: "/whole-home-wifi", showButtonAs: "text" },
-            { buttonLabel: "Internet Security", href: "/kinetic-secure-packs", showButtonAs: "text" },
-            { buttonLabel: "AT&T Wireless", href: "/att-wireless", showButtonAs: "text" },
-            { buttonLabel: "TV & Entertainment", href: "/products", showButtonAs: "text" },
-            { buttonLabel: "Home Phone", href: "/home-phone", showButtonAs: "text" },
-            { buttonLabel: "Kinetic Wi-Fi Manager", href: "/wifi-manager", showButtonAs: "text" },
-          ],
-        },
-      },
-      {
-        title: "Resources",
-        items: {
-          items: [
-            { buttonLabel: "Support", href: "/support", showButtonAs: "text" },
-            { buttonLabel: "Find Local", href: "/find-local", showButtonAs: "text" },
-            { buttonLabel: "Go Kinetic Customer Portal", href: "https://www.my.gokinetic.com/", showButtonAs: "text" },
-            { buttonLabel: "Move My Service", href: "/moving-my-internet-service", showButtonAs: "text" },
-            { buttonLabel: "Kinetic Blog", href: "/blog", showButtonAs: "text" },
-            { buttonLabel: "Referral Program", href: "/refer-a-friend-program", showButtonAs: "text" },
-            { buttonLabel: "Lifeline Assistance Program", href: "/lifeline", showButtonAs: "text" },
-            { buttonLabel: "Digital Literacy Program", href: "/residential/digital-literacy-program", showButtonAs: "text" },
-            { buttonLabel: "Become an Authorized Dealer", href: "/authorized-dealer", showButtonAs: "text" },
-          ],
-        },
-      },
-      {
-        title: "Company",
-        items: {
-          items: [
-            { buttonLabel: "About Us", href: "/about", showButtonAs: "text" },
-            { buttonLabel: "Careers", href: "/careers", showButtonAs: "text" },
-            { buttonLabel: "News", href: "/news", showButtonAs: "text" },
-            { buttonLabel: "Investor Relations", href: "https://investor.windstream.com", showButtonAs: "text" },
-            { buttonLabel: "Suppliers", href: "/about/supplier-information", showButtonAs: "text" },
-            { buttonLabel: "Offer Conditions", href: "/offer-conditions", showButtonAs: "text" },
-            { buttonLabel: "Broadband Network Statement", href: "/about/legal/broadband-network-statement", showButtonAs: "text" },
-            { buttonLabel: "Law Enforcement Support Center", href: "/law-enforcement-support-center-2", showButtonAs: "text" },
-            { buttonLabel: "Call Authentication Statement", href: "/about/legal/call-authentication-statement", showButtonAs: "text" },
-          ],
-        },
-      },
-      {
-        title: "Kinetic",
-        items: {
-          items: [
-            { buttonLabel: "Residential", href: "/", showButtonAs: "text" },
-            { buttonLabel: "Business", href: "/business", showButtonAs: "text" },
-            { buttonLabel: "Uniti Solutions", href: "/enterprise", showButtonAs: "text" },
-          ],
-        },
-      },
-    ],
-    bottomLinks: [
-      { buttonLabel: "Privacy Policy", href: "/about/legal/privacy-policy", showButtonAs: "text" },
-      { buttonLabel: "Terms & Conditions", href: "/about/legal/terms-and-conditions", showButtonAs: "text" },
-      { buttonLabel: "Legal Notice", href: "/about/legal/legal-notices", showButtonAs: "text" },
-    ],
-  },
-  render: ({ body, copyrights, ...rest }) => (
-    <Footer
-      {...rest}
-      body={
-        body ? (
-          <div dangerouslySetInnerHTML={{ __html: body as string }} />
-        ) : undefined
-      }
-      copyrights={
-        copyrights ? (
-          <div dangerouslySetInnerHTML={{ __html: copyrights as string }} />
-        ) : undefined
-      }
-    />
-  ),
-};
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};
-
-export const NoLinks: Story = {
-  parameters: {
-    docs: {
-      description: {
-        story: "Footer without navigation link group columns.",
-      },
-    },
-  },
-  args: {
-    links: [],
-  },
-};
-
-export const NoBottomLinks: Story = {
-  parameters: {
-    docs: {
-      description: {
-        story: "Footer without bottom copyright and legal links row.",
-      },
-    },
-  },
-  args: {
-    bottomLinks: [],
-  },
-};
-
-/**no max-width constraint */
-export const FullWidth: Story = {
-  parameters: {
-    docs: {
-      description: {
-        story: "Footer without max-width constraint — spans full container width.",
-      },
-    },
-  },
-  args: {
-    maxWidth: false,
-  },
-};
-
-/**terms and copyright, no links or body */
-export const Minimal: Story = {
-  parameters: {
-    docs: {
-      description: {
-        story: "Minimal footer with only terms and copyright text — no body, no links.",
-      },
-    },
-  },
-  args: {
-    body: undefined,
-    links: [],
-    bottomLinks: [],
-    copyrights: undefined,
-  },
+import { Footer } from "./index";
+import { DocsPage } from "@shared/stories/DocsTemplate";
+import type { Meta, StoryObj } from "@storybook/react";
+
+// ─── Mock Data ────────────────────────────────────────────────────────────────
+const mockBody = `<p><strong>Kinetic's multi-Gig Fiber upload speeds</strong> are faster than advertised cable upload speeds, excluding areas where cable providers offer symmetrical upload speeds for service tiers 1 Gig and above. Speed comparison based upon publicly available advertised speeds in Kinetic's footprint as of February 2026.</p>
+<br/><p><strong>99.9% Network Reliability:</strong> Kinetic Network Reliability based on monthly service availability scores from March 2023 to Dec. 2025 as measured by the Kinetic Network Operations Center using the formula Available Customer Hours divided by Total Customer Hours (Available Customer Hours plus Customer Outage Hours). Customer Outage Hours does not include planned maintenance, emergency events (hurricanes, winter storms, mass flooding, etc.).</p>
+<br/><p><strong>100% Fiber excludes some multitenant units.</strong></p>
+<br/><p><strong>The Kinetic Promise</strong> - relies on reasonable effort to confirm Wi-Fi works in living spaces where customer grants technician access. Wi-Fi coverage &amp; performance vary by layout, building materials, interference, &amp; device capability. Not a guarantee of uniform coverage, speed, or error-free service. Add. equipment or wiring may be required &amp; incur charges; certain areas/devices (e.g., detached structures or outdoor spaces) may be excluded. Customer may cancel any time.</p>`;
+
+const mockCopyrights = `<strong>Uniti2101</strong><br/><strong>Riverfront Drive</strong><br/><strong>Little Rock, Arkansas 72202</strong><br/><br/>`;
+
+const meta: Meta<typeof Footer> = {
+  title: "Contentful Blocks/Footer",
+  component: Footer,
+  tags: ["autodocs"],
+  parameters: {
+    layout: "fullscreen",
+    docs: {
+      page: DocsPage,
+      description: {
+        component:
+          "Contentful footer block with body, links, copyrights, and terms.",
+      },
+    },
+  },
+  argTypes: {
+    body: {
+      control: "text",
+      description: "HTML string for disclaimer or promotional body content at top of footer",
+    },
+    copyrights: {
+      control: "text",
+      description: "HTML string for copyright description text rendered below the year",
+    },
+    terms: {
+      control: "text",
+      description: "Company name shown after © year symbol",
+    },
+    links: {
+      control: "object",
+      description: "Navigation link groups rendered as columns",
+    },
+    bottomLinks: {
+      control: "object",
+      description: "Legal bottom links rendered inline with bullet separators",
+    },
+    maxWidth: {
+      control: "boolean",
+      description: "Constrains footer content to max-width centered layout",
+    },
+    onClick: {
+      action: "clicked",
+      description: "Callback fired when any footer link is clicked",
+    },
+  },
+  args: {
+    body: mockBody,
+    copyrights: mockCopyrights,
+    terms: "All rights reserved Uniti Group, Inc.",
+    maxWidth: true,
+    links: [
+      {
+        title: "Explore",
+        items: {
+          items: [
+            { buttonLabel: "Fiber Internet", href: "/fiber-internet", showButtonAs: "text" },
+            { buttonLabel: "High-Speed Internet", href: "/high-speed-internet", showButtonAs: "text" },
+            { buttonLabel: "Whole Home Wi-Fi", href: "/whole-home-wifi", showButtonAs: "text" },
+            { buttonLabel: "Internet Security", href: "/kinetic-secure-packs", showButtonAs: "text" },
+            { buttonLabel: "AT&T Wireless", href: "/att-wireless", showButtonAs: "text" },
+            { buttonLabel: "TV & Entertainment", href: "/products", showButtonAs: "text" },
+            { buttonLabel: "Home Phone", href: "/home-phone", showButtonAs: "text" },
+            { buttonLabel: "Kinetic Wi-Fi Manager", href: "/wifi-manager", showButtonAs: "text" },
+          ],
+        },
+      },
+      {
+        title: "Resources",
+        items: {
+          items: [
+            { buttonLabel: "Support", href: "/support", showButtonAs: "text" },
+            { buttonLabel: "Find Local", href: "/find-local", showButtonAs: "text" },
+            { buttonLabel: "Go Kinetic Customer Portal", href: "https://www.my.gokinetic.com/", showButtonAs: "text" },
+            { buttonLabel: "Move My Service", href: "/moving-my-internet-service", showButtonAs: "text" },
+            { buttonLabel: "Kinetic Blog", href: "/blog", showButtonAs: "text" },
+            { buttonLabel: "Referral Program", href: "/refer-a-friend-program", showButtonAs: "text" },
+            { buttonLabel: "Lifeline Assistance Program", href: "/lifeline", showButtonAs: "text" },
+            { buttonLabel: "Digital Literacy Program", href: "/residential/digital-literacy-program", showButtonAs: "text" },
+            { buttonLabel: "Become an Authorized Dealer", href: "/authorized-dealer", showButtonAs: "text" },
+          ],
+        },
+      },
+      {
+        title: "Company",
+        items: {
+          items: [
+            { buttonLabel: "About Us", href: "/about", showButtonAs: "text" },
+            { buttonLabel: "Careers", href: "/careers", showButtonAs: "text" },
+            { buttonLabel: "News", href: "/news", showButtonAs: "text" },
+            { buttonLabel: "Investor Relations", href: "https://investor.windstream.com", showButtonAs: "text" },
+            { buttonLabel: "Suppliers", href: "/about/supplier-information", showButtonAs: "text" },
+            { buttonLabel: "Offer Conditions", href: "/offer-conditions", showButtonAs: "text" },
+            { buttonLabel: "Broadband Network Statement", href: "/about/legal/broadband-network-statement", showButtonAs: "text" },
+            { buttonLabel: "Law Enforcement Support Center", href: "/law-enforcement-support-center-2", showButtonAs: "text" },
+            { buttonLabel: "Call Authentication Statement", href: "/about/legal/call-authentication-statement", showButtonAs: "text" },
+          ],
+        },
+      },
+      {
+        title: "Kinetic",
+        items: {
+          items: [
+            { buttonLabel: "Residential", href: "/", showButtonAs: "text" },
+            { buttonLabel: "Business", href: "/business", showButtonAs: "text" },
+            { buttonLabel: "Uniti Solutions", href: "/enterprise", showButtonAs: "text" },
+          ],
+        },
+      },
+    ],
+    bottomLinks: [
+      { buttonLabel: "Privacy Policy", href: "/about/legal/privacy-policy", showButtonAs: "text" },
+      { buttonLabel: "Terms & Conditions", href: "/about/legal/terms-and-conditions", showButtonAs: "text" },
+      { buttonLabel: "Legal Notice", href: "/about/legal/legal-notices", showButtonAs: "text" },
+    ],
+  },
+  render: ({ body, copyrights, ...rest }) => (
+    <Footer
+      {...rest}
+      body={
+        body ? (
+          <div dangerouslySetInnerHTML={{ __html: body as string }} />
+        ) : undefined
+      }
+      copyrights={
+        copyrights ? (
+          <div dangerouslySetInnerHTML={{ __html: copyrights as string }} />
+        ) : undefined
+      }
+    />
+  ),
+};
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};
+
+export const NoLinks: Story = {
+  parameters: {
+    docs: {
+      description: {
+        story: "Footer without navigation link group columns.",
+      },
+    },
+  },
+  args: {
+    links: [],
+  },
+};
+
+export const NoBottomLinks: Story = {
+  parameters: {
+    docs: {
+      description: {
+        story: "Footer without bottom copyright and legal links row.",
+      },
+    },
+  },
+  args: {
+    bottomLinks: [],
+  },
+};
+
+/**no max-width constraint */
+export const FullWidth: Story = {
+  parameters: {
+    docs: {
+      description: {
+        story: "Footer without max-width constraint — spans full container width.",
+      },
+    },
+  },
+  args: {
+    maxWidth: false,
+  },
+};
+
+/**terms and copyright, no links or body */
+export const Minimal: Story = {
+  parameters: {
+    docs: {
+      description: {
+        story: "Minimal footer with only terms and copyright text — no body, no links.",
+      },
+    },
+  },
+  args: {
+    body: undefined,
+    links: [],
+    bottomLinks: [],
+    copyrights: undefined,
+  },
 };

package/src/contentful/blocks/footer/index.tsx

@@ -1,91 +1,91 @@
-import React from "react";
-import { Button } from "../button";
-import { FooterProps } from "./types";
-
-import { Divider } from "@shared/components/divider";
-import { Text } from "@shared/components/text";
-
-export const Footer: React.FC<FooterProps> = ({
-  body,
-  links,
-  bottomLinks,
-  copyrights,
-  terms,
-  maxWidth = true,
-  onClick,
-}) => {
-  function footerClick(
-    event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>
-  ): void {
-    onClick?.(event);
-  }
-
-  return (
-    <div className="component-container bg-bg-inverse text-white">
-      <div className={` ${maxWidth ? "mx-auto max-w-120" : ""} px-5 py-8`}>
-        <aside className="break-words" aria-label="Promotions and disclaimers">
-          {body}
-        </aside>
-        <Divider className="my-8 border-border-inverse lg:my-16" />
-        <div className="grid-1 grid gap-8 md:grid-cols-2 lg:grid-cols-4">
-          {links?.map((link: any, index: number) => (
-            <React.Fragment key={`footer-link-group-${index}`}>
-              <div key={`footer-link-group-${index}`}>
-                <nav
-                  aria-labelledby={`footer-${link?.title}`}
-                  className="site-links-group"
-                  key={`link-group-${index}`}
-                >
-                  <Text as="div" className="label3">
-                    {link?.title}
-                  </Text>
-                  <ul className="flex flex-col">
-                    {link?.items?.items?.map((site: any, _index: number) => (
-                      <li className="pt-3" key={`site-links-${_index}`}>
-                        <Button
-                          {...site}
-                          linkVariant="unstyled"
-                          linkClassName="text-white body3 hover:underline underline-offset-4"
-                          onClick={footerClick}
-                        />
-                      </li>
-                    ))}
-                  </ul>
-                </nav>
-              </div>
-              <Divider className="border-border-inverse md:hidden" />
-            </React.Fragment>
-          ))}
-        </div>
-
-        <div className="py-8">
-          <Divider className="my-8 hidden border-border-inverse md:my-8 md:block" />
-
-          <p className="terms-text footnote text-white">
-            &copy; {new Date().getFullYear()} {terms}
-          </p>
-          <p className="copy-rights whitespace-pre-line">{copyrights}</p>
-          <nav aria-label="Footer legal">
-            <ul className="bottom-links list-none">
-              {bottomLinks?.map((link: any, index: number) => (
-                <li
-                  key={`links-${index}`}
-                  className="relative float-left pl-[8px] before:absolute before:left-[3px] before:top-1/2 before:-translate-y-1/2 before:text-[14px] before:content-['•'] first-of-type:pl-0 first-of-type:before:content-['']"
-                >
-                  <Button
-                    {...link}
-                    linkClassName="footnote text-white hover:underline underline-offset-4"
-                    linkVariant="unstyled"
-                    onClick={footerClick}
-                  />
-                </li>
-              ))}
-            </ul>
-          </nav>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default Footer;
+import React from "react";
+import { Button } from "../button";
+import { FooterProps } from "./types";
+
+import { Divider } from "@shared/components/divider";
+import { Text } from "@shared/components/text";
+
+export const Footer: React.FC<FooterProps> = ({
+  body,
+  links,
+  bottomLinks,
+  copyrights,
+  terms,
+  maxWidth = true,
+  onClick,
+}) => {
+  function footerClick(
+    event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>
+  ): void {
+    onClick?.(event);
+  }
+
+  return (
+    <div className="component-container bg-bg-inverse text-white">
+      <div className={` ${maxWidth ? "mx-auto max-w-120" : ""} px-5 py-8`}>
+        <aside className="break-words" aria-label="Promotions and disclaimers">
+          {body}
+        </aside>
+        <Divider className="my-8 border-border-inverse lg:my-16" />
+        <div className="grid-1 grid gap-8 md:grid-cols-2 lg:grid-cols-4">
+          {links?.map((link: any, index: number) => (
+            <React.Fragment key={`footer-link-group-${index}`}>
+              <div key={`footer-link-group-${index}`}>
+                <nav
+                  aria-labelledby={`footer-${link?.title}`}
+                  className="site-links-group"
+                  key={`link-group-${index}`}
+                >
+                  <Text as="div" className="label3">
+                    {link?.title}
+                  </Text>
+                  <ul className="flex flex-col">
+                    {link?.items?.items?.map((site: any, _index: number) => (
+                      <li className="pt-3" key={`site-links-${_index}`}>
+                        <Button
+                          {...site}
+                          linkVariant="unstyled"
+                          linkClassName="text-white body3 hover:underline underline-offset-4"
+                          onClick={footerClick}
+                        />
+                      </li>
+                    ))}
+                  </ul>
+                </nav>
+              </div>
+              <Divider className="border-border-inverse md:hidden" />
+            </React.Fragment>
+          ))}
+        </div>
+
+        <div className="py-8">
+          <Divider className="my-8 hidden border-border-inverse md:my-8 md:block" />
+
+          <p className="terms-text footnote text-white">
+            &copy; {new Date().getFullYear()} {terms}
+          </p>
+          <p className="copy-rights whitespace-pre-line">{copyrights}</p>
+          <nav aria-label="Footer legal">
+            <ul className="bottom-links list-none">
+              {bottomLinks?.map((link: any, index: number) => (
+                <li
+                  key={`links-${index}`}
+                  className="relative float-left pl-[8px] before:absolute before:left-[3px] before:top-1/2 before:-translate-y-1/2 before:text-[14px] before:content-['•'] first-of-type:pl-0 first-of-type:before:content-['']"
+                >
+                  <Button
+                    {...link}
+                    linkClassName="footnote text-white hover:underline underline-offset-4"
+                    linkVariant="unstyled"
+                    onClick={footerClick}
+                  />
+                </li>
+              ))}
+            </ul>
+          </nav>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Footer;

package/src/contentful/blocks/footer/types.ts

@@ -1,13 +1,13 @@
-import React from "react";
-
-export type FooterProps = {
-  body: React.ReactNode;
-  links?: Array<any>;
-  bottomLinks?: Array<any>;
-  copyrights?: React.ReactNode;
-  terms?: string;
-  maxWidth?: boolean;
-  onClick?: (
-    event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>
-  ) => void;
-};
+import React from "react";
+
+export type FooterProps = {
+  body: React.ReactNode;
+  links?: Array<any>;
+  bottomLinks?: Array<any>;
+  copyrights?: React.ReactNode;
+  terms?: string;
+  maxWidth?: boolean;
+  onClick?: (
+    event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>
+  ) => void;
+};