@scrippsproduct/networks-ui-library 1.1.2 → 1.1.3

package/dist/components/ScheduleLayout/ScheduleLayout.js

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

package/package.json

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