@scrippsproduct/networks-ui-library 2.0.0-dev.0 → 2.0.1-dev.0

package/dist/components/AdBlock/AdBlock.js

@@ -1,191 +1,194 @@
-import { jsx as a, jsxs as d, Fragment as q } from "react/jsx-runtime";
-import { useRef as c, useCallback as b, useEffect as x } from "react";
-import '../../assets/AdBlock.css';const $ = "_fade_84hvi_1", N = "_slidein_84hvi_1", T = "_slideout_84hvi_1", R = "_scale_84hvi_1", L = "_reveal_84hvi_1", w = "_hide_84hvi_1", u = {
-  "ad-copy__description": "_ad-copy__description_84hvi_254",
-  "ad-copy__link": "_ad-copy__link_84hvi_255",
-  "ad-anchor": "_ad-anchor_84hvi_277",
-  "ad-image": "_ad-image_84hvi_292",
-  "ad-image__text": "_ad-image__text_84hvi_319",
-  "ad-copy": "_ad-copy_84hvi_254",
-  "ad-image--animate": "_ad-image--animate_84hvi_330",
-  "promo-slide-in-left": "_promo-slide-in-left_84hvi_1",
-  "ad-copy--animate": "_ad-copy--animate_84hvi_337",
-  "promo-slide-in-right": "_promo-slide-in-right_84hvi_1",
-  "ad-copy__header": "_ad-copy__header_84hvi_345",
-  fade: $,
-  "fade-in": "_fade-in_84hvi_1",
-  "fade-out": "_fade-out_84hvi_1",
-  "page-fade-in": "_page-fade-in_84hvi_1",
-  "backdrop-reveal": "_backdrop-reveal_84hvi_1",
-  "slide-up": "_slide-up_84hvi_1",
-  slidein: N,
-  slideout: T,
-  "list-item-slide-in": "_list-item-slide-in_84hvi_1",
-  scale: R,
-  reveal: L,
-  "reveal-overlay": "_reveal-overlay_84hvi_1",
-  hide: w,
-  "hide-overlay": "_hide-overlay_84hvi_1",
-  "rotate-full": "_rotate-full_84hvi_1",
-  "ui-spinner-rotate-left": "_ui-spinner-rotate-left_84hvi_1",
-  "ui-spinner-rotate-right": "_ui-spinner-rotate-right_84hvi_1",
-  "clip-path-open": "_clip-path-open_84hvi_1",
-  "clip-path-close": "_clip-path-close_84hvi_1"
-}, M = "_fade_1ongd_1", C = "_slidein_1ongd_1", I = "_slideout_1ongd_1", O = "_scale_1ongd_1", j = "_reveal_1ongd_1", A = "_hide_1ongd_1", D = {
-  "ad-copy__link": "_ad-copy__link_1ongd_263",
-  "ad-anchor": "_ad-anchor_1ongd_282",
-  "ad-image": "_ad-image_1ongd_307",
-  "ad-image__text": "_ad-image__text_1ongd_324",
-  "ad-copy": "_ad-copy_1ongd_263",
-  "ad-image--animate": "_ad-image--animate_1ongd_343",
-  "promo-slide-in-left": "_promo-slide-in-left_1ongd_1",
-  "ad-copy--animate": "_ad-copy--animate_1ongd_350",
-  "promo-slide-in-right": "_promo-slide-in-right_1ongd_1",
-  "ad-copy__header": "_ad-copy__header_1ongd_358",
-  "ad-copy__description": "_ad-copy__description_1ongd_370",
-  "ad-copy__link-text": "_ad-copy__link-text_1ongd_371",
-  fade: M,
-  "fade-in": "_fade-in_1ongd_1",
-  "fade-out": "_fade-out_1ongd_1",
-  "page-fade-in": "_page-fade-in_1ongd_1",
-  "backdrop-reveal": "_backdrop-reveal_1ongd_1",
-  "slide-up": "_slide-up_1ongd_1",
-  slidein: C,
-  slideout: I,
-  "list-item-slide-in": "_list-item-slide-in_1ongd_1",
-  scale: O,
-  reveal: j,
-  "reveal-overlay": "_reveal-overlay_1ongd_1",
-  hide: A,
-  "hide-overlay": "_hide-overlay_1ongd_1",
-  "rotate-full": "_rotate-full_1ongd_1",
-  "ui-spinner-rotate-left": "_ui-spinner-rotate-left_1ongd_1",
-  "ui-spinner-rotate-right": "_ui-spinner-rotate-right_1ongd_1",
-  "clip-path-open": "_clip-path-open_1ongd_1",
-  "clip-path-close": "_clip-path-close_1ongd_1"
-}, E = "_fade_qmk1m_1", B = "_slidein_qmk1m_1", F = "_slideout_qmk1m_1", P = "_scale_qmk1m_1", z = "_reveal_qmk1m_1", G = "_hide_qmk1m_1", H = {
-  "ad-anchor": "_ad-anchor_qmk1m_272",
-  "ad-copy__link": "_ad-copy__link_qmk1m_283",
-  "background-container": "_background-container_qmk1m_287",
-  "ad-copy": "_ad-copy_qmk1m_283",
-  "ad-copy__header": "_ad-copy__header_qmk1m_303",
-  "ad-copy__description": "_ad-copy__description_qmk1m_313",
-  "cta-container": "_cta-container_qmk1m_324",
-  "cta-container__link": "_cta-container__link_qmk1m_335",
-  "ad-image": "_ad-image_qmk1m_354",
-  "ad-image__text": "_ad-image__text_qmk1m_373",
-  "ad-image-mobile": "_ad-image-mobile_qmk1m_383",
-  "ad-image--animate": "_ad-image--animate_qmk1m_484",
-  "promo-slide-in-right": "_promo-slide-in-right_qmk1m_1",
-  "ad-copy--animate": "_ad-copy--animate_qmk1m_491",
-  "promo-slide-in-left": "_promo-slide-in-left_qmk1m_1",
-  "ad-cta--animate": "_ad-cta--animate_qmk1m_498",
-  "ad-mobile-disclaimer--animate": "_ad-mobile-disclaimer--animate_qmk1m_512",
-  fade: E,
-  "fade-in": "_fade-in_qmk1m_1",
-  "fade-out": "_fade-out_qmk1m_1",
-  "page-fade-in": "_page-fade-in_qmk1m_1",
-  "backdrop-reveal": "_backdrop-reveal_qmk1m_1",
-  "slide-up": "_slide-up_qmk1m_1",
-  slidein: B,
-  slideout: F,
-  "list-item-slide-in": "_list-item-slide-in_qmk1m_1",
-  scale: P,
-  reveal: z,
-  "reveal-overlay": "_reveal-overlay_qmk1m_1",
+import { jsx as a, jsxs as l, Fragment as z } from "react/jsx-runtime";
+import { useRef as d, useCallback as b, useEffect as q } from "react";
+import '../../assets/AdBlock.css';const x = "_fade_44sh7_1", $ = "_slidein_44sh7_1", N = "_slideout_44sh7_1", T = "_scale_44sh7_1", R = "_reveal_44sh7_1", L = "_hide_44sh7_1", g = {
+  "ad-copy__description": "_ad-copy__description_44sh7_264",
+  "ad-copy__link": "_ad-copy__link_44sh7_265",
+  "ad-anchor": "_ad-anchor_44sh7_287",
+  "ad-image": "_ad-image_44sh7_302",
+  "ad-image__text": "_ad-image__text_44sh7_329",
+  "ad-copy": "_ad-copy_44sh7_264",
+  "ad-image--animate": "_ad-image--animate_44sh7_340",
+  "promo-slide-in-left": "_promo-slide-in-left_44sh7_1",
+  "ad-copy--animate": "_ad-copy--animate_44sh7_347",
+  "promo-slide-in-right": "_promo-slide-in-right_44sh7_1",
+  "ad-copy__header": "_ad-copy__header_44sh7_355",
+  fade: x,
+  "dim-fade": "_dim-fade_44sh7_1",
+  "fade-in": "_fade-in_44sh7_1",
+  "fade-out": "_fade-out_44sh7_1",
+  "page-fade-in": "_page-fade-in_44sh7_1",
+  "backdrop-reveal": "_backdrop-reveal_44sh7_1",
+  "slide-up": "_slide-up_44sh7_1",
+  slidein: $,
+  slideout: N,
+  "list-item-slide-in": "_list-item-slide-in_44sh7_1",
+  scale: T,
+  reveal: R,
+  "reveal-overlay": "_reveal-overlay_44sh7_1",
+  hide: L,
+  "hide-overlay": "_hide-overlay_44sh7_1",
+  "rotate-full": "_rotate-full_44sh7_1",
+  "ui-spinner-rotate-left": "_ui-spinner-rotate-left_44sh7_1",
+  "ui-spinner-rotate-right": "_ui-spinner-rotate-right_44sh7_1",
+  "clip-path-open": "_clip-path-open_44sh7_1",
+  "clip-path-close": "_clip-path-close_44sh7_1"
+}, w = "_fade_26q8p_1", M = "_slidein_26q8p_1", C = "_slideout_26q8p_1", I = "_scale_26q8p_1", O = "_reveal_26q8p_1", j = "_hide_26q8p_1", A = {
+  "ad-copy__link": "_ad-copy__link_26q8p_273",
+  "ad-anchor": "_ad-anchor_26q8p_292",
+  "ad-image": "_ad-image_26q8p_317",
+  "ad-image__text": "_ad-image__text_26q8p_334",
+  "ad-copy": "_ad-copy_26q8p_273",
+  "ad-image--animate": "_ad-image--animate_26q8p_353",
+  "promo-slide-in-left": "_promo-slide-in-left_26q8p_1",
+  "ad-copy--animate": "_ad-copy--animate_26q8p_360",
+  "promo-slide-in-right": "_promo-slide-in-right_26q8p_1",
+  "ad-copy__header": "_ad-copy__header_26q8p_368",
+  "ad-copy__description": "_ad-copy__description_26q8p_380",
+  "ad-copy__link-text": "_ad-copy__link-text_26q8p_381",
+  fade: w,
+  "dim-fade": "_dim-fade_26q8p_1",
+  "fade-in": "_fade-in_26q8p_1",
+  "fade-out": "_fade-out_26q8p_1",
+  "page-fade-in": "_page-fade-in_26q8p_1",
+  "backdrop-reveal": "_backdrop-reveal_26q8p_1",
+  "slide-up": "_slide-up_26q8p_1",
+  slidein: M,
+  slideout: C,
+  "list-item-slide-in": "_list-item-slide-in_26q8p_1",
+  scale: I,
+  reveal: O,
+  "reveal-overlay": "_reveal-overlay_26q8p_1",
+  hide: j,
+  "hide-overlay": "_hide-overlay_26q8p_1",
+  "rotate-full": "_rotate-full_26q8p_1",
+  "ui-spinner-rotate-left": "_ui-spinner-rotate-left_26q8p_1",
+  "ui-spinner-rotate-right": "_ui-spinner-rotate-right_26q8p_1",
+  "clip-path-open": "_clip-path-open_26q8p_1",
+  "clip-path-close": "_clip-path-close_26q8p_1"
+}, D = "_fade_zs25c_1", E = "_slidein_zs25c_1", B = "_slideout_zs25c_1", F = "_scale_zs25c_1", P = "_reveal_zs25c_1", G = "_hide_zs25c_1", H = {
+  "ad-anchor": "_ad-anchor_zs25c_282",
+  "ad-copy__link": "_ad-copy__link_zs25c_293",
+  "background-container": "_background-container_zs25c_297",
+  "ad-copy": "_ad-copy_zs25c_293",
+  "ad-copy__header": "_ad-copy__header_zs25c_313",
+  "ad-copy__description": "_ad-copy__description_zs25c_323",
+  "cta-container": "_cta-container_zs25c_334",
+  "cta-container__link": "_cta-container__link_zs25c_345",
+  "ad-image": "_ad-image_zs25c_364",
+  "ad-image__text": "_ad-image__text_zs25c_383",
+  "ad-image-mobile": "_ad-image-mobile_zs25c_393",
+  "ad-image--animate": "_ad-image--animate_zs25c_494",
+  "promo-slide-in-right": "_promo-slide-in-right_zs25c_1",
+  "ad-copy--animate": "_ad-copy--animate_zs25c_501",
+  "promo-slide-in-left": "_promo-slide-in-left_zs25c_1",
+  "ad-cta--animate": "_ad-cta--animate_zs25c_508",
+  "ad-mobile-disclaimer--animate": "_ad-mobile-disclaimer--animate_zs25c_522",
+  fade: D,
+  "dim-fade": "_dim-fade_zs25c_1",
+  "fade-in": "_fade-in_zs25c_1",
+  "fade-out": "_fade-out_zs25c_1",
+  "page-fade-in": "_page-fade-in_zs25c_1",
+  "backdrop-reveal": "_backdrop-reveal_zs25c_1",
+  "slide-up": "_slide-up_zs25c_1",
+  slidein: E,
+  slideout: B,
+  "list-item-slide-in": "_list-item-slide-in_zs25c_1",
+  scale: F,
+  reveal: P,
+  "reveal-overlay": "_reveal-overlay_zs25c_1",
   hide: G,
-  "hide-overlay": "_hide-overlay_qmk1m_1",
-  "rotate-full": "_rotate-full_qmk1m_1",
-  "ui-spinner-rotate-left": "_ui-spinner-rotate-left_qmk1m_1",
-  "ui-spinner-rotate-right": "_ui-spinner-rotate-right_qmk1m_1",
-  "clip-path-open": "_clip-path-open_qmk1m_1",
-  "clip-path-close": "_clip-path-close_qmk1m_1"
+  "hide-overlay": "_hide-overlay_zs25c_1",
+  "rotate-full": "_rotate-full_zs25c_1",
+  "ui-spinner-rotate-left": "_ui-spinner-rotate-left_zs25c_1",
+  "ui-spinner-rotate-right": "_ui-spinner-rotate-right_zs25c_1",
+  "clip-path-open": "_clip-path-open_zs25c_1",
+  "clip-path-close": "_clip-path-close_zs25c_1"
 }, J = {
   "ad-anchor": "_ad-anchor_1kpgs_1",
   "cta-container__link": "_cta-container__link_1kpgs_11"
 };
-function U({ image: i, ad: _, theme: t = "default" }) {
+function U({ image: i, ad: _, theme: r = "default" }) {
   const e = (/* @__PURE__ */ new Map([
-    ["default", u],
-    ["round2", D],
+    ["default", g],
+    ["round2", A],
     ["tablotv", H],
     ["imageonly", J]
-  ])).get(t) ?? u, k = _.campaign === "" ? "" : `?utm_campaign=${_.campaign}&utm_source=${_.source}&utm_medium=${_.medium}&utm_content=${_.content}`, s = c(null), r = c(null), o = c(null), m = c(null), h = c(null), p = c(null), l = `${_.href}${k}`, g = b((n, v) => {
-    n.forEach((y) => {
-      var f;
-      if (y.isIntersecting) {
-        if (t === "tablotv" && (o.current !== null && ((f = o.current) == null || f.classList.add(`${e["ad-cta--animate"]}`)), p.current !== null && p.current.classList.add(`${e["ad-mobile-disclaimer--animate"]}`)), s.current === null || r.current === null) return;
-        s.current.classList.add(`${e["ad-copy--animate"]}`), r.current.classList.add(`${e["ad-image--animate"]}`), v.unobserve(r.current);
+  ])).get(r) ?? g, y = _.campaign === "" ? "" : `?utm_campaign=${_.campaign}&utm_source=${_.source}&utm_medium=${_.medium}&utm_content=${_.content}`, o = d(null), n = d(null), c = d(null), p = d(null), m = d(null), h = d(null), s = `${_.href}${y}`, f = b((t, v) => {
+    t.forEach((k) => {
+      var u;
+      if (k.isIntersecting) {
+        if (r === "tablotv" && (c.current !== null && ((u = c.current) == null || u.classList.add(`${e["ad-cta--animate"]}`)), h.current !== null && h.current.classList.add(`${e["ad-mobile-disclaimer--animate"]}`)), o.current === null || n.current === null) return;
+        o.current.classList.add(`${e["ad-copy--animate"]}`), n.current.classList.add(`${e["ad-image--animate"]}`), v.unobserve(n.current);
       }
     });
-  }, [e, t]);
-  return x(() => {
-    if (t !== "imageonly") {
-      const n = new IntersectionObserver(g, {
+  }, [e, r]);
+  return q(() => {
+    if (r !== "imageonly") {
+      const t = new IntersectionObserver(f, {
         root: null,
         rootMargin: "0px",
         threshold: 0.1
       });
-      return n.observe(r.current), () => {
-        n.disconnect();
+      return t.observe(n.current), () => {
+        t.disconnect();
       };
     }
-  }, [t, g]), // onClick - ensure tab isn't opened twice if clicking directly on the cta
+  }, [r, f]), // onClick - ensure tab isn't opened twice if clicking directly on the cta
   /* @__PURE__ */ a(
     "ad-block",
     {
       class: `${e["ad-anchor"]}`,
-      onClick: (n) => {
-        (n.target === o.current || n.target === m.current || n.target === h.current) && n.preventDefault(), window.open(o.current, "_blank");
+      onClick: (t) => {
+        (t.target === c.current || t.target === p.current || t.target === m.current) && t.preventDefault(), window.open(c.current, "_blank");
       },
-      children: t === "imageonly" ? /* @__PURE__ */ a(
+      children: r === "imageonly" ? /* @__PURE__ */ a(
         "a",
         {
           className: e["cta-container__link"],
-          href: l,
-          ref: o,
+          href: s,
+          ref: c,
           rel: "noreferrer",
           target: "_blank",
           children: /* @__PURE__ */ a("span", { className: "sr-only", children: i.text })
         }
-      ) : t === "tablotv" ? /* @__PURE__ */ d("div", { className: e["background-container"], children: [
-        /* @__PURE__ */ d("div", { className: e["ad-copy"], ref: s, children: [
+      ) : r === "tablotv" ? /* @__PURE__ */ l("div", { className: e["background-container"], children: [
+        /* @__PURE__ */ l("div", { className: e["ad-copy"], ref: o, children: [
           /* @__PURE__ */ a("h4", { className: e["ad-copy__header"], children: _.header }),
-          /* @__PURE__ */ a("div", { className: e["ad-image-mobile"], ref: r, children: /* @__PURE__ */ a("ad-image", { children: /* @__PURE__ */ a("a", { href: l, rel: "noreferrer", target: "_blank", children: /* @__PURE__ */ a("img", { alt: i.altText, ref: h, src: i.mobile }) }) }) }),
+          /* @__PURE__ */ a("div", { className: e["ad-image-mobile"], ref: n, children: /* @__PURE__ */ a("ad-image", { children: /* @__PURE__ */ a("a", { href: s, rel: "noreferrer", target: "_blank", children: /* @__PURE__ */ a("img", { alt: i.altText, ref: m, src: i.mobile }) }) }) }),
           /* @__PURE__ */ a("p", { className: e["ad-copy__description"], children: _.description })
         ] }),
-        /* @__PURE__ */ d("div", { className: e["cta-container"], children: [
+        /* @__PURE__ */ l("div", { className: e["cta-container"], children: [
           /* @__PURE__ */ a(
             "a",
             {
               className: e["cta-container__link"],
-              href: l,
-              ref: o,
+              href: s,
+              ref: c,
               rel: "noreferrer",
               target: "_blank",
               children: _.linkText
             }
           ),
-          /* @__PURE__ */ a("span", { className: e["ad-image__text"], ref: p, children: i.text })
+          /* @__PURE__ */ a("span", { className: e["ad-image__text"], ref: h, children: i.text })
         ] }),
-        /* @__PURE__ */ d("div", { className: e["ad-image"], ref: r, children: [
-          /* @__PURE__ */ a("ad-image", { children: /* @__PURE__ */ a("a", { href: l, rel: "noreferrer", target: "_blank", children: /* @__PURE__ */ a("img", { alt: i.altText, ref: m, src: i.url }) }) }),
+        /* @__PURE__ */ l("div", { className: e["ad-image"], ref: n, children: [
+          /* @__PURE__ */ a("ad-image", { children: /* @__PURE__ */ a("a", { href: s, rel: "noreferrer", target: "_blank", children: /* @__PURE__ */ a("img", { alt: i.altText, ref: p, src: i.url }) }) }),
           /* @__PURE__ */ a("span", { className: e["ad-image__text"], children: i.text })
         ] })
-      ] }) : /* @__PURE__ */ d(q, { children: [
-        /* @__PURE__ */ d("div", { className: e["ad-image"], ref: r, children: [
+      ] }) : /* @__PURE__ */ l(z, { children: [
+        /* @__PURE__ */ l("div", { className: e["ad-image"], ref: n, children: [
           /* @__PURE__ */ a("span", { className: e["ad-image__text"], children: i.text }),
-          /* @__PURE__ */ a("ad-image", { children: /* @__PURE__ */ a("a", { href: l, rel: "noreferrer", target: "_blank", children: /* @__PURE__ */ a("img", { alt: i.altText, ref: m, src: i.url }) }) })
+          /* @__PURE__ */ a("ad-image", { children: /* @__PURE__ */ a("a", { href: s, rel: "noreferrer", target: "_blank", children: /* @__PURE__ */ a("img", { alt: i.altText, ref: p, src: i.url }) }) })
         ] }),
-        /* @__PURE__ */ d("div", { className: e["ad-copy"], ref: s, children: [
+        /* @__PURE__ */ l("div", { className: e["ad-copy"], ref: o, children: [
           /* @__PURE__ */ a("h4", { className: e["ad-copy__header"], children: _.header }),
           /* @__PURE__ */ a("p", { className: e["ad-copy__description"], children: _.description }),
           /* @__PURE__ */ a(
             "a",
             {
               className: e["ad-copy__link"],
-              href: l,
-              ref: o,
+              href: s,
+              ref: c,
               rel: "noreferrer",
               target: "_blank",
               children: _.linkText

package/dist/components/BasicGridModule/BasicGridModule.js

@@ -1,68 +1,88 @@
-import { jsxs as p, Fragment as j, jsx as u } from "react/jsx-runtime";
-import { useState as a, useRef as y, useCallback as F, useEffect as b, createElement as O } from "react";
-import { classes as _ } from "../../utils/helpers.js";
-import { blockLayoutsMap as q } from "../../settings.js";
-import { EqualSizeGrid as z } from "../EqualSizeGrid/EqualSizeGrid.js";
-import { InfoPanel as A } from "../InfoPanel/InfoPanel.js";
-import '../../assets/BasicGridModule.css';function Q({
-  gap: L = "1.5rem",
-  itemsPerRow: k = 4,
-  classname: E = "",
-  title: d = "",
-  itemComponent: s = {
+import { jsxs as f, Fragment as T, jsx as o } from "react/jsx-runtime";
+import { useReducer as _, useState as I, useRef as M, useEffect as O, createElement as S } from "react";
+import { classes as x } from "../../utils/helpers.js";
+import { blockLayoutsMap as v } from "../../settings.js";
+import { EqualSizeGrid as P } from "../EqualSizeGrid/EqualSizeGrid.js";
+import { InfoPanel as B } from "../InfoPanel/InfoPanel.js";
+import '../../assets/BasicGridModule.css';function w(e, i) {
+  switch (i.type) {
+    case "OPEN_REQUEST":
+      return e.phase !== "idle" ? e : { phase: "exiting", activeContent: i.content };
+    case "EXIT_COMPLETE":
+      return e.phase !== "exiting" ? e : { ...e, phase: "open" };
+    case "CLOSE_PANEL":
+      return e.phase !== "open" ? e : { ...e, phase: "entering" };
+    case "ENTER_COMPLETE":
+      return e.phase !== "entering" ? e : { ...e, phase: "idle" };
+    default:
+      return e;
+  }
+}
+function q({
+  gap: e = "1.5rem",
+  itemsPerRow: i = 4,
+  classname: h = "",
+  title: u = "",
+  itemComponent: c = {
     layout: "ImageCard",
     props: {
       fullCardClickable: !1
     }
   },
-  infoPanelComponent: n = {
+  infoPanelComponent: a = {
     layout: "",
     backButtonLabel: "Return to List",
     resourceList: [],
     classname: ""
   },
-  items: v = [],
-  customClicksHandler: I = null,
-  noAnimation: x = !1
+  items: m = [],
+  customClicksHandler: g = null,
+  noAnimation: d = !1
 }) {
-  const [i, f] = a(!1), [C, R] = a({}), [m, B] = a(void 0), [M, c] = a("entering"), [N, G] = a(x ? null : !0), o = y("entering"), e = y(null), r = F(() => {
-    e.current !== null && e.current.children[0].addEventListener("animationstart", () => {
-      e.current !== null && e.current.children[0].addEventListener("animationend", r, { once: !0 });
-    }), o.current === "exiting" ? (c("entering"), o.current = "entering", f(!0)) : c("idle");
-  }, []), S = (t) => {
-    t.type === "info-panel" && (R(n.resourceList.find((l) => Number.parseInt(l.id, 10) === Number.parseInt(t.resourceId, 10)) ?? {}), G(!1), o.current = "exiting", c("exiting"));
-  };
-  return b(() => {
-    B(q.get(s.layout));
-  }, [s.layout]), b(() => {
-    var l, h;
-    const t = e.current;
-    return !i && e.current !== null && e.current.children.length && ((l = e.current.children[0]) == null || l.removeEventListener("animationend", r), (h = e.current.children[0]) == null || h.addEventListener("animationend", r, { once: !0 })), () => {
-      var g;
-      t !== null && t.children.length && ((g = t.children[0]) == null || g.removeEventListener("animationend", r));
+  const [{ phase: r, activeContent: y }, l] = _(w, {
+    phase: d ? "idle" : "entering",
+    activeContent: {}
+  }), p = v.get(c.layout), [L, C] = I(d ? null : "true"), E = M(null);
+  O(() => {
+    const t = E.current;
+    if (t === null) return;
+    const n = t.lastElementChild;
+    if (n === null || r !== "exiting" && r !== "entering") return;
+    const s = (R) => {
+      R.target === n && l({ type: r === "exiting" ? "EXIT_COMPLETE" : "ENTER_COMPLETE" });
     };
-  }, [i, r]), /* @__PURE__ */ p(j, { children: [
-    !i && /* @__PURE__ */ p(
+    return n.addEventListener("animationend", s), () => n.removeEventListener("animationend", s);
+  }, [r]);
+  const b = (t) => {
+    if (t.type === "info-panel") {
+      const n = a.resourceList.find(
+        (s) => Number.parseInt(s.id, 10) === Number.parseInt(t.resourceId, 10)
+      ) ?? {};
+      C("false"), l({ type: "OPEN_REQUEST", content: n });
+    }
+  }, k = r !== "open", N = r === "open";
+  return /* @__PURE__ */ f(T, { children: [
+    k && /* @__PURE__ */ f(
       "basic-grid-module",
       {
-        "data-state": M,
-        "first-entry": N,
-        ref: e,
+        "data-state": r === "open" ? "idle" : r,
+        "first-entry": L,
+        ref: E,
         children: [
-          d !== "" && /* @__PURE__ */ u("h2", { className: _(["basic-grid-module__header", "h4"]), children: d }),
-          m !== void 0 && /* @__PURE__ */ u(
-            z,
+          u !== "" && /* @__PURE__ */ o("h2", { className: x(["basic-grid-module__header", "h4"]), children: u }),
+          p !== void 0 && /* @__PURE__ */ o(
+            P,
             {
-              classname: E,
-              gap: L,
-              itemsPerRow: k,
-              children: v.map(
-                (t) => /* @__PURE__ */ O(
-                  m,
+              classname: h,
+              gap: e,
+              itemsPerRow: i,
+              children: m.map(
+                (t) => /* @__PURE__ */ S(
+                  p,
                   {
                     ...t,
-                    ...s.props,
-                    handleClicks: I ?? S,
+                    ...c.props,
+                    handleClicks: g ?? b,
                     key: `grid-item-${Math.round(Math.random() * 1e7)}`,
                     relatedResourceId: t.id
                   }
@@ -73,26 +93,26 @@ import '../../assets/BasicGridModule.css';function Q({
         ]
       }
     ),
-    i && n.layout && /* @__PURE__ */ u(
-      A,
+    N && a.layout && /* @__PURE__ */ o(
+      B,
       {
-        backButtonLabel: n.backButtonLabel,
+        backButtonLabel: a.backButtonLabel,
         className: "grid-info-panel",
-        classname: n.classname,
+        classname: a.classname,
         layoutComponent: {
-          layout: n.layout,
+          layout: a.layout,
           props: {
-            ...C
+            ...y
           }
         },
         onBackClicked: () => {
-          f(!1);
+          l({ type: "CLOSE_PANEL" });
         }
       }
     )
   ] });
 }
 export {
-  Q as BasicGridModule,
-  Q as default
+  q as BasicGridModule,
+  q as default
 };