@axos-web-dev/shared-components 1.0.100-dev.75 → 1.0.100-dev.77

package/README.md

@@ -1,111 +1,111 @@
-# Installation
-
-Using npm:
-
-```shell
-$ npm install @axos-web-dev/shared-components
-```
-
-To import components
-In Node.js:
-
-```js
-// Import Components
-import {
-  AlertBanner,
-  CallToActionBar,
-  DownloadTile,
-  ImageBillboard,
-  SecondaryFooter,
-} from "@axos-web-dev/shared-components";
-
-// Import Types/Interfaces
-
-import { AlertBannerInterface } from "@axos-web-dev/shared-components/dist/AlertBanner/AlertBanner.interface";
-```
-
-In css files:
-
-```css
-/*** Import styles ***/
-
-@import "@axos-web-dev/shared-components/dist/assets/AlertBanner/AlertBanner.css";
-```
-
-# Shared components
-
-This project is develop using `React + TypeScript + Vite + Storybook + Vanilla-extract` to building custom components for internal use.
-
-## How to add new component
-
-For add a new component use the `src/lib` folder and create a folder for the component. After that you should register an export in `src/lib/main.ts` file.
-
-Also you need create a storie for the new component. Go to `src/stories` and create a new file or folder.
-
-```shell
-git clone bofaz@vs-ssh.visualstudio.com:v3/bofaz/Axos%20Marketing%20Cloud/Shared%20Components shared-components
-
-cd shared-components
-
-npm install
-
-# for using storybook
-npm run storybook
-
-# for build
-npm run build
-
-# for testing in other projects
-npm run build
-
-npm link
-
-```
-
-For publishing we need to udpate the version we are using [semantic versioning](https://semver.org/)
-
-```
-Given a version number MAJOR.MINOR.PATCH, increment the:
-
-    MAJOR version when you make incompatible API changes
-    MINOR version when you add functionality in a backward compatible manner
-    PATCH version when you make backward compatible bug fixes
-
-Additional labels for pre-release and build metadata are available as extensions to the MAJOR.MINOR.PATCH format.
-```
-
-we can update the version with the following commands:
-
-```shell
-# bumps the patch number like 0.0.0 -> 0.0.1
-npm version patch
-
-# bumps the patch number like 0.0.0 -> 0.1.0
-npm version minor
-
-# bumps the patch number like 0.0.0 -> 1.0.0
-npm version major
-
-
-
-```
-
-## How to publish new library version to npm
-
-First update the version as previously described
-
-```shell
-npm version [...]
-```
-
-Then you will need to login into npm to do that write:
-
-```shell
-npm login --scope=@my-org
-```
-
-Last you to publish the new version:
-
-```shell
-npm publish
-```
+# Installation
+
+Using npm:
+
+```shell
+$ npm install @axos-web-dev/shared-components
+```
+
+To import components
+In Node.js:
+
+```js
+// Import Components
+import {
+  AlertBanner,
+  CallToActionBar,
+  DownloadTile,
+  ImageBillboard,
+  SecondaryFooter,
+} from "@axos-web-dev/shared-components";
+
+// Import Types/Interfaces
+
+import { AlertBannerInterface } from "@axos-web-dev/shared-components/dist/AlertBanner/AlertBanner.interface";
+```
+
+In css files:
+
+```css
+/*** Import styles ***/
+
+@import "@axos-web-dev/shared-components/dist/assets/AlertBanner/AlertBanner.css";
+```
+
+# Shared components
+
+This project is develop using `React + TypeScript + Vite + Storybook + Vanilla-extract` to building custom components for internal use.
+
+## How to add new component
+
+For add a new component use the `src/lib` folder and create a folder for the component. After that you should register an export in `src/lib/main.ts` file.
+
+Also you need create a storie for the new component. Go to `src/stories` and create a new file or folder.
+
+```shell
+git clone bofaz@vs-ssh.visualstudio.com:v3/bofaz/Axos%20Marketing%20Cloud/Shared%20Components shared-components
+
+cd shared-components
+
+npm install
+
+# for using storybook
+npm run storybook
+
+# for build
+npm run build
+
+# for testing in other projects
+npm run build
+
+npm link
+
+```
+
+For publishing we need to udpate the version we are using [semantic versioning](https://semver.org/)
+
+```
+Given a version number MAJOR.MINOR.PATCH, increment the:
+
+    MAJOR version when you make incompatible API changes
+    MINOR version when you add functionality in a backward compatible manner
+    PATCH version when you make backward compatible bug fixes
+
+Additional labels for pre-release and build metadata are available as extensions to the MAJOR.MINOR.PATCH format.
+```
+
+we can update the version with the following commands:
+
+```shell
+# bumps the patch number like 0.0.0 -> 0.0.1
+npm version patch
+
+# bumps the patch number like 0.0.0 -> 0.1.0
+npm version minor
+
+# bumps the patch number like 0.0.0 -> 1.0.0
+npm version major
+
+
+
+```
+
+## How to publish new library version to npm
+
+First update the version as previously described
+
+```shell
+npm version [...]
+```
+
+Then you will need to login into npm to do that write:
+
+```shell
+npm login --scope=@my-org
+```
+
+Last you to publish the new version:
+
+```shell
+npm publish
+```

package/dist/Accordion/Accordion.js

@@ -1,7 +1,7 @@
 "use client";
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
-import React, { createContext, useContext, useState } from "react";
+import React, { createContext, useState, useContext } from "react";
 import "../icons/ArrowIcon/ArrowIcon.css.js";
 import "../icons/CheckIcon/CheckIcon.css.js";
 import SvgChevronDown from "../icons/ChevronDown.js";
@@ -12,7 +12,7 @@ import '../assets/icons/FollowIcon/FollowIcon.css';import '../assets/icons/Downl
 /* empty css                                    */
 /* empty css                                                    */
 /* empty css                                                */
-import { headerContent, icon, headerAccordion, bodyAccordion, hide, paragraph, accordion } from "./Accordion.css.js";
+import { bodyAccordion, hide, paragraph, accordion, headerContent, icon, headerAccordion } from "./Accordion.css.js";
 const AccordionCtx = createContext({
   isOpen: false,
   onclick: () => {

package/dist/AlertBanner/index.js

@@ -10,7 +10,7 @@ import '../assets/icons/FollowIcon/FollowIcon.css';import '../assets/icons/Downl
 /* empty css                                                */
 import SvgLockIcon from "../icons/LockIcon/index.js";
 import { SvgWarningIcon } from "../icons/WarningIcon/index.js";
-import { alertBanner, alertBanner_img_section, alertBanner_body, alertBanner_cta } from "./AlertBanner.css.js";
+import { alertBanner_img_section, alertBanner_body, alertBanner_cta, alertBanner } from "./AlertBanner.css.js";
 const AlertBanner = ({
   alertType,
   message,

package/dist/Article/Article.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { getVariant } from "../utils/getVariant.js";
 import { OptimizeImage } from "../utils/optimizeImage/OptimizeImage.js";
-import { ant_article, ant_img, ant_content, ant_eyebrow, ant_card_title, ant_card_body, ant_card_cta } from "./Article.css.js";
+import { ant_img, ant_content, ant_eyebrow, ant_card_title, ant_card_body, ant_card_cta, ant_article } from "./Article.css.js";
 import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
 import "react";

package/dist/Avatar/Avatar.module.js

@@ -1,10 +1,10 @@
-import '../assets/Avatar/Avatar.css.css';const avatar_sec = "_avatar_sec_1clr6_1";
-const container = "_container_1clr6_5";
-const image = "_image_1clr6_14";
-const text = "_text_1clr6_23";
-const name = "_name_1clr6_29";
-const title = "_title_1clr6_37";
-const description = "_description_1clr6_44";
+import '../assets/Avatar/Avatar.css.css';const avatar_sec = "_avatar_sec_q4a8z_1";
+const container = "_container_q4a8z_9";
+const image = "_image_q4a8z_27";
+const text = "_text_q4a8z_45";
+const name = "_name_q4a8z_57";
+const title = "_title_q4a8z_73";
+const description = "_description_q4a8z_87";
 const css = {
   avatar_sec,
   container,

package/dist/Blockquote/Blockquote.module.js

@@ -1,6 +1,6 @@
-import '../assets/Blockquote/Blockquote.css.css';const quote_spacer = "_quote_spacer_ovx4r_1";
-const author = "_author_ovx4r_7";
-const quote = "_quote_ovx4r_1";
+import '../assets/Blockquote/Blockquote.css.css';const quote_spacer = "_quote_spacer_lqs2u_1";
+const author = "_author_lqs2u_13";
+const quote = "_quote_lqs2u_1";
 const css = {
   quote_spacer,
   author,

package/dist/Calculators/AnnualFeeCalculator/index.js

@@ -8,7 +8,7 @@ import { getVariant } from "../../utils/getVariant.js";
 import { useRef, useState, useEffect } from "react";
 import clsx from "clsx";
 import { calculator } from "../calculator.css.js";
-import { container, calc_container, calc_block, pb0_1023, slider_block_wrapper, w100, stat_row, balance_wrapper, fb50, stat, slider_wrapper, slider, pt0_1023, text_block } from "./AnnualFeeCalculator.css.js";
+import { calc_container, calc_block, pb0_1023, slider_block_wrapper, w100, stat_row, balance_wrapper, fb50, stat, slider_wrapper, slider, pt0_1023, text_block, container } from "./AnnualFeeCalculator.css.js";
 const AnnualFeeCalculator = ({
   marketingTiles,
   variant: fullVariant = "primary"

package/dist/Calculators/ApyCalculator/index.js

@@ -7,7 +7,7 @@ import "react-use";
 import { Chevron } from "../../Chevron/index.js";
 import { section_container, content, headerIconBillboard, buttons } from "../../IconBillboard/IconBillboard.css.js";
 import { getVariant } from "../../utils/getVariant.js";
-import { container, apy_calculator, calculator_section, section_header, header_theme, mt_8, apy_calculator_form, pis_0, errorTag, fieldset, field_row, relative, label_symbol, cash, prefix_pad, percent, submit_section, span_12, form_disclosure, marketing, marketingTile, bodyContent } from "./ApyCalculator.css.js";
+import { apy_calculator, calculator_section, section_header, header_theme, mt_8, apy_calculator_form, pis_0, errorTag, fieldset, field_row, relative, label_symbol, cash, prefix_pad, percent, submit_section, span_12, form_disclosure, marketing, marketingTile, bodyContent, container } from "./ApyCalculator.css.js";
 const ApyCalculator = ({
   header,
   body,

package/dist/Calculators/BuyDownCalculator/index.js

@@ -23,7 +23,7 @@ import { z } from "zod";
 import { getVariant } from "../../utils/getVariant.js";
 import clsx from "clsx";
 import { useForm, FormProvider } from "react-hook-form";
-import { calc_container, calculator_section, section_header, theme_header, mt_8, buydown_calculator_form, row_form, calculate_row, form_wrapper, form_disclosure } from "./BuyDownCalculator.css.js";
+import { calculator_section, section_header, theme_header, mt_8, buydown_calculator_form, row_form, calculate_row, form_wrapper, form_disclosure, calc_container } from "./BuyDownCalculator.css.js";
 const BuyDownCalculator = ({
   header,
   body,

package/dist/Calculators/MarginTradingCalculator/index.js

@@ -4,7 +4,7 @@ import { Button } from "../../Button/Button.js";
 import { button } from "../../Button/Button.css.js";
 import { useEffect } from "react";
 import "react-use";
-import { container, field_row, errorTag, marketingTile, bodyContent, header_theme } from "../ApyCalculator/ApyCalculator.css.js";
+import { field_row, errorTag, marketingTile, bodyContent, header_theme, container } from "../ApyCalculator/ApyCalculator.css.js";
 import { Chevron } from "../../Chevron/index.js";
 import { content, headerIconBillboard, buttons } from "../../IconBillboard/IconBillboard.css.js";
 import { findMoreAxosDomains } from "../../utils/allowedAxosDomains.js";

package/dist/Calculators/MarineLoanMonthlyPaymentCalculator/index.js

@@ -8,7 +8,7 @@ import { useState } from "react";
 import clsx from "clsx";
 import { calc_text, description_text, calc_disclosure } from "../BalanceAPYCalculator/BalanceAPYCalculator.css.js";
 import { calculator } from "../calculator.css.js";
-import { calc_container, container, h2i, inputs_container, input_container, input_box, error_message, hide_select_arrow, calculation_header, payment_results } from "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import { calc_container, h2i, inputs_container, input_container, input_box, error_message, hide_select_arrow, calculation_header, payment_results, container } from "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 const MarineLoanMonthlyPaymentCalculator = ({ variant, header, disclosure, bodyCopy = true }) => {
   const fullVariant = getVariant(variant);
   const [loanAmountDisplay, setLoanAmountDisplay] = useState("$75,000");

package/dist/Calculators/MaxLoanCalculator/index.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { button } from "../../Button/Button.css.js";
-import { calc_container, container, h2i, inputs_container, input_container, input_box, error_message, calculation_header, payment_results } from "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
+import { calc_container, h2i, inputs_container, input_container, input_box, error_message, calculation_header, payment_results, container } from "../MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
 import { title } from "../../IconBillboard/IconBillboard.css.js";
 import "../../utils/allowedAxosDomains.js";
 import { getVariant } from "../../utils/getVariant.js";

package/dist/Calculators/MonthlyPaymentCalculator/index.js

@@ -8,7 +8,7 @@ import { useState } from "react";
 import clsx from "clsx";
 import { calc_text, description_text, calc_disclosure } from "../BalanceAPYCalculator/BalanceAPYCalculator.css.js";
 import { calculator } from "../calculator.css.js";
-import { calc_container, container, h2i, inputs_container, input_container, input_box, error_message, calculation_header, payment_results } from "./MonthlyPaymentCalculator.css.js";
+import { calc_container, h2i, inputs_container, input_container, input_box, error_message, calculation_header, payment_results, container } from "./MonthlyPaymentCalculator.css.js";
 const MonthlyPaymentCalculator = ({
   variant,
   header,

package/dist/Calculators/MonthlyPaymentLVFCalculator/index.js

@@ -5,7 +5,7 @@ import "../../utils/allowedAxosDomains.js";
 import { getVariant } from "../../utils/getVariant.js";
 import { useState } from "react";
 import { calc_disclosure } from "../BalanceAPYCalculator/BalanceAPYCalculator.css.js";
-import { bg_vars, calc_content_area, calc_h2, calc_bodycopy, lvf_calc_wrapper, lvf_calc_header, calc_wrapper_inner, calc_input_wrap, rounded_cell, calc_input_styles, error_dialog, results_wrap, result_header, result_value, waves, parallax } from "./MonthlyPaymentCalculator.css.js";
+import { calc_content_area, calc_h2, calc_bodycopy, lvf_calc_wrapper, lvf_calc_header, calc_wrapper_inner, calc_input_wrap, rounded_cell, calc_input_styles, error_dialog, results_wrap, result_header, result_value, waves, parallax, bg_vars } from "./MonthlyPaymentCalculator.css.js";
 const MonthlyPaymentLVFCalculator = ({ variant, header, bodyCopy, disclosure }) => {
   const theme = getVariant(variant);
   const [loanAmountMasked, setLoanAmountMasked] = useState("50,000");

package/dist/Carousel/index.js

@@ -133,7 +133,7 @@ import "../StepItemSet/StepItemSet.css.js";
 /* empty css                                                  */
 /* empty css                                                */
 /* empty css                                              */
-import { icon, slide, authorLocation, author, quoteSetContainer, headerCarousel, descriptionCarousel, slides, carousel, dots, dot } from "./Carousel.css.js";
+import { icon, quoteSetContainer, headerCarousel, descriptionCarousel, slides, carousel, slide, authorLocation, author, dots, dot } from "./Carousel.css.js";
 import { useCarousel } from "./store.js";
 const iconVarints = /* @__PURE__ */ new Map([
   [

package/dist/Chatbot/ChatWindow.js

@@ -41,7 +41,9 @@ const ChatWindow = ({
     showThankyouMessage,
     displayThankyouMessage,
     toggleThankyouMessage,
-    hasEscalated
+    hasEscalated,
+    isBlockedInput,
+    isOpen
   } = useOpenChat();
   const [mounted, setMounted] = React.useState(false);
   const [menuOpen, setMenuOpen] = React.useState(false);
@@ -50,9 +52,6 @@ const ChatWindow = ({
   const [input, setInput] = React.useState("");
   const messagesEndRef = useRef(null);
   const inputRef = useRef(null);
-  const isOpen = useOpenChat((state2) => state2.isOpen);
-  const isBlockedInput = useOpenChat((state2) => state2.isBlockedInput);
-  const blockInput = useOpenChat((state2) => state2.blockInput);
   useEffect(() => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages]);
@@ -60,10 +59,7 @@ const ChatWindow = ({
     e.preventDefault();
     const cleaned = cleanInput(input);
     if (isBlockedInput) return;
-    if (cleaned) {
-      if (!hasEscalated) {
-        blockInput?.();
-      }
+    if (cleaned != "") {
       onSend(cleaned);
       setInput("");
     }
@@ -457,7 +453,7 @@ const ChatWindow = ({
         style: {
           display: "flex",
           padding: "12px 16px",
-          background: "#ffffff",
+          background: isBlockedInput || inputDisabled || status !== "connected" || messages.length == 0 || escalationDeflected ? "light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3))" : "#ffffff",
           borderRadius: 12
         },
         children: [

package/dist/Chatbot/Chatbot.js

@@ -22,7 +22,7 @@ const Chatbot = ({
     hasEscalated,
     endEscalation,
     unblockInput,
-    isBlockedInput
+    blockInput
   } = useOpenChat();
   const { addMessage, addMessages, clearMessages, messages } = useMessages();
   const clientRef = useRef(null);
@@ -99,31 +99,31 @@ const Chatbot = ({
   };
   const onChatMessageHandler = async (message) => {
     console.log("Received message:", message);
-    if (["system", "virtual_agent", "user"].includes(message.$userType) && message.event === void 0) {
-      console.log(message.$userType, "not end user");
+    const { event, $userType } = message;
+    if (["system", "virtual_agent", "user"].includes($userType) && event === void 0) {
       addMessage(message);
-      if (!hasEscalated && isBlockedInput) {
+      if (!hasEscalated) {
         unblockInput?.();
       }
       return;
     }
-    const eventName = message?.event;
-    switch (eventName) {
+    switch (event) {
       case "escalationAccepted":
+      case "escalationStarted":
         setScalationStarted(true);
         startEscalation?.();
         addMessage(message);
         return;
-      case "escalationStarted":
-        setScalationStarted(true);
-        startEscalation?.();
+      case "escalationEnded":
+      case "escalationFailed": {
+        endEscalation?.();
         addMessage(message);
         return;
+      }
       default:
         addMessage(message);
         if (["end_user"].includes(message.$userType)) {
           if (!hasEscalated) {
-            console.log(message.$userType, "end user");
             addMessage(typingMessage);
           }
         }
@@ -294,7 +294,15 @@ const Chatbot = ({
   };
   const onSendMessage = async (msg) => {
     console.log("Sending message:", msg);
-    await clientRef.current?.sendTextMessage(msg);
+    try {
+      await clientRef.current?.sendTextMessage(msg);
+    } catch (error) {
+      console.log(error);
+    } finally {
+      if (!hasEscalated) {
+        blockInput?.();
+      }
+    }
   };
   const onEndChat = async () => {
     console.log("Ending chat");

package/dist/Chatbot/ChatbotMessage.js

@@ -9,7 +9,7 @@ import '../assets/themes/victorie.css';import '../assets/themes/ufb.css';import
 /* empty css                               */
 /* empty css                                    */
 import clsx from "clsx";
-import { shimmerText, notificationStyle, endChatButtonStyle, messageStyle, user_msg, agent_msg, inline_button_wrapper, inline_button } from "./ChatWindow.css.js";
+import { shimmerText, notificationStyle, messageStyle, user_msg, agent_msg, inline_button_wrapper, inline_button, endChatButtonStyle } from "./ChatWindow.css.js";
 import { useOpenChat } from "./store/chat.js";
 function timeAgo(date) {
   const seconds = Math.floor(((/* @__PURE__ */ new Date()).getTime() - date.getTime()) / 1e3);
@@ -24,7 +24,6 @@ const ChatbotMessage = ({
   showAvatar,
   showName,
   virtualAgent,
-  onCancelEndChat,
   onEndChat,
   onSend
 }) => {
@@ -76,23 +75,20 @@ const ChatbotMessage = ({
       " ",
       msg.to_agent ? /* @__PURE__ */ jsx("strong", { children: msg?.to_agent?.name }) : "an agent"
     ] }, msg.$index),
-    msg.type == "noti" && msg.$userType == "virtual_agent" && msg.event == "escalationDeflected" && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: notificationStyle,
-          style: { fontSize: 12 },
-          children: [
-            "Our chat team is available weekdays, 8am-5pm, except federal bank holidays. For immediate assistance you can reach out to us at",
-            " ",
-            /* @__PURE__ */ jsx("a", { href: "tel:1-888-502-2967", children: "1-888-502-2967" }),
-            "."
-          ]
-        },
-        msg.$index
-      ),
-      /* @__PURE__ */ jsx("div", { style: { textAlign: "center", marginBottom: 12 }, children: /* @__PURE__ */ jsx("button", { className: endChatButtonStyle, onClick: onCancelEndChat, children: "End Chat" }) })
-    ] }),
+    msg.type == "noti" && msg.$userType == "virtual_agent" && msg.event == "escalationDeflected" && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: notificationStyle,
+        style: { fontSize: 12 },
+        children: [
+          "Our chat team is available weekdays, 8am-5pm, except federal bank holidays. For immediate assistance you can reach out to us at",
+          " ",
+          /* @__PURE__ */ jsx("a", { href: "tel:1-888-502-2967", children: "1-888-502-2967" }),
+          "."
+        ]
+      },
+      msg.$index
+    ) }),
     ["text", "markdown_template", "markdown"].includes(msg.type) && /* @__PURE__ */ jsx(
       "div",
       {
@@ -181,7 +177,28 @@ const ChatbotMessage = ({
         index
       );
     }) }),
-    msg.event == "chatEnded" && /* @__PURE__ */ jsxs(Fragment, { children: [
+    " ",
+    msg.event == "chatEnded" && msg.status == "failed" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          title: (/* @__PURE__ */ new Date()).toLocaleString(),
+          style: {
+            fontSize: 12,
+            color: "#888",
+            marginBottom: 4,
+            textAlign: "center"
+          },
+          children: [
+            "No team members are online at the moment.",
+            /* @__PURE__ */ jsx("br", {}),
+            " Please try again later."
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { style: { textAlign: "center", marginBottom: 12 }, children: /* @__PURE__ */ jsx("button", { className: endChatButtonStyle, onClick: onEndChat, children: "End Chat" }) })
+    ] }),
+    msg.event == "chatEnded" && msg.status != "failed" && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsxs(
         "div",
         {

package/dist/ContentBanner/index.js

@@ -7,7 +7,7 @@ import { getVariant } from "../utils/getVariant.js";
 import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
 import "react-use";
-import { content_banner, section_pad, section_min_pad, push_down_24, cb_eyebrow, body_copy, call_to_action_row, link } from "./ContentBanner.css.js";
+import { section_pad, section_min_pad, push_down_24, cb_eyebrow, body_copy, call_to_action_row, link, content_banner } from "./ContentBanner.css.js";
 const ContentBanner = ({
   variant,
   icon,

package/dist/ExecutiveBio/ExecutiveBio.js

@@ -4,7 +4,7 @@ import { useRef, useState, useEffect, createElement } from "react";
 import { getVariant } from "../utils/getVariant.js";
 import { OptimizeImage } from "../utils/optimizeImage/OptimizeImage.js";
 import { Overlay } from "./Overlay.js";
-import { executive_bio, padding, item_bio, shift, media, headshot, img_area, description, person, headline_setting, job_title, copy, contacts, contact_col, svg_icon, contact_entry, url_row, ceoSection, ceoContainer, ceoWrapper, ceoMedia, ceoImgWrapper, imgAlignment, highlights, bulletsHeadline, bulletsWrapper, ceoContent, ceoHeader, ceoPersonalInfo, ceo_name, ceo_title, ceo_contacts, social, hover, svg_color, tooltip, ceo_quote, ceo_body, order_3, overlay } from "./ExecutiveBio.css.js";
+import { executive_bio, padding, shift, media, headshot, img_area, description, person, headline_setting, job_title, copy, contacts, contact_col, svg_icon, contact_entry, url_row, item_bio, ceoContainer, ceoWrapper, ceoMedia, ceoImgWrapper, imgAlignment, highlights, bulletsHeadline, bulletsWrapper, ceoContent, ceoHeader, ceoPersonalInfo, ceo_name, ceo_title, ceo_contacts, social, hover, svg_color, tooltip, ceo_quote, ceo_body, order_3, overlay, ceoSection } from "./ExecutiveBio.css.js";
 import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../icons/ArrowIcon/ArrowIcon.css.js";

package/dist/ExecutiveBio/ExecutiveBioSet.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { getVariant } from "../utils/getVariant.js";
 import { ExecutiveBio } from "./ExecutiveBio.js";
-import { section_theme, bio_section_text, header_theme, components, details } from "./ExecutiveBio.css.js";
+import { bio_section_text, header_theme, components, details, section_theme } from "./ExecutiveBio.css.js";
 const ExecutiveBioSet = ({
   id,
   title,

package/dist/FaqAccordion/index.js

@@ -135,7 +135,7 @@ import "../StepItemSet/StepItemSet.css.js";
 /* empty css                                              */
 import { getLevelNumber } from "../utils/faqAccordionOptions.js";
 import { create } from "zustand";
-import { summary, summaryHeader, content, header, faqAccordion, faqAccordion_section } from "./FaqAccordion.css.js";
+import { content, summary, summaryHeader, header, faqAccordion, faqAccordion_section } from "./FaqAccordion.css.js";
 const useAccordion = create()((set) => ({
   itemsOpened: [],
   addItem: (id) => {

package/dist/FdicCallout/FdicCallout.module.js

@@ -1,5 +1,5 @@
-import '../assets/FdicCallout/FdicCallout.css.css';const fdic_callout = "_fdic_callout_1f6md_1";
-const inner_container = "_inner_container_1f6md_6";
+import '../assets/FdicCallout/FdicCallout.css.css';const fdic_callout = "_fdic_callout_eqzgp_1";
+const inner_container = "_inner_container_eqzgp_11";
 const css = {
   fdic_callout,
   inner_container

package/dist/FooterDisclosure/FooterDisclosure.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import clsx from "clsx";
-import { footerParagraph, iconsContent, footerDisclosure } from "./FooterDisclosure.css.js";
+import { footerDisclosure, iconsContent, footerParagraph } from "./FooterDisclosure.css.js";
 const FooterContent = (props) => {
   return /* @__PURE__ */ jsx(
     "div",