@axos-web-dev/shared-components 0.0.56 → 0.0.57

package/dist/AlertBanner/index.d.ts

@@ -1,4 +1,4 @@
-import { AlertBannerInterface } from './AlertBanner.interface';
 import { FC } from 'react';
+import { AlertBannerInterface } from './AlertBanner.interface';
 
 export declare const AlertBanner: FC<AlertBannerInterface>;

package/dist/Button/Button.d.ts

@@ -1,5 +1,5 @@
-import { ButtonVariants } from './Button.css';
 import { AnchorHTMLAttributes, ButtonHTMLAttributes, ReactNode } from 'react';
+import { ButtonVariants } from './Button.css';
 
 export type ButtonBase = {
     children?: ReactNode;

package/dist/Button/GoBackButton.d.ts

@@ -1,4 +1,4 @@
-import { ButtonVariants } from './Button.css';
 import { ButtonProps } from './Button';
+import { ButtonVariants } from './Button.css';
 
 export declare const GoBackButton: (props: ButtonProps & ButtonVariants) => import("react/jsx-runtime").JSX.Element;

package/dist/CallToActionBar/CallToActionBar.interface.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
 import { ChevronProps } from '../Chevron/Chevron.interface';
+import { ReactNode } from 'react';
 
 export interface CallToActionBarInterface {
     id?: string;

package/dist/CallToActionBar/index.d.ts

@@ -1,4 +1,4 @@
-import { CallToActionBarInterface } from './CallToActionBar.interface';
 import { FC } from 'react';
+import { CallToActionBarInterface } from './CallToActionBar.interface';
 
 export declare const CallToActionBar: FC<CallToActionBarInterface>;

package/dist/Carousel/Carousel.css.d.ts

@@ -1,6 +1,34 @@
 import { RecipeVariants } from '@vanilla-extract/recipes';
 
 export declare const dots: string;
+export declare const headerCarousel: import('@vanilla-extract/recipes').RuntimeFn<{
+    variant: {
+        primary: {
+            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundClip: "text";
+            WebkitTextFillColor: "transparent";
+            textShadow: "0px 0px #00000000";
+        };
+        secondary: {
+            background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundClip: "text";
+            WebkitTextFillColor: "transparent";
+            textShadow: "0px 0px #00000000";
+        };
+        tertiary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundClip: "text";
+            WebkitTextFillColor: "transparent";
+            textShadow: "0px 0px #00000000";
+        };
+        quaternary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            backgroundClip: "text";
+            WebkitTextFillColor: "transparent";
+            textShadow: "0px 0px #00000000";
+        };
+    };
+}>;
 export declare const carousel: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {
         primary: {
@@ -21,6 +49,22 @@ export declare const carousel: import('@vanilla-extract/recipes').RuntimeFn<{
         };
     };
 }>;
+export declare const descriptionCarousel: import('@vanilla-extract/recipes').RuntimeFn<{
+    variant: {
+        primary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        secondary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        tertiary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+        quaternary: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
+    };
+}>;
 export declare const authorLocation: string;
 export declare const author: import('@vanilla-extract/recipes').RuntimeFn<{
     variant: {

package/dist/Carousel/Carousel.css.js

@@ -3,20 +3,24 @@
 /* empty css                            */
 import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
 var dots = "jgs3fs0";
-var carousel = createRuntimeFn({ defaultClassName: "jgs3fs1", variantClassNames: { variant: { primary: "jgs3fs2", secondary: "jgs3fs3", tertiary: "jgs3fs4", quaternary: "jgs3fs5" } }, defaultVariants: { variant: "primary" }, compoundVariants: [] });
-var authorLocation = "jgs3fs6";
-var author = createRuntimeFn({ defaultClassName: "jgs3fs8 jgs3fs7", variantClassNames: { variant: { primary: "jgs3fs9", secondary: "jgs3fsa", tertiary: "jgs3fsb", quaternary: "jgs3fsc" } }, defaultVariants: {}, compoundVariants: [] });
-var slideBase = "jgs3fsd";
-var slide = { show: "jgs3fse jgs3fsd", hide: "jgs3fsf jgs3fsd" };
-var slides = "jgs3fsg";
-var icon = createRuntimeFn({ defaultClassName: "jgs3fsh", variantClassNames: {}, defaultVariants: {}, compoundVariants: [] });
-var dot = createRuntimeFn({ defaultClassName: "jgs3fsi", variantClassNames: { variant: { primary: "jgs3fsj", secondary: "jgs3fsk", tertiary: "jgs3fsl", quaternary: "jgs3fsm" }, selected: { true: "jgs3fsn" } }, defaultVariants: { variant: "primary" }, compoundVariants: [[{ variant: "primary", selected: true }, "jgs3fso"], [{ variant: "secondary", selected: true }, "jgs3fsp"], [{ variant: "tertiary", selected: true }, "jgs3fsq"], [{ variant: "quaternary", selected: true }, "jgs3fsr"]] });
+var headerCarousel = createRuntimeFn({ defaultClassName: "jgs3fs1", variantClassNames: { variant: { primary: "jgs3fs2", secondary: "jgs3fs3", tertiary: "jgs3fs4", quaternary: "jgs3fs5" } }, defaultVariants: { variant: "primary" }, compoundVariants: [] });
+var carousel = createRuntimeFn({ defaultClassName: "jgs3fs6", variantClassNames: { variant: { primary: "jgs3fs7", secondary: "jgs3fs8", tertiary: "jgs3fs9", quaternary: "jgs3fsa" } }, defaultVariants: { variant: "primary" }, compoundVariants: [] });
+var descriptionCarousel = createRuntimeFn({ defaultClassName: "jgs3fsb", variantClassNames: { variant: { primary: "jgs3fsc", secondary: "jgs3fsd", tertiary: "jgs3fse", quaternary: "jgs3fsf" } }, defaultVariants: {}, compoundVariants: [] });
+var authorLocation = "jgs3fsg";
+var author = createRuntimeFn({ defaultClassName: "jgs3fsi jgs3fsh", variantClassNames: { variant: { primary: "jgs3fsj", secondary: "jgs3fsk", tertiary: "jgs3fsl", quaternary: "jgs3fsm" } }, defaultVariants: {}, compoundVariants: [] });
+var slideBase = "jgs3fsn";
+var slide = { show: "jgs3fso jgs3fsn", hide: "jgs3fsp jgs3fsn" };
+var slides = "jgs3fsq";
+var icon = createRuntimeFn({ defaultClassName: "jgs3fsr", variantClassNames: {}, defaultVariants: {}, compoundVariants: [] });
+var dot = createRuntimeFn({ defaultClassName: "jgs3fss", variantClassNames: { variant: { primary: "jgs3fst", secondary: "jgs3fsu", tertiary: "jgs3fsv", quaternary: "jgs3fsw" }, selected: { true: "jgs3fsx" } }, defaultVariants: { variant: "primary" }, compoundVariants: [[{ variant: "primary", selected: true }, "jgs3fsy"], [{ variant: "secondary", selected: true }, "jgs3fsz"], [{ variant: "tertiary", selected: true }, "jgs3fs10"], [{ variant: "quaternary", selected: true }, "jgs3fs11"]] });
 export {
   author,
   authorLocation,
   carousel,
+  descriptionCarousel,
   dot,
   dots,
+  headerCarousel,
   icon,
   slide,
   slideBase,

package/dist/Carousel/index.d.ts

@@ -1,5 +1,5 @@
-import { carouselVariants } from './Carousel.css';
 import { PropsWithChildren, ReactNode } from 'react';
+import { carouselVariants } from './Carousel.css';
 
 export interface SlideProps extends PropsWithChildren {
     id: string | number;
@@ -13,6 +13,8 @@ export interface CarouselProps extends PropsWithChildren {
     time?: number;
     selectedItem?: string | number;
     items?: SlideProps[];
+    title?: ReactNode;
+    description?: ReactNode;
 }
 export declare const CarouselSlide: (props: SlideProps & carouselVariants) => import("react/jsx-runtime").JSX.Element;
 export declare const Carousel: (props: CarouselProps & carouselVariants) => import("react/jsx-runtime").JSX.Element;

package/dist/Carousel/index.js

@@ -1,5 +1,6 @@
 "use client";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { section_text } from "../IconBillboard/IconBillboard.css.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import "../icons/CheckIcon/CheckIcon.css.js";
 /* empty css                                */
@@ -9,9 +10,56 @@ import SvgQuoteIconGrey from "../icons/QuoteIconGrey.js";
 import SvgQuoteIconWhite from "../icons/QuoteIconWhite.js";
 import SvgQuoteIconYellow from "../icons/QuoteIconYellow.js";
 /* empty css                                                */
+/* empty css                                          */
+/* empty css                                          */
+import "../Accordion/Accordion.js";
+import "../Accordion/Accordion.css.js";
+import "../AlertBanner/AlertBanner.css.js";
+import "../Modal/contextApi/store.js";
+import { getVariant } from "../utils/getVariant.js";
 import clsx from "clsx";
 import React, { useEffect, Children, cloneElement } from "react";
-import { icon, slide, authorLocation, author, carousel, slides, dots, dot } from "./Carousel.css.js";
+import "../Button/Button.css.js";
+import "react-use";
+/* empty css                                                */
+/* empty css                                                    */
+/* empty css                                                                    */
+import "../HeroBanner/HeroBanner.css.js";
+import "../ContentBanner/ContentBanner.css.js";
+/* empty css                                              */
+import "../ExecutiveBio/ExecutiveBio.css.js";
+import "../FaqAccordion/index.js";
+import "../FooterDisclosure/FooterDisclosure.css.js";
+/* empty css                                                         */
+import "@hookform/resolvers/zod";
+import "../Input/Checkbox.js";
+import "../Input/CurrencyInput.js";
+import "../Input/Dropdown.js";
+/* empty css                                   */
+import "../Input/Input.js";
+import "../Input/Input.css.js";
+import "../Input/InputPhone.js";
+import "react-hook-form";
+import "../Forms/Forms.css.js";
+import "../Forms/SalesforceFieldsForm.js";
+import "../SetContainer/SetContainer.css.js";
+import "../ImageBillboard/ImageBillboard.css.js";
+import "../LandingPageHeader/LandingPageHeader.css.js";
+import "../Chevron/Chevron.css.js";
+/* empty css                                */
+/* empty css                                                      */
+/* empty css                                                         */
+/* empty css                                                              */
+/* empty css                                                                 */
+/* empty css                                                    */
+/* empty css                                                  */
+import "../StepItems/StepItems.css.js";
+import "../Table/Table.css.js";
+/* empty css                                        */
+import "next/script.js";
+/* empty css                                        */
+/* empty css                                              */
+import { icon, slide, authorLocation, author, headerCarousel, descriptionCarousel, carousel, slides, dots, dot } from "./Carousel.css.js";
 import { useCarousel } from "./store.js";
 const iconVarints = /* @__PURE__ */ new Map([
   [
@@ -47,9 +95,18 @@ const CarouselSlide = (props) => {
   ] }) });
 };
 const Carousel = (props) => {
-  const { children, time = 5e3, variant, items, auto = false } = props;
+  const {
+    children,
+    time = 5e3,
+    variant: fullVariant = "primary",
+    items,
+    auto = false,
+    title = void 0,
+    description = void 0
+  } = props;
   const change = useCarousel((state) => state.change);
   const itemSelected = useCarousel((state) => state.selected);
+  const variant = getVariant(fullVariant);
   useEffect(() => {
     if (!auto) {
       return;
@@ -71,7 +128,7 @@ const Carousel = (props) => {
   };
   const child = children;
   const showDots = () => {
-    if (children && child?.props?.content?.length > 1) {
+    if (children && child?.length > 1) {
       return /* @__PURE__ */ jsx("div", { className: dots, children: Children.map(children, (_, indx) => /* @__PURE__ */ jsx(
         "div",
         {
@@ -81,36 +138,32 @@ const Carousel = (props) => {
         indx
       )) });
     }
-    if (items && items.length > 1) {
-      return /* @__PURE__ */ jsx("div", { className: dots, children: items.map((_, indx) => /* @__PURE__ */ jsx(
-        "div",
+  };
+  return /* @__PURE__ */ jsxs("div", { className: `containment`, children: [
+    /* @__PURE__ */ jsxs("div", { className: section_text, children: [
+      /* @__PURE__ */ jsx("h2", { className: clsx("header_2", headerCarousel({ variant })), children: title }),
+      /* @__PURE__ */ jsx("div", { className: clsx(descriptionCarousel({ variant })), children: description })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: clsx(carousel({ variant })), children: [
+      /* @__PURE__ */ jsx("div", { children: iconVarints.get(variant) }),
+      /* @__PURE__ */ jsx("div", { className: slides, children: children ? Children.map(
+        children,
+        (item, idx) => React.isValidElement(item) && cloneElement(item, {
+          ...item.props,
+          selected: idx === itemSelected,
+          variant
+        })
+      ) : items?.map((item, idx) => /* @__PURE__ */ jsx(
+        CarouselSlide,
         {
-          onClick: () => selectItem(indx),
-          className: dot({ variant, selected: indx === itemSelected })
+          selected: idx === itemSelected,
+          ...item,
+          variant
         },
-        indx
-      )) });
-    }
-  };
-  return /* @__PURE__ */ jsxs("div", { className: clsx(carousel({ variant })), children: [
-    /* @__PURE__ */ jsx("div", { children: iconVarints.get(variant) }),
-    /* @__PURE__ */ jsx("div", { className: slides, children: children ? Children.map(
-      children,
-      (item, idx) => React.isValidElement(item) && cloneElement(item, {
-        ...item.props,
-        selected: idx === itemSelected,
-        variant
-      })
-    ) : items?.map((item, idx) => /* @__PURE__ */ jsx(
-      CarouselSlide,
-      {
-        selected: idx === itemSelected,
-        ...item,
-        variant
-      },
-      item.id
-    )) }),
-    showDots()
+        item.id
+      )) }),
+      showDots()
+    ] })
   ] });
 };
 export {

package/dist/Chevron/Chevron.interface.d.ts

@@ -1,5 +1,5 @@
-import { PropsWithChildren, ReactNode } from 'react';
 import { CallToActionTypes } from '../utils/variant.types';
+import { PropsWithChildren, ReactNode } from 'react';
 
 export interface ChevronProps extends PropsWithChildren {
     /**

package/dist/Chevron/index.d.ts

@@ -1,4 +1,4 @@
-import { ChevronProps } from './Chevron.interface';
 import { FC } from 'react';
+import { ChevronProps } from './Chevron.interface';
 
 export declare const Chevron: FC<ChevronProps>;

package/dist/ContentBanner/ContentBanner.interface.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
 import { ChevronProps } from '../Chevron/Chevron.interface';
+import { ReactNode } from 'react';
 
 export interface HeroBannerInterface {
     id?: string;

package/dist/ContentBanner/index.d.ts

@@ -1,4 +1,4 @@
-import { HeroBannerInterface as ContentBannerInterface } from './ContentBanner.interface';
 import { FC } from 'react';
+import { HeroBannerInterface as ContentBannerInterface } from './ContentBanner.interface';
 
 export declare const ContentBanner: FC<ContentBannerInterface>;

package/dist/DownloadTile/index.d.ts

@@ -1,4 +1,4 @@
-import { DownloadTileSet } from './DownloadTile.interface';
 import { FC } from 'react';
+import { DownloadTileSet } from './DownloadTile.interface';
 
 export declare const DownloadTile: FC<DownloadTileSet>;

package/dist/ExecutiveBio/ExecutiveBio.interface.d.ts

@@ -1,6 +1,6 @@
-import { ReactNode } from 'react';
-import { ImageInterface } from '../IconBillboard';
 import { QuaternaryTypes } from '../utils/variant.types';
+import { ImageInterface } from '../IconBillboard';
+import { ReactNode } from 'react';
 
 export interface ExecutiveBioSetProps {
     id: string;

package/dist/ExecutiveBio/ExecutiveBioSet.d.ts

@@ -1,4 +1,4 @@
-import { ExecutiveBioSetProps as Props } from './ExecutiveBio.interface';
 import { SetContainerProps } from '../SetContainer';
+import { ExecutiveBioSetProps as Props } from './ExecutiveBio.interface';
 
 export declare const ExecutiveBioSet: ({ id, title, description, executiveBios, additionalDetails, variant, headline, }: Props & SetContainerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/FaqAccordion/index.d.ts

@@ -1,4 +1,3 @@
-import { header } from './FaqAccordion.css';
 import { PropsWithChildren } from 'react';
 
 export interface AccordionItemProps extends PropsWithChildren {
@@ -7,8 +6,10 @@ export interface AccordionItemProps extends PropsWithChildren {
 export declare const AccordionItem: (props: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
 export declare const AccordionItemSummary: (props: {
     id: string;
+    level: string;
 } & PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
 export declare const AccordionItemContent: (props: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
 export declare const FaqAccordion: (props: {
     header?: string;
+    accordionEmbedLevel?: string;
 } & PropsWithChildren) => import("react/jsx-runtime").JSX.Element;

package/dist/FaqAccordion/index.js

@@ -7,17 +7,30 @@ import SvgChevronUp from "../icons/ChevronUp.js";
 /* empty css                                   */
 /* empty css                                                    */
 /* empty css                                                */
+import { getLevelNumber } from "../utils/faqAccordionOptions.js";
 import { create } from "zustand";
 import { icon } from "../Accordion/Accordion.css.js";
 import { summary, summaryHeader, content, header, faqAccordion } from "./FaqAccordion.css.js";
 const useAccordion = create()((set) => ({
-  itemOpened: "",
-  toggle: (id) => set(() => ({ itemOpened: id }))
+  itemsOpened: [],
+  addItem: (id) => {
+    set((state) => ({
+      itemsOpened: [...state.itemsOpened, id]
+    }));
+  },
+  removeItem: (id) => {
+    set((state) => ({
+      itemsOpened: state.itemsOpened.filter((item) => item !== id)
+    }));
+  }
 }));
 const AccordionItem = (props) => {
-  const selectItem = useAccordion((state) => state.toggle);
-  const isOpen = useAccordion((state) => state.itemOpened);
+  const addItem = useAccordion((state) => state.addItem);
+  const removeItem = useAccordion((state) => state.removeItem);
+  const isOpen = useAccordion((state) => state.itemsOpened);
   const toggle = (event) => {
+    event.stopPropagation();
+    event.preventDefault();
     const ev = event.target;
     let evClasses = ev.getAttribute("class");
     if (!evClasses) {
@@ -26,11 +39,10 @@ const AccordionItem = (props) => {
     if (!evClasses?.includes(summary) !== (evClasses?.includes(summaryHeader) || evClasses?.includes(icon))) {
       return;
     }
-    event.preventDefault();
-    if (isOpen !== props.id) {
-      selectItem(props.id);
+    if (!isOpen.includes(props.id)) {
+      addItem(props.id);
     } else {
-      selectItem("");
+      removeItem(props.id);
     }
   };
   return /* @__PURE__ */ jsx(
@@ -40,16 +52,17 @@ const AccordionItem = (props) => {
         toggle(e);
         return;
       },
-      open: isOpen === props.id,
+      open: isOpen.includes(props.id),
       children: props.children
     }
   );
 };
 const AccordionItemSummary = (props) => {
-  const isOpen = useAccordion((state) => state.itemOpened);
+  const level = getLevelNumber(props.level);
+  const isOpen = useAccordion((state) => state.itemsOpened);
   return /* @__PURE__ */ jsxs("summary", { className: summary, children: [
-    /* @__PURE__ */ jsx("div", { className: summaryHeader, children: props.children }),
-    /* @__PURE__ */ jsx("div", { className: icon, children: isOpen === props.id ? /* @__PURE__ */ jsx(SvgChevronUp, {}) : /* @__PURE__ */ jsx(SvgChevronDown, {}) })
+    level === 1 ? /* @__PURE__ */ jsx("h3", { className: summaryHeader, children: props.children }) : level === 2 ? /* @__PURE__ */ jsx("h4", { className: summaryHeader, children: props.children }) : /* @__PURE__ */ jsx("h5", { className: summaryHeader, children: props.children }),
+    /* @__PURE__ */ jsx("div", { className: icon, children: isOpen.includes(props.id) ? /* @__PURE__ */ jsx(SvgChevronUp, {}) : /* @__PURE__ */ jsx(SvgChevronDown, {}) })
   ] });
 };
 const AccordionItemContent = (props) => {
@@ -58,7 +71,7 @@ const AccordionItemContent = (props) => {
 const FaqAccordion = (props) => {
   const { children } = props;
   return /* @__PURE__ */ jsxs("section", { children: [
-    props.header && /* @__PURE__ */ jsx("p", { className: header, children: props.header }),
+    props.header && /* @__PURE__ */ jsx("h2", { className: header, children: props.header }),
     /* @__PURE__ */ jsx("div", { className: faqAccordion, children })
   ] });
 };

package/dist/Forms/RenderForm.d.ts

@@ -1,5 +1,5 @@
-import { FormProps } from '.';
 import { PropsWithChildren } from 'react';
+import { FormProps } from '.';
 
 export interface renderFormProps extends FormProps, PropsWithChildren {
     form?: string;

package/dist/Forms/ScheduleCall.d.ts

@@ -1,6 +1,6 @@
-import { PropsWithChildren, ReactNode } from 'react';
-import { QuaternaryTypes } from '../utils/variant.types';
 import { ChevronProps } from '../Chevron/Chevron.interface';
+import { QuaternaryTypes } from '../utils/variant.types';
+import { PropsWithChildren, ReactNode } from 'react';
 
 export type Inputs = {
     first_name: string;

package/dist/Forms/ScheduleCall.js

@@ -85,7 +85,13 @@ const ScheduleCall = ({
         icon && /* @__PURE__ */ jsx("div", { className: clsx("text_center", iconForm), children: ["primary", "secondary"].includes(variant) ? /* @__PURE__ */ jsx(SvgComponent, {}) : /* @__PURE__ */ jsx(SvgAxosX, {}) }),
         /* @__PURE__ */ jsxs("div", { className: `${headerContainer} text_center`, children: [
           /* @__PURE__ */ jsx("h2", { className: clsx("header_2", headerForm({ variant })), children: headline }),
-          description && /* @__PURE__ */ jsx("div", { className: `${form} ${descriptionField} text_center`, children: description })
+          description && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: `${form} ${descriptionField({ variant })} text_center`,
+              children: description
+            }
+          )
         ] }),
         /* @__PURE__ */ jsxs("form", { className: form, onSubmit: handleSubmit(submitForm), children: [
           /* @__PURE__ */ jsxs("div", { className: clsx(formWrapper({ variant })), children: [

package/dist/HeroBanner/HeroBanner.interface.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
 import { ChevronProps } from '../Chevron/Chevron.interface';
+import { ReactNode } from 'react';
 
 export interface ImageInterface {
     src: string;

package/dist/Hyperlink/index.d.ts

@@ -1,4 +1,4 @@
-import { HyperlinkProps } from './Hyperlink.interface';
 import { FC } from 'react';
+import { HyperlinkProps } from './Hyperlink.interface';
 
 export declare const Hyperlink: FC<HyperlinkProps>;

package/dist/IconBillboard/IconBillboard.d.ts

@@ -1,7 +1,7 @@
-import { ContainerVariants, LayoutVariants } from './IconBillboard.css';
-import { ImageInterface } from '.';
-import { ReactNode } from 'react';
 import { ChevronProps } from '../Chevron/Chevron.interface';
+import { ReactNode } from 'react';
+import { ImageInterface } from '.';
+import { ContainerVariants, LayoutVariants } from './IconBillboard.css';
 
 export interface FocusProps {
     icon?: ImageInterface;

package/dist/IconBillboard/IconBillboard.interface.d.ts

@@ -1,7 +1,7 @@
-import { ReactNode } from 'react';
-import { QuaternaryTypes } from '../utils/variant.types';
-import { ChevronProps } from '../Chevron/Chevron.interface';
 import { BulletItemProps } from '../BulletItem';
+import { ChevronProps } from '../Chevron/Chevron.interface';
+import { QuaternaryTypes } from '../utils/variant.types';
+import { ReactNode } from 'react';
 
 export interface IconBillboardSet {
     id: string;

package/dist/ImageBillboard/ImageBillboard.interface.d.ts

@@ -1,8 +1,8 @@
-import { ReactNode } from 'react';
-import { QuaternaryTypes } from '../utils/variant.types';
-import { ImageInterface } from '../IconBillboard';
-import { ChevronProps } from '../Chevron/Chevron.interface';
 import { BulletItemProps } from '../BulletItem';
+import { ChevronProps } from '../Chevron/Chevron.interface';
+import { ImageInterface } from '../IconBillboard';
+import { QuaternaryTypes } from '../utils/variant.types';
+import { ReactNode } from 'react';
 
 export interface ImageBillboardSetProps {
     id: string;

package/dist/ImageLink/ImageLinkSet.d.ts

@@ -1,6 +1,6 @@
-import { ImageLinkProps } from './ImageLink';
-import { SetContainerProps } from '../SetContainer';
 import { ChevronProps } from '../Chevron/Chevron.interface';
+import { SetContainerProps } from '../SetContainer';
+import { ImageLinkProps } from './ImageLink';
 
 export interface ImageLinkSetProps extends SetContainerProps {
     imageLinks: ImageLinkProps[];

package/dist/Input/Input.d.ts

@@ -1,5 +1,5 @@
-import { InputHTMLAttributes, ReactNode } from 'react';
 import { QuaternaryTypes } from '../utils';
+import { InputHTMLAttributes, ReactNode } from 'react';
 
 export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
     label?: ReactNode;

package/dist/Input/InputProps.d.ts

@@ -1,5 +1,5 @@
-import { InputHTMLAttributes, PropsWithChildren, ReactNode, SelectHTMLAttributes } from 'react';
 import { QuaternaryTypes } from '../utils';
+import { InputHTMLAttributes, PropsWithChildren, ReactNode, SelectHTMLAttributes } from 'react';
 
 export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
     label?: ReactNode;

package/dist/Modal/Modal.d.ts

@@ -1,4 +1,4 @@
-import { ModalProps } from './Modal.interface';
 import { FC } from 'react';
+import { ModalProps } from './Modal.interface';
 
 export declare const Modal: FC<ModalProps>;

package/dist/SetContainer/SetContainer.d.ts

@@ -1,5 +1,5 @@
-import { PropsWithChildren } from 'react';
 import { ImageBillboardSetProps } from '../ImageBillboard/ImageBillboard.interface';
+import { PropsWithChildren } from 'react';
 
 export interface SetContainerProps extends Omit<ImageBillboardSetProps, "imageBillboards">, PropsWithChildren {
     internalName?: string;

package/dist/StepItems/StepItems.interface.d.ts

@@ -1,7 +1,7 @@
-import { ReactNode } from 'react';
-import { ImageInterface } from '../IconBillboard';
-import { QuaternaryTypes } from '../utils/variant.types';
 import { ChevronProps } from '../Chevron/Chevron.interface';
+import { QuaternaryTypes } from '../utils/variant.types';
+import { ImageInterface } from '../IconBillboard';
+import { ReactNode } from 'react';
 
 export interface StepItemsSetProps {
     id: string;

package/dist/Table/Table.d.ts

@@ -1,5 +1,5 @@
-import { CellProps, RowProps, TableContainerProps, TableProps } from './Table.interface';
 import { PropsWithChildren } from 'react';
+import { CellProps, RowProps, TableContainerProps, TableProps } from './Table.interface';
 
 export declare const TableContainer: ({ tableTitle, tableBody, tableFooter, tableType, tableDescription, internalName, id, }: TableContainerProps) => import("react/jsx-runtime").JSX.Element;
 export declare const Table: ({ variant, children, highlight, tableType, alternateColorRows, }: TableProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Typography/Typography.d.ts

@@ -1,5 +1,5 @@
-import { TypographySizeVariants, TypographyVariants } from '.';
 import { default as React } from 'react';
+import { TypographySizeVariants, TypographyVariants } from '.';
 
 type AsType = "body1" | "body2" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "inherit" | "overline" | "subtitle1" | "subtitle2" | string;
 export interface Props extends React.PropsWithChildren {

package/dist/VideoTile/VideoTile.d.ts

@@ -1,4 +1,4 @@
-import { VideoTileInterface } from './VideoTile.interface';
 import { FC } from 'react';
+import { VideoTileInterface } from './VideoTile.interface';
 
 export declare const VideoTile: FC<VideoTileInterface>;

package/dist/VideoWrapper/index.d.ts

@@ -1,5 +1,5 @@
-import { VideoTileInterface } from '../VideoTile';
 import { FC } from 'react';
+import { VideoTileInterface } from '../VideoTile';
 
 export interface VideoWrapperProps {
     videoTiles: VideoTileInterface[];

package/dist/assets/Carousel/Carousel.css

@@ -6,7 +6,31 @@
   justify-content: center;
   margin-top: 16px;
 }
-.jgs3fs1 {
+.jgs3fs2 {
+  background: var(--_1073cm84);
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+  text-shadow: 0px 0px #00000000;
+}
+.jgs3fs3 {
+  background: var(--_1073cm8b);
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+  text-shadow: 0px 0px #00000000;
+}
+.jgs3fs4 {
+  color: var(--_1073cm8i);
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+  text-shadow: 0px 0px #00000000;
+}
+.jgs3fs5 {
+  color: var(--_1073cm8p);
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+  text-shadow: 0px 0px #00000000;
+}
+.jgs3fs6 {
   display: flex;
   flex-direction: column;
   border-radius: 16px;
@@ -16,46 +40,61 @@
   padding-top: 40px;
   padding-bottom: 40px;
 }
-.jgs3fs2 {
+.jgs3fs7 {
   background: var(--_1073cm81);
   color: var(--_1073cm83);
 }
-.jgs3fs3 {
+.jgs3fs8 {
   background: var(--_1073cm88);
   color: var(--_1073cm8a);
 }
-.jgs3fs4 {
+.jgs3fs9 {
   background: var(--_1073cm8f);
   color: var(--_1073cm8h);
 }
-.jgs3fs5 {
+.jgs3fsa {
   background: var(--_1073cm8m);
   color: var(--_1073cm8n);
 }
-.jgs3fs6 {
+.jgs3fsb {
+  margin-top: 16px;
+}
+.jgs3fsc {
+  color: var(--_1073cm82);
+}
+.jgs3fsd {
+  color: var(--_1073cm8a);
+}
+.jgs3fse {
+  color: var(--_1073cm8j);
+}
+.jgs3fsf {
+  color: var(--_1073cm8n);
+}
+.jgs3fsg {
   display: flex;
   gap: 10px;
   text-align: center;
   justify-content: center;
 }
-.jgs3fs7 {
+.jgs3fsh {
   font-size: 18px;
   font-weight: 600;
   letter-spacing: 0.2px;
 }
-.jgs3fs9 {
+.jgs3fsj {
   color: var(--_1073cm83);
 }
-.jgs3fsa {
+.jgs3fsk {
   color: var(--_1073cm8a);
 }
-.jgs3fsb {
+.jgs3fsl {
   color: var(--_1073cm8h);
 }
-.jgs3fsc {
+.jgs3fsm {
   color: var(--_1073cm8o);
 }
-.jgs3fsd {
+.jgs3fsn {
   text-align: center;
   gap: 24px;
   font-style: italic;
@@ -69,20 +108,20 @@
   transition-property: all;
   transition-behavior: left;
 }
-.jgs3fse {
+.jgs3fso {
   display: flex;
   flex-direction: column;
   justify-content: center;
   opacity: 1;
   transition-delay: .5s;
 }
-.jgs3fsf {
+.jgs3fsp {
   display: none;
 }
-.jgs3fsg {
+.jgs3fsq {
   display: flex;
 }
-.jgs3fsh {
+.jgs3fsr {
   display: flex;
   justify-content: center;
   width: 100%;
@@ -90,7 +129,7 @@
   border: none;
   margin-bottom: 24px;
 }
-.jgs3fsi {
+.jgs3fss {
   width: 12px;
   height: 12px;
   border-width: 1px;
@@ -98,39 +137,39 @@
   border-radius: 100px;
   cursor: pointer;
 }
-.jgs3fsj {
+.jgs3fst {
   border-color: #1E3860;
 }
-.jgs3fsj:hover {
+.jgs3fst:hover {
   background: #87B9D7;
 }
-.jgs3fsk {
+.jgs3fsu {
   border-color: #1E3860;
 }
-.jgs3fsk:hover {
+.jgs3fsu:hover {
   background: #87B9D7;
 }
-.jgs3fsl {
+.jgs3fsv {
   border-color: #FFFFFF;
 }
-.jgs3fsl:hover {
+.jgs3fsv:hover {
   background: #EBEBEB;
 }
-.jgs3fsm {
+.jgs3fsw {
   border-color: #FAA74A;
 }
-.jgs3fsm:hover {
+.jgs3fsw:hover {
   background: #FFE7D2;
 }
-.jgs3fso {
+.jgs3fsy {
   background: #1E3860;
 }
-.jgs3fsp {
+.jgs3fsz {
   background: #1E3860;
 }
-.jgs3fsq {
+.jgs3fs10 {
   background: #FFFFFF;
 }
-.jgs3fsr {
+.jgs3fs11 {
   background: #FAA74A;
 }

package/dist/assets/IconBillboard/IconBillboard.css

@@ -89,10 +89,13 @@
   gap: 10px;
 }
 ._1r4ovbuh {
+  display: flex;
   justify-content: center;
   width: 100%;
   text-align: center;
   margin-top: auto;
+  gap: 24px;
+  flex-wrap: wrap;
 }
 ._1r4ovbui {
   margin-inline: auto;

package/dist/icons/ArrowIcon/index.d.ts

@@ -1,5 +1,5 @@
-import { FC } from 'react';
 import { CallToActionTypes } from '../../utils/variant.types';
+import { FC } from 'react';
 
 export interface ArrowProps {
     variant: CallToActionTypes;

package/dist/utils/faqAccordionOptions.d.ts

@@ -0,0 +1 @@
+export declare const getLevelNumber: (level: string) => 1 | 2 | 3;

package/dist/utils/faqAccordionOptions.js

@@ -0,0 +1,20 @@
+const getLevelNumber = (level) => {
+  const faqlevel = level?.toLowerCase();
+  switch (faqlevel) {
+    case "one": {
+      return 1;
+    }
+    case "two": {
+      return 2;
+    }
+    case "three": {
+      return 3;
+    }
+    default: {
+      return 1;
+    }
+  }
+};
+export {
+  getLevelNumber
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@axos-web-dev/shared-components",
   "description": "Axos shared components library for web.",
-  "version": "0.0.56",
+  "version": "0.0.57",
   "type": "module",
   "module": "dist/main.js",
   "types": "dist/main.d.ts",
@@ -28,20 +28,20 @@
     "npm:link": "npm run build && npm link"
   },
   "dependencies": {
-    "@hookform/resolvers": "^3.3.4",
-    "@react-input/mask": "^1.2.0",
-    "@react-input/number-format": "^1.0.25",
+    "@hookform/resolvers": "^3.4.0",
+    "@react-input/mask": "^1.2.4",
+    "@react-input/number-format": "^1.0.26",
     "@storybook/builder-vite": "^7.6.19",
     "@storybook/preview-api": "^7.6.19",
     "@vanilla-extract/css": "^1.15.1",
     "@vanilla-extract/recipes": "^0.5.1",
     "clsx": "^2.1.1",
-    "react-hook-form": "^7.51.3",
+    "react-hook-form": "^7.51.4",
     "react-markdown": "^9.0.1",
     "react-use": "^17.5.0",
     "typed-css-modules": "^0.9.1",
     "vite-plugin-svgr": "^4.2.0",
-    "zod": "^3.23.6",
+    "zod": "^3.23.8",
     "zustand": "^4.5.2"
   },
   "peerDependencies": {
@@ -58,7 +58,7 @@
     "@storybook/addon-essentials": "^7.6.19",
     "@storybook/addon-interactions": "^7.6.19",
     "@storybook/addon-links": "^7.6.19",
-    "@storybook/addon-onboarding": "^8.0.9",
+    "@storybook/addon-onboarding": "^8.1.0",
     "@storybook/addon-themes": "^7.6.19",
     "@storybook/blocks": "^7.6.19",
     "@storybook/react": "^7.6.19",
@@ -67,11 +67,11 @@
     "@svgr/core": "^8.1.0",
     "@svgr/plugin-prettier": "^8.1.0",
     "@svgr/plugin-svgo": "^8.1.0",
-    "@types/node": "^20.12.8",
-    "@types/react": "^18.3.1",
+    "@types/node": "^20.12.12",
+    "@types/react": "^18.3.2",
     "@types/react-dom": "^18.3.0",
-    "@typescript-eslint/eslint-plugin": "^7.8.0",
-    "@typescript-eslint/parser": "^7.8.0",
+    "@typescript-eslint/eslint-plugin": "^7.9.0",
+    "@typescript-eslint/parser": "^7.9.0",
     "@vanilla-extract/css-utils": "^0.1.3",
     "@vanilla-extract/recipes": "^0.5.2",
     "@vanilla-extract/vite-plugin": "^4.0.9",
@@ -79,9 +79,9 @@
     "esbuild-vanilla-image-loader": "^0.1.3",
     "eslint": "^8.57.0",
     "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-plugin-react-refresh": "^0.4.6",
+    "eslint-plugin-react-refresh": "^0.4.7",
     "eslint-plugin-storybook": "^0.8.0",
-    "glob": "^10.3.12",
+    "glob": "^10.3.15",
     "husky": "^9.0.11",
     "next": "^14.1.4",
     "prettier": "3.2.5",
@@ -91,11 +91,11 @@
     "rollup-plugin-svg-import": "^3.0.0",
     "rollup-plugin-svgo": "^2.0.0",
     "storybook": "^7.6.19",
-    "typescript": "^5.2.2",
+    "typescript": "^5.4.5",
     "typescript-plugin-css-modules": "^5.1.0",
-    "vite": "^5.2.10",
-    "vite-plugin-dts": "^3.9.0",
-    "vite-plugin-lib-inject-css": "^2.0.1",
+    "vite": "^5.2.11",
+    "vite-plugin-dts": "^3.9.1",
+    "vite-plugin-lib-inject-css": "^2.1.1",
     "vite-plugin-setting-css-module": "^1.1.4",
     "vite-tsconfig-paths": "^4.3.2"
   },