@scrippsproduct/networks-ui-library 2.0.4 → 2.0.5

package/dist/components/ImageCard/ImageCardCore.js

@@ -1,18 +1,18 @@
-import { jsxs as i, Fragment as N, jsx as n } from "react/jsx-runtime";
-import { p as R } from "../../index-5kXULIVv.mjs";
+import { jsxs as n, Fragment as R, jsx as i } from "react/jsx-runtime";
+import { p as M } from "../../index-5kXULIVv.mjs";
 import { classes as a } from "../../utils/helpers.js";
-import { AnchorTag as y } from "../AnchorTag/AnchorTag.js";
-import { ButtonAnchor as h } from "../ButtonAnchor/ButtonAnchor.js";
-import { ResponsiveImage as B } from "../ResponsiveImage/ResponsiveImage.js";
-const U = ({
-  image: d = { url: "", altText: "", aspectRatio: 1, sources: [] },
-  mobileImage: t = { url: "", altText: "", aspectRatio: 1 },
-  lazyLoad: f = !0,
-  fetchPriority: m = void 0,
-  decoding: v = "async",
+import { AnchorTag as g } from "../AnchorTag/AnchorTag.js";
+import { ButtonAnchor as _ } from "../ButtonAnchor/ButtonAnchor.js";
+import { ResponsiveImage as V } from "../ResponsiveImage/ResponsiveImage.js";
+const q = ({
+  image: t = { url: "", altText: "", aspectRatio: 1, sources: [] },
+  mobileImage: m = { url: "", altText: "", aspectRatio: 1 },
+  lazyLoad: h = !0,
+  fetchPriority: l = void 0,
+  decoding: y = "async",
   title: T = "",
-  content: l = "",
-  overlayContent: p = "",
+  content: p = "",
+  overlayContent: d = "",
   cta: e = {
     label: "",
     href: "",
@@ -21,60 +21,60 @@ const U = ({
     position: "end"
     // inline - in the content | end | start
   },
-  displayCTA: g = !0,
-  handleClicks: A = (u) => {
+  displayCTA: f = !0,
+  handleClicks: C = (c) => {
   },
-  fullCardClickable: x = !1,
+  fullCardClickable: v = !1,
   styles: o = {}
 }) => {
-  var b;
-  const u = /* @__PURE__ */ new Map([
+  var N;
+  const c = /* @__PURE__ */ new Map([
     ["play-video", {
-      label: "View Promo",
-      component: h
+      label: "View Video",
+      component: _
     }],
     ["internal-link", {
       label: "View More",
-      component: y
+      component: g
     }],
     ["external-link", {
       label: "Learn More",
-      component: y
+      component: g
     }],
     ["info-panel", {
       label: "View More",
-      component: h
+      component: _
     }],
     ["show-modal", {
       label: "See More",
-      component: h
+      component: _
     }]
-  ]), c = (b = u.get(e.type)) == null ? void 0 : b.component, s = (r) => {
-    r.stopPropagation(), A({
+  ]), b = ["play-video", "show-modal", "info-panel"], u = (N = c.get(e.type)) == null ? void 0 : N.component, s = (r) => {
+    r.stopPropagation(), C({
       type: e.type,
       resourceId: e.relatedResourceId,
       resourceType: e.relatedResourceType,
       target: r.target,
       currentTarget: r.currentTarget
     });
-  }, _ = (r) => {
-    var w;
-    if (!c) return null;
-    const k = c === y, M = r.type === "internal-link" || r.type === "external-link";
-    return /* @__PURE__ */ n(
-      c,
+  }, x = (r) => {
+    var A;
+    if (!u) return null;
+    const k = u === g, w = r.type === "internal-link" || r.type === "external-link";
+    return /* @__PURE__ */ i(
+      u,
       {
         classname: a([o["image-card__cta"], "image-card__cta"]),
         "data-resource-id": r.relatedResourceId,
         ...k && { href: r.href },
-        label: r.label ? r.label : ((w = u.get(r.type)) == null ? void 0 : w.label) ?? "",
-        ...k && M && r.type && { type: r.type },
-        onClick: r.type !== "internal-link" && r.type !== "external-link" ? s : void 0
+        label: r.label ? r.label : ((A = c.get(r.type)) == null ? void 0 : A.label) ?? "",
+        ...k && w && r.type && { type: r.type },
+        onClick: !w && r.type ? s : void 0
       }
     );
   };
-  return /* @__PURE__ */ i(N, { children: [
-    /* @__PURE__ */ i(
+  return /* @__PURE__ */ n(R, { children: [
+    /* @__PURE__ */ n(
       "div",
       {
         className: a([
@@ -82,42 +82,42 @@ const U = ({
           "image-card__img-wrapper"
         ]),
         children: [
-          t.url !== "" && /* @__PURE__ */ n(
+          m.url !== "" && /* @__PURE__ */ i(
             "img",
             {
-              alt: t.altText,
+              alt: m.altText,
               className: o["image-card__mobile-image"],
-              decoding: v,
-              ...m && { fetchpriority: m },
-              loading: f ? "lazy" : void 0,
-              src: t.url,
-              onClick: (e.type === "play-video" || e.type === "show-modal") && !x ? s : void 0
+              decoding: y,
+              ...l && { fetchpriority: l },
+              loading: h ? "lazy" : void 0,
+              src: m.url,
+              onClick: b.includes(e.type) && !v ? s : void 0
             }
           ),
-          /* @__PURE__ */ n(
-            B,
+          /* @__PURE__ */ i(
+            V,
             {
-              altText: d.altText,
+              altText: t.altText,
               classname: o["image-card__image"],
-              decoding: v,
-              fetchPriority: m,
-              fullSizeUrl: d.url,
-              handleClick: (e.type === "play-video" || e.type === "show-modal") && !x ? (r) => (s(r), !1) : () => !0,
-              loading: f ? "lazy" : void 0,
-              sources: d.sources
+              decoding: y,
+              fetchPriority: l !== "auto" ? l : void 0,
+              fullSizeUrl: t.url,
+              handleClick: b.includes(e.type) && !v ? s : void 0,
+              loading: h ? "lazy" : void 0,
+              sources: t.sources
             }
           ),
-          p !== "" && /* @__PURE__ */ n(
+          d !== "" && /* @__PURE__ */ i(
             "div",
             {
               className: a([
                 o["image-card__overlay-content"],
                 "image-card__overlay-content"
               ]),
-              children: typeof p == "string" ? R(p) : p
+              children: typeof d == "string" ? M(d) : d
             }
           ),
-          (e == null ? void 0 : e.type) === "play-video" && /* @__PURE__ */ i(
+          (e == null ? void 0 : e.type) === "play-video" && /* @__PURE__ */ n(
             "button",
             {
               className: a([
@@ -127,28 +127,24 @@ const U = ({
               type: "button",
               onClick: s,
               children: [
-                /* @__PURE__ */ n("span", { className: "sr-only", children: "PLAY BUTTON" }),
-                /* @__PURE__ */ n("div", { className: `${o["play-icon__triangle"]}` })
+                /* @__PURE__ */ i("span", { className: "sr-only", children: "PLAY BUTTON" }),
+                /* @__PURE__ */ i("div", { className: `${o["play-icon__triangle"]}` })
               ]
             }
           )
         ]
       }
     ),
-    l !== "" && /* @__PURE__ */ i("div", { className: a([o["image-card__content"], "image-card__content"]), children: [
-      T !== "" && /* @__PURE__ */ n("h2", { className: "h4", children: T }),
-      typeof l == "string" && /* @__PURE__ */ i("div", { children: [
-        R(l),
-        g && (e == null ? void 0 : e.type) && e.position === "inline" && _(e)
-      ] }),
-      typeof l != "string" && /* @__PURE__ */ i(N, { children: [
-        l,
-        g && (e == null ? void 0 : e.type) && e.position === "inline" && _(e)
+    p !== "" && /* @__PURE__ */ n("div", { className: a([o["image-card__content"], "image-card__content"]), children: [
+      T !== "" && /* @__PURE__ */ i("h2", { className: "h4", children: T }),
+      /* @__PURE__ */ n(R, { children: [
+        typeof p == "string" ? M(p) : p,
+        f && (e == null ? void 0 : e.type) && e.position === "inline" && x(e)
       ] })
     ] }),
-    g && (e == null ? void 0 : e.type) && (e == null ? void 0 : e.position) === "end" && /* @__PURE__ */ n("div", { className: o["image-card__cta-wrapper"], children: _(e) })
+    f && (e == null ? void 0 : e.type) && (e == null ? void 0 : e.position) === "end" && /* @__PURE__ */ i("div", { className: o["image-card__cta-wrapper"], children: x(e) })
   ] });
 };
 export {
-  U as default
+  q as default
 };

package/dist/components/ImageCard/ImageCardCore.test.js

@@ -483,9 +483,9 @@ p("ImageCardCore", () => {
       t(e).not.toBeInTheDocument();
     });
   }), p("Default CTA Labels", () => {
-    l('should use "View Promo" for play-video when no label', () => {
+    l('should use "View Video" for play-video when no label', () => {
       const e = r({ type: "play-video", label: "" });
-      a(/* @__PURE__ */ n(i, { cta: e, styles: o })), t(c.getByText("View Promo")).toBeInTheDocument();
+      a(/* @__PURE__ */ n(i, { cta: e, styles: o })), t(c.getByText("View Video")).toBeInTheDocument();
     }), l('should use "View More" for internal-link when no label', () => {
       const e = r({ type: "internal-link", label: "" });
       a(/* @__PURE__ */ n(i, { cta: e, styles: o })), t(c.getByText("View More")).toBeInTheDocument();

package/dist/components/LogoListItem/LogoListItem.js

@@ -1,31 +1,31 @@
-import { jsxs as m, Fragment as o, jsx as i } from "react/jsx-runtime";
+import { jsxs as n, Fragment as o, jsx as i } from "react/jsx-runtime";
 import { classes as l } from "../../utils/helpers.js";
 import '../../assets/LogoListItem.css';const s = {
-  "icon-list-item": "_icon-list-item_19qvn_1",
-  "icon-list-item__link": "_icon-list-item__link_19qvn_18",
-  "icon-list-item__img-wrapper": "_icon-list-item__img-wrapper_19qvn_19"
+  "icon-list-item": "_icon-list-item_1j8qa_1",
+  "icon-list-item__link": "_icon-list-item__link_1j8qa_18",
+  "icon-list-item__img-wrapper": "_icon-list-item__img-wrapper_1j8qa_19"
 };
 function r({
-  imageSource: e,
+  imageSource: m,
   href: t = "",
-  altText: n = "",
+  altText: e = "",
   target: c = "_self"
 }) {
-  return /* @__PURE__ */ m(o, { children: [
-    t !== "" && /* @__PURE__ */ i("li", { className: l([s["icon-list-item"], "icon-list-item"]), children: /* @__PURE__ */ m(
+  return /* @__PURE__ */ n(o, { children: [
+    t !== "" && /* @__PURE__ */ i("li", { className: l([s["icon-list-item"], "icon-list-item"]), children: /* @__PURE__ */ n(
       "a",
       {
         className: l([s["icon-list-item__link"], "icon-list-item__link"]),
         href: t,
         target: c,
         children: [
-          /* @__PURE__ */ i("span", { className: "sr-only", children: n }),
+          /* @__PURE__ */ i("span", { className: "sr-only", children: e }),
           /* @__PURE__ */ i(
             "img",
             {
-              alt: `${n} logo`,
+              alt: `${e} logo`,
               className: s["ion-list-item__image"],
-              src: e
+              src: m
             }
           )
         ]
@@ -34,8 +34,8 @@ function r({
     t === "" && /* @__PURE__ */ i("li", { className: l([s["icon-list-item"], "icon-list-item"]), children: /* @__PURE__ */ i("span", { className: l([s["icon-list-item__img-wrapper"], "icon-list-item__img-wrapper"]), children: /* @__PURE__ */ i(
       "img",
       {
-        alt: `${n} logo`,
-        src: e
+        alt: `${e} logo`,
+        src: m
       }
     ) }) })
   ] });

package/dist/components/PromotionsRowModule/PromotionsRowModule.js

@@ -1,11 +1,11 @@
-import { jsxs as h, Fragment as S, jsx as a } from "react/jsx-runtime";
-import { useState as R, useEffect as x } from "react";
-import { classes as I } from "../../utils/helpers.js";
-import { PromotionsRowBlock as b } from "../PromotionsRowBlock/PromotionsRowBlock.js";
+import { jsx as a, jsxs as w, Fragment as R } from "react/jsx-runtime";
+import { useState as x, useMemo as I, useEffect as b } from "react";
+import { classes as m } from "../../utils/helpers.js";
+import { PromotionsRowBlock as _ } from "../PromotionsRowBlock/PromotionsRowBlock.js";
 import { ImageCard as B } from "../ImageCard/ImageCard.js";
 import { Carousel as G } from "../Carousel/Carousel.js";
-import { CtaBlock as v } from "../CtaBlock/CtaBlock.js";
-import '../../assets/PromotionsRowModule.css';const P = {
+import { CtaBlock as S } from "../CtaBlock/CtaBlock.js";
+import '../../assets/PromotionsRowModule.css';const A = {
   paginationType: "dots",
   showControls: !0,
   controlButtonsOffset: -4,
@@ -25,17 +25,21 @@ import '../../assets/PromotionsRowModule.css';const P = {
   cellsPosition: "flex-start",
   wrapAround: !1
 };
-function T({
-  title: d = "",
-  promos: n = [],
-  handleClicks: o = null
+function D({
+  title: u = "",
+  promos: s = [],
+  shouldClampContent: y = !0,
+  handleClicks: d = null
 }) {
-  const [u, w] = R([]), y = () => {
-  };
-  return x(() => {
-    const t = (r) => {
-      const c = r.map((e) => {
-        var l, i, s;
+  const [f, P] = x([]), C = () => {
+  }, c = I(() => y ? s.map((n) => n.content ? {
+    ...n,
+    content: /* @__PURE__ */ a("div", { className: "promotions-row__clamped-content", children: n.content })
+  } : n) : s, [s, y]);
+  return b(() => {
+    const t = (n) => {
+      const o = n.map((e) => {
+        var l, i, r;
         return {
           title: "",
           layout: "ImageCard",
@@ -47,56 +51,56 @@ function T({
             },
             title: e.title,
             content: e.content,
-            handleClicks: o ?? y,
+            handleClicks: d ?? C,
             relatedResourceId: e.id,
             overlayContent: e != null && e.overlayContent ? /* @__PURE__ */ a(
-              v,
+              S,
               {
                 content: (l = e.overlayContent) == null ? void 0 : l.content,
                 cta: (i = e.overlayContent) == null ? void 0 : i.cta,
-                title: (s = e.overlayContent) == null ? void 0 : s.title
+                title: (r = e.overlayContent) == null ? void 0 : r.title
               }
             ) : "",
             cta: e.cta
           }
         };
       });
-      w(c);
+      P(o);
     };
-    n.length > 4 && t(n);
-  }, [n, o]), n.length > 4 && u.length ? /* @__PURE__ */ h(S, { children: [
-    /* @__PURE__ */ a("h1", { className: ["h3", "promotions-row__header"].join(" "), children: d }),
+    c.length > 4 && t(c);
+  }, [c, d]), s.length > 4 && f.length ? /* @__PURE__ */ w(R, { children: [
+    /* @__PURE__ */ a("h1", { className: ["h3", "promotions-row__header"].join(" "), children: u }),
     /* @__PURE__ */ a(
       G,
       {
-        cells: u,
+        cells: f,
         id: `promotions-row-${Date.now()}`,
-        options: P
+        options: A
       }
     )
-  ] }) : /* @__PURE__ */ h("section", { className: "promotions-row", children: [
-    /* @__PURE__ */ a("h2", { className: I(["h2", "promotions-row__header"]), children: d }),
-    /* @__PURE__ */ a(b, { gap: "2rem", children: n.map((t) => {
-      var r, c, e, l, i, s, C, f, g;
+  ] }) : /* @__PURE__ */ w("section", { className: "promotions-row", children: [
+    /* @__PURE__ */ a("h2", { className: m(["h2", "promotions-row__header"]), children: u }),
+    /* @__PURE__ */ a(_, { gap: "2rem", children: c.map((t) => {
+      var n, o, e, l, i, r, g, h, v;
       return /* @__PURE__ */ a(
         B,
         {
           classname: t == null ? void 0 : t.classname,
           content: t.content,
           cta: t.cta,
-          handleClicks: ((r = t == null ? void 0 : t.cta) == null ? void 0 : r.type) === "play-video" ? o ?? y : () => !0,
+          handleClicks: ((n = t == null ? void 0 : t.cta) == null ? void 0 : n.type) === "play-video" ? d ?? C : () => !0,
           image: t.image,
           overlayContent: t.overlayContent ? /* @__PURE__ */ a(
-            v,
+            S,
             {
-              btnGradientEndColor: (c = t.overlayContent) == null ? void 0 : c.btnGradientEndColor,
+              btnGradientEndColor: (o = t.overlayContent) == null ? void 0 : o.btnGradientEndColor,
               btnGradientStartColor: (e = t.overlayContent) == null ? void 0 : e.btnGradientStartColor,
               content: (l = t.overlayContent) == null ? void 0 : l.content,
               cta: (i = t.overlayContent) == null ? void 0 : i.cta,
-              ctaButtonStyle: (s = t.overlayContent) == null ? void 0 : s.ctaButtonStyle,
-              title: (C = t.overlayContent) == null ? void 0 : C.title,
-              titleImageUrl: (f = t.overlayContent) == null ? void 0 : f.titleImageUrl,
-              type: (g = t.overlayContent) == null ? void 0 : g.type
+              ctaButtonStyle: (r = t.overlayContent) == null ? void 0 : r.ctaButtonStyle,
+              title: (g = t.overlayContent) == null ? void 0 : g.title,
+              titleImageUrl: (h = t.overlayContent) == null ? void 0 : h.titleImageUrl,
+              type: (v = t.overlayContent) == null ? void 0 : v.type
             }
           ) : "",
           relatedResourceId: t.id,
@@ -108,6 +112,6 @@ function T({
   ] });
 }
 export {
-  T as PromotionsRowModule,
-  T as default
+  D as PromotionsRowModule,
+  D as default
 };