@axos-web-dev/shared-components 2.0.0-dev.9-fixdependencies → 2.0.0-dev.login

package/dist/NavigationMenu/utils.d.ts

@@ -0,0 +1,480 @@
+import { UrlResolver } from '../utils/allowedAxosDomains';
+
+export interface Logo {
+    id: string;
+    url: string;
+    alt: string;
+}
+export interface NavItem {
+    id: string;
+    url: string;
+    label: string;
+    descriptiveTextAriaLabel?: string;
+    icon?: string | undefined;
+    ariaLabel?: string | undefined;
+    target?: any;
+}
+export interface NavItems extends NavItem {
+    items?: NavItems[];
+    subItems?: NavItems[];
+    menuItems?: Menu;
+    hasMenu?: boolean;
+    rightSide?: boolean | undefined;
+    dropdown?: boolean | undefined;
+    displayInNavigation?: boolean | undefined;
+}
+export interface SubNavItems extends NavItem {
+    subItems: (NavItems | NavItem | undefined)[];
+    menuItems?: Menu;
+    hasMenu?: boolean;
+    dropdown: boolean | undefined;
+    rightSide?: boolean | undefined;
+    displayInNavigation?: boolean | undefined;
+}
+export interface Navigation {
+    subNavBar?: SubNavItems[];
+    logo?: Logo;
+    quickLinks: NavItem[];
+}
+export interface Menu {
+    target: Record<string, unknown>;
+    heading: string;
+    bannerHeading: string;
+    bannerDescription: string;
+    helpAndSupportLink?: string;
+    bannerImage: {
+        fields: {
+            title: string;
+            file: {
+                url: string;
+                details: {
+                    size: number;
+                    image: {
+                        width: number;
+                        height: number;
+                    };
+                };
+                fileName: string;
+                contentType: string;
+            };
+        };
+    };
+    bannerCta?: {
+        id: string;
+        label: string;
+        url: string;
+        ariaLabel?: string;
+        variant?: string;
+        type?: "Button" | "Chevron";
+        newTab?: boolean;
+    }[];
+    subItems?: NavItems[];
+}
+export interface PrimaryMenu {
+    sys: {
+        id: string;
+        contentType: {
+            sys: {
+                id: "primaryNavigation";
+            };
+        };
+    };
+    fields: {
+        display: string;
+        displayInNavigation: boolean;
+        rightSide: boolean;
+        dropdown: boolean;
+        target: {
+            sys: {
+                id: string;
+                contentType: {
+                    sys: {
+                        id: string;
+                    };
+                };
+            };
+            fields: {
+                displayText: string;
+                targetUrl: string;
+                descriptiveTextAriaLabel: string;
+                icon: {
+                    fields: {
+                        image: {
+                            fields: {
+                                file: {
+                                    url: string;
+                                };
+                            };
+                        };
+                    };
+                };
+            };
+        };
+        children: Array<PrimaryChildrens>;
+    };
+}
+export interface QuickLink {
+    sys: {
+        id: string;
+        contentType: {
+            sys: {
+                id: string;
+            };
+        };
+    };
+    fields: {
+        displayText: string;
+        targetUrl: string;
+        descriptiveTextAriaLabel: string;
+        icon: {
+            fields: {
+                image: {
+                    fields: {
+                        file: {
+                            url: string;
+                        };
+                    };
+                };
+            };
+        };
+    };
+}
+export interface HyperLinkType {
+    sys: {
+        id: string;
+        contentType: {
+            sys: {
+                id: "hyperlink";
+            };
+        };
+    };
+    fields: {
+        displayText: string;
+        targetUrl: string;
+        descriptiveTextAriaLabel: string;
+    };
+}
+export interface CallToActionType {
+    sys: {
+        id: string;
+        contentType: {
+            sys: {
+                id: "hyperlink";
+            };
+        };
+    };
+    fields: {
+        displayText: string;
+        targetUrl: string;
+        descriptiveTextAriaLabel: string;
+        icon: {
+            fields: {
+                image: {
+                    fields: {
+                        file: {
+                            url: string;
+                        };
+                    };
+                };
+            };
+        };
+    };
+}
+export interface TertiaryMenu {
+    sys: {
+        id: string;
+        contentType: {
+            sys: {
+                id: "tertiaryNavigation";
+            };
+        };
+    };
+    fields: {
+        displayText?: string;
+        target: CallToActionType;
+        descriptiveTextAriaLabel?: string;
+        children: Array<HyperLinkType>;
+        targetUrl?: string;
+        icon: {
+            fields: {
+                file: {
+                    url: string;
+                };
+            };
+        };
+    };
+}
+export interface SecondaryMenu {
+    sys: {
+        id: string;
+        contentType: {
+            sys: {
+                id: "secondaryNavigation";
+            };
+        };
+    };
+    fields: {
+        display: string;
+        target: HyperLinkType;
+        children: Array<TertiaryMenu>;
+        heading: string;
+        bannerHeading: string;
+        bannerDescription: string;
+        helpAndSupportLink?: string;
+        bannerImage: {
+            fields: {
+                title: string;
+                file: {
+                    url: string;
+                    details: {
+                        size: number;
+                        image: {
+                            width: number;
+                            height: number;
+                        };
+                    };
+                    fileName: string;
+                    contentType: string;
+                };
+            };
+        };
+        bannerCtaLinks?: Array<{
+            sys: {
+                id: string;
+                type: string;
+            };
+            fields: {
+                displayText: string;
+                targetUrl: string;
+                descriptiveTextAriaLabel: string;
+                variant?: string;
+                type?: "Button" | "Chevron";
+                openNewTab?: boolean;
+            };
+        }>;
+    };
+}
+type PrimaryChildrens = SecondaryMenu | HyperLinkType;
+export interface MenuObject {
+    sys: {
+        id: string;
+        contentType: {
+            sys: {
+                id: string;
+            };
+        };
+    };
+    fields: {
+        label: string;
+        description: string;
+        display: string;
+        target: Array<{
+            sys: {
+                id: string;
+                contentType: {
+                    sys: {
+                        id: string;
+                    };
+                };
+            };
+            fields: {
+                displayText: string;
+                targetUrl: string;
+                descriptiveTextAriaLabel: string;
+            };
+        }>;
+        logo: {
+            sys: {
+                id: string;
+                type: string;
+            };
+            fields: {
+                title: string;
+                image: {
+                    fields: {
+                        file: {
+                            url: string;
+                        };
+                    };
+                };
+            };
+        };
+        quickLinks: Array<{
+            sys: {
+                id: string;
+                contentType: {
+                    sys: {
+                        id: string;
+                    };
+                };
+            };
+            fields: {
+                displayText: string;
+                targetUrl: string;
+                descriptiveTextAriaLabel: string;
+                icon: {
+                    fields: {
+                        image: {
+                            fields: {
+                                file: {
+                                    url: string;
+                                };
+                            };
+                        };
+                    };
+                };
+            };
+        }>;
+        children: PrimaryMenu[];
+    };
+}
+export declare const getFirstLevelMenuItems: (menuData: MenuObject) => ({
+    id: string;
+    label: string;
+    url: string;
+    descriptiveTextAriaLabel: string;
+    rightSide: boolean;
+    dropdown: boolean;
+} | {
+    id?: undefined;
+    label?: undefined;
+    url?: undefined;
+    descriptiveTextAriaLabel?: undefined;
+    rightSide?: undefined;
+    dropdown?: undefined;
+})[];
+export declare const getLogo: (menuData: MenuObject) => {
+    id: string;
+    url: string;
+    alt: string;
+};
+export declare const getQuickLinks: (menuData: MenuObject) => NavItem[];
+export declare const extractChildrenTargets: (children: PrimaryChildrens[]) => (NavItem | {
+    id: string;
+    label: string;
+    url: string;
+    hasMenu: boolean;
+    descriptiveTextAriaLabel: string;
+    menuItems: {
+        target: {
+            displayText: string;
+            targetUrl: string;
+            descriptiveTextAriaLabel: string;
+            id: string;
+        };
+        heading: string;
+        bannerHeading: string;
+        bannerDescription: string;
+        helpAndSupportLink: string | undefined;
+        bannerImage: {
+            fields: {
+                title: string;
+                file: {
+                    url: string;
+                    details: {
+                        size: number;
+                        image: {
+                            width: number;
+                            height: number;
+                        };
+                    };
+                    fileName: string;
+                    contentType: string;
+                };
+            };
+        };
+        bannerCta: {
+            id: string;
+            label: string;
+            url: string;
+            ariaLabel: string;
+            variant: string | undefined;
+            type: "Button" | "Chevron" | undefined;
+            newTab: boolean | undefined;
+        }[] | undefined;
+        subItems: {
+            items: {
+                id: string;
+                label: string;
+                descriptiveTextAriaLabel: string;
+                url: string;
+                icon: string;
+            }[];
+            id: string;
+            label: string;
+            icon: string;
+            descrictiveTextAriaLabel: string;
+            url: string;
+        }[];
+    };
+} | undefined)[];
+export declare const getNavMenuItems: (menuData: MenuObject) => {
+    id: string;
+    label: string;
+    url: string;
+    descriptiveTextAriaLabel: string;
+    dropdown: boolean;
+    rightSide: boolean;
+    displayInNavigation: boolean;
+    subItems: (NavItem | {
+        id: string;
+        label: string;
+        url: string;
+        hasMenu: boolean;
+        descriptiveTextAriaLabel: string;
+        menuItems: {
+            target: {
+                displayText: string;
+                targetUrl: string;
+                descriptiveTextAriaLabel: string;
+                id: string;
+            };
+            heading: string;
+            bannerHeading: string;
+            bannerDescription: string;
+            helpAndSupportLink: string | undefined;
+            bannerImage: {
+                fields: {
+                    title: string;
+                    file: {
+                        url: string;
+                        details: {
+                            size: number;
+                            image: {
+                                width: number;
+                                height: number;
+                            };
+                        };
+                        fileName: string;
+                        contentType: string;
+                    };
+                };
+            };
+            bannerCta: {
+                id: string;
+                label: string;
+                url: string;
+                ariaLabel: string;
+                variant: string | undefined;
+                type: "Button" | "Chevron" | undefined;
+                newTab: boolean | undefined;
+            }[] | undefined;
+            subItems: {
+                items: {
+                    id: string;
+                    label: string;
+                    descriptiveTextAriaLabel: string;
+                    url: string;
+                    icon: string;
+                }[];
+                id: string;
+                label: string;
+                icon: string;
+                descrictiveTextAriaLabel: string;
+                url: string;
+            }[];
+        };
+    } | undefined)[];
+}[];
+export declare const getPathFromNavUrl: (url: string | undefined, resolveUrl: UrlResolver) => string;
+export {};

package/dist/NavigationMenu/utils.js

@@ -0,0 +1,128 @@
+const getFirstLevelMenuItems = (menuData) => {
+  if (!menuData.fields?.children) return [];
+  return menuData.fields?.children?.map(
+    ({ fields, sys }) => fields?.target !== void 0 ? {
+      id: sys.id || sys.id,
+      label: fields.target.fields.displayText,
+      url: fields.target.fields.targetUrl,
+      descriptiveTextAriaLabel: fields?.target.fields.descriptiveTextAriaLabel,
+      rightSide: !!fields.rightSide,
+      dropdown: fields?.dropdown
+    } : {}
+  );
+};
+const getLogo = (menuData) => {
+  const { fields } = menuData;
+  return {
+    id: fields?.logo?.sys?.id,
+    url: fields?.logo?.fields?.image?.fields?.file?.url,
+    alt: fields?.logo?.fields?.title
+  };
+};
+const transformPrimaryNavigation = (item) => {
+  const { sys, fields } = item;
+  return {
+    id: sys.id,
+    label: fields?.target?.fields?.displayText,
+    url: fields?.target?.fields?.targetUrl,
+    hasMenu: fields.children && fields.children.length > 0,
+    descriptiveTextAriaLabel: fields.target?.fields.descriptiveTextAriaLabel,
+    menuItems: {
+      target: { id: fields.target?.sys?.id, ...fields?.target?.fields },
+      heading: fields.heading,
+      bannerHeading: fields.bannerHeading,
+      bannerDescription: fields.bannerDescription,
+      helpAndSupportLink: fields.helpAndSupportLink,
+      bannerImage: fields?.bannerImage,
+      bannerCta: fields?.bannerCtaLinks?.map(({ sys: sys2, fields: fields2 }) => ({
+        id: sys2.id,
+        label: fields2.displayText,
+        url: fields2.targetUrl,
+        ariaLabel: fields2.descriptiveTextAriaLabel,
+        variant: fields2.variant,
+        type: fields2.type,
+        newTab: fields2.openNewTab
+      })),
+      subItems: fields?.children?.length > 0 ? fields.children?.map(({ fields: menuFields, sys: menuSys }) => {
+        const target = {
+          id: menuSys.id,
+          label: menuFields?.target?.fields?.displayText ?? menuFields?.displayText,
+          icon: menuFields?.icon?.fields?.file?.url,
+          descrictiveTextAriaLabel: menuFields?.target?.fields?.descriptiveTextAriaLabel ?? menuFields.descriptiveTextAriaLabel,
+          url: menuFields?.target?.fields?.targetUrl ?? menuFields.targetUrl
+        };
+        const items = menuFields?.children?.map((item2) => {
+          return {
+            id: item2.sys.id,
+            label: item2.fields.displayText,
+            descriptiveTextAriaLabel: item2.fields.descriptiveTextAriaLabel,
+            url: item2.fields.targetUrl,
+            icon: menuFields?.icon?.fields?.file?.url
+          };
+        });
+        return {
+          ...target,
+          items
+        };
+      }) : []
+    }
+  };
+};
+const getQuickLinks = (menuData) => {
+  return menuData?.fields?.quickLinks?.map(({ fields, sys }) => ({
+    id: sys.id,
+    label: fields?.displayText,
+    url: fields?.targetUrl,
+    ariaLabel: fields?.descriptiveTextAriaLabel ?? "",
+    icon: fields?.icon?.fields?.image?.fields?.file?.url
+  }));
+};
+const extractChildrenTargets = (children) => {
+  if (!children) return [];
+  return children?.map((child) => {
+    if (child?.sys?.contentType?.sys?.id === "secondaryNavigation") {
+      return transformPrimaryNavigation(child);
+    }
+    if (child?.sys?.contentType?.sys?.id === "hyperlink") {
+      const { fields, sys } = child;
+      return {
+        id: sys.id,
+        label: fields?.displayText,
+        url: fields?.targetUrl,
+        descriptiveTextAriaLabel: fields?.descriptiveTextAriaLabel
+      };
+    }
+  }).filter(Boolean);
+};
+const getNavMenuItems = (menuData) => {
+  return menuData?.fields?.children?.map(({ fields, sys }) => ({
+    id: sys.id,
+    label: fields.target?.fields?.displayText,
+    url: fields.target?.fields?.targetUrl,
+    descriptiveTextAriaLabel: fields.target?.fields?.descriptiveTextAriaLabel ?? "",
+    dropdown: fields?.dropdown,
+    rightSide: fields?.rightSide ?? false,
+    displayInNavigation: fields?.displayInNavigation,
+    subItems: extractChildrenTargets(fields.children)
+  }));
+};
+const getPathFromNavUrl = (url, resolveUrl) => {
+  if (!url) return "";
+  const resolved = resolveUrl(url);
+  if (resolved.startsWith("/")) {
+    return resolved.split(/[?#]/)[0];
+  }
+  try {
+    return new URL(resolved).pathname;
+  } catch {
+    return resolved.startsWith("/") ? resolved : `/${resolved}`;
+  }
+};
+export {
+  extractChildrenTargets,
+  getFirstLevelMenuItems,
+  getLogo,
+  getNavMenuItems,
+  getPathFromNavUrl,
+  getQuickLinks
+};

package/dist/PageNavSet/PageNavSet.js

@@ -107,15 +107,23 @@ const PageNavSet = ({ id, pageNavItems }) => {
       });
     }
   }, [isClient]);
-  return /* @__PURE__ */ jsx("nav", { className: clsx(sticky_nav), id: "pageNav", children: /* @__PURE__ */ jsx("div", { className: "containment", id: `id_${id}`, style: { width: "100%" }, children: /* @__PURE__ */ jsx(SliderComponent, { ...settings, ref: sliderRef, children: pageNavItems?.map((section) => /* @__PURE__ */ jsx(
-    PageNavItem,
+  return /* @__PURE__ */ jsx(
+    "nav",
     {
-      id: section?.id,
-      label: section.label,
-      addClassName: `nav_child ${activeSection === section?.id?.replace(/ /g, "-") ? "active" : ""}`
-    },
-    section?.id
-  )) }) }) });
+      className: clsx(sticky_nav),
+      id: "pageNav",
+      "aria-label": "current page navigation",
+      children: /* @__PURE__ */ jsx("div", { className: "containment", id: `id_${id}`, style: { width: "100%" }, children: /* @__PURE__ */ jsx(SliderComponent, { ...settings, ref: sliderRef, children: pageNavItems?.map((section) => /* @__PURE__ */ jsx(
+        PageNavItem,
+        {
+          id: section?.id,
+          label: section.label,
+          addClassName: `nav_child ${activeSection === section?.id?.replace(/ /g, "-") ? "active" : ""}`
+        },
+        section?.id
+      )) }) })
+    }
+  );
 };
 export {
   PageNavSet

package/dist/Pagination/Pagination.d.ts

@@ -1,5 +1,5 @@
 type Props = {
     totalPages: number;
 };
-export declare function Pagination({ totalPages }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function Pagination({ totalPages }: Props): import("react").JSX.Element;
 export {};

package/dist/SecondaryFooter/index.d.ts

@@ -6,4 +6,4 @@ export interface FooterItem {
 export interface SecondaryFooterProps {
     items: FooterItem[];
 }
-export declare const SecondaryFooter: (props: SecondaryFooterProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SecondaryFooter: (props: SecondaryFooterProps) => import("react").JSX.Element;

package/dist/SecondaryFooter/index.js

@@ -4,7 +4,14 @@ import clsx from "clsx";
 import { footer_items_wrapper, footer_item, footer_link, secondary_footer } from "./SecondaryFooter.css.js";
 const SecondaryFooter = (props) => {
   const { items } = props;
-  return /* @__PURE__ */ jsx("div", { className: clsx(secondary_footer, "containment", "section_spacer"), children: /* @__PURE__ */ jsx("div", { className: footer_items_wrapper, children: items?.map((item) => /* @__PURE__ */ jsx("div", { className: footer_item, children: /* @__PURE__ */ jsx(Hyperlink, { targetUrl: item.targetURL, className: footer_link, children: item.displayText }) }, item.id)) }) });
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      className: clsx(secondary_footer, "containment"),
+      "aria-label": "popular links navigation",
+      children: /* @__PURE__ */ jsx("div", { className: footer_items_wrapper, children: items?.map((item) => /* @__PURE__ */ jsx("div", { className: footer_item, children: /* @__PURE__ */ jsx(Hyperlink, { targetUrl: item.targetURL, className: footer_link, children: item.displayText }) }, item.id)) })
+    }
+  );
 };
 export {
   SecondaryFooter

package/dist/SetContainer/SetContainer.css.d.ts

@@ -5,14 +5,17 @@ export declare const set_container: import('@vanilla-extract/recipes').RuntimeFn
         };
         secondary: {
             background: `var(--${string})`;
+            paddingBlock: "2.5rem";
         };
         tertiary: {
             background: `var(--${string})`;
             color: `var(--${string})`;
+            paddingBlock: "2.5rem";
         };
         quaternary: {
             background: `var(--${string})`;
             color: `var(--${string})`;
+            paddingBlock: "2.5rem";
         };
     };
 }>;
@@ -34,6 +37,7 @@ export declare const set_container_cols: import('@vanilla-extract/recipes').Runt
     };
 }>;
 export declare const setcontainer_section_text: string;
+export declare const setcontainer_section_additionaltext: string;
 export declare const imageLinkContainer: string;
 export declare const set_logo: string;
 export declare const isolate_container: import('@vanilla-extract/recipes').RuntimeFn<{