@axos-web-dev/shared-components 1.0.100-dev.86-videoPoster.2 → 1.0.100-dev.87

package/dist/HeroBanner/HeroVideoPoster.js

@@ -1,154 +0,0 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import { VideoInit } from "../VideoTile/VideoInit.js";
-import "../icons/ArrowIcon/ArrowIcon.css.js";
-import "../icons/CheckIcon/CheckIcon.css.js";
-import '../assets/VideoWrapper/VideoWrapper.css';import '../assets/TopicalNavSet/TopicalNavSet.css';import '../assets/TopicalNavItem/TopicalNavItem.css';import '../assets/Topic/Topic.css';import '../assets/TextBlock/TextBlock.css';import '../assets/SocialMediaBar/SocialMediaBar.css';import '../assets/SecondaryFooter/SecondaryFooter.css';import '../assets/Pagination/Pagination.css';import '../assets/PageNavSet/PageNavigationSet.css';import '../assets/NavigationMenu/LaVictoire/NavBar.css';import '../assets/NavigationMenu/AxosALTS/NavBar.css';import '../assets/NavigationMenu/AxosClearing/NavBar.css';import '../assets/NavigationMenu/AxosBank/SubNavbar.css';import '../assets/NavigationMenu/AxosBank/NavBar.css';import '../assets/NavigationMenu/AxosAdvisorServices/SubNavbar.css';import '../assets/NavigationMenu/AxosAdvisorServices/NavBar.css';import '../assets/NavigationMenu/AxosAdvisor/SubNavbar.css';import '../assets/NavigationMenu/AxosAdvisor/NavBar.css';import '../assets/Insight/Featured/Header.css';import '../assets/Insight/Featured/CategorySelector.css';import '../assets/Insight/Featured/Featured.css';import '../assets/ImageLink/ImageLink.css';import '../assets/HelpArticle/HelpArticle.css';import '../assets/FooterSiteMap/AxosBank/FooterSiteMap.css';import '../assets/FooterDisclosure/LVF/LaVictorieFooter.css';import '../assets/DownloadTile/DownloadTile.css';import '../assets/CollectInformationAlert/CollectInformationAlert.css';import '../assets/Chatbot/ChatWindow.css';import '../assets/Chatbot/Chatbot.css';import '../assets/Chatbot/Bubble.css';import '../assets/Chatbot/AnimatedGradientBorder.css';import '../assets/CallToActionBar/CallToActionBar.css';import '../assets/Insight/Insight.css';import '../assets/AwardsItem/AwardsItem.css';import '../assets/AwardsBanner/AwardsBanner.css';import '../assets/Auth/SignIn.css';import '../assets/Auth/ErrorAlert.css';import '../assets/Calculators/MarginTradingCalculator/MarginTradingCalculator.css';import '../assets/Forms/QuickPricer/UserInformation.css';import '../assets/Forms/QuickPricer/QuickPricerResults.css';import '../assets/Modal/Modal.css';import '../assets/BulletItem/BulletItem.css';import '../assets/VideoTile/VideoTile.css';import '../assets/Typography/Typography.css';import '../assets/icons/FollowIcon/FollowIcon.css';import '../assets/icons/DownloadIcon/DownloadIcon.css';import '../assets/themes/victorie.css';import '../assets/themes/ufb.css';import '../assets/themes/premier.css';import '../assets/themes/axos.css';/* empty css                                */
-/* empty css                                   */
-/* empty css                               */
-/* empty css                                    */
-/* empty css                                                    */
-/* empty css                                                */
-import "react-use";
-/* empty css                                          */
-/* empty css                                        */
-import "react";
-import "../ImageBillboard/ImageBillboard.css.js";
-import "clsx";
-import "../IconBillboard/IconBillboard.css.js";
-/* empty css                                          */
-import "../Accordion/Accordion.js";
-import "../Accordion/Accordion.css.js";
-import "../AlertBanner/AlertBanner.css.js";
-import "../Article/Article.css.js";
-import "../ArticlesSet/ArticlesSet.css.js";
-import "../Calculators/calculator.css.js";
-import "../Calculators/AnnualFeeCalculator/AnnualFeeCalculator.css.js";
-import "../Button/Button.css.js";
-import "../Modal/contextApi/store.js";
-import "../Calculators/ApyCalculator/ApyCalculator.css.js";
-import "../Table/Table.css.js";
-import "../Calculators/AxosOneCalculator/BalanceAPYCalculator.css.js";
-import "../Calculators/BalanceAPYCalculator/BalanceAPYCalculator.css.js";
-import "@hookform/resolvers/zod";
-import "../Input/Checkbox.js";
-import "../Input/CurrencyInput.js";
-import "../Input/Dropdown.js";
-import "../Input/Dropdown.css.js";
-import "../Input/Input.js";
-import "../Input/Input.css.js";
-import "../Input/InputAmount.js";
-import "../Input/InputPhone.js";
-import "../Input/InputTextArea.js";
-import "../Input/DownPaymentInput.js";
-import "../Input/RadioButton.js";
-import "../Input/PercentageInput.js";
-import "react-hook-form";
-import "../Calculators/BuyDownCalculator/BuyDownCalculator.css.js";
-import "../Forms/Forms.css.js";
-import "../Forms/HoneyPot/index.js";
-import "../Forms/SalesforceFieldsForm.js";
-import "../Input/RadioButton.css.js";
-import "../Input/Checkbox.css.js";
-import "../LoadingIndicator/LoadingIndicator.css.js";
-import "../Chevron/Chevron.css.js";
-/* empty css                                */
-import "../Interstitial/Interstitial-variants.css.js";
-import "../Inputs/Input.css.js";
-/* empty css                                                         */
-import "../Hyperlink/Hyperlink.css.js";
-/* empty css                                                      */
-import "iframe-resizer";
-/* empty css                                                                                */
-import "../Calculators/MonthlyPaymentCalculator/MonthlyPaymentCalculator.css.js";
-import "../Calculators/MonthlyPaymentLVFCalculator/MonthlyPaymentCalculator.css.js";
-import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
-/* empty css                                    */
-import "react-dom";
-/* empty css                                */
-import "../Auth/SignInPassword.js";
-/* empty css                                              */
-/* empty css                                          */
-/* empty css                                    */
-/* empty css                                                    */
-import "../Carousel/index.js";
-/* empty css                                                   */
-/* empty css                                   */
-import "../Chatbot/store/chat.js";
-import "../Chatbot/authenticate.js";
-/* empty css                                    */
-/* empty css                                       */
-import "../Chatbot/store/messages.js";
-/* empty css                                                                    */
-import "../Comparison/Comparison.css.js";
-import "next/image.js";
-import "./HeroBanner.css.js";
-import { player } from "./LargeBanner.css.js";
-import "./SelectionBanner.css.js";
-import "../SetContainer/SetContainer.css.js";
-import "../Tab/Tab.css.js";
-import "../icons/Star/Star.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                                                          */
-/* empty css                                                         */
-/* empty css                                            */
-/* empty css                                        */
-/* empty css                                              */
-/* empty css                                                      */
-/* empty css                                            */
-import "../LandingPageHeader/LandingPageHeader.css.js";
-/* empty css                                                      */
-import "next/navigation.js";
-/* empty css                                                         */
-/* empty css                                                              */
-/* empty css                                                                 */
-import "next/link.js";
-/* empty css                                                   */
-/* empty css                                                      */
-/* empty css                                                       */
-/* empty css                                                   */
-/* empty css                                                     */
-import "../PageNavItem/PageNavItem.css.js";
-import "react-slick";
-/* empty css                                                 */
-/* empty css                                          */
-/* empty css                                                    */
-/* empty css                                                  */
-import "../StepItem/StepItem.css.js";
-import "../StepItemSet/StepItemSet.css.js";
-/* empty css                                        */
-/* empty css                                */
-/* empty css                                                  */
-/* empty css                                                */
-/* empty css                                              */
-const HeroVideoPoster = ({
-  videoId,
-  videoPlayer,
-  thumbnailImage
-}) => {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(VideoInit, {}),
-    /* @__PURE__ */ jsx("div", { className: player, "data-uuid": videoId, children: /* @__PURE__ */ jsx(
-      "img",
-      {
-        style: {
-          width: "100%",
-          margin: "auto",
-          display: "block"
-        },
-        alt: "",
-        className: "vidyard-player-embed",
-        src: thumbnailImage ? thumbnailImage : `https://play.vidyard.com/${videoId}.jpg`,
-        "data-uuid": videoId,
-        "data-v": "4",
-        "data-type": videoPlayer
-      }
-    ) })
-  ] });
-};
-export {
-  HeroVideoPoster
-};

package/dist/HeroBanner/LargeHeroBanner.d.ts

@@ -1,5 +0,0 @@
-import { HeroBannerInterface } from './HeroBanner.interface';
-
-type LargeHeroBannerProps = Pick<HeroBannerInterface, "id" | "eyebrow" | "headline" | "bodyCopy" | "bullets" | "callToActionRow" | "image" | "imagePlacement" | "variant" | "video" | "bannerType" | "videoTextPosition">;
-export declare const LargeHeroBanner: ({ id, eyebrow, headline, bodyCopy, bullets, callToActionRow, image, imagePlacement, variant, video, bannerType, videoTextPosition, }: LargeHeroBannerProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/HeroBanner/LargeHeroBanner.js

@@ -1,224 +0,0 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import clsx from "clsx";
-import Image from "next/image.js";
-import { Button } from "../Button/Button.js";
-import "../Button/Button.css.js";
-import "react";
-import "react-use";
-import { Chevron } from "../Chevron/index.js";
-import "../icons/ArrowIcon/ArrowIcon.css.js";
-import "../icons/CheckIcon/CheckIcon.css.js";
-import SvgCheckIcon from "../icons/CheckIcon/index.js";
-import '../assets/icons/FollowIcon/FollowIcon.css';import '../assets/icons/DownloadIcon/DownloadIcon.css';import '../assets/themes/victorie.css';import '../assets/themes/ufb.css';import '../assets/themes/premier.css';import '../assets/themes/axos.css';/* empty css                                */
-/* empty css                                   */
-/* empty css                               */
-/* empty css                                    */
-/* empty css                                                    */
-/* empty css                                                */
-import { getVariant } from "../utils/getVariant.js";
-import { HeroVideoPoster } from "./HeroVideoPoster.js";
-import { getPosition } from "../utils/getPosition.js";
-import { hero_wrapper, hero_bullet_item, hero_sub_bullets, hero_btns, img_contents, reversed_lg_image, reversed } from "./HeroBanner.css.js";
-import { lg_hero_container, content_display_lg, lg_hero_eyebrow, lg_headline_text, lg_hero_text, placement, lg_hero_content_mobile, lg_hero_sizing, lg_hero_img, lg_hero_content, video_wrapper, lg_hero_banner, video_bg } from "./LargeBanner.css.js";
-const LargeHeroBanner = ({
-  id,
-  eyebrow,
-  headline,
-  bodyCopy,
-  bullets,
-  callToActionRow,
-  image,
-  imagePlacement = "Right",
-  variant,
-  video,
-  bannerType,
-  videoTextPosition = "default"
-}) => {
-  const textPosition = getPosition(videoTextPosition);
-  return /* @__PURE__ */ jsxs(
-    "section",
-    {
-      className: clsx(
-        lg_hero_banner({ variant: getVariant(variant) }),
-        bannerType === "Video Poster" ? video_bg : ""
-      ),
-      id,
-      children: [
-        /* @__PURE__ */ jsx("div", { className: `${hero_wrapper} containment ${lg_hero_container}`, children: /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: clsx(
-              lg_hero_content,
-              imagePlacement !== "Right" ? reversed : "",
-              "flex",
-              "between",
-              "middle"
-            ),
-            style: {
-              position: textPosition !== "default" ? "static" : "relative"
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: clsx(
-                    lg_hero_text({ variant: getVariant(variant) }),
-                    "rounded",
-                    textPosition !== "default" ? placement({ position: textPosition }) : "",
-                    lg_hero_content_mobile
-                  ),
-                  children: /* @__PURE__ */ jsxs("div", { className: `containment ${content_display_lg}`, children: [
-                    eyebrow && /* @__PURE__ */ jsx(
-                      "h1",
-                      {
-                        className: lg_hero_eyebrow({
-                          variant: getVariant(variant)
-                        }),
-                        children: eyebrow
-                      }
-                    ),
-                    eyebrow ? /* @__PURE__ */ jsx(
-                      "h2",
-                      {
-                        className: lg_headline_text({
-                          variant: getVariant(variant)
-                        }),
-                        children: headline
-                      }
-                    ) : /* @__PURE__ */ jsx(
-                      "h1",
-                      {
-                        className: lg_headline_text({
-                          variant: getVariant(variant)
-                        }),
-                        children: headline
-                      }
-                    ),
-                    /* @__PURE__ */ jsxs("div", { className: "push_up", children: [
-                      /* @__PURE__ */ jsx(Fragment, { children: bodyCopy }),
-                      bullets && bullets.length > 0 && /* @__PURE__ */ jsx("ul", { className: "list_unstyled mb_0 push_up_24", children: bullets.map(
-                        ({ id: id2, icon, copy, subBullet }) => !subBullet ? /* @__PURE__ */ jsxs(
-                          "li",
-                          {
-                            className: `list_item flex ${hero_bullet_item}`,
-                            children: [
-                              /* @__PURE__ */ jsx("div", { className: "img_item", children: getVariant(variant) ? /* @__PURE__ */ jsx(
-                                SvgCheckIcon,
-                                {
-                                  variant: getVariant(variant) === "primary" || getVariant(variant) === "secondary" ? "secondary" : "primary"
-                                }
-                              ) : /* @__PURE__ */ jsx("img", { src: icon?.src, alt: icon?.altText }) }),
-                              /* @__PURE__ */ jsx("span", { children: copy })
-                            ]
-                          },
-                          id2
-                        ) : /* @__PURE__ */ jsx(
-                          "ul",
-                          {
-                            className: clsx(hero_sub_bullets, "mb_0", "push_up"),
-                            children: /* @__PURE__ */ jsxs("li", { className: "list_item flex", children: [
-                              /* @__PURE__ */ jsx("div", { className: "img_item", children: /* @__PURE__ */ jsx(
-                                "img",
-                                {
-                                  style: { maxWidth: "max-content" },
-                                  src: icon?.src,
-                                  alt: icon?.altText
-                                }
-                              ) }),
-                              /* @__PURE__ */ jsx("span", { children: copy })
-                            ] })
-                          },
-                          id2
-                        )
-                      ) })
-                    ] }),
-                    callToActionRow && callToActionRow.length > 0 && /* @__PURE__ */ jsx("div", { className: `${hero_btns}`, children: callToActionRow.map(
-                      ({
-                        id: id2,
-                        variant: variant2,
-                        displayText,
-                        targetUrl,
-                        type,
-                        newTab
-                      }) => type === "Button" ? /* @__PURE__ */ jsx(
-                        Button,
-                        {
-                          targetUrl,
-                          color: getVariant(variant2),
-                          size: "large",
-                          rounded: "medium",
-                          newTab,
-                          children: displayText
-                        },
-                        id2
-                      ) : /* @__PURE__ */ jsx(
-                        Chevron,
-                        {
-                          targetUrl,
-                          variant: getVariant(variant2),
-                          newTab,
-                          children: displayText
-                        },
-                        id2
-                      )
-                    ) })
-                  ] })
-                }
-              ),
-              bannerType === "Large" && image && /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: clsx(
-                    lg_hero_img,
-                    imagePlacement !== "Right" ? reversed_lg_image : "",
-                    "rounded",
-                    lg_hero_content_mobile
-                  ),
-                  role: "presentation",
-                  children: /* @__PURE__ */ jsxs("picture", { className: img_contents, children: [
-                    /* @__PURE__ */ jsx(
-                      "source",
-                      {
-                        srcSet: `https:${image?.src}?fm=avif`,
-                        type: "image/avif"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      "source",
-                      {
-                        srcSet: `https:${image?.src}?fm=webp`,
-                        type: "image/webp"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      Image,
-                      {
-                        src: `https:${image?.src}?q=90`,
-                        className: lg_hero_sizing,
-                        alt: "",
-                        height: 600,
-                        width: 792,
-                        priority: true
-                      }
-                    )
-                  ] })
-                }
-              )
-            ]
-          }
-        ) }),
-        bannerType === "Video Poster" && video && /* @__PURE__ */ jsx("div", { className: video_wrapper, "aria-hidden": "true", inert: true, children: /* @__PURE__ */ jsx(
-          HeroVideoPoster,
-          {
-            videoId: video.videoId,
-            videoPlayer: video.videoPlayer,
-            thumbnailImage: video.thumbnailImage
-          }
-        ) })
-      ]
-    }
-  );
-};
-export {
-  LargeHeroBanner
-};

package/dist/utils/getPosition.d.ts

@@ -1 +0,0 @@
-export declare const getPosition: (text: string | undefined) => "default" | "top left" | "top right" | "bottom left" | "bottom right";

package/dist/utils/getPosition.js

@@ -1,17 +0,0 @@
-const getPosition = (text) => {
-  switch (text) {
-    case "top left":
-      return "top left";
-    case "top right":
-      return "top right";
-    case "bottom left":
-      return "bottom left";
-    case "bottom right":
-      return "bottom right";
-    default:
-      return "default";
-  }
-};
-export {
-  getPosition
-};