@scrippsproduct/networks-ui-library 1.1.0-alpha.1 → 1.1.0-alpha.10

package/dist/components/UpcomingList/UpcomingList.js

@@ -1,57 +1,71 @@
 import { jsx as t, jsxs as c } from "react/jsx-runtime";
-import "react";
-import { getMinutesFromStr as m, classes as r } from "../../utils/helpers.js";
-import { determineIfShowIsOnNow as _ } from "../../utils/date-helpers.js";
-import { Concat as g } from "../Concat/Concat.js";
-import { StringList as u } from "../StringList/StringList.js";
-import { AirDateFormatter as b } from "../AirDateFormatter/AirDateFormatter.js";
-import { ImageCard as h } from "../ImageCard/ImageCard.js";
+import { getMinutesFromStr as _, classes as l } from "../../utils/helpers.js";
+import { determineIfShowIsOnNow as g } from "../../utils/date-helpers.js";
+import { Concat as u } from "../Concat/Concat.js";
+import { StringList as b } from "../StringList/StringList.js";
+import { AirDateFormatter as h } from "../AirDateFormatter/AirDateFormatter.js";
+import { ImageCard as v } from "../ImageCard/ImageCard.js";
 import '../../assets/UpcomingList.css';const e = {
   "upcoming-list": "_upcoming-list_15byb_1",
   "upcoming-list__item": "_upcoming-list__item_15byb_6",
   "upcoming-list__airdate": "_upcoming-list__airdate_15byb_16"
 };
-function T({ list: l, handleClicks: d = () => !0 }) {
-  return /* @__PURE__ */ t("ul", { className: e["upcoming-list"], children: l.length > 0 && l.map((i) => {
-    var a, n, s, p;
-    const o = m(i.title.element_length);
-    return /* @__PURE__ */ c("li", { className: r([e["upcoming-list__item"], "upcoming-list__item"]), children: [
-      /* @__PURE__ */ t("div", { className: r([e["upcoming-list__airdate"], "upcoming-list__airdate"]), children: /* @__PURE__ */ c("div", { className: r([e["upcoming-list__airdate-bg"], "upcoming-list__airdate-bg"]), children: [
-        _(i.airdate, i.title.element_length) && /* @__PURE__ */ t("div", { className: "upcoming-list__on-now", children: "On Now" }),
+function T({
+  list: r,
+  handleClicks: d = () => !0
+}) {
+  return /* @__PURE__ */ t("ul", { className: e["upcoming-list"], children: r.length > 0 && r.map((i) => {
+    var n, a, s, p;
+    const o = _(i.title.element_length), m = {
+      displayInline: !0,
+      clampContentLines: !1,
+      content: /* @__PURE__ */ t(
+        u,
+        {
+          list: [
+            `<div>EP ${i.title.episode_number}: ${i.title.name}</div><div>${i.title.synopsis}</div>`,
+            /* @__PURE__ */ t(
+              b,
+              {
+                list: (a = (n = i.title) == null ? void 0 : n.video) != null && a.brightcove_id ? [o, i.title.rating, "&nbsp;"] : [o, i.title.rating],
+                separatorType: "pipe"
+              }
+            )
+          ]
+        }
+      ),
+      cta: (p = (s = i.title) == null ? void 0 : s.video) != null && p.brightcove_id ? {
+        label: "Watch Episode",
+        type: "play-video",
+        href: "",
+        relatedResourceId: i.title.video.brightcove_id,
+        position: "inline"
+      } : {
+        label: "",
+        type: "",
+        href: ""
+      },
+      handleClicks: d,
+      id: i.id,
+      image: {
+        url: i.title.image.url,
+        altText: "",
+        aspectRatio: 330 / 185
+      },
+      title: ""
+    };
+    return /* @__PURE__ */ c("li", { className: l([e["upcoming-list__item"], "upcoming-list__item"]), children: [
+      /* @__PURE__ */ t("div", { className: l([e["upcoming-list__airdate"], "upcoming-list__airdate"]), children: /* @__PURE__ */ c("div", { className: l([e["upcoming-list__airdate-bg"], "upcoming-list__airdate-bg"]), children: [
+        i.title.element_length && g(i.airdate, i.title.element_length) && /* @__PURE__ */ t("div", { className: "upcoming-list__on-now", children: "On Now" }),
         /* @__PURE__ */ t(
-          b,
+          h,
           {
             airdateStr: i.airdate,
             separatorType: "line-break"
           }
         )
       ] }) }),
-      /* @__PURE__ */ t(
-        h,
-        {
-          id: i.id,
-          image: {
-            url: i.title.image.url,
-            altText: "",
-            aspectRatio: 330 / 185
-          },
-          title: "",
-          content: /* @__PURE__ */ t(g, { list: [
-            `<div>EP ${i.title.episode_number}: ${i.title.name}</div><div>${i.title.synopsis}</div>`,
-            /* @__PURE__ */ t(u, { list: (n = (a = i.title) == null ? void 0 : a.video) != null && n.brightcove_id ? [o, i.title.rating, "&nbsp;"] : [o, i.title.rating], separatorType: "pipe" })
-          ] }),
-          cta: (p = (s = i.title) == null ? void 0 : s.video) != null && p.brightcove_id ? {
-            label: "Watch Episode",
-            type: "play-video",
-            href: "",
-            relatedResourceId: i.title.video.brightcove_id,
-            position: "inline"
-          } : {},
-          clampContentLines: !1,
-          displayInline: !0,
-          handleClicks: d
-        }
-      )
+      /* @__PURE__ */ t(v, { ...m })
     ] }, `upcoming-list-${i.id}`);
   }) });
 }

package/dist/containers/GetFeatruedListContainer.d.ts

@@ -1,17 +1,24 @@
-export default GetFeaturedListContainer;
-declare function GetFeaturedListContainer({ numberOfPrograms, startTime, endTime, type, canUseSameDay, handleClicks, hasSeriesPages, loadingMessage, fallbackImage, getResource, SCHEDULE_ENDPOINT, NETWORK, }: {
-    numberOfPrograms?: number | undefined;
-    startTime?: string | undefined;
-    endTime?: string | undefined;
-    type?: string | undefined;
-    canUseSameDay?: boolean | undefined;
-    handleClicks?: (() => boolean) | undefined;
-    hasSeriesPages?: boolean | undefined;
-    loadingMessage?: string | undefined;
+import { HandleClicksDetails } from '../types';
+type GetFeaturedListContainerProps = {
+    numberOfPrograms?: number;
+    startTime?: string;
+    endTime?: string;
+    type?: 'series' | 'movies' | 'all';
+    canUseSameDay?: boolean;
+    handleClicks?: (details: HandleClicksDetails) => void | boolean;
+    hasSeriesPages?: boolean;
+    loadingMessage?: string;
     fallbackImage?: {
         url: string;
-    } | undefined;
-    getResource?: (() => boolean) | undefined;
-    SCHEDULE_ENDPOINT: any;
-    NETWORK: any;
-}): import("react/jsx-runtime").JSX.Element;
+    };
+    getResource?: (options: {
+        queryKey: [string, {
+            resourceName: string;
+            queryVars: Record<string, unknown>;
+        }];
+    }) => Promise<unknown>;
+    SCHEDULE_ENDPOINT: string;
+    NETWORK: string;
+};
+declare function GetFeaturedListContainer({ numberOfPrograms, startTime, endTime, type, canUseSameDay, handleClicks, hasSeriesPages, loadingMessage, fallbackImage, getResource, SCHEDULE_ENDPOINT, NETWORK, }: GetFeaturedListContainerProps): JSX.Element;
+export default GetFeaturedListContainer;

package/dist/containers/GetFeatruedListContainer.js

@@ -1,27 +1,27 @@
 import { jsxs as x, Fragment as h, jsx as s } from "react/jsx-runtime";
 import { useState as j, useRef as w, useEffect as I } from "react";
-import { getFeaturedList as y } from "../utils/getFeaturedList.js";
-import { getFeaturedListImages as A } from "../utils/getFeaturedListImages.js";
-import { FeaturedList as C } from "../components/FeaturedList/FeaturedList.js";
-import { Loading as E } from "../components/Loading/Loading.js";
-function v({
+import { getFeaturedList as v } from "../utils/getFeaturedList.js";
+import { getFeaturedListImages as y } from "../utils/getFeaturedListImages.js";
+import { FeaturedList as A } from "../components/FeaturedList/FeaturedList.js";
+import { Loading as C } from "../components/Loading/Loading.js";
+function W({
   numberOfPrograms: i = 4,
-  startTime: a = "11:00",
-  endTime: o = "23:00",
+  startTime: o = "11:00",
+  endTime: a = "23:00",
   type: u = "series",
   canUseSameDay: n = !1,
   handleClicks: m = () => !0,
   hasSeriesPages: f = !0,
   loadingMessage: d = "",
   fallbackImage: e = { url: "" },
-  getResource: r = () => !0,
+  getResource: r = () => Promise.resolve({}),
   SCHEDULE_ENDPOINT: l,
   NETWORK: L
 }) {
   const [t, p] = j(null), c = w({
     type: u,
-    startTime: a,
-    endTime: o,
+    startTime: o,
+    endTime: a,
     numberOfPrograms: i,
     canUseSameDay: n,
     SCHEDULE_ENDPOINT: l,
@@ -29,22 +29,22 @@ function v({
   });
   return I(() => {
     t === null && (async () => {
-      const g = await y(c.current), F = await A({ featuredList: g, fallbackImage: e, getResource: r });
+      const g = await v(c.current), F = await y({ featuredList: g, fallbackImage: e, getResource: r });
       p(F);
     })();
   }, [t, e, r]), /* @__PURE__ */ x(h, { children: [
-    t === null && /* @__PURE__ */ s(E, { message: d }),
+    t === null && /* @__PURE__ */ s(C, { message: d }),
     t !== null && /* @__PURE__ */ s(
-      C,
+      A,
       {
-        list: t,
+        handleClicks: m,
         hasSeriesPages: f,
         imageAspectRatio: 0.6775300171526587,
-        handleClicks: m
+        list: t
       }
     )
   ] });
 }
 export {
-  v as default
+  W as default
 };

package/dist/containers/NowPlayingContainer.d.ts

@@ -1,16 +1,18 @@
+import { default as ProgramAirdate } from '../components/ProgramAirdate';
+type NowPlayingContainerProps = {
+    scheduleEndpoint: string;
+    network: string;
+    fallbackImage?: {
+        url: string;
+    };
+    getResource: (options: {
+        queryKey: [string, {
+            resourceName: string;
+            queryVars: Record<string, unknown>;
+        }];
+    }) => Promise<unknown>;
+    showEpisodeNumber?: boolean;
+    ProgramAirdateProps?: React.ComponentProps<typeof ProgramAirdate>;
+};
+export declare function NowPlayingContainer({ scheduleEndpoint, network, fallbackImage, getResource, showEpisodeNumber, ProgramAirdateProps, }: NowPlayingContainerProps): JSX.Element;
 export default NowPlayingContainer;
-declare function NowPlayingContainer({ scheduleEndpoint, network, fallbackImage, getResource, showEpisodeNumber, ProgramAirdateProps }: {
-    scheduleEndpoint: any;
-    network: any;
-    fallbackImage: any;
-    getResource: any;
-    showEpisodeNumber?: boolean | undefined;
-    ProgramAirdateProps?: {
-        brand: string;
-        buttonStyle: string;
-        logoStyle: string;
-        useLogo: boolean;
-        useSeriesColors: boolean;
-        href: string;
-    } | undefined;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/containers/NowPlayingContainer.js

@@ -1,14 +1,14 @@
 import { jsxs as Xe, Fragment as Ye, jsx as i } from "react/jsx-runtime";
-import { useState as Ze, useCallback as ts, useEffect as ke } from "react";
-import { getOnNowProgram as os } from "../utils/getOnNowProgram.js";
+import { useState as Ze, useCallback as os, useEffect as ke } from "react";
+import { getOnNowProgram as ts } from "../utils/getOnNowProgram.js";
 import { ProgramAirdate as as } from "../components/ProgramAirdate/ProgramAirdate.js";
 import { Loading as ms } from "../components/Loading/Loading.js";
 import { ResponsiveImage as cs } from "../components/ResponsiveImage/ResponsiveImage.js";
 import { ErrorHandler as ns } from "../components/ErrorHandler/ErrorHandler.js";
 function Ss({
   scheduleEndpoint: r,
-  network: t,
-  fallbackImage: o,
+  network: o,
+  fallbackImage: t,
   getResource: a,
   showEpisodeNumber: m = !1,
   ProgramAirdateProps: es = {
@@ -17,22 +17,23 @@ function Ss({
     logoStyle: "image",
     useLogo: !1,
     useSeriesColors: !0,
-    href: "/schedule"
+    href: "/schedule",
+    program: {}
   }
 }) {
-  var d, l, p, g, u, x, f, S, h, z, w, y, $, v, P, _, C, b, N, j, A, L, O, T, q, E, F, G, H, U, B, D, I, J, K, M, Q, R, V, W, X, Y, Z, k, ee, se, ie, re, te, oe, ae, me, ce, ne, de, le, pe, ge, ue, xe, fe, Se, he, ze, we, ye, $e, ve, Pe, _e, Ce, be, Ne, je, Ae, Le, Oe, Te, qe, Ee, Fe, Ge, He, Ue, Be, De, Ie, Je, Ke, Me, Qe, Re, Ve;
-  const [e, ss] = Ze(null), [is, rs] = Ze("on-now"), c = document.querySelector(":root"), n = ts(() => {
+  var d, l, p, g, u, x, f, S, h, z, w, y, $, v, P, _, C, b, N, j, A, L, O, T, q, E, F, G, H, U, B, D, I, J, K, M, Q, R, V, W, X, Y, Z, k, ee, se, ie, re, oe, te, ae, me, ce, ne, de, le, pe, ge, ue, xe, fe, Se, he, ze, we, ye, $e, ve, Pe, _e, Ce, be, Ne, je, Ae, Le, Oe, Te, qe, Ee, Fe, Ge, He, Ue, Be, De, Ie, Je, Ke, Me, Qe, Re, Ve;
+  const [e, ss] = Ze(), [is, rs] = Ze("on-now"), c = document.querySelector(":root"), n = os(() => {
     (async () => {
-      const s = await os({
+      const s = await ts({
         scheduleEndpoint: r,
-        network: t,
+        network: o,
         showEpisodeNumber: m,
-        fallbackImage: o,
+        fallbackImage: t,
         getResource: a
       });
       ss(s == null ? void 0 : s.program), rs(s == null ? void 0 : s.type);
     })();
-  }, [r, t, m, o, a]);
+  }, [r, o, m, t, a]);
   return ke(() => n(), [n]), ke(() => {
     var s, We;
     e !== null && c.style.setProperty("--on-now-text-color", ((We = (s = e == null ? void 0 : e.episode) == null ? void 0 : s.series) == null ? void 0 : We.primary_color) || "var(--theme-color-100)");
@@ -40,14 +41,14 @@ function Ss({
     e === void 0 && /* @__PURE__ */ i("div", { style: { gridColumn: "1/span 2" }, children: /* @__PURE__ */ i(
       ns,
       {
-        title: "An error has been encounter.",
-        message: "There has been an error while retrieving our currently airing program."
+        message: "There has been an error while retrieving our currently airing program.",
+        title: "An error has been encounter."
       }
     ) }),
     e === null && /* @__PURE__ */ i(ms, { topOffset: "30%" }),
     e != null && /* @__PURE__ */ Xe(Ye, { children: [
-      /* @__PURE__ */ i(as, { ...es, type: is, program: e }),
-      /* @__PURE__ */ i("div", { className: "program-on-now__image-wrapper", children: ((p = (l = (d = e == null ? void 0 : e.episode) == null ? void 0 : d.series) == null ? void 0 : l.image) == null ? void 0 : p.sizes) === void 0 ? /* @__PURE__ */ i("img", { className: "on-now__series-img", src: (x = (u = (g = e.episode) == null ? void 0 : g.series) == null ? void 0 : u.image) == null ? void 0 : x.url, alt: "" }) : /* @__PURE__ */ i(
+      /* @__PURE__ */ i(as, { ...es, program: e, type: is }),
+      /* @__PURE__ */ i("div", { className: "program-on-now__image-wrapper", children: ((p = (l = (d = e == null ? void 0 : e.episode) == null ? void 0 : d.series) == null ? void 0 : l.image) == null ? void 0 : p.sizes) === void 0 ? /* @__PURE__ */ i("img", { alt: "", className: "on-now__series-img", src: (x = (u = (g = e.episode) == null ? void 0 : g.series) == null ? void 0 : u.image) == null ? void 0 : x.url }) : /* @__PURE__ */ i(
         cs,
         {
           fullSizeUrl: (h = (S = (f = e == null ? void 0 : e.episode) == null ? void 0 : f.series) == null ? void 0 : S.image) == null ? void 0 : h.url,
@@ -62,7 +63,7 @@ function Ss({
             },
             {
               media: "min-width: 960px",
-              srcsets: [`${(k = (Z = (Y = (X = (W = (V = (R = e.episode) == null ? void 0 : R.series) == null ? void 0 : V.image) == null ? void 0 : W.sizes) == null ? void 0 : X[0]) == null ? void 0 : Y.srcSets) == null ? void 0 : Z[1]) == null ? void 0 : k.src}`, `${(ae = (oe = (te = (re = (ie = (se = (ee = e.episode) == null ? void 0 : ee.series) == null ? void 0 : se.image) == null ? void 0 : ie.sizes) == null ? void 0 : re[0]) == null ? void 0 : te.srcSets) == null ? void 0 : oe[3]) == null ? void 0 : ae.src} 2x`]
+              srcsets: [`${(k = (Z = (Y = (X = (W = (V = (R = e.episode) == null ? void 0 : R.series) == null ? void 0 : V.image) == null ? void 0 : W.sizes) == null ? void 0 : X[0]) == null ? void 0 : Y.srcSets) == null ? void 0 : Z[1]) == null ? void 0 : k.src}`, `${(ae = (te = (oe = (re = (ie = (se = (ee = e.episode) == null ? void 0 : ee.series) == null ? void 0 : se.image) == null ? void 0 : ie.sizes) == null ? void 0 : re[0]) == null ? void 0 : oe.srcSets) == null ? void 0 : te[3]) == null ? void 0 : ae.src} 2x`]
             },
             {
               media: "min-width: 600px",
@@ -83,5 +84,6 @@ function Ss({
   ] });
 }
 export {
+  Ss as NowPlayingContainer,
   Ss as default
 };

package/dist/custom-elements.d.js

@@ -0,0 +1 @@
+

package/dist/data-resources/FakeDataResource.d.ts

@@ -1,33 +1,94 @@
-export const platform_resources: Map<{
+import { ChoiceList } from '../types';
+declare const streaming_devices: {
+    metadata: {
+        name: string;
+        slug: string;
+    };
+    items: {
+        id: number;
+        image_url: string;
+        alt_text: string;
+        link: string;
+    }[];
+};
+declare const smart_tvs: {
+    metadata: {
+        name: string;
+        slug: string;
+    };
+    items: {
+        id: number;
+        image_url: string;
+        alt_text: string;
+        link: string;
+    }[];
+};
+declare const audio_platforms: {
+    metadata: {
+        name: string;
+        slug: string;
+    };
+    items: {
+        id: number;
+        image_url: string;
+        alt_text: string;
+        link: string;
+    }[];
+};
+declare const video_platforms: {
+    metadata: {
+        name: string;
+        slug: string;
+    };
+    items: {
+        id: number;
+        image_url: string;
+        alt_text: string;
+        link: string;
+    }[];
+};
+declare const mobile_devices: {
+    metadata: {
+        name: string;
+        slug: string;
+    };
+    items: {
+        id: number;
+        image_url: string;
+        alt_text: string;
+        link: string;
+    }[];
+};
+declare const platform_resources: Map<{
     name: string;
     slug: string;
-} | {
+}, {
     id: number;
     image_url: string;
     alt_text: string;
     link: string;
-}[], any[]>;
-export const platform_resources_video_platforms_first: Map<{
+}[]>;
+declare const platform_resources_video_platforms_first: Map<{
     name: string;
     slug: string;
-} | {
+}, {
     id: number;
     image_url: string;
     alt_text: string;
     link: string;
-}[], any[]>;
-export const small_platform_resouces: Map<{
+}[]>;
+declare const small_platform_resouces: Map<{
     name: string;
     slug: string;
-} | {
+}, {
     id: number;
     image_url: string;
     alt_text: string;
     link: string;
-}[], any[]>;
-export namespace wp_platform_resources {
-    let network: string;
-    let platform: {
+}[]>;
+declare const wp_platform_resources: {
+    network: string;
+    platform: {
         order: number;
         category_title: string;
         logos: {
@@ -37,59 +98,7 @@ export namespace wp_platform_resources {
             alt_text: string;
         }[];
     }[];
-}
-export const streaming_devices: ({
-    name: string;
-    slug: string;
-} | {
-    id: number;
-    image_url: string;
-    alt_text: string;
-    link: string;
-}[])[];
-export const smart_tvs: ({
-    name: string;
-    slug: string;
-} | {
-    id: number;
-    image_url: string;
-    alt_text: string;
-    link: string;
-}[])[];
-export const audio_platforms: ({
-    name: string;
-    slug: string;
-} | {
-    id: number;
-    image_url: string;
-    alt_text: string;
-    link: string;
-}[])[];
-export const video_platforms: ({
-    name: string;
-    slug: string;
-} | {
-    id: number;
-    image_url: string;
-    alt_text: string;
-    link: string;
-}[])[];
-export const mobile_devices: ({
-    name: string;
-    slug: string;
-} | {
-    id: number;
-    image_url: string;
-    alt_text: string;
-    link: string;
-}[])[];
-export const stateOptions: {
-    label: string;
-    value: string;
-}[];
-export const statesForCustomList: {
-    parent_id: null;
-    label: string;
-    value: string;
-    id: number;
-}[];
+};
+declare const stateOptions: ChoiceList;
+declare const statesForCustomList: ChoiceList;
+export { platform_resources, platform_resources_video_platforms_first, small_platform_resouces, wp_platform_resources, streaming_devices, smart_tvs, audio_platforms, video_platforms, mobile_devices, stateOptions, statesForCustomList, };