@digital-b2c/coreui-kit 0.21.11 → 0.22.1

package/dist/index.d.ts

@@ -1,4 +1,3 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import react__default, { ImgHTMLAttributes, AnchorHTMLAttributes, ReactNode, MouseEventHandler, Ref, HTMLAttributes, ButtonHTMLAttributes, InputHTMLAttributes, PropsWithChildren, JSX, FC, RefObject, CSSProperties } from 'react';
 
@@ -120,7 +119,7 @@ interface BrandsStripProps {
     size?: 'small';
 }
 
-declare const BrandsStrip: ({ className, variant, title, logos, cta, size, }: BrandsStripProps) => react_jsx_runtime.JSX.Element;
+declare const BrandsStrip: ({ className, variant, title, logos, cta, size, }: BrandsStripProps) => react.JSX.Element;
 
 declare const ButtonVariantReadOnly: readonly ["primary", "secondary", "ghost", "nofill", "grey", "nofillblack", "shiny", "tabbutton", "navnofillblack", "textmenu"];
 type TButtonVariant = (typeof ButtonVariantReadOnly)[number];
@@ -161,11 +160,11 @@ interface CardProps {
 }
 
 declare const Card: {
-    ({ className, variant, title, subtitle, cta, onCtaClick, icon, logo, children, ref, }: CardProps): react_jsx_runtime.JSX.Element;
+    ({ className, variant, title, subtitle, cta, onCtaClick, icon, logo, children, ref, }: CardProps): react.JSX.Element;
     displayName: string;
 } & {
-    Title: ({ children }: CardTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: CardSubtitleProps) => react_jsx_runtime.JSX.Element;
+    Title: ({ children }: CardTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: CardSubtitleProps) => react.JSX.Element;
 };
 
 type CountingCardTitleProps = {
@@ -180,8 +179,8 @@ interface CountingCardProps {
     children?: ReactNode;
 }
 
-declare const CountingCard: (({ className, title, count, image, children }: CountingCardProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: CountingCardTitleProps) => react_jsx_runtime.JSX.Element;
+declare const CountingCard: (({ className, title, count, image, children }: CountingCardProps) => react.JSX.Element) & {
+    Title: ({ children }: CountingCardTitleProps) => react.JSX.Element;
 };
 
 type ResourceView = 'grid' | 'list';
@@ -205,7 +204,7 @@ interface ResourceCardItemProps {
     }) => React.ReactNode;
 }
 
-declare const ResourceCardItem: ({ item, view, variant, renderLink }: ResourceCardItemProps) => react_jsx_runtime.JSX.Element;
+declare const ResourceCardItem: ({ item, view, variant, renderLink }: ResourceCardItemProps) => react.JSX.Element;
 
 type FilterOption = 'all' | 'pdf' | 'externalLink';
 type SortOption = 'latest' | 'oldest' | 'az' | 'za';
@@ -221,7 +220,7 @@ interface FilterBarProps {
     onSearchChange: (v: string) => void;
 }
 
-declare function FilterBar({ view, onViewChange, isMobile, filterValue, onFilterChange, sortValue, onSortChange, searchValue, onSearchChange, }: FilterBarProps): react_jsx_runtime.JSX.Element;
+declare function FilterBar({ view, onViewChange, isMobile, filterValue, onFilterChange, sortValue, onSortChange, searchValue, onSearchChange, }: FilterBarProps): react.JSX.Element;
 
 type InfoCardSubtitleProps = {
     children: ReactNode;
@@ -240,9 +239,9 @@ interface InfoCardProps {
     children?: ReactNode;
 }
 
-declare const InfoCard: (({ className, title, subtitle, icon, badge, children }: InfoCardProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: InfoCardTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: InfoCardSubtitleProps) => react_jsx_runtime.JSX.Element;
+declare const InfoCard: (({ className, title, subtitle, icon, badge, children }: InfoCardProps) => react.JSX.Element) & {
+    Title: ({ children }: InfoCardTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: InfoCardSubtitleProps) => react.JSX.Element;
 };
 
 interface ModalProps {
@@ -259,7 +258,7 @@ interface ModalProps {
 }
 
 declare const Modal: {
-    ({ className, contentClassName, isOpen, onClose, ariaLabel, closeLabel, hideCloseButton, children, }: ModalProps): react_jsx_runtime.JSX.Element;
+    ({ className, contentClassName, isOpen, onClose, ariaLabel, closeLabel, hideCloseButton, children, }: ModalProps): react.JSX.Element;
     displayName: string;
 };
 
@@ -281,9 +280,9 @@ interface PaginationProps {
     }) => ReactNode;
 }
 
-declare const Pagination: ({ className, totalPages, currentPage, loop, hasNumber, disableArrows, onPageChange, showEllipsis, boundaryCount, siblingCount, hidePagesBorder, renderLink, }: PaginationProps) => react_jsx_runtime.JSX.Element;
+declare const Pagination: ({ className, totalPages, currentPage, loop, hasNumber, disableArrows, onPageChange, showEllipsis, boundaryCount, siblingCount, hidePagesBorder, renderLink, }: PaginationProps) => react.JSX.Element;
 
-declare const Picture: ({ className, ...props }: PictureProps) => react_jsx_runtime.JSX.Element;
+declare const Picture: ({ className, ...props }: PictureProps) => react.JSX.Element;
 
 interface PracticeCardProps {
     className?: string;
@@ -292,7 +291,7 @@ interface PracticeCardProps {
     image?: IPicture;
 }
 
-declare const PracticeCard: ({ className, title, cta, image }: PracticeCardProps) => react_jsx_runtime.JSX.Element;
+declare const PracticeCard: ({ className, title, cta, image }: PracticeCardProps) => react.JSX.Element;
 
 interface SidebarCategory {
     label: string;
@@ -309,7 +308,7 @@ interface SidebarProps {
     onSelect: (index: number) => void;
 }
 
-declare const Sidebar: ({ categories, isMobile, onToggle, selectedIndex, onSelect, }: SidebarProps) => react_jsx_runtime.JSX.Element;
+declare const Sidebar: ({ categories, isMobile, onToggle, selectedIndex, onSelect, }: SidebarProps) => react.JSX.Element;
 
 interface UpcomingEventCardProps {
     className?: string;
@@ -325,7 +324,7 @@ interface UpcomingEventCardProps {
     showImage?: boolean;
 }
 
-declare const UpcomingEventCard: ({ className, image, date, title, location, description, cta, direction, showImage, }: UpcomingEventCardProps) => react_jsx_runtime.JSX.Element;
+declare const UpcomingEventCard: ({ className, image, date, title, location, description, cta, direction, showImage, }: UpcomingEventCardProps) => react.JSX.Element;
 
 type BadgeBaseProps = {
     children?: ReactNode;
@@ -405,7 +404,7 @@ interface NewsCardProps {
     }) => React.ReactNode;
 }
 
-declare const NewsCard: ({ type, className, image, date, description, tag, title, cta, direction, renderLink, }: NewsCardProps) => react_jsx_runtime.JSX.Element;
+declare const NewsCard: ({ type, className, image, date, description, tag, title, cta, direction, renderLink, }: NewsCardProps) => react.JSX.Element;
 
 type BlogPostContentBodyProps = {
     children: ReactNode;
@@ -417,8 +416,8 @@ interface BlogPostContentProps {
     body?: ReactNode;
 }
 
-declare const BlogPostContent: (({ className, body, children }: BlogPostContentProps) => react_jsx_runtime.JSX.Element) & {
-    Body: ({ children }: BlogPostContentBodyProps) => react_jsx_runtime.JSX.Element;
+declare const BlogPostContent: (({ className, body, children }: BlogPostContentProps) => react.JSX.Element) & {
+    Body: ({ children }: BlogPostContentBodyProps) => react.JSX.Element;
 };
 
 interface SearchProps {
@@ -435,7 +434,7 @@ interface SearchProps {
     className?: string;
 }
 
-declare const Search: ({ placeholder, searchCta, onSearch, variant, className, }: SearchProps) => react_jsx_runtime.JSX.Element;
+declare const Search: ({ placeholder, searchCta, onSearch, variant, className, }: SearchProps) => react.JSX.Element;
 
 interface AnchorProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
     isExternal?: boolean;
@@ -444,7 +443,7 @@ interface AnchorProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
     }) => ReactNode;
 }
 
-declare const Anchor: ({ children, isExternal, renderLink, ...props }: AnchorProps) => react_jsx_runtime.JSX.Element;
+declare const Anchor: ({ children, isExternal, renderLink, ...props }: AnchorProps) => react.JSX.Element;
 
 interface ContainerProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
@@ -474,7 +473,7 @@ interface TextProps extends HTMLAttributes<HTMLElement> {
 }
 
 declare const Text: {
-    ({ tag, promoteToH1, ref, children, ...props }: TextProps): react_jsx_runtime.JSX.Element;
+    ({ tag, promoteToH1, ref, children, ...props }: TextProps): react.JSX.Element;
     displayName: string;
 };
 
@@ -485,7 +484,7 @@ interface ColTextMenuProps extends IColTextMenuItem {
 }
 
 declare const ColTextMenu: {
-    ({ label, url, isExternal, className, renderLink, }: ColTextMenuProps): react_jsx_runtime.JSX.Element;
+    ({ label, url, isExternal, className, renderLink, }: ColTextMenuProps): react.JSX.Element;
     displayName: string;
 };
 
@@ -526,14 +525,14 @@ interface UserMenuProps {
  *   Escape or outside interaction).
  * - Without `menuItems`, renders a plain link (when `url` is set) or button.
  */
-declare const UserMenu: ({ user, className, dropUp, fullWidth }: UserMenuProps) => react_jsx_runtime.JSX.Element;
+declare const UserMenu: ({ user, className, dropUp, fullWidth }: UserMenuProps) => react.JSX.Element;
 
 interface LoaderProps {
     className?: string;
 }
 
 declare const Loader: {
-    ({ className }: LoaderProps): react_jsx_runtime.JSX.Element;
+    ({ className }: LoaderProps): react.JSX.Element;
     displayName: string;
 };
 
@@ -552,7 +551,7 @@ interface BrandCardProps {
     };
 }
 
-declare const BrandCard: ({ theme, title, subtitle, image, animationSettings, className, }: BrandCardProps) => react_jsx_runtime.JSX.Element;
+declare const BrandCard: ({ theme, title, subtitle, image, animationSettings, className, }: BrandCardProps) => react.JSX.Element;
 
 type CardCarouselFootnoteProps = {
     children: ReactNode;
@@ -584,10 +583,10 @@ interface CardCarouselProps {
     children?: ReactNode;
 }
 
-declare const CardCarousel: (({ className, title, subtitle, footnote, cards, theme, ariaLabel, children, }: CardCarouselProps) => react_jsx_runtime.JSX.Element | null) & {
-    Title: ({ children }: CardCarouselTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: CardCarouselSubtitleProps) => react_jsx_runtime.JSX.Element;
-    Footnote: ({ children }: CardCarouselFootnoteProps) => react_jsx_runtime.JSX.Element;
+declare const CardCarousel: (({ className, title, subtitle, footnote, cards, theme, ariaLabel, children, }: CardCarouselProps) => react.JSX.Element | null) & {
+    Title: ({ children }: CardCarouselTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: CardCarouselSubtitleProps) => react.JSX.Element;
+    Footnote: ({ children }: CardCarouselFootnoteProps) => react.JSX.Element;
 };
 
 type CardCollectionSubtitleProps = {
@@ -609,9 +608,9 @@ interface CardCollectionProps {
     theme?: 'dark' | 'light';
 }
 
-declare const CardCollection: (({ className, variant, theme, title, subtitle, cards, ctaLabel, children, }: CardCollectionProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: CardCollectionTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: CardCollectionSubtitleProps) => react_jsx_runtime.JSX.Element;
+declare const CardCollection: (({ className, variant, theme, title, subtitle, cards, ctaLabel, children, }: CardCollectionProps) => react.JSX.Element) & {
+    Title: ({ children }: CardCollectionTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: CardCollectionSubtitleProps) => react.JSX.Element;
 };
 
 type ContactModuleSubtitleProps = {
@@ -633,9 +632,9 @@ interface ContactModuleProps {
     animateBlur?: boolean;
 }
 
-declare const ContactModule: (({ className, children, title, subtitle, ctas, image, blurred, animateBlur, }: ContactModuleProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: ContactModuleTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: ContactModuleSubtitleProps) => react_jsx_runtime.JSX.Element;
+declare const ContactModule: (({ className, children, title, subtitle, ctas, image, blurred, animateBlur, }: ContactModuleProps) => react.JSX.Element) & {
+    Title: ({ children }: ContactModuleTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: ContactModuleSubtitleProps) => react.JSX.Element;
 };
 
 interface IFooterLink {
@@ -661,7 +660,7 @@ interface FooterProps {
     supportContacts?: IFooterSupportGroup[];
 }
 
-declare const Footer: ({ className, supporters, navigationLinks, disclaimer, copyright, children, supportContacts, }: FooterProps) => react_jsx_runtime.JSX.Element;
+declare const Footer: ({ className, supporters, navigationLinks, disclaimer, copyright, children, supportContacts, }: FooterProps) => react.JSX.Element;
 
 type HeroBannerSubtitleProps = {
     children: ReactNode;
@@ -688,9 +687,9 @@ interface HeroBannerProps {
     type?: 'internal' | 'external';
 }
 
-declare const HeroBanner: (({ className, variant, title, subtitle, backgroundImage, logo, cta, ctaLogo, brands, promoteToH1, type, children, }: HeroBannerProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: HeroBannerTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: HeroBannerSubtitleProps) => react_jsx_runtime.JSX.Element;
+declare const HeroBanner: (({ className, variant, title, subtitle, backgroundImage, logo, cta, ctaLogo, brands, promoteToH1, type, children, }: HeroBannerProps) => react.JSX.Element) & {
+    Title: ({ children }: HeroBannerTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: HeroBannerSubtitleProps) => react.JSX.Element;
 };
 
 interface HeroBannerCarouselItem {
@@ -705,7 +704,7 @@ interface HeroBannerCarouselProps {
     items?: HeroBannerCarouselItem[];
 }
 
-declare const HeroBannerCarousel: ({ className, items }: HeroBannerCarouselProps) => react_jsx_runtime.JSX.Element | null;
+declare const HeroBannerCarousel: ({ className, items }: HeroBannerCarouselProps) => react.JSX.Element | null;
 
 interface InternalBrandsTabProps {
     title?: string;
@@ -728,7 +727,7 @@ interface InternalBrandsTabProps {
     }[];
 }
 
-declare const InternalBrandsTab: (props: InternalBrandsTabProps) => react_jsx_runtime.JSX.Element;
+declare const InternalBrandsTab: (props: InternalBrandsTabProps) => react.JSX.Element;
 
 type MiniBannerGoBackProps = {
     children: ReactNode;
@@ -766,10 +765,10 @@ interface MiniBannerProps {
     children?: ReactNode;
 }
 
-declare const MiniBanner: (({ className, variant, pretitle, title, subtitle, logo, background, cta, promoteToH1, children, }: MiniBannerProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: MiniBannerTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: MiniBannerSubtitleProps) => react_jsx_runtime.JSX.Element;
-    GoBack: ({ children }: MiniBannerGoBackProps) => react_jsx_runtime.JSX.Element;
+declare const MiniBanner: (({ className, variant, pretitle, title, subtitle, logo, background, cta, promoteToH1, children, }: MiniBannerProps) => react.JSX.Element) & {
+    Title: ({ children }: MiniBannerTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: MiniBannerSubtitleProps) => react.JSX.Element;
+    GoBack: ({ children }: MiniBannerGoBackProps) => react.JSX.Element;
 };
 
 type MiniSectionCtaSubtitleProps = {
@@ -782,8 +781,8 @@ type MiniSectionCtaTitleProps = {
 
 interface MiniSectionCtaProps {
     className?: string;
-    variant?: 'headerCTA' | 'BgColorBlack' | 'BgColorGrey' | 'infoCallout' | 'miniTextCenterCta';
-    theme?: 'dark' | 'light' | 'gray';
+    variant?: 'headerCTA' | 'BgColorBlack' | 'BgColorGrey' | 'infoCallout' | 'miniTextCenterCta' | 'bgGradientGrey';
+    theme?: 'dark' | 'light' | 'gray' | 'gradientGrey';
     cta?: ICta;
     title?: ReactNode;
     subtitle?: ReactNode;
@@ -791,12 +790,13 @@ interface MiniSectionCtaProps {
     moduleStyles?: {
         color?: string;
         backgroundColor?: string;
+        mobileBackgroundColor?: string;
     };
 }
 
-declare const MiniSectionCta: (({ className, variant, theme, title, subtitle, cta, moduleStyles, children, }: MiniSectionCtaProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: MiniSectionCtaTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: MiniSectionCtaSubtitleProps) => react_jsx_runtime.JSX.Element;
+declare const MiniSectionCta: (({ className, variant, theme, title, subtitle, cta, moduleStyles, children, }: MiniSectionCtaProps) => react.JSX.Element) & {
+    Title: ({ children }: MiniSectionCtaTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: MiniSectionCtaSubtitleProps) => react.JSX.Element;
 };
 
 type NavigationUserMenuFallbackProps = {
@@ -848,8 +848,8 @@ interface NavigationProps extends PropsWithChildren {
     brandBars?: NavigationBrandBar[];
 }
 
-declare const Navigation: ((props: NavigationProps) => react_jsx_runtime.JSX.Element) & {
-    UserMenuFallback: ({ children }: NavigationUserMenuFallbackProps) => react_jsx_runtime.JSX.Element;
+declare const Navigation: ((props: NavigationProps) => react.JSX.Element) & {
+    UserMenuFallback: ({ children }: NavigationUserMenuFallbackProps) => react.JSX.Element;
 };
 
 type PracticePathCardsFooterProps = {
@@ -874,10 +874,10 @@ interface PracticePathCardsProps {
     cta?: ICta;
 }
 
-declare const PracticePathCards: (({ className, children, cards, title, subtitle, footer, cta, }: PracticePathCardsProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: PracticePathCardsTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: PracticePathCardsSubtitleProps) => react_jsx_runtime.JSX.Element;
-    Footer: ({ children }: PracticePathCardsFooterProps) => react_jsx_runtime.JSX.Element;
+declare const PracticePathCards: (({ className, children, cards, title, subtitle, footer, cta, }: PracticePathCardsProps) => react.JSX.Element) & {
+    Title: ({ children }: PracticePathCardsTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: PracticePathCardsSubtitleProps) => react.JSX.Element;
+    Footer: ({ children }: PracticePathCardsFooterProps) => react.JSX.Element;
 };
 
 type Teaser5050With3TextTitleProps = {
@@ -893,8 +893,8 @@ interface Teaser5050With3TextProps {
     children?: ReactNode;
 }
 
-declare const Teaser5050With3Text: (({ className, variant, title, cards, image, children, }: Teaser5050With3TextProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: Teaser5050With3TextTitleProps) => react_jsx_runtime.JSX.Element;
+declare const Teaser5050With3Text: (({ className, variant, title, cards, image, children, }: Teaser5050With3TextProps) => react.JSX.Element) & {
+    Title: ({ children }: Teaser5050With3TextTitleProps) => react.JSX.Element;
 };
 
 type Teaser5050WithCtaSubtitleProps = {
@@ -919,9 +919,9 @@ interface Teaser5050WithCtaProps {
     };
 }
 
-declare const Teaser5050WithCta: (({ className, variant, title, subtitle, ctas, image, children, moduleStyles, }: Teaser5050WithCtaProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: Teaser5050WithCtaTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: Teaser5050WithCtaSubtitleProps) => react_jsx_runtime.JSX.Element;
+declare const Teaser5050WithCta: (({ className, variant, title, subtitle, ctas, image, children, moduleStyles, }: Teaser5050WithCtaProps) => react.JSX.Element) & {
+    Title: ({ children }: Teaser5050WithCtaTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: Teaser5050WithCtaSubtitleProps) => react.JSX.Element;
 };
 
 type EventListEmptyProps = {
@@ -943,9 +943,9 @@ interface EventListProps extends PropsWithChildren {
     variant?: 'internalEventList';
 }
 
-declare const EventList: (({ className, title, items, cta, backgroundColor, variant, children, }: EventListProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: EventListTitleProps) => react_jsx_runtime.JSX.Element;
-    Empty: ({ children }: EventListEmptyProps) => react_jsx_runtime.JSX.Element;
+declare const EventList: (({ className, title, items, cta, backgroundColor, variant, children, }: EventListProps) => react.JSX.Element) & {
+    Title: ({ children }: EventListTitleProps) => react.JSX.Element;
+    Empty: ({ children }: EventListEmptyProps) => react.JSX.Element;
 };
 
 type TextEventRichTextProps = {
@@ -965,9 +965,9 @@ interface TextEventProps {
     children?: ReactNode;
 }
 
-declare const TextEvent: ((props: TextEventProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: TextEventTitleProps) => react_jsx_runtime.JSX.Element;
-    RichText: ({ children }: TextEventRichTextProps) => react_jsx_runtime.JSX.Element;
+declare const TextEvent: ((props: TextEventProps) => react.JSX.Element) & {
+    Title: ({ children }: TextEventTitleProps) => react.JSX.Element;
+    RichText: ({ children }: TextEventRichTextProps) => react.JSX.Element;
 };
 
 type TextBodyBodyProps = {
@@ -987,9 +987,9 @@ interface TextBodyProps {
     children?: ReactNode;
 }
 
-declare const TextBody: ((props: TextBodyProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: TextBodyTitleProps) => react_jsx_runtime.JSX.Element;
-    Body: ({ children }: TextBodyBodyProps) => react_jsx_runtime.JSX.Element;
+declare const TextBody: ((props: TextBodyProps) => react.JSX.Element) & {
+    Title: ({ children }: TextBodyTitleProps) => react.JSX.Element;
+    Body: ({ children }: TextBodyBodyProps) => react.JSX.Element;
 };
 
 type TextCenterCtaInBottomSubtitleProps = {
@@ -1008,9 +1008,9 @@ interface TextCenterCtaInBottomProps {
     children?: ReactNode;
 }
 
-declare const TextCenterCtaInBottom: (({ className, title, subtitle, ctas, children, }: TextCenterCtaInBottomProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: TextCenterCtaInBottomTitleProps) => react_jsx_runtime.JSX.Element;
-    Subtitle: ({ children }: TextCenterCtaInBottomSubtitleProps) => react_jsx_runtime.JSX.Element;
+declare const TextCenterCtaInBottom: (({ className, title, subtitle, ctas, children, }: TextCenterCtaInBottomProps) => react.JSX.Element) & {
+    Title: ({ children }: TextCenterCtaInBottomTitleProps) => react.JSX.Element;
+    Subtitle: ({ children }: TextCenterCtaInBottomSubtitleProps) => react.JSX.Element;
 };
 
 interface ResourcesGridListProps {
@@ -1023,7 +1023,7 @@ interface ResourcesGridListProps {
     children?: ReactNode;
 }
 
-declare const ResourcesGridList: ({ className, items, categories, defaultView, defaultFilter, defaultSort, }: ResourcesGridListProps) => react_jsx_runtime.JSX.Element;
+declare const ResourcesGridList: ({ className, items, categories, defaultView, defaultFilter, defaultSort, }: ResourcesGridListProps) => react.JSX.Element;
 
 type BlogCardGridTitleProps = {
     children: ReactNode;
@@ -1043,8 +1043,8 @@ interface BlogCardGridProps extends PropsWithChildren {
     }) => React.ReactNode;
 }
 
-declare const BlogCardGrid: (({ title, items, backgroundColor, cta, className, hasContainer, gridProps, gridItemProps, renderLink, children, }: BlogCardGridProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: BlogCardGridTitleProps) => react_jsx_runtime.JSX.Element;
+declare const BlogCardGrid: (({ title, items, backgroundColor, cta, className, hasContainer, gridProps, gridItemProps, renderLink, children, }: BlogCardGridProps) => react.JSX.Element) & {
+    Title: ({ children }: BlogCardGridTitleProps) => react.JSX.Element;
 };
 
 type FeaturedNewsHighlightsTitleProps = {
@@ -1064,8 +1064,8 @@ interface FeaturedNewsHighlightsProps extends PropsWithChildren {
     }) => React.ReactNode;
 }
 
-declare const FeaturedNewsHighlights: (({ variant, title, items, backgroundColor, cta, className, hasContainer, renderLink, children, }: FeaturedNewsHighlightsProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: FeaturedNewsHighlightsTitleProps) => react_jsx_runtime.JSX.Element;
+declare const FeaturedNewsHighlights: (({ variant, title, items, backgroundColor, cta, className, hasContainer, renderLink, children, }: FeaturedNewsHighlightsProps) => react.JSX.Element) & {
+    Title: ({ children }: FeaturedNewsHighlightsTitleProps) => react.JSX.Element;
 };
 
 type NewsCardListPaginationProps = {
@@ -1086,8 +1086,8 @@ interface NewsCardListProps extends PropsWithChildren {
     }) => React.ReactNode;
 }
 
-declare const NewsCardList: (({ items, backgroundColor, className, currentPage, searchValue, onSearchChange, onSearchSubmit, searchInputProps, renderLink, children, }: NewsCardListProps) => react_jsx_runtime.JSX.Element) & {
-    Pagination: ({ children }: NewsCardListPaginationProps) => react_jsx_runtime.JSX.Element;
+declare const NewsCardList: (({ items, backgroundColor, className, currentPage, searchValue, onSearchChange, onSearchSubmit, searchInputProps, renderLink, children, }: NewsCardListProps) => react.JSX.Element) & {
+    Pagination: ({ children }: NewsCardListPaginationProps) => react.JSX.Element;
 };
 
 type BlogPostBodyProps = {
@@ -1103,9 +1103,9 @@ interface BlogPostProps extends PropsWithChildren, Omit<NewsCardProps, 'descript
     relatedArticles?: NewsCardProps[];
 }
 
-declare const BlogPost: (({ title, description: body, image, date, tag, relatedArticles, className, children, }: BlogPostProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: BlogPostTitleProps) => react_jsx_runtime.JSX.Element;
-    Body: ({ children }: BlogPostBodyProps) => react_jsx_runtime.JSX.Element;
+declare const BlogPost: (({ title, description: body, image, date, tag, relatedArticles, className, children, }: BlogPostProps) => react.JSX.Element) & {
+    Title: ({ children }: BlogPostTitleProps) => react.JSX.Element;
+    Body: ({ children }: BlogPostBodyProps) => react.JSX.Element;
 };
 
 type BlogSearchResultsListPaginationProps = {
@@ -1129,9 +1129,9 @@ interface BlogSearchResultsListProps extends PropsWithChildren {
     }) => React.ReactNode;
 }
 
-declare const BlogSearchResultsList: (({ items, searchResult, onSearchChange, onSearchSubmit, searchValue, searchInputProps, className, renderLink, children, }: BlogSearchResultsListProps) => react_jsx_runtime.JSX.Element) & {
-    Search: ({ children }: BlogSearchResultsListSearchProps) => react_jsx_runtime.JSX.Element;
-    Pagination: ({ children, }: BlogSearchResultsListPaginationProps) => react_jsx_runtime.JSX.Element;
+declare const BlogSearchResultsList: (({ items, searchResult, onSearchChange, onSearchSubmit, searchValue, searchInputProps, className, renderLink, children, }: BlogSearchResultsListProps) => react.JSX.Element) & {
+    Search: ({ children }: BlogSearchResultsListSearchProps) => react.JSX.Element;
+    Pagination: ({ children, }: BlogSearchResultsListPaginationProps) => react.JSX.Element;
 };
 
 type GlobalSearchResultsListPaginationProps = {
@@ -1151,9 +1151,9 @@ interface GlobalSearchResultsListProps extends PropsWithChildren {
     }) => React.ReactNode;
 }
 
-declare const GlobalSearchResultsList: (({ items, searchResult, className, renderLink, children, }: GlobalSearchResultsListProps) => react_jsx_runtime.JSX.Element) & {
-    Search: ({ children }: GlobalSearchResultsListSearchProps) => react_jsx_runtime.JSX.Element;
-    Pagination: ({ children, }: GlobalSearchResultsListPaginationProps) => react_jsx_runtime.JSX.Element;
+declare const GlobalSearchResultsList: (({ items, searchResult, className, renderLink, children, }: GlobalSearchResultsListProps) => react.JSX.Element) & {
+    Search: ({ children }: GlobalSearchResultsListSearchProps) => react.JSX.Element;
+    Pagination: ({ children, }: GlobalSearchResultsListPaginationProps) => react.JSX.Element;
 };
 
 type TextCenterWithMediaTitleProps = {
@@ -1172,16 +1172,16 @@ interface TextCenterWithMediaProps {
     children?: ReactNode;
 }
 
-declare const TextCenterWithMedia: (({ className, title, thumbnail, videoUrl, loop, mute, hideControl, autoPlay, children, }: TextCenterWithMediaProps) => react_jsx_runtime.JSX.Element) & {
-    Title: ({ children }: TextCenterWithMediaTitleProps) => react_jsx_runtime.JSX.Element;
+declare const TextCenterWithMedia: (({ className, title, thumbnail, videoUrl, loop, mute, hideControl, autoPlay, children, }: TextCenterWithMediaProps) => react.JSX.Element) & {
+    Title: ({ children }: TextCenterWithMediaTitleProps) => react.JSX.Element;
 };
 
 interface QuoteSectionBlockItem {
     bodyText: ReactNode;
-    displayPhoto: string;
+    displayPhoto: IPicture;
     displayName: string;
-    displaySubName?: string;
-    jobTitleLogo?: string;
+    jobTitle?: string;
+    jobTitleLogo?: IPicture;
 }
 interface QuoteSectionBlockProps {
     className?: string;
@@ -1190,7 +1190,7 @@ interface QuoteSectionBlockProps {
     items?: QuoteSectionBlockItem[];
 }
 
-declare const QuoteSectionBlock: ({ className, title, viewtype, items, }: QuoteSectionBlockProps) => react_jsx_runtime.JSX.Element | null;
+declare const QuoteSectionBlock: ({ className, title, viewtype, items, }: QuoteSectionBlockProps) => react.JSX.Element | null;
 
 type PageLoaderLogoProps = {
     children: ReactNode;
@@ -1200,8 +1200,8 @@ interface PageLoaderProps extends PropsWithChildren {
     className?: string;
 }
 
-declare const PageLoader: (({ className, children }: PageLoaderProps) => react_jsx_runtime.JSX.Element) & {
-    Logo: ({ children }: PageLoaderLogoProps) => react_jsx_runtime.JSX.Element;
+declare const PageLoader: (({ className, children }: PageLoaderProps) => react.JSX.Element) & {
+    Logo: ({ children }: PageLoaderLogoProps) => react.JSX.Element;
 };
 
 interface ITwoColTextMenuSection {
@@ -1217,7 +1217,7 @@ interface TwoColTextMenuProps {
 }
 
 declare const TwoColTextMenu: {
-    ({ className, ariaLabel, sections, renderLink, }: TwoColTextMenuProps): react_jsx_runtime.JSX.Element | null;
+    ({ className, ariaLabel, sections, renderLink, }: TwoColTextMenuProps): react.JSX.Element | null;
     displayName: string;
 };
 
@@ -1233,8 +1233,8 @@ interface LocationsBrandCardsProps extends PropsWithChildren {
     cards: BrandCardProps[];
 }
 
-declare const LocationsBrandCards: (({ className, title, subtitle, image, cards, children, }: LocationsBrandCardsProps) => react_jsx_runtime.JSX.Element) & {
-    Text: ({ children }: LocationsBrandCardsTextProps) => react_jsx_runtime.JSX.Element;
+declare const LocationsBrandCards: (({ className, title, subtitle, image, cards, children, }: LocationsBrandCardsProps) => react.JSX.Element) & {
+    Text: ({ children }: LocationsBrandCardsTextProps) => react.JSX.Element;
 };
 
 interface BrandTab {
@@ -1265,7 +1265,7 @@ interface BrandsTabProps {
     tabs?: BrandTab[];
 }
 
-declare const BrandsTab: (props: BrandsTabProps) => react_jsx_runtime.JSX.Element;
+declare const BrandsTab: (props: BrandsTabProps) => react.JSX.Element;
 
 interface TimelineCard {
     logo?: IPicture;
@@ -1277,7 +1277,7 @@ interface TimelineCardsProps {
     cards?: TimelineCard[];
 }
 
-declare const TimelineCards: ({ captionText, cards, className }: TimelineCardsProps) => react_jsx_runtime.JSX.Element;
+declare const TimelineCards: ({ captionText, cards, className }: TimelineCardsProps) => react.JSX.Element;
 
 /** Tracks the current browser path, updating on back/forward navigation. */
 declare const useActivePath: () => string;

package/dist/index.mjs

@@ -3465,8 +3465,10 @@ var MiniSectionCta_module_default = {
   infoCallout: "MiniSectionCta_module_infoCallout",
   subtitle: "MiniSectionCta_module_subtitle",
   miniTextCenterCta: "MiniSectionCta_module_miniTextCenterCta",
+  bgGradientGrey: "MiniSectionCta_module_bgGradientGrey",
   light: "MiniSectionCta_module_light",
   gray: "MiniSectionCta_module_gray",
+  gradientGrey: "MiniSectionCta_module_gradientGrey",
   dark: "MiniSectionCta_module_dark",
   cta: "MiniSectionCta_module_cta",
   BgColorGrey: "MiniSectionCta_module_BgColorGrey"
@@ -3495,6 +3497,7 @@ var MiniSectionCta = ({
       className: clsx52(MiniSectionCta_module_default.miniSectionCta, MiniSectionCta_module_default[variant], theme && MiniSectionCta_module_default[theme], className),
       style: __spreadValues({}, hasModuleStyles && {
         "--custom-background-color": moduleStyles.backgroundColor,
+        "--custom-mobile-background-color": moduleStyles.mobileBackgroundColor,
         "--custom-color": moduleStyles.color
       }),
       children: /* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsxs("div", { className: MiniSectionCta_module_default.wrapper, children: [
@@ -3514,7 +3517,7 @@ var MiniSectionCta = ({
             className: MiniSectionCta_module_default.cta,
             href: cta.url,
             isExternal: cta.isExternal,
-            variant: variant === "BgColorBlack" ? "shiny" : "primary",
+            variant: variant === "BgColorBlack" ? "shiny" : variant === "bgGradientGrey" ? "secondary" : "primary",
             icon: variant === "miniTextCenterCta" ? "tiltedRightWhite" : void 0,
             children: cta.label
           }
@@ -5705,6 +5708,8 @@ var TextCenterWithMedia2 = Object.assign(TextCenterWithMedia, {
 
 // src/widgets/QuoteSectionBlock/QuoteSectionBlock.module.scss
 var QuoteSectionBlock_module_default = {
+  bodyText: "QuoteSectionBlock_module_bodyText",
+  displayName: "QuoteSectionBlock_module_displayName",
   quoteSectionBlock: "QuoteSectionBlock_module_quoteSectionBlock",
   inner: "QuoteSectionBlock_module_inner",
   title: "QuoteSectionBlock_module_title",
@@ -5712,11 +5717,9 @@ var QuoteSectionBlock_module_default = {
   swiperContainerFullWidth: "QuoteSectionBlock_module_swiperContainerFullWidth",
   card: "QuoteSectionBlock_module_card",
   quoteLogo: "QuoteSectionBlock_module_quoteLogo",
-  bodyText: "QuoteSectionBlock_module_bodyText",
   attribution: "QuoteSectionBlock_module_attribution",
+  attributionRight: "QuoteSectionBlock_module_attributionRight",
   displayPhoto: "QuoteSectionBlock_module_displayPhoto",
-  displayName: "QuoteSectionBlock_module_displayName",
-  displaySubName: "QuoteSectionBlock_module_displaySubName",
   attributionText: "QuoteSectionBlock_module_attributionText",
   jobTitleLogo: "QuoteSectionBlock_module_jobTitleLogo",
   controls: "QuoteSectionBlock_module_controls"
@@ -5743,20 +5746,15 @@ var QuoteSectionBlock = ({
         onSlideChange: (swiper) => setActiveIndex(swiper.activeIndex),
         children: items.map((item, index) => /* @__PURE__ */ jsx(SwiperSlide, { children: /* @__PURE__ */ jsxs("div", { className: QuoteSectionBlock_module_default.card, children: [
           /* @__PURE__ */ jsx(Icon, { type: "quote", className: QuoteSectionBlock_module_default.quoteLogo }),
-          (item == null ? void 0 : item.bodyText) && /* @__PURE__ */ jsx("p", { className: QuoteSectionBlock_module_default.bodyText, children: item.bodyText }),
+          (item == null ? void 0 : item.bodyText) && /* @__PURE__ */ jsx("div", { className: QuoteSectionBlock_module_default.bodyText, children: item.bodyText }),
           /* @__PURE__ */ jsxs("div", { className: QuoteSectionBlock_module_default.attribution, children: [
-            (item == null ? void 0 : item.displayPhoto) && /* @__PURE__ */ jsx(
-              "img",
-              {
-                src: item.displayPhoto,
-                alt: item.displayName,
-                className: QuoteSectionBlock_module_default.displayPhoto
-              }
-            ),
-            /* @__PURE__ */ jsxs("div", { className: QuoteSectionBlock_module_default.attributionText, children: [
-              (item == null ? void 0 : item.displayName) && /* @__PURE__ */ jsx("span", { className: QuoteSectionBlock_module_default.displayName, children: item.displayName }),
-              (item == null ? void 0 : item.displaySubName) && /* @__PURE__ */ jsx("span", { className: QuoteSectionBlock_module_default.displaySubName, children: item.displaySubName }),
-              (item == null ? void 0 : item.jobTitleLogo) && /* @__PURE__ */ jsx("img", { src: item.jobTitleLogo, alt: "", className: QuoteSectionBlock_module_default.jobTitleLogo })
+            (item == null ? void 0 : item.displayPhoto) && /* @__PURE__ */ jsx(Picture, __spreadProps(__spreadValues({}, item.displayPhoto), { className: QuoteSectionBlock_module_default.displayPhoto })),
+            /* @__PURE__ */ jsxs("div", { className: QuoteSectionBlock_module_default.attributionRight, children: [
+              /* @__PURE__ */ jsxs("div", { className: QuoteSectionBlock_module_default.attributionText, children: [
+                (item == null ? void 0 : item.displayName) && /* @__PURE__ */ jsx("span", { className: QuoteSectionBlock_module_default.displayName, children: item.displayName }),
+                (item == null ? void 0 : item.jobTitle) && /* @__PURE__ */ jsx("span", { className: QuoteSectionBlock_module_default.jobTitle, children: item.jobTitle })
+              ] }),
+              (item == null ? void 0 : item.jobTitleLogo) && /* @__PURE__ */ jsx(Picture, __spreadProps(__spreadValues({}, item.jobTitleLogo), { className: QuoteSectionBlock_module_default.jobTitleLogo }))
             ] })
           ] })
         ] }) }, index))