@scrippsproduct/networks-ui-library 1.1.0-alpha.3 → 1.1.0-alpha.4

package/dist/components/ScheduleLayout/ScheduleLayout.d.ts

@@ -11,6 +11,7 @@ type ScheduleLayoutProps = {
     weeks?: Day[][];
     handleScheduleClicks?: (details: HandleClicksDetails) => boolean | void;
     handleDateChanged?: (date: Date) => boolean | void;
+    fetchError?: boolean;
 };
-export declare function ScheduleLayout({ schedule, weeks, handleScheduleClicks, handleDateChanged, }: ScheduleLayoutProps): JSX.Element;
+export declare function ScheduleLayout({ schedule, weeks, handleScheduleClicks, handleDateChanged, fetchError, }: ScheduleLayoutProps): JSX.Element;
 export default ScheduleLayout;

package/dist/components/ScheduleLayout/ScheduleLayout.js

@@ -1,29 +1,30 @@
-import { jsx as t, jsxs as b } from "react/jsx-runtime";
-import { useRef as d, useCallback as S, useEffect as y } from "react";
-import { f as w } from "../../format-YhWt2D8M.mjs";
+import { jsx as t, jsxs as L } from "react/jsx-runtime";
+import { useRef as d, useCallback as w, useEffect as v } from "react";
+import { f as b } from "../../format-YhWt2D8M.mjs";
 import { l as c } from "../../logger-C0N7U0YY.mjs";
-import { classes as L } from "../../utils/helpers.js";
-import { ScheduleProvider as E } from "./ScheduleContext.js";
-import { useScheduleContext as T } from "./useScheduleContext.js";
-import { DateNavigation as k } from "../DateNavigation/DateNavigation.js";
-import { ScheduleList as q } from "../ScheduleList/ScheduleList.js";
+import { classes as E } from "../../utils/helpers.js";
+import { ScheduleProvider as T } from "./ScheduleContext.js";
+import { useScheduleContext as k } from "./useScheduleContext.js";
+import { DateNavigation as q } from "../DateNavigation/DateNavigation.js";
+import { ScheduleList as x } from "../ScheduleList/ScheduleList.js";
 c.setComponent("ScheduleLayout");
-import '../../assets/ScheduleLayout.css';function x({
-  handleScheduleClicks: f = () => !0
+import '../../assets/ScheduleLayout.css';function C({
+  handleScheduleClicks: f = () => !0,
+  fetchError: p = !1
 }) {
-  const { currentDate: n } = T(), r = d(null), p = d(0), i = d(null), s = d(null), l = d(null), a = S((u) => {
+  const { currentDate: n } = k(), r = d(null), m = d(0), i = d(null), s = d(null), l = d(null), a = w((u) => {
     c.log("Determining pointer position for date: ", u);
     const o = () => {
       let e;
-      const v = document.querySelector(`.date-navigation__day[aria-controls="${w(u, "yyyy-MM-dd")}"]`);
-      if (v && (e = v.parentElement), e && r.current) {
-        const g = e.offsetLeft + e.offsetWidth / 2;
-        p.current = g, r.current.style.setProperty(
+      const g = document.querySelector(`.date-navigation__day[aria-controls="${b(u, "yyyy-MM-dd")}"]`);
+      if (g && (e = g.parentElement), e && r.current) {
+        const S = e.offsetLeft + e.offsetWidth / 2;
+        m.current = S, r.current.style.setProperty(
           "--pointer-position",
-          `${g}px`
+          `${S}px`
         );
       }
-    }, h = () => {
+    }, y = () => {
       c.log("Scrolling schedule list to top"), c.log("Schedule list element: ", s.current), c.log("Sticky wrapper element: ", l.current);
       const e = document.querySelector(".mobile-nav");
       s.current && l.current && (c.log("Mobile nav element: ", e), window.scrollTo({
@@ -34,22 +35,22 @@ import '../../assets/ScheduleLayout.css';function x({
     };
     if (!r.current) {
       const e = setInterval(() => {
-        r.current = document.querySelector(".date-navigation__list"), r.current && (clearInterval(e), s.current = document.querySelector(".schedule-list"), l.current = document.querySelector("sticky-content-wrapper"), o(), h());
+        r.current = document.querySelector(".date-navigation__list"), r.current && (clearInterval(e), s.current = document.querySelector(".schedule-list"), l.current = document.querySelector("sticky-content-wrapper"), o(), y());
       }, 100);
       setTimeout(() => {
         clearInterval(e);
       }, 3e3);
       return;
     }
-    o(), h();
-  }, []), m = S(() => {
+    o(), y();
+  }, []), h = w(() => {
     i.current && clearTimeout(i.current), i.current = window.setTimeout(() => {
       a(n);
     }, 250);
   }, [n, a]);
-  return y(() => (window.addEventListener("resize", m), () => {
-    window.removeEventListener("resize", m), i.current && clearTimeout(i.current);
-  }), [a, m]), y(() => {
+  return v(() => (window.addEventListener("resize", h), () => {
+    window.removeEventListener("resize", h), i.current && clearTimeout(i.current);
+  }), [a, h]), v(() => {
     const u = document.querySelector(".header-divider"), o = document.querySelector("sticky-content-wrapper");
     o && u && new IntersectionObserver(
       ([e]) => {
@@ -60,41 +61,42 @@ import '../../assets/ScheduleLayout.css';function x({
         rootMargin: "-37px"
       }
     ).observe(u);
-  }, []), y(() => {
+  }, []), v(() => {
     a(n);
-  }, [n, a]), /* @__PURE__ */ b("schedule-layout", { children: [
+  }, [n, a]), /* @__PURE__ */ L("schedule-layout", { children: [
     /* @__PURE__ */ t("sticky-content-wrapper", { "data-pinned-state": "unpinned", children: /* @__PURE__ */ t(
       "content-constrainer",
       {
-        class: L([
+        class: E([
           "content-constrainer--no-padding",
           "content-constrainer--no-border",
           "content-constrainer--lead-container",
           "schedule-date-nav-constrainer"
         ]),
-        children: /* @__PURE__ */ t(k, {})
+        children: /* @__PURE__ */ t(q, {})
       }
     ) }),
-    /* @__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: w(n, "yyyy-MM-dd"), role: "tabpanel", children: /* @__PURE__ */ t(q, { 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: b(n, "yyyy-MM-dd"), role: "tabpanel", children: /* @__PURE__ */ t(x, { fetchError: p, handleClicks: f }) }) }) })
   ] });
 }
-function N({
+function O({
   schedule: f = [],
-  weeks: n = [],
-  handleScheduleClicks: r = () => !0,
-  handleDateChanged: p = () => !0
+  weeks: p = [],
+  handleScheduleClicks: n = () => !0,
+  handleDateChanged: r = () => !0,
+  fetchError: m = !1
 }) {
   return /* @__PURE__ */ t(
-    E,
+    T,
     {
-      handleDateChanged: p,
+      handleDateChanged: r,
       schedule: f,
-      weeks: n,
-      children: /* @__PURE__ */ t(x, { handleScheduleClicks: r })
+      weeks: p,
+      children: /* @__PURE__ */ t(C, { fetchError: m, handleScheduleClicks: n })
     }
   );
 }
 export {
-  N as ScheduleLayout,
-  N as default
+  O as ScheduleLayout,
+  O as default
 };

package/dist/components/ScheduleList/ScheduleList.d.ts

@@ -1,6 +1,7 @@
 import { HandleClicksDetails } from '../../types.d.ts';
 type ScheduleListProps = {
     handleClicks?: (details: HandleClicksDetails) => boolean | void;
+    fetchError?: boolean;
 };
-export declare function ScheduleList({ handleClicks, }: ScheduleListProps): JSX.Element;
+export declare function ScheduleList({ handleClicks, fetchError, }: ScheduleListProps): JSX.Element;
 export default ScheduleList;

package/dist/components/ScheduleList/ScheduleList.js

@@ -1,12 +1,12 @@
-import { jsx as t, jsxs as q } from "react/jsx-runtime";
-import { useReducer as S, useState as R, useRef as w, useCallback as A, useEffect as d } from "react";
+import { jsx as a, jsxs as d } from "react/jsx-runtime";
+import { useReducer as u, useState as R, useRef as w, useCallback as A, useEffect as c } from "react";
 import { classes as T, getMinutesFromStr as L } from "../../utils/helpers.js";
-import { useScheduleContext as x } from "../ScheduleLayout/useScheduleContext.js";
-import { Loading as b } from "../Loading/Loading.js";
-import { SportsItem as u } from "./schedule-list-items/SportsItem.js";
-import { SeriesItem as D } from "./schedule-list-items/SeriesItem.js";
-import { MovieItem as M } from "./schedule-list-items/MovieItem.js";
-import '../../assets/ScheduleList.css';const l = {
+import { useScheduleContext as b } from "../ScheduleLayout/useScheduleContext.js";
+import { Loading as x } from "../Loading/Loading.js";
+import { SportsItem as D } from "./schedule-list-items/SportsItem.js";
+import { SeriesItem as M } from "./schedule-list-items/SeriesItem.js";
+import { MovieItem as k } from "./schedule-list-items/MovieItem.js";
+import '../../assets/ScheduleList.css';const f = {
   "schedule-list__item": "_schedule-list__item_wmqq1_1",
   "schedule-list__airdate": "_schedule-list__airdate_wmqq1_14",
   "airdate-formatter__date": "_airdate-formatter__date_wmqq1_22",
@@ -21,11 +21,11 @@ import '../../assets/ScheduleList.css';const l = {
   "date-navigation__date": "_date-navigation__date_wmqq1_113",
   "image-card__content": "_image-card__content_wmqq1_122"
 };
-function c(r) {
+function S(r) {
   return typeof r == "object" && !Array.isArray(r) && "queryStatus" in r && r.queryStatus === "no-results";
 }
-function k(r, a) {
-  switch (a.type) {
+function C(r, p) {
+  switch (p.type) {
     case "START_EXIT":
       return "exiting";
     case "EXIT_COMPLETE":
@@ -38,9 +38,9 @@ function k(r, a) {
       return r;
   }
 }
-const E = (r) => {
-  var a, s, n, p, o, y, f, _, e, i, g;
-  return (a = r.video) != null && a.brightcove_id ? {
+const v = (r) => {
+  var p, t, s, n, e, o, y, g, _, l, i;
+  return (p = r.video) != null && p.brightcove_id ? {
     label: "Watch Preview",
     type: "play-video",
     href: "",
@@ -71,10 +71,10 @@ const E = (r) => {
     //'film',
     position: void 0
     //'inline',
-  } : (((s = r == null ? void 0 : r.content) == null ? void 0 : s.external_link) !== void 0 && ((n = r == null ? void 0 : r.content) == null ? void 0 : n.external_link) !== "" || ((p = r == null ? void 0 : r.content) == null ? void 0 : p.slug) !== void 0 && ((o = r == null ? void 0 : r.content) == null ? void 0 : o.slug) !== "") && !((y = r == null ? void 0 : r.content) != null && y.prevent_detail_page) ? {
+  } : (((t = r == null ? void 0 : r.content) == null ? void 0 : t.external_link) !== void 0 && ((s = r == null ? void 0 : r.content) == null ? void 0 : s.external_link) !== "" || ((n = r == null ? void 0 : r.content) == null ? void 0 : n.slug) !== void 0 && ((e = r == null ? void 0 : r.content) == null ? void 0 : e.slug) !== "") && !((o = r == null ? void 0 : r.content) != null && o.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: (f = r == null ? void 0 : r.content) != null && f.external_link ? "external-link" : "internal-link",
-    href: (_ = r == null ? void 0 : r.content) != null && _.external_link ? (e = r == null ? void 0 : r.content) == null ? void 0 : e.external_link : r.program_class === "Episode" ? `/show/${(i = r == null ? void 0 : r.content) == null ? void 0 : i.slug}` : `/movie/${(g = r == null ? void 0 : r.content) == null ? void 0 : g.slug}`,
+    type: (y = r == null ? void 0 : r.content) != null && y.external_link ? "external-link" : "internal-link",
+    href: (g = r == null ? void 0 : r.content) != null && g.external_link ? (_ = r == null ? void 0 : r.content) == null ? void 0 : _.external_link : r.program_class === "Episode" ? `/show/${(l = r == null ? void 0 : r.content) == null ? void 0 : l.slug}` : `/movie/${(i = r == null ? void 0 : r.content) == null ? void 0 : i.slug}`,
     position: "inline"
   } : {
     label: "",
@@ -83,26 +83,27 @@ const E = (r) => {
     position: void 0
   };
 };
-function j({
-  handleClicks: r = () => !0
+function H({
+  handleClicks: r = () => !0,
+  fetchError: p = !1
 }) {
-  const { schedule: a, isLoading: s } = x(), [n, p] = S(k, "idle"), [o, y] = R(a), f = w(null), _ = w(null), e = A(() => {
-    _.current && (clearTimeout(_.current), _.current = null), n === "exiting" ? p({ type: "EXIT_COMPLETE" }) : n === "entering" && p({ type: "ENTER_COMPLETE" });
+  const { schedule: t, isLoading: s } = b(), [n, e] = u(C, "idle"), [o, y] = R(t), g = w(null), _ = w(null), l = A(() => {
+    _.current && (clearTimeout(_.current), _.current = null), n === "exiting" ? e({ type: "EXIT_COMPLETE" }) : n === "entering" && e({ type: "ENTER_COMPLETE" });
   }, [n]);
-  return d(() => {
-    const i = f.current;
+  return c(() => {
+    const i = g.current;
     if (i)
-      return i.addEventListener("animationend", e), () => {
-        i.removeEventListener("animationend", e);
+      return i.addEventListener("animationend", l), () => {
+        i.removeEventListener("animationend", l);
       };
-  }, [e]), d(() => {
-    s && n === "idle" && p({ type: "START_EXIT" });
-  }, [s, n]), d(() => {
-    const i = c(a) || Array.isArray(a) && a.length >= 0;
-    !s && n === "loading" && i && (y(a), p({ type: "SCHEDULE_LOADED" }));
-  }, [s, n, a]), d(() => () => {
+  }, [l]), c(() => {
+    s && n === "idle" && e({ type: "START_EXIT" });
+  }, [s, n]), c(() => {
+    const i = S(t) || Array.isArray(t) && t.length >= 0;
+    !s && n === "loading" && i && (y(t), e({ type: "SCHEDULE_LOADED" }));
+  }, [s, n, t]), c(() => () => {
     _.current && clearTimeout(_.current);
-  }, []), n === "loading" ? /* @__PURE__ */ t(
+  }, []), n === "loading" ? /* @__PURE__ */ a(
     "div",
     {
       style: {
@@ -111,75 +112,82 @@ function j({
         minHeight: "100dvh",
         paddingTop: "6rem"
       },
-      children: /* @__PURE__ */ t(b, {})
+      children: /* @__PURE__ */ a(x, {})
     }
-  ) : c(o) ? /* @__PURE__ */ q(
+  ) : p ? /* @__PURE__ */ d("div", { className: "schedule-list__no-schedule", children: [
+    /* @__PURE__ */ a("h2", { children: "There was an error loading the schedule for this day." }),
+    /* @__PURE__ */ d("p", { children: [
+      "Please try again later. If this problem persists report it at ",
+      /* @__PURE__ */ a("a", { href: "https://support.iontelevision.com/support/home", children: "our support page" }),
+      "."
+    ] })
+  ] }) : S(o) ? /* @__PURE__ */ d(
     "div",
     {
       className: T([
-        l["schedule-list__no-schedule"],
+        f["schedule-list__no-schedule"],
         "schedule-list__no-schedule"
       ]),
       "data-state": n,
       style: { animationDelay: "500ms" },
       children: [
-        /* @__PURE__ */ t("h2", { children: "There are no shows scheduled for this day." }),
-        /* @__PURE__ */ q("p", { children: [
+        /* @__PURE__ */ a("h2", { children: "There are no shows scheduled for this day." }),
+        /* @__PURE__ */ d("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__ */ a("a", { href: "https://support.iontelevision.com/support/home", children: "our support page" }),
           "."
         ] })
       ]
     }
-  ) : Array.isArray(o) && o.length === 0 ? /* @__PURE__ */ q(
+  ) : Array.isArray(o) && o.length === 0 ? /* @__PURE__ */ d(
     "div",
     {
       className: T([
-        l["schedule-list__no-schedule"],
+        f["schedule-list__no-schedule"],
         "schedule-list__no-schedule"
       ]),
       "data-state": n,
       children: [
-        /* @__PURE__ */ t("h2", { children: "Our programming schedule for today has completed." }),
-        /* @__PURE__ */ t("p", { children: "Our programming will restart at 6am." })
+        /* @__PURE__ */ a("h2", { children: "Our programming schedule for today has completed." }),
+        /* @__PURE__ */ a("p", { children: "Our programming will restart at 6am." })
       ]
     }
-  ) : /* @__PURE__ */ t(
+  ) : /* @__PURE__ */ a(
     "ul",
     {
-      className: `${l["schedule-list"]} schedule-list`,
+      className: `${f["schedule-list"]} schedule-list`,
       "data-state": n,
-      ref: f,
+      ref: g,
       children: Array.isArray(o) && o.map((i) => {
-        const g = L(i.element_length), v = E(i).type === "" ? [g, i.rating] : [g, i.rating, " "];
-        return i.program_class === "Episode" ? /* @__PURE__ */ t(
-          D,
+        const q = L(i.element_length), E = v(i).type === "" ? [q, i.rating] : [q, i.rating, " "];
+        return i.program_class === "Episode" ? /* @__PURE__ */ a(
+          M,
           {
-            determineCTA: E,
+            determineCTA: v,
             handleClicks: r,
             scheduleItem: i,
-            strListArr: v,
-            styles: l
+            strListArr: E,
+            styles: f
           },
           `schedule-list-${i.id}`
-        ) : i.program_class === "Film" || i.program_class === "Movie" || i.program_class === "Special" ? /* @__PURE__ */ t(
-          M,
+        ) : i.program_class === "Film" || i.program_class === "Movie" || i.program_class === "Special" ? /* @__PURE__ */ a(
+          k,
           {
-            determineCTA: E,
+            determineCTA: v,
             handleClicks: r,
             scheduleItem: i,
-            strListArr: v,
-            styles: l
+            strListArr: E,
+            styles: f
           },
           `schedule-list-${i.id}`
-        ) : i.program_class === "Sports" ? /* @__PURE__ */ t(
-          u,
+        ) : i.program_class === "Sports" ? /* @__PURE__ */ a(
+          D,
           {
-            determineCTA: E,
+            determineCTA: v,
             handleClicks: r,
             scheduleItem: i,
-            strListArr: v,
-            styles: l
+            strListArr: E,
+            styles: f
           },
           `schedule-list-${i.id}`
         ) : null;
@@ -188,6 +196,6 @@ function j({
   );
 }
 export {
-  j as ScheduleList,
-  j as default
+  H as ScheduleList,
+  H as default
 };

package/package.json

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