@digital-b2c/coreui-kit 0.5.3 → 0.5.5

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import clsx19 from 'clsx';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import React52, { forwardRef, Children, isValidElement, useRef, useState, useCallback, useMemo, useEffect } from 'react';
+import React52, { forwardRef, useRef, useState, useCallback, Children, isValidElement, useMemo, useEffect } from 'react';
 import gsap$1, { gsap } from 'gsap';
 import { useGSAP } from '@gsap/react';
 import { ScrollTrigger } from 'gsap/ScrollTrigger';
@@ -665,40 +665,54 @@ function resolveCompoundSlots(children, slots) {
   return resolved;
 }
 
+// src/components/primitives/Container/Container.module.scss
+var Container_module_default = {
+  container: "Container_module_container"
+};
+var Container = forwardRef(
+  (_a, ref) => {
+    var _b = _a, { children, className } = _b, props = __objRest(_b, ["children", "className"]);
+    return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({ ref, className: clsx19(Container_module_default.container, className) }, props), { children }));
+  }
+);
+Container.displayName = "Container";
+
 // src/components/Card/Card.module.scss
 var Card_module_default = {
   card: "Card_module_card",
   logo: "Card_module_logo",
   subtitle: "Card_module_subtitle"
 };
-var Card = forwardRef(
-  ({ className, title, subtitle, cta, icon, logo, children }, ref) => {
-    var _a, _b;
-    const slots = resolveCompoundSlots(children, {
-      title: CardTitle,
-      subtitle: CardSubtitle
-    });
-    const titleNode = (_a = slots.title) != null ? _a : title;
-    const subtitleNode = (_b = slots.subtitle) != null ? _b : subtitle;
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx19(Card_module_default.card, className), children: [
-      (logo == null ? void 0 : logo.src) ? /* @__PURE__ */ jsx(Picture, __spreadValues({ className: Card_module_default.logo }, logo)) : icon && /* @__PURE__ */ jsx(Icon, { type: icon, className: Card_module_default.logo }),
-      /* @__PURE__ */ jsxs("div", { className: Card_module_default.content, children: [
-        titleNode && /* @__PURE__ */ jsx("h3", { className: "h4", children: titleNode }),
-        subtitleNode && /* @__PURE__ */ jsx("div", { className: Card_module_default.subtitle, children: subtitleNode })
-      ] }),
-      cta && /* @__PURE__ */ jsx(
-        Button,
-        {
-          href: cta.url,
-          isExternal: cta.isExternal,
-          variant: "secondary",
-          icon: cta.url ? "rightBlack" : void 0,
-          children: cta.label
-        }
-      )
-    ] });
-  }
-);
+var Card = ({ className, title, subtitle, cta, icon, logo, children, ref }) => {
+  var _a, _b;
+  const { url: href, label, isExternal } = cta != null ? cta : {};
+  const slots = resolveCompoundSlots(children, {
+    title: CardTitle,
+    subtitle: CardSubtitle
+  });
+  const titleNode = (_a = slots.title) != null ? _a : title;
+  const subtitleNode = (_b = slots.subtitle) != null ? _b : subtitle;
+  console.log(href && !label, href, !label);
+  return /* @__PURE__ */ jsxs(
+    ConditionalWrapper,
+    __spreadProps(__spreadValues({
+      ref,
+      className: clsx19(Card_module_default.card, className),
+      wrapper: Anchor,
+      fallback: "div",
+      condition: href && !label
+    }, href ? { href, isExternal } : {}), {
+      children: [
+        (logo == null ? void 0 : logo.src) ? /* @__PURE__ */ jsx(Picture, __spreadValues({ className: Card_module_default.logo }, logo)) : icon && /* @__PURE__ */ jsx(Icon, { type: icon, className: Card_module_default.logo }),
+        /* @__PURE__ */ jsxs("div", { className: Card_module_default.content, children: [
+          titleNode && /* @__PURE__ */ jsx("h3", { className: "h4", children: titleNode }),
+          subtitleNode && /* @__PURE__ */ jsx("div", { className: Card_module_default.subtitle, children: subtitleNode })
+        ] }),
+        (cta == null ? void 0 : cta.label) && /* @__PURE__ */ jsx(Button, { href: cta.url, isExternal: cta.isExternal, variant: "secondary", icon: cta.icon, children: cta.label })
+      ]
+    })
+  );
+};
 Card.displayName = "Card";
 
 // src/components/Card/index.ts
@@ -861,18 +875,6 @@ var Pagination = ({
   ] });
 };
 
-// src/components/primitives/Container/Container.module.scss
-var Container_module_default = {
-  container: "Container_module_container"
-};
-var Container = forwardRef(
-  (_a, ref) => {
-    var _b = _a, { children, className } = _b, props = __objRest(_b, ["children", "className"]);
-    return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({ ref, className: clsx19(Container_module_default.container, className) }, props), { children }));
-  }
-);
-Container.displayName = "Container";
-
 // src/components/PracticeCard/PracticeCard.module.scss
 var PracticeCard_module_default = {
   "practice-card": "PracticeCard_module_practice-card",
@@ -921,6 +923,7 @@ var CardCollection_module_default = {
   wrapper: "CardCollection_module_wrapper",
   cardWrapper: "CardCollection_module_cardWrapper",
   threeCols: "CardCollection_module_threeCols",
+  fourCols: "CardCollection_module_fourCols",
   examCard: "CardCollection_module_examCard",
   "reveal-wrapper": "CardCollection_module_reveal-wrapper",
   "reveal-inner": "CardCollection_module_reveal-inner",
@@ -1625,13 +1628,19 @@ var Teaser5050WithCta2 = Object.assign(Teaser5050WithCta, {
 
 // src/components/UpcomingEventCard/UpcomingEventCard.module.scss
 var UpcomingEventCard_module_default = {
-  hidden: "UpcomingEventCard_module_hidden",
-  image: "UpcomingEventCard_module_image",
-  "text-content": "UpcomingEventCard_module_text-content",
-  cta: "UpcomingEventCard_module_cta",
+  "event-card": "UpcomingEventCard_module_event-card",
+  "event-card-content": "UpcomingEventCard_module_event-card-content",
+  "event-card-image": "UpcomingEventCard_module_event-card-image",
+  "event-card-text-content": "UpcomingEventCard_module_event-card-text-content",
   date: "UpcomingEventCard_module_date",
   location: "UpcomingEventCard_module_location",
-  description: "UpcomingEventCard_module_description"
+  description: "UpcomingEventCard_module_description",
+  "event-card-footer": "UpcomingEventCard_module_event-card-footer",
+  horizontal: "UpcomingEventCard_module_horizontal",
+  "event-card-cta": "UpcomingEventCard_module_event-card-cta",
+  hidden: "UpcomingEventCard_module_hidden",
+  "cta-without-image": "UpcomingEventCard_module_cta-without-image",
+  vertical: "UpcomingEventCard_module_vertical"
 };
 var UpcomingEventCard = ({
   className,
@@ -1640,38 +1649,74 @@ var UpcomingEventCard = ({
   title,
   location,
   description,
-  cta
+  cta,
+  direction = "horizontal",
+  showImage = true
 }) => {
   const { is } = useViewPort_default();
   const hasCtaWithoutImage = cta && cta.url && !image;
-  const isBelowTablet = is("tablet", "below");
+  const hasCTAandImage = Boolean(cta && cta.url && image);
+  const hasImage = Boolean(image);
   const isBelowMobile = is("mobile-l", "below");
-  return /* @__PURE__ */ jsxs("article", { className: clsx19(className), children: [
-    image && /* @__PURE__ */ jsx(Picture, __spreadProps(__spreadValues({}, image), { className: clsx19(UpcomingEventCard_module_default.image, className) })),
-    hasCtaWithoutImage && /* @__PURE__ */ jsx(Button, { variant: "secondary", className: clsx19(isBelowTablet && UpcomingEventCard_module_default.hidden), href: cta.url, children: cta.label }),
-    /* @__PURE__ */ jsxs("div", { className: clsx19(UpcomingEventCard_module_default["text-content"], className), children: [
-      /* @__PURE__ */ jsx("span", { className: UpcomingEventCard_module_default.date, children: date }),
-      title && /* @__PURE__ */ jsx("h3", { children: title }),
-      location && /* @__PURE__ */ jsx("span", { className: UpcomingEventCard_module_default.location, children: location }),
-      description && /* @__PURE__ */ jsx("div", { className: UpcomingEventCard_module_default.description, children: description }),
-      cta && cta.url && /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: "secondary",
-          className: clsx19(!isBelowTablet && !image && UpcomingEventCard_module_default.hidden, UpcomingEventCard_module_default.cta),
-          fullWidth: isBelowMobile,
-          href: cta.url,
-          children: cta.label
-        }
-      )
-    ] })
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "article",
+    {
+      className: clsx19(
+        "card",
+        UpcomingEventCard_module_default["event-card"],
+        UpcomingEventCard_module_default[direction],
+        hasCtaWithoutImage && UpcomingEventCard_module_default["cta-without-image"],
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: clsx19("card-content", UpcomingEventCard_module_default["event-card-content"]), children: [
+          showImage && image && /* @__PURE__ */ jsx(Picture, __spreadProps(__spreadValues({}, image), { className: clsx19("card-image", UpcomingEventCard_module_default["event-card-image"]) })),
+          /* @__PURE__ */ jsxs("div", { className: clsx19("card-text-content", UpcomingEventCard_module_default["event-card-text-content"]), children: [
+            /* @__PURE__ */ jsx("span", { className: UpcomingEventCard_module_default.date, children: date }),
+            title && /* @__PURE__ */ jsx("h3", { className: clsx19("card-text-title"), children: title }),
+            location && /* @__PURE__ */ jsx("span", { className: UpcomingEventCard_module_default.location, children: location }),
+            description && /* @__PURE__ */ jsx("div", { className: clsx19("card-text-description", UpcomingEventCard_module_default.description), children: description }),
+            cta && cta.url && /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "secondary",
+                className: clsx19(
+                  "card-cta",
+                  UpcomingEventCard_module_default["event-card-cta"],
+                  !hasCTAandImage && UpcomingEventCard_module_default.hidden
+                ),
+                fullWidth: isBelowMobile,
+                href: cta.url,
+                icon: cta.icon,
+                children: cta.label
+              }
+            )
+          ] })
+        ] }),
+        cta && cta.url && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: clsx19("card-footer", UpcomingEventCard_module_default["event-card-footer"], hasImage && UpcomingEventCard_module_default.hidden),
+            children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "secondary",
+                className: clsx19("card-cta", UpcomingEventCard_module_default["event-card-cta"]),
+                fullWidth: isBelowMobile,
+                href: cta.url,
+                icon: cta.icon,
+                children: cta.label
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
 };
 
 // src/components/Carousel/Carousel.module.scss
-var Carousel_module_default = {
-  "carousel-item": "Carousel_module_carousel-item"
-};
+var Carousel_module_default = {};
 var Carousel = (_a) => {
   var _b = _a, { slides, className } = _b, props = __objRest(_b, ["slides", "className"]);
   return /* @__PURE__ */ jsx(
@@ -1679,22 +1724,38 @@ var Carousel = (_a) => {
     __spreadProps(__spreadValues({
       className: clsx19(Carousel_module_default.carousel, className),
       spaceBetween: 0,
-      slidesPerView: 1,
+      slidesPerView: "auto",
       modules: [FreeMode],
       freeMode: { enabled: true, sticky: false, momentum: true },
       wrapperTag: "ul",
       loop: false
     }, props), {
-      children: slides.map((slide, index) => /* @__PURE__ */ jsx(SwiperSlide, { tag: "li", className: Carousel_module_default["carousel-item"], children: slide }, index))
+      children: slides.map((slide, index) => /* @__PURE__ */ jsx(
+        SwiperSlide,
+        {
+          tag: "li",
+          className: clsx19(Carousel_module_default["carousel-item"], props.slideClass),
+          children: slide
+        },
+        index
+      ))
     })
   );
 };
 
 // src/widgets/EventList/EventList.module.scss
 var EventList_module_default = {
-  section: "EventList_module_section",
+  "event-list-module": "EventList_module_event-list-module",
+  "event-list-header-container": "EventList_module_event-list-header-container",
+  "event-list-wrapper": "EventList_module_event-list-wrapper",
+  vertical: "EventList_module_vertical",
   grey: "EventList_module_grey",
-  "header-container": "EventList_module_header-container"
+  "card-list-item": "EventList_module_card-list-item",
+  "card-item": "EventList_module_card-item",
+  horizontal: "EventList_module_horizontal",
+  "carousel-wrapper": "EventList_module_carousel-wrapper",
+  "carousel-list-item": "EventList_module_carousel-list-item",
+  "event-card": "EventList_module_event-card"
 };
 var EventListTitle = ({ children }) => {
   return /* @__PURE__ */ jsx(Fragment, { children });
@@ -1706,22 +1767,69 @@ var EventList = ({ className, title, items, cta, variant, children }) => {
     title: EventListTitle
   });
   const titleNode = (_a = slots.title) != null ? _a : title;
+  const isGrey = variant === "grey";
   const isBelowTablet = is("tablet", "below");
-  return /* @__PURE__ */ jsxs("section", { className: clsx19(EventList_module_default.section, variant && EventList_module_default[variant], className), children: [
-    /* @__PURE__ */ jsxs("div", { className: EventList_module_default["header-container"], children: [
-      titleNode && /* @__PURE__ */ jsx("h2", { children: titleNode }),
-      cta && cta.url && /* @__PURE__ */ jsx(Button, { className: EventList_module_default.cta, variant: "nofillblack", href: cta.url, icon: "rightBlack", children: cta.label })
-    ] }),
-    variant === "grey" && isBelowTablet && /* @__PURE__ */ jsx(
-      Carousel,
-      {
-        className: EventList_module_default[variant],
-        slides: items.map((item) => /* @__PURE__ */ jsx(UpcomingEventCard, __spreadValues({ className: variant }, item), item.title))
-      }
-    ),
-    variant === "grey" && !isBelowTablet && /* @__PURE__ */ jsx("ul", { className: clsx19(EventList_module_default[variant]), children: items == null ? void 0 : items.map((item, index) => /* @__PURE__ */ jsx("li", { className: variant, children: /* @__PURE__ */ jsx(UpcomingEventCard, __spreadProps(__spreadValues({}, item), { className: variant })) }, index)) }),
-    !variant && /* @__PURE__ */ jsx("ul", { children: items == null ? void 0 : items.map((item, index) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(UpcomingEventCard, __spreadValues({}, item)) }, index)) })
-  ] });
+  const cardDirection = isBelowTablet ? "vertical" : "horizontal";
+  const listDirection = isGrey ? "horizontal" : "vertical";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: clsx19(
+        "event-list-module",
+        EventList_module_default["event-list-module"],
+        isGrey && EventList_module_default[variant],
+        className
+      ),
+      children: /* @__PURE__ */ jsxs(Container, { className: clsx19(EventList_module_default["event-list-container"]), children: [
+        /* @__PURE__ */ jsxs("div", { className: EventList_module_default["event-list-header-container"], children: [
+          titleNode && /* @__PURE__ */ jsx("h2", { children: titleNode }),
+          cta && cta.url && /* @__PURE__ */ jsx(Button, { className: EventList_module_default.cta, variant: "nofillblack", href: cta.url, icon: cta.icon, children: cta.label })
+        ] }),
+        isGrey && isBelowTablet && /* @__PURE__ */ jsx(
+          Carousel,
+          {
+            wrapperClass: clsx19(EventList_module_default["carousel-wrapper"]),
+            slideClass: EventList_module_default["carousel-list-item"],
+            spaceBetween: 16,
+            slides: items.map((item) => {
+              var _a2, _b;
+              return /* @__PURE__ */ jsx(
+                UpcomingEventCard,
+                __spreadValues({
+                  className: isGrey && EventList_module_default["event-card"],
+                  direction: "vertical",
+                  showImage: false
+                }, item),
+                (_b = (_a2 = item.title) != null ? _a2 : item.date) != null ? _b : item.location
+              );
+            })
+          }
+        ),
+        isGrey && !isBelowTablet && /* @__PURE__ */ jsx("ul", { className: clsx19(EventList_module_default["event-list-wrapper"], EventList_module_default["horizontal"], EventList_module_default[variant]), children: items == null ? void 0 : items.map((item, index) => {
+          var _a2, _b, _c;
+          return /* @__PURE__ */ jsx(
+            "li",
+            {
+              className: clsx19(EventList_module_default["card-list-item"]),
+              children: /* @__PURE__ */ jsx(
+                UpcomingEventCard,
+                __spreadProps(__spreadValues({}, item), {
+                  className: isGrey && EventList_module_default["card-item"],
+                  showImage: false,
+                  direction: "vertical"
+                })
+              )
+            },
+            (_c = (_b = (_a2 = item.title) != null ? _a2 : item.date) != null ? _b : item.location) != null ? _c : index
+          );
+        }) }),
+        !isGrey && /* @__PURE__ */ jsx("ul", { className: clsx19(EventList_module_default["event-list-wrapper"], EventList_module_default[listDirection]), children: items == null ? void 0 : items.map((item, index) => {
+          var _a2, _b, _c;
+          return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(UpcomingEventCard, __spreadProps(__spreadValues({}, item), { direction: cardDirection })) }, (_c = (_b = (_a2 = item.title) != null ? _a2 : item.date) != null ? _b : item.location) != null ? _c : index);
+        }) })
+      ] })
+    }
+  );
 };
 
 // src/widgets/EventList/index.ts
@@ -1809,6 +1917,72 @@ var TextBody2 = Object.assign(TextBody, {
   Title: TextBodyTitle,
   Body: TextBodyBody
 });
+var TextCenterCtaInBottomTitle = ({ children }) => {
+  return /* @__PURE__ */ jsx(Fragment, { children });
+};
+var TextCenterCtaInBottomSubtitle = ({ children }) => {
+  return /* @__PURE__ */ jsx(Fragment, { children });
+};
+
+// src/widgets/TextCenterCtaInBottom/TextCenterCtaInBottom.module.scss
+var TextCenterCtaInBottom_module_default = {
+  textCenterCta: "TextCenterCtaInBottom_module_textCenterCta",
+  container: "TextCenterCtaInBottom_module_container",
+  content: "TextCenterCtaInBottom_module_content",
+  title: "TextCenterCtaInBottom_module_title",
+  subtitle: "TextCenterCtaInBottom_module_subtitle",
+  ctaWrapper: "TextCenterCtaInBottom_module_ctaWrapper",
+  iconOnly: "TextCenterCtaInBottom_module_iconOnly",
+  cta: "TextCenterCtaInBottom_module_cta"
+};
+var TextCenterCtaInBottom = ({
+  className,
+  title,
+  subtitle,
+  ctas,
+  children
+}) => {
+  var _a, _b;
+  const slots = resolveCompoundSlots(children, {
+    title: TextCenterCtaInBottomTitle,
+    subtitle: TextCenterCtaInBottomSubtitle
+  });
+  const titleNode = (_a = slots.title) != null ? _a : title;
+  const subtitleNode = (_b = slots.subtitle) != null ? _b : subtitle;
+  return /* @__PURE__ */ jsx("div", { className: clsx19(TextCenterCtaInBottom_module_default.textCenterCta, className), children: /* @__PURE__ */ jsxs(Container, { className: TextCenterCtaInBottom_module_default.container, children: [
+    /* @__PURE__ */ jsxs("div", { className: TextCenterCtaInBottom_module_default.content, children: [
+      titleNode && /* @__PURE__ */ jsx("div", { className: TextCenterCtaInBottom_module_default.title, children: titleNode }),
+      subtitleNode && /* @__PURE__ */ jsx("div", { className: TextCenterCtaInBottom_module_default.subtitle, children: subtitleNode })
+    ] }),
+    !!(ctas == null ? void 0 : ctas.length) && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: clsx19(
+          TextCenterCtaInBottom_module_default.ctaWrapper,
+          ctas.every((cta) => !cta.label && cta.logo) && TextCenterCtaInBottom_module_default.iconOnly
+        ),
+        children: ctas.map((cta, key) => /* @__PURE__ */ jsx(
+          Button,
+          {
+            className: TextCenterCtaInBottom_module_default.cta,
+            variant: "secondary",
+            href: cta == null ? void 0 : cta.url,
+            isExternal: cta == null ? void 0 : cta.isExternal,
+            logo: cta.logo,
+            children: cta == null ? void 0 : cta.label
+          },
+          key
+        ))
+      }
+    )
+  ] }) });
+};
+
+// src/widgets/TextCenterCtaInBottom/index.ts
+var TextCenterCtaInBottom2 = Object.assign(TextCenterCtaInBottom, {
+  Title: TextCenterCtaInBottomTitle,
+  Subtitle: TextCenterCtaInBottomSubtitle
+});
 function useIntersectionObserver({
   animateOnce = false,
   options = {}
@@ -1838,6 +2012,6 @@ function useIntersectionObserver({
   return { observeRef, isVisible };
 }
 
-export { Anchor, BrandsStrip, Button, Card2 as Card, CardCollection2 as CardCollection, ConditionalWrapper, ContactModule2 as ContactModule, Container, CountingCard2 as CountingCard, EventList2 as EventList, Footer, HeroBanner2 as HeroBanner, Icon, InfoCard2 as InfoCard, MiniBanner2 as MiniBanner, MiniSectionCta2 as MiniSectionCta, Pagination, Picture, PracticeCard, PracticePathCards2 as PracticePathCards, Teaser5050With3Text2 as Teaser5050With3Text, Teaser5050WithCta2 as Teaser5050WithCta, TextBody2 as TextBody, TextEvent2 as TextEvent, resolveCompoundSlots, svgs, useIntersectionObserver };
+export { Anchor, BrandsStrip, Button, Card2 as Card, CardCollection2 as CardCollection, ConditionalWrapper, ContactModule2 as ContactModule, Container, CountingCard2 as CountingCard, EventList2 as EventList, Footer, HeroBanner2 as HeroBanner, Icon, InfoCard2 as InfoCard, MiniBanner2 as MiniBanner, MiniSectionCta2 as MiniSectionCta, Pagination, Picture, PracticeCard, PracticePathCards2 as PracticePathCards, Teaser5050With3Text2 as Teaser5050With3Text, Teaser5050WithCta2 as Teaser5050WithCta, TextBody2 as TextBody, TextCenterCtaInBottom2 as TextCenterCtaInBottom, TextEvent2 as TextEvent, resolveCompoundSlots, svgs, useIntersectionObserver };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map