@scrippsproduct/networks-ui-library 1.1.4 → 1.1.6

package/dist/components/ScheduleLayout/ScheduleLayout.js

@@ -1,110 +1,110 @@
 import { jsx as t, jsxs as b } from "react/jsx-runtime";
-import { useRef as s, useCallback as w, useEffect as h } from "react";
-import { f as L } from "../../format-YhWt2D8M.mjs";
-import { l as g } from "../../logger-C0N7U0YY.mjs";
-import { classes as E } from "../../utils/helpers.js";
-import { ScheduleProvider as q } from "./ScheduleContext.js";
-import { useScheduleContext as T } from "./useScheduleContext.js";
-import { DateNavigation as k } from "../DateNavigation/DateNavigation.js";
-import { ScheduleList as C } from "../ScheduleList/ScheduleList.js";
-g.setComponent("ScheduleLayout");
-import '../../assets/ScheduleLayout.css';function x({
-  handleScheduleClicks: f = () => !0
+import { useRef as a, useCallback as w, useEffect as y } from "react";
+import { f as S } from "../../format-YhWt2D8M.mjs";
+import { l as L } from "../../logger-C0N7U0YY.mjs";
+import { classes as g } from "../../utils/helpers.js";
+import { ScheduleProvider as E } from "./ScheduleContext.js";
+import { useScheduleContext as q } from "./useScheduleContext.js";
+import { DateNavigation as T } from "../DateNavigation/DateNavigation.js";
+import { ScheduleList as k } from "../ScheduleList/ScheduleList.js";
+L.setComponent("ScheduleLayout");
+import '../../assets/ScheduleLayout.css';function C({
+  handleScheduleClicks: d = () => !0
 }) {
   console.warn("ScheduleLayoutContent rendered");
-  const { currentDate: n } = T(), r = s(null), m = s(0), o = s(null), u = s(null), a = s(null), p = s(!0), l = w((c) => {
-    const i = () => {
+  const { currentDate: n } = q(), r = a(null), f = a(0), o = a(null), l = a(null), m = a(!0), s = w((i) => {
+    const c = () => {
       let e;
-      const d = document.querySelector(`.date-navigation__day[aria-controls="${L(c, "yyyy-MM-dd")}"]`);
-      if (d && (e = d.parentElement), e && r.current) {
-        const S = e.offsetLeft + e.offsetWidth / 2;
-        m.current = S, r.current.style.setProperty(
+      const u = document.querySelector(`.date-navigation__day[aria-controls="${S(i, "yyyy-MM-dd")}"]`);
+      if (u && (e = u.parentElement), e && r.current) {
+        const v = e.offsetLeft + e.offsetWidth / 2;
+        f.current = v, r.current.style.setProperty(
           "--pointer-position",
-          `${S}px`
+          `${v}px`
         );
       }
-    }, v = () => {
-      a.current || (a.current = document.querySelector("sticky-content-wrapper")), u.current || (u.current = document.querySelector(".schedule-list"));
+    }, h = () => {
+      l.current || (l.current = document.querySelector("sticky-content-wrapper"));
       const e = document.querySelector(".mobile-nav");
-      if (u.current && (u.current.scrollTop = 0), a.current) {
-        const d = e && window.getComputedStyle(e).display !== "none" ? e.offsetHeight + 8 : 16;
+      if (l.current) {
+        const u = e && window.getComputedStyle(e).display !== "none" ? e.offsetHeight + 8 : 16;
         window.scrollTo({
-          behavior: "smooth",
-          top: a.current.offsetTop - d,
+          behavior: "auto",
+          top: l.current.offsetTop - u,
           left: 0
         });
       }
     };
     if (!r.current) {
       const e = setInterval(() => {
-        r.current = document.querySelector(".date-navigation__list"), r.current && (clearInterval(e), a.current = document.querySelector("sticky-content-wrapper"), i());
+        r.current = document.querySelector(".date-navigation__list"), r.current && (clearInterval(e), c());
       }, 100);
       setTimeout(() => {
         clearInterval(e);
       }, 3e3);
       return;
     }
-    i(), p.current || v();
-  }, []), y = w(() => {
+    c(), m.current || h();
+  }, []), p = w(() => {
     o.current && clearTimeout(o.current), o.current = window.setTimeout(() => {
-      l(n);
+      s(n);
     }, 250);
-  }, [n, l]);
-  return h(() => (window.addEventListener("resize", y), () => {
-    window.removeEventListener("resize", y), o.current && clearTimeout(o.current);
-  }), [l, y]), h(() => {
-    const c = document.querySelector(".header-divider"), i = document.querySelector("sticky-content-wrapper");
-    i && c && new IntersectionObserver(
+  }, [n, s]);
+  return y(() => (window.addEventListener("resize", p), () => {
+    window.removeEventListener("resize", p), o.current && clearTimeout(o.current);
+  }), [s, p]), y(() => {
+    const i = document.querySelector(".header-divider"), c = document.querySelector("sticky-content-wrapper");
+    c && i && new IntersectionObserver(
       ([e]) => {
-        e.intersectionRatio < 1 ? i.dataset.pinnedState = "pinned" : i.dataset.pinnedState = "unpinned";
+        e.intersectionRatio < 1 ? c.dataset.pinnedState = "pinned" : c.dataset.pinnedState = "unpinned";
       },
       {
         threshold: [1],
         rootMargin: "-37px"
       }
-    ).observe(c);
-  }, []), h(() => {
-    const c = requestAnimationFrame(() => {
+    ).observe(i);
+  }, []), y(() => {
+    const i = requestAnimationFrame(() => {
       requestAnimationFrame(() => {
-        l(n), p.current && (p.current = !1);
+        s(n), m.current && (m.current = !1);
       });
     });
-    return () => cancelAnimationFrame(c);
-  }, [n, l]), /* @__PURE__ */ b("schedule-layout", { children: [
+    return () => cancelAnimationFrame(i);
+  }, [n, s]), /* @__PURE__ */ b("schedule-layout", { children: [
     /* @__PURE__ */ t("sticky-content-wrapper", { "data-pinned-state": "unpinned", children: /* @__PURE__ */ t(
       "content-constrainer",
       {
-        class: E([
+        class: g([
           "content-constrainer--no-padding",
           "content-constrainer--no-border",
           "content-constrainer--lead-container",
           "schedule-date-nav-constrainer"
         ]),
-        children: /* @__PURE__ */ t(k, {})
+        children: /* @__PURE__ */ t(T, {})
       }
     ) }),
-    /* @__PURE__ */ t("section", { className: "page-section", id: "schedule-section", children: /* @__PURE__ */ t("content-constrainer", { class: "content-constrainer--no-border schedule-content-constrainer", children: /* @__PURE__ */ t("div", { id: L(n, "yyyy-MM-dd"), role: "tabpanel", children: /* @__PURE__ */ t(C, { handleClicks: f }) }) }) })
+    /* @__PURE__ */ t("section", { className: "page-section", id: "schedule-section", children: /* @__PURE__ */ t("content-constrainer", { class: "content-constrainer--no-border schedule-content-constrainer", children: /* @__PURE__ */ t("div", { id: S(n, "yyyy-MM-dd"), role: "tabpanel", children: /* @__PURE__ */ t(k, { handleClicks: d }) }) }) })
   ] });
 }
-function A({
-  fetchSchedule: f,
+function _({
+  fetchSchedule: d,
   initialSchedule: n = [],
   weeks: r = [],
-  handleScheduleClicks: m = () => !0,
+  handleScheduleClicks: f = () => !0,
   handleDateChanged: o = () => !0
 }) {
   return /* @__PURE__ */ t(
-    q,
+    E,
     {
-      fetchSchedule: f,
+      fetchSchedule: d,
       handleDateChanged: o,
       initialSchedule: n,
       weeks: r,
-      children: /* @__PURE__ */ t(x, { handleScheduleClicks: m })
+      children: /* @__PURE__ */ t(C, { handleScheduleClicks: f })
     }
   );
 }
 export {
-  A as ScheduleLayout,
-  A as default
+  _ as ScheduleLayout,
+  _ as default
 };

package/dist/components/ScheduleList/ScheduleList.js

@@ -1,12 +1,12 @@
-import { jsx as t, jsxs as g } from "react/jsx-runtime";
-import { useReducer as A, useState as u, useRef as S, useCallback as x, useEffect as y } from "react";
-import { classes as R, getMinutesFromStr as b } from "../../utils/helpers.js";
-import { useScheduleContext as w } from "../ScheduleLayout/useScheduleContext.js";
-import { Loading as D } from "../Loading/Loading.js";
-import { SportsItem as M } from "./schedule-list-items/SportsItem.js";
-import { SeriesItem as C } from "./schedule-list-items/SeriesItem.js";
-import { MovieItem as O } from "./schedule-list-items/MovieItem.js";
-import '../../assets/ScheduleList.css';const l = {
+import { jsx as n, jsxs as v } from "react/jsx-runtime";
+import { useReducer as A, useState as x, useRef as u, useCallback as C, useEffect as c } from "react";
+import { classes as S, getMinutesFromStr as D } from "../../utils/helpers.js";
+import { useScheduleContext as M } from "../ScheduleLayout/useScheduleContext.js";
+import { Loading as O } from "../Loading/Loading.js";
+import { SportsItem as P } from "./schedule-list-items/SportsItem.js";
+import { SeriesItem as k } from "./schedule-list-items/SeriesItem.js";
+import { MovieItem as N } from "./schedule-list-items/MovieItem.js";
+import '../../assets/ScheduleList.css';const y = {
   "schedule-list__item": "_schedule-list__item_686v7_1",
   "schedule-list__airdate": "_schedule-list__airdate_686v7_14",
   "airdate-formatter__date": "_airdate-formatter__date_686v7_22",
@@ -19,11 +19,11 @@ import '../../assets/ScheduleList.css';const l = {
   "schedule-content-constrainer": "_schedule-content-constrainer_686v7_102",
   "image-card__content": "_image-card__content_686v7_116"
 };
-function L(r) {
+function w(r) {
   return typeof r == "object" && !Array.isArray(r) && (r == null ? void 0 : r.queryStatus) && r.queryStatus === "no-results";
 }
-function P(r, a) {
-  switch (a.type) {
+function $(r, o) {
+  switch (o.type) {
     case "START_EXIT":
       return "exiting";
     case "EXIT_COMPLETE":
@@ -36,9 +36,9 @@ function P(r, a) {
       return r;
   }
 }
-const d = (r) => {
-  var a, o, v, n, s, _, E, f, p, e, i;
-  return (a = r.video) != null && a.brightcove_id ? {
+const T = (r) => {
+  var o, a, d, t, e, s, E, l, p, f, i;
+  return (o = r.video) != null && o.brightcove_id ? {
     label: "Watch Preview",
     type: "play-video",
     href: "",
@@ -69,10 +69,10 @@ const d = (r) => {
     //'film',
     position: void 0
     //'inline',
-  } : (((o = r == null ? void 0 : r.content) == null ? void 0 : o.external_link) !== void 0 && ((v = r == null ? void 0 : r.content) == null ? void 0 : v.external_link) !== "" || ((n = r == null ? void 0 : r.content) == null ? void 0 : n.slug) !== void 0 && ((s = r == null ? void 0 : r.content) == null ? void 0 : s.slug) !== "") && !((_ = r == null ? void 0 : r.content) != null && _.prevent_detail_page) ? {
+  } : (((a = r == null ? void 0 : r.content) == null ? void 0 : a.external_link) !== void 0 && ((d = r == null ? void 0 : r.content) == null ? void 0 : d.external_link) !== "" || ((t = r == null ? void 0 : r.content) == null ? void 0 : t.slug) !== void 0 && ((e = r == null ? void 0 : r.content) == null ? void 0 : e.slug) !== "") && !((s = r == null ? void 0 : r.content) != null && s.prevent_detail_page) ? {
     label: (r == null ? void 0 : r.program_class) === "Episode" ? "View Series Details" : (r == null ? void 0 : r.program_class) === "Film" ? "View Movie Details" : "Learn More",
     type: (E = r == null ? void 0 : r.content) != null && E.external_link ? "external-link" : "internal-link",
-    href: (f = r == null ? void 0 : r.content) != null && f.external_link ? (p = r == null ? void 0 : r.content) == null ? void 0 : p.external_link : r.program_class === "Episode" ? `/show/${(e = r == null ? void 0 : r.content) == null ? void 0 : e.slug}` : `/movie/${(i = r == null ? void 0 : r.content) == null ? void 0 : i.slug}`,
+    href: (l = r == null ? void 0 : r.content) != null && l.external_link ? (p = r == null ? void 0 : r.content) == null ? void 0 : p.external_link : r.program_class === "Episode" ? `/show/${(f = r == null ? void 0 : r.content) == null ? void 0 : f.slug}` : `/movie/${(i = r == null ? void 0 : r.content) == null ? void 0 : i.slug}`,
     position: "inline"
   } : {
     label: "",
@@ -81,28 +81,39 @@ const d = (r) => {
     position: void 0
   };
 };
-function q({
+function B({
   handleClicks: r = () => !0
 }) {
-  const { schedule: a, isLoading: o, isError: v } = w(), [n, s] = A(P, "idle"), [_, E] = u(a), f = S(null), p = S(null), e = x(() => {
-    p.current && (clearTimeout(p.current), p.current = null), n === "exiting" ? s({ type: "EXIT_COMPLETE" }) : n === "entering" && s({ type: "ENTER_COMPLETE" });
-  }, [n]);
-  return y(() => {
-    const i = f.current;
+  const { schedule: o, isLoading: a, isError: d } = M(), [t, e] = A($, "idle"), [s, E] = x(o), l = u(null), p = u(null), f = C(() => {
+    p.current && (clearTimeout(p.current), p.current = null), t === "exiting" ? e({ type: "EXIT_COMPLETE" }) : t === "entering" && e({ type: "ENTER_COMPLETE" });
+  }, [t]);
+  return c(() => {
+    const i = l.current;
     if (i)
-      return i.addEventListener("animationend", e), () => {
-        i.removeEventListener("animationend", e);
+      return i.addEventListener("animationend", f), () => {
+        i.removeEventListener("animationend", f);
       };
-  }, [e]), y(() => {
-    o && n === "idle" && s({ type: "START_EXIT" });
-  }, [o, n]), y(() => {
-    !o && n === "exiting" && s({ type: "EXIT_COMPLETE" });
-  }, [o, n]), y(() => {
-    const i = L(a) || Array.isArray(a) && a.length >= 0;
-    !o && n === "loading" && i && (E(a), s({ type: "SCHEDULE_LOADED" }));
-  }, [o, n, a]), y(() => () => {
+  }, [f]), c(() => {
+    a && t === "idle" && e({ type: "START_EXIT" });
+  }, [a, t]), c(() => {
+    !a && t === "exiting" && e({ type: "EXIT_COMPLETE" });
+  }, [a, t]), c(() => {
+    const i = w(o) || Array.isArray(o) && o.length >= 0;
+    !a && t === "loading" && i && (E(o), e({ type: "SCHEDULE_LOADED" }));
+  }, [a, t, o]), c(() => {
+    if (t === "exiting" && l.current) {
+      const i = document.querySelector("sticky-content-wrapper"), g = document.querySelector(".mobile-nav");
+      let _ = 0;
+      i && (_ += i.offsetHeight), g && window.getComputedStyle(g).display !== "none" && (_ += g.offsetHeight), _ += 16;
+      const R = l.current.getBoundingClientRect(), L = window.pageYOffset || document.documentElement.scrollTop, b = R.top + L - _;
+      window.scrollTo({
+        top: b,
+        behavior: "auto"
+      });
+    }
+  }, [t]), c(() => () => {
     p.current && clearTimeout(p.current);
-  }, []), n === "loading" ? /* @__PURE__ */ t(
+  }, []), t === "loading" ? /* @__PURE__ */ n(
     "div",
     {
       style: {
@@ -111,82 +122,82 @@ function q({
         minHeight: "100dvh",
         paddingTop: "6rem"
       },
-      children: /* @__PURE__ */ t(D, {})
+      children: /* @__PURE__ */ n(O, {})
     }
-  ) : v ? /* @__PURE__ */ g("div", { className: "schedule-list__no-schedule", children: [
-    /* @__PURE__ */ t("h2", { children: "There was an error loading the schedule for this day." }),
-    /* @__PURE__ */ g("p", { children: [
+  ) : d ? /* @__PURE__ */ v("div", { className: "schedule-list__no-schedule", children: [
+    /* @__PURE__ */ n("h2", { children: "There was an error loading the schedule for this day." }),
+    /* @__PURE__ */ v("p", { children: [
       "Please try again later. If this problem persists report it at ",
-      /* @__PURE__ */ t("a", { href: "https://support.iontelevision.com/support/home", children: "our support page" }),
+      /* @__PURE__ */ n("a", { href: "https://support.iontelevision.com/support/home", children: "our support page" }),
       "."
     ] })
-  ] }) : L(_) ? /* @__PURE__ */ g(
+  ] }) : w(s) ? /* @__PURE__ */ v(
     "div",
     {
-      className: R([
-        l["schedule-list__no-schedule"],
+      className: S([
+        y["schedule-list__no-schedule"],
         "schedule-list__no-schedule"
       ]),
-      "data-state": n,
+      "data-state": t,
       style: { animationDelay: "500ms" },
       children: [
-        /* @__PURE__ */ t("h2", { children: "There are no shows scheduled for this day." }),
-        /* @__PURE__ */ g("p", { children: [
+        /* @__PURE__ */ n("h2", { children: "There are no shows scheduled for this day." }),
+        /* @__PURE__ */ v("p", { children: [
           "Please try again later. If this problem persists report it at ",
-          /* @__PURE__ */ t("a", { href: "https://support.iontelevision.com/support/home", children: "our support page" }),
+          /* @__PURE__ */ n("a", { href: "https://support.iontelevision.com/support/home", children: "our support page" }),
           "."
         ] })
       ]
     }
-  ) : Array.isArray(_) && _.length === 0 ? /* @__PURE__ */ g(
+  ) : Array.isArray(s) && s.length === 0 ? /* @__PURE__ */ v(
     "div",
     {
-      className: R([
-        l["schedule-list__no-schedule"],
+      className: S([
+        y["schedule-list__no-schedule"],
         "schedule-list__no-schedule"
       ]),
-      "data-state": n,
+      "data-state": t,
       children: [
-        /* @__PURE__ */ t("h2", { children: "Our programming schedule for today has completed." }),
-        /* @__PURE__ */ t("p", { children: "Our programming will restart at 6am." })
+        /* @__PURE__ */ n("h2", { children: "Our programming schedule for today has completed." }),
+        /* @__PURE__ */ n("p", { children: "Our programming will restart at 6am." })
       ]
     }
-  ) : /* @__PURE__ */ t(
+  ) : /* @__PURE__ */ n(
     "ul",
     {
-      className: `${l["schedule-list"]} schedule-list`,
-      "data-state": n,
-      ref: f,
-      children: Array.isArray(_) && _.map((i) => {
-        const T = b(i.element_length), c = d(i).type === "" ? [T, i.rating] : [T, i.rating, " "];
-        return i.program_class === "Episode" ? /* @__PURE__ */ t(
-          C,
+      className: `${y["schedule-list"]} schedule-list`,
+      "data-state": t,
+      ref: l,
+      children: Array.isArray(s) && s.map((i) => {
+        const g = D(i.element_length), _ = T(i).type === "" ? [g, i.rating] : [g, i.rating, " "];
+        return i.program_class === "Episode" ? /* @__PURE__ */ n(
+          k,
           {
-            determineCTA: d,
+            determineCTA: T,
             handleClicks: r,
             scheduleItem: i,
-            strListArr: c,
-            styles: l
+            strListArr: _,
+            styles: y
           },
           `schedule-list-${i.id}`
-        ) : i.program_class === "Film" || i.program_class === "Movie" || i.program_class === "Special" ? /* @__PURE__ */ t(
-          O,
+        ) : i.program_class === "Film" || i.program_class === "Movie" || i.program_class === "Special" ? /* @__PURE__ */ n(
+          N,
           {
-            determineCTA: d,
+            determineCTA: T,
             handleClicks: r,
             scheduleItem: i,
-            strListArr: c,
-            styles: l
+            strListArr: _,
+            styles: y
           },
           `schedule-list-${i.id}`
-        ) : i.program_class === "Sports" ? /* @__PURE__ */ t(
-          M,
+        ) : i.program_class === "Sports" ? /* @__PURE__ */ n(
+          P,
           {
-            determineCTA: d,
+            determineCTA: T,
             handleClicks: r,
             scheduleItem: i,
-            strListArr: c,
-            styles: l
+            strListArr: _,
+            styles: y
           },
           `schedule-list-${i.id}`
         ) : null;
@@ -195,6 +206,6 @@ function q({
   );
 }
 export {
-  q as ScheduleList,
-  q as default
+  B as ScheduleList,
+  B as default
 };

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.1.4",
+  "version": "1.1.6",
   "name": "@scrippsproduct/networks-ui-library",
   "description": "React Component Library for use in Scripps Networks external applications",
   "author": {