@scrippsproduct/networks-ui-library 1.1.0-alpha.0 → 1.1.0-alpha.2

package/dist/components/DateNavigation/DateNavigation.js

@@ -1,115 +1,158 @@
-import { jsxs as d, jsx as n } from "react/jsx-runtime";
-import D, { useState as _, useRef as h, useEffect as f } from "react";
-import { f as y } from "../../format-YhWt2D8M.mjs";
-import { classes as W } from "../../utils/helpers.js";
-import { C as L } from "../../chevron-left-DRvpaLmK.mjs";
-import { C as E } from "../../chevron-right-C8yCnmfx.mjs";
-import '../../assets/DateNavigation.css';const e = {
-  "date-navigation__list": "_date-navigation__list_18gb9_5",
-  "date-navigation__control": "_date-navigation__control_18gb9_42",
-  "date-navigation__control--previous": "_date-navigation__control--previous_18gb9_69",
-  "date-navigation__control--next": "_date-navigation__control--next_18gb9_74",
-  "date-navigation__day": "_date-navigation__day_18gb9_94",
-  "date-navigation__month-day-break": "_date-navigation__month-day-break_18gb9_100"
+import { jsxs as _, jsx as e } from "react/jsx-runtime";
+import { useState as g, useReducer as M, useRef as m, useCallback as S, useEffect as p } from "react";
+import { f as l } from "../../format-YhWt2D8M.mjs";
+import { classes as o } from "../../utils/helpers.js";
+import { useScheduleContext as W } from "../ScheduleLayout/useScheduleContext.js";
+import { C as j } from "../../chevron-left-DRvpaLmK.mjs";
+import { C as w } from "../../chevron-right-C8yCnmfx.mjs";
+import '../../assets/DateNavigation.css';const n = {
+  "date-navigation__list": "_date-navigation__list_1gjz5_1",
+  "date-navigation__control": "_date-navigation__control_1gjz5_72",
+  "date-navigation__control--previous": "_date-navigation__control--previous_1gjz5_103",
+  "date-navigation__control--next": "_date-navigation__control--next_1gjz5_108",
+  "date-navigation__item": "_date-navigation__item_1gjz5_119",
+  "date-navigation__day": "_date-navigation__day_1gjz5_134",
+  "date-navigation__month-day-break": "_date-navigation__month-day-break_1gjz5_140",
+  "date-navigation__weekday": "_date-navigation__weekday_1gjz5_153",
+  "date-navigation__date": "_date-navigation__date_1gjz5_156"
 };
-function $({ weeks: a = [[], []], handleDateChanged: s = () => !0 }) {
-  const [i, b] = _(0), [p, k] = _(a[0]), [x, u] = _(a[0][0]), [N, v] = _("entering"), o = h(null), r = h(0), g = (t) => {
-    b(t), v(() => t ? "exiting" : "entering");
-  }, C = (t) => {
-    u(t), s(t.date);
-  }, S = (t) => {
-    (t.key === "ArrowRight" || t.key === "ArrowDown") && r.current < 6 && ++r.current, (t.key === "ArrowLeft" || t.key === "ArrowUp") && r.current > 0 && --r.current, t.currentTarget.children[r.current].children[0].focus();
-  }, l = D.useCallback(() => {
-    o.current.addEventListener("animationstart", () => {
-      o.current.addEventListener("animationend", l, { once: !0 });
-    }), v("idle");
+function z(a, i) {
+  switch (i.type) {
+    case "NAVIGATE_TO_WEEK":
+      return i.targetWeekIndex > i.currentWeekIndex ? "advancing" : i.targetWeekIndex < i.currentWeekIndex ? "retracting" : a;
+    case "ANIMATION_COMPLETE":
+      return "idle";
+    default:
+      return a;
+  }
+}
+function P() {
+  const { weeks: a, setCurrentDate: i } = W(), [r, x] = g(0), [b, C] = g(a[0]), [s, y] = g(a[0][0]), [N, h] = M(z, "idle"), d = m(null), D = m(0), f = m(l(new Date(s.fullDateStr), "yyyy-MM-dd")), k = (t) => {
+    h({ type: "NAVIGATE_TO_WEEK", currentWeekIndex: r, targetWeekIndex: t }), x(t);
+  }, E = (t) => {
+    l(t.date, "yyyy-MM-dd") !== f.current && (f.current = l(t.date, "yyyy-MM-dd"), y(t), i(t.date));
+  }, c = S(() => {
+    if (d.current === null) return;
+    const t = d.current;
+    t.addEventListener("animationstart", () => {
+      t.addEventListener("animationend", c, { once: !0 });
+    }), h({ type: "ANIMATION_COMPLETE" });
   }, []);
-  return f(() => {
-    o.current !== null && (o.current.removeEventListener("animationend", l, { once: !0 }), o.current.addEventListener("animationend", l, { once: !0 }));
-  }, [l]), f(() => {
-    k(a[i]), u((t) => {
-      var m;
-      const c = a[i ? 0 : 1].findIndex((j) => y(j.date, "yyyy-MM-dd") === y(t.date, "yyyy-MM-dd"));
-      return c === -1 ? t : (s((m = a[i][c]) == null ? void 0 : m.date), r.current = c, a[i][c]);
-    });
-  }, [i, a, s]), /* @__PURE__ */ d("date-navigation", { "data-state": N, children: [
-    /* @__PURE__ */ d("date-navigation-controls", { children: [
-      /* @__PURE__ */ d(
+  return p(() => {
+    d.current !== null && (d.current.removeEventListener("animationend", c), d.current.addEventListener("animationend", c, { once: !0 }));
+  }, [c]), p(() => {
+    C(a[r]);
+    const t = r ? 0 : 1, I = l(s.date, "yyyy-MM-dd"), u = a[t].findIndex(
+      (v) => l(v.date, "yyyy-MM-dd") === I
+    );
+    if (u !== -1 && a[r][u]) {
+      const v = a[r][u];
+      D.current = u, y(v), i(v.date);
+    }
+  }, [r, a, i, s]), /* @__PURE__ */ _("date-navigation", { "data-state": N, children: [
+    /* @__PURE__ */ _("date-navigation-controls", { children: [
+      /* @__PURE__ */ _(
         "button",
         {
-          type: "button",
-          className: [
-            e["date-navigation__control"],
-            e["date-navigation__control--previous"],
+          className: o([
+            n["date-navigation__control"],
+            n["date-navigation__control--previous"],
             "date-navigation__control",
             "date-navigation__control--previous"
-          ].join(" "),
+          ]),
+          disabled: r === 0 ? !0 : void 0,
+          type: "button",
           onClick: () => {
-            g(0);
+            k(0);
           },
-          disabled: i === 0 ? !0 : null,
           children: [
-            /* @__PURE__ */ n("i", { "aria-hidden": "true", children: /* @__PURE__ */ n(L, { width: 48, height: 48 }) }),
-            /* @__PURE__ */ n("span", { className: "sr-only", children: "Current Week" })
+            /* @__PURE__ */ e("i", { "aria-hidden": "true", children: /* @__PURE__ */ e(j, { height: 48, width: 48 }) }),
+            /* @__PURE__ */ e("span", { className: "sr-only", children: "Current Week" })
           ]
         }
       ),
-      /* @__PURE__ */ d(
+      /* @__PURE__ */ _(
         "button",
         {
-          type: "button",
-          className: [
-            e["date-navigation__control"],
-            e["date-navigation__control--next"],
+          className: o([
+            n["date-navigation__control"],
+            n["date-navigation__control--next"],
             "date-navigation__control",
             "date-navigation__control--next"
-          ].join(" "),
+          ]),
+          disabled: r === 1 ? !0 : void 0,
+          type: "button",
           onClick: () => {
-            g(1);
+            k(1);
           },
-          disabled: i === 1 ? !0 : null,
           children: [
-            /* @__PURE__ */ n("i", { "aria-hidden": "true", children: /* @__PURE__ */ n(E, { width: 48, height: 48 }) }),
-            /* @__PURE__ */ n("span", { className: "sr-only", children: "Next Week" })
+            /* @__PURE__ */ e("i", { "aria-hidden": "true", children: /* @__PURE__ */ e(w, { height: 48, width: 48 }) }),
+            /* @__PURE__ */ e("span", { className: "sr-only", children: "Next Week" })
           ]
         }
       )
     ] }),
-    /* @__PURE__ */ n("date-navigation-list", { children: /* @__PURE__ */ n(
+    /* @__PURE__ */ e("date-navigation-list", { children: /* @__PURE__ */ e(
       "ul",
       {
-        className: [e["date-navigation__list"], "date-navigation__list"].join(" "),
-        ref: o,
-        role: "tablist",
         "aria-label": "Date Tabs",
-        onKeyDown: S,
-        children: p.map((t) => /* @__PURE__ */ n("li", { className: [e["date-navigation__item"], "date-navigation__item"].join(" "), role: "presentation", children: /* @__PURE__ */ d(
-          "button",
+        className: o([n["date-navigation__list"], "date-navigation__list"]),
+        ref: d,
+        role: "tablist",
+        children: b.map((t) => /* @__PURE__ */ e(
+          "li",
           {
-            type: "button",
-            className: [e["date-navigation__day"], "date-navigation__day"].join(" "),
-            "aria-selected": x.fullDateStr === t.fullDateStr,
-            onClick: () => {
-              C(t);
-            },
-            role: "tab",
-            "aria-controls": `${t.fullDateStr}`,
-            children: [
-              /* @__PURE__ */ n("div", { className: [e["date-navigation__weekday"], "date-navigation__weekday"].join(" "), children: t.dayStr }),
-              /* @__PURE__ */ d("div", { className: [e["date-navigation__date"], "date-navigation__date"].join(" "), children: [
-                t.monthStr,
-                " ",
-                /* @__PURE__ */ n("br", { className: W([e["date-navigation__month-day-break"], "date-navigation__month-day-break"]) }),
-                t.dateStr
-              ] })
-            ]
-          }
-        ) }, `schedule-nav-${t.fullDateStr}`))
+            className: [n["date-navigation__item"], "date-navigation__item"].join(" "),
+            role: "presentation",
+            children: /* @__PURE__ */ _(
+              "button",
+              {
+                "aria-controls": `${t.fullDateStr}`,
+                "aria-selected": s.fullDateStr === t.fullDateStr,
+                className: o([n["date-navigation__day"], "date-navigation__day"]),
+                role: "tab",
+                type: "button",
+                onClick: () => {
+                  E(t);
+                },
+                children: [
+                  /* @__PURE__ */ e(
+                    "div",
+                    {
+                      className: o([n["date-navigation__weekday"], "date-navigation__weekday"]),
+                      children: t.dayStr
+                    }
+                  ),
+                  /* @__PURE__ */ _(
+                    "div",
+                    {
+                      className: o([n["date-navigation__date"], "date-navigation__date"]),
+                      children: [
+                        t.monthStr,
+                        /* @__PURE__ */ e(
+                          "br",
+                          {
+                            className: o([
+                              n["date-navigation__month-day-break"],
+                              "date-navigation__month-day-break"
+                            ])
+                          }
+                        ),
+                        t.dateStr
+                      ]
+                    }
+                  )
+                ]
+              }
+            )
+          },
+          `schedule-nav-${t.fullDateStr}`
+        ))
       }
     ) })
   ] });
 }
 export {
-  $ as DateNavigation,
-  $ as default
+  P as DateNavigation,
+  P as default
 };

package/dist/components/DateNavigation/index.d.ts

@@ -1 +1,2 @@
-export { DateNavigation, DateNavigation as default } from './DateNavigation';
+export { DateNavigation } from './DateNavigation';
+export { DateNavigation as default } from './DateNavigation';

package/dist/components/DatePicker/index.d.ts

@@ -1 +1,2 @@
-export { DatePicker, DatePicker as default } from './DatePicker';
+export { DatePicker } from './DatePicker';
+export { DatePicker as default } from './DatePicker';

package/dist/components/DeviceAndPlatformLists/DeviceAndPlatformLists.d.ts

@@ -1,5 +1,15 @@
-export function DeviceAndPlatformLists({ platformResources, numberOfColumns }: {
-    platformResources: any;
-    numberOfColumns: any;
-}): import("react/jsx-runtime").JSX.Element;
+type DeviceAndPlatformListsProps = {
+    platformResources: Map<{
+        name: string;
+        slug: string;
+    }, {
+        id: number | string;
+        alt_text: string;
+        image_url: string;
+        link: string;
+        target?: '_blank' | '_self' | '_parent' | '_top' | undefined;
+    }[]>;
+    numberOfColumns?: number;
+};
+export declare function DeviceAndPlatformLists({ platformResources, numberOfColumns }: DeviceAndPlatformListsProps): JSX.Element;
 export default DeviceAndPlatformLists;

package/dist/components/DeviceAndPlatformLists/DeviceAndPlatformLists.js

@@ -1,55 +1,62 @@
 import { jsxs as v, jsx as l } from "react/jsx-runtime";
-import "react";
-import { classes as a } from "../../utils/helpers.js";
-import { GridList as r } from "../GridList/GridList.js";
+import { classes as t } from "../../utils/helpers.js";
+import { GridList as d } from "../GridList/GridList.js";
 import { LogoListItem as _ } from "../LogoListItem/LogoListItem.js";
-import '../../assets/DeviceAndPlatformLists.css';const t = {
-  "devices-platforms": "_devices-platforms_1jzzl_1",
-  "devices-platforms__column": "_devices-platforms__column_1jzzl_5",
-  "devices-platforms__column-item": "_devices-platforms__column-item_1jzzl_12"
+import '../../assets/DeviceAndPlatformLists.css';const c = {
+  "devices-platforms": "_devices-platforms_t4rcx_1",
+  "devices-platforms__column": "_devices-platforms__column_t4rcx_5",
+  "devices-platforms__column-item": "_devices-platforms__column-item_t4rcx_12"
 };
-function x({ platformResources: s, numberOfColumns: c }) {
+function x({ platformResources: s, numberOfColumns: a }) {
   let o = s.size < 4 ? s.size : Math.ceil(s.size / 2);
-  const d = [...s.entries()];
+  const r = [...s.entries()];
   [...s.keys()][0].slug === "video-platforms" && (o = 1);
-  const m = d.slice(0, o), n = d.slice(o, s.size);
-  return /* @__PURE__ */ v("section", { className: a([t["devices-platforms"], "devices-platforms"]), children: [
+  const m = r.slice(0, o), n = r.slice(o, s.size);
+  return /* @__PURE__ */ v("section", { className: t([c["devices-platforms"], "devices-platforms"]), children: [
     /* @__PURE__ */ l(
       "div",
       {
-        className: a([t["devices-platforms__column"], "devices-platforms__column"]),
+        className: t([c["devices-platforms__column"], "devices-platforms__column"]),
         style: {
           gridColumn: s.size >= 4 ? "1/2" : "1/3"
         },
-        children: m.map((i) => /* @__PURE__ */ l("div", { className: a([t["devices-platforms__column-item"], "devices-platforms__column-item"]), children: /* @__PURE__ */ l(r, { headerText: i[0].name.toLowerCase(), ...c && { numberOfColumns: c }, children: i[1].map((e) => /* @__PURE__ */ l(
-          _,
-          {
-            imageSource: e.image_url,
-            altText: e.alt_text,
-            href: e.link,
-            target: (e == null ? void 0 : e.target) ?? "_blank"
-          },
-          `sd-${e.id}`
-        )) }) }, `${i[0].slug}`))
+        children: m.map(
+          (i) => /* @__PURE__ */ l("div", { className: t([c["devices-platforms__column-item"], "devices-platforms__column-item"]), children: /* @__PURE__ */ l(d, { headerText: i[0].name.toLowerCase(), ...a && { numberOfColumns: a }, children: i[1].map(
+            (e) => /* @__PURE__ */ l(
+              _,
+              {
+                altText: e.alt_text,
+                href: e.link,
+                imageSource: e.image_url,
+                target: (e == null ? void 0 : e.target) ?? "_blank"
+              },
+              `sd-${e.id}`
+            )
+          ) }) }, `${i[0].slug}`)
+        )
       }
     ),
     s.size >= 4 && /* @__PURE__ */ l(
       "div",
       {
-        className: a([t["devices-platforms__column"], "devices-platforms__column"]),
+        className: t([c["devices-platforms__column"], "devices-platforms__column"]),
         style: {
           gridColumn: "2/3"
         },
-        children: n.map((i) => /* @__PURE__ */ l("div", { className: a([t["devices-platforms__column-item"], "devices-platforms__column-item"]), children: /* @__PURE__ */ l(r, { headerText: i[0].name.toLowerCase(), ...c && { numberOfColumns: c }, children: i[1].map((e) => /* @__PURE__ */ l(
-          _,
-          {
-            imageSource: e.image_url,
-            altText: e.alt_text,
-            href: e.link,
-            target: (e == null ? void 0 : e.target) ?? "_blank"
-          },
-          `sd-${e.id}`
-        )) }) }, `${i[0].slug}`))
+        children: n.map(
+          (i) => /* @__PURE__ */ l("div", { className: t([c["devices-platforms__column-item"], "devices-platforms__column-item"]), children: /* @__PURE__ */ l(d, { headerText: i[0].name.toLowerCase(), ...a && { numberOfColumns: a }, children: i[1].map(
+            (e) => /* @__PURE__ */ l(
+              _,
+              {
+                altText: e.alt_text,
+                href: e.link,
+                imageSource: e.image_url,
+                target: (e == null ? void 0 : e.target) ?? "_blank"
+              },
+              `sd-${e.id}`
+            )
+          ) }) }, `${i[0].slug}`)
+        )
       }
     )
   ] });

package/dist/components/DeviceAndPlatformLists/index.d.ts

@@ -1 +1,2 @@
-export { DeviceAndPlatformLists, DeviceAndPlatformLists as default } from './DeviceAndPlatformLists';
+export { DeviceAndPlatformLists } from './DeviceAndPlatformLists';
+export { DeviceAndPlatformLists as default } from './DeviceAndPlatformLists';

package/dist/components/DrawerNavigation/DrawerNavigation.d.ts

@@ -1,7 +1,27 @@
+import { AnchorLink, Image } from '../../types';
+type DrawerNavigationProps = {
+    links?: AnchorLink[];
+    items?: Array<{
+        href: string;
+        image: Image;
+        altText: string;
+        title?: string;
+    }>;
+    classname?: string;
+    logo?: {
+        image?: Image;
+        href?: string;
+        baselineAdjustment?: number;
+        height?: number;
+    };
+    clipPathStart?: string;
+    clipPathEnd?: string;
+    overlayAppendEl?: Element | undefined;
+};
 /**
  * DrawerNavigation component for rendering a drawer-style navigation menu.
  * @param {*} param0 - Component props.
  * @returns {JSX.Element} The rendered drawer navigation.
  */
-export function DrawerNavigation({ links, items, classname, logo, clipPathStart, clipPathEnd, overlayAppendEl }: any): JSX.Element;
+export declare function DrawerNavigation({ links, items, classname, logo, clipPathStart, clipPathEnd, overlayAppendEl, }: DrawerNavigationProps): JSX.Element;
 export default DrawerNavigation;

package/dist/components/DrawerNavigation/DrawerNavigation.js

@@ -1,10 +1,10 @@
-import { jsxs as t, Fragment as h, jsx as e } from "react/jsx-runtime";
-import { useState as v } from "react";
-import { classes as o } from "../../utils/helpers.js";
-import { NavList as b } from "../NavList/NavList.js";
-import { LogoNavigation as N } from "../LogoNavigation/LogoNavigation.js";
-import { ImageReplacementAnchor as k } from "../ImageReplacementAnchor/ImageReplacementAnchor.js";
-import { Overlay as x } from "../Overlay/Overlay.js";
+import { jsxs as o, Fragment as v, jsx as e } from "react/jsx-runtime";
+import { useState as h, useCallback as k, useEffect as x } from "react";
+import { classes as d } from "../../utils/helpers.js";
+import { NavList as A } from "../NavList/NavList.js";
+import { LogoNavigation as S } from "../LogoNavigation/LogoNavigation.js";
+import { ImageReplacementAnchor as j } from "../ImageReplacementAnchor/ImageReplacementAnchor.js";
+import { Overlay as E } from "../Overlay/Overlay.js";
 import '../../assets/DrawerNavigation.css';const n = {
   "drawer-navigation__nav-bar": "_drawer-navigation__nav-bar_5hknh_1",
   "with-logo": "_with-logo_5hknh_11",
@@ -14,67 +14,73 @@ import '../../assets/DrawerNavigation.css';const n = {
   "drawer-navigation__separator": "_drawer-navigation__separator_5hknh_102",
   "visually-hidden": "_visually-hidden_5hknh_113"
 };
-function I({
-  links: s = [],
-  items: g = [],
-  classname: c = "",
-  logo: i = {},
+function Y({
+  links: g = [],
+  items: l = [],
+  classname: u = "",
+  logo: r = {},
   clipPathStart: p = "circle(0% at top right)",
-  clipPathEnd: u = "circle(250% at top right)",
-  overlayAppendEl: w = document.querySelector("#root")
+  clipPathEnd: w = "circle(250% at top right)",
+  overlayAppendEl: y = document.querySelector("#root")
 }) {
-  const [a, y] = v(!1), [d, l] = v(null), m = document.querySelector("body"), _ = () => {
-    if (y(!a), l("closing"), a) {
-      const r = document.querySelector("#overlay");
-      r == null || r.setAttribute("data-state", "exiting"), setTimeout(() => {
-        r == null || r.remove(), m.style.overflowY = "auto";
-      }, 400);
-    } else
-      m.style.overflowY = "hidden";
-  }, f = () => {
-    a || l(null);
+  const [a, f] = h(!1), [s, m] = h(null), _ = document.querySelector("body"), t = k(() => {
+    f((N) => {
+      const c = !N;
+      if (c) {
+        const i = document.querySelector("#overlay");
+        i == null || i.setAttribute("data-state", "exiting"), setTimeout(() => {
+          i == null || i.remove(), _.style.overflowY = "auto";
+        }, 400);
+      } else
+        _.style.overflowY = "hidden";
+      return c;
+    }), m("closing");
+  }, [_]), b = () => {
+    a || m(null);
   };
-  return document.addEventListener("scripps:overlay:closed", _), // Ideally the parent for this component will be a <nav> for accessibility reasons
-  /* @__PURE__ */ t(h, { children: [
-    /* @__PURE__ */ t(
+  return x(() => (document.addEventListener("scripps:overlay:closed", t), () => {
+    document.removeEventListener("scripps:overlay:closed", t);
+  }), [a, t]), // Ideally the parent for this component will be a <nav> for accessibility reasons
+  /* @__PURE__ */ o(v, { children: [
+    /* @__PURE__ */ o(
       "div",
       {
-        className: o([
+        className: d([
           n["drawer-navigation__nav-bar"],
           "drawer-navigation__nav-bar",
-          i.image && n["with-logo"],
-          `drawer-navigation__nav-bar--${a ? "expanded" : d ? "closing" : "closed"}`
+          r.image && n["with-logo"],
+          `drawer-navigation__nav-bar--${a ? "expanded" : s ? "closing" : "closed"}`
         ]),
         children: [
-          i.image && /* @__PURE__ */ e(
-            k,
+          r.image && /* @__PURE__ */ e(
+            j,
             {
-              href: i.href,
-              image: i.image,
-              height: i.height,
-              baselineAdjustment: i.baselineAdjustment
+              baselineAdjustment: r.baselineAdjustment,
+              height: r.height,
+              href: r.href,
+              image: r.image
             }
           ),
-          /* @__PURE__ */ t(
+          /* @__PURE__ */ o(
             "button",
             {
-              className: o([
+              "aria-controls": "drawer-navigation__primary-navigation",
+              "aria-expanded": a,
+              className: d([
                 n["drawer-navigation__menu-toggle"],
                 "drawer-navigation__menu-toggle"
               ]),
-              "aria-controls": "drawer-navigation__primary-navigation",
-              "aria-expanded": a,
-              onClick: _,
+              onClick: t,
               children: [
                 /* @__PURE__ */ e("span", { className: n["visually-hidden"], children: "Menu" }),
                 /* @__PURE__ */ e(
                   "div",
                   {
-                    className: o([
+                    "aria-hidden": "true",
+                    className: d([
                       n["drawer-navigation__hamburger"],
                       "drawer-navigation__hamburger"
-                    ]),
-                    "aria-hidden": "true"
+                    ])
                   }
                 )
               ]
@@ -83,41 +89,54 @@ function I({
         ]
       }
     ),
-    /* @__PURE__ */ t(
+    /* @__PURE__ */ o(
       "div",
       {
-        className: o([
+        className: d([
           n["drawer-navigation__primary-navigation"],
           "drawer-navigation__primary-navigation"
         ]),
+        "data-state": a ? "opened" : s || "closed",
         id: "drawer-navigation__primary-navigation",
-        "data-state": a ? "opened" : d || "closed",
-        onAnimationEnd: f,
         style: {
           "--clip-path-start": p,
-          "--clip-path-end": u
+          "--clip-path-end": w
         },
+        onAnimationEnd: b,
         children: [
-          s.length > 0 && /* @__PURE__ */ e(b, { links: s, classname: c, toggleHandler: _ }),
-          g.length > 0 && /* @__PURE__ */ t(h, { children: [
+          g.length > 0 && /* @__PURE__ */ e(
+            A,
+            {
+              classname: u,
+              links: g,
+              toggleHandler: t
+            }
+          ),
+          l.length > 0 && /* @__PURE__ */ o(v, { children: [
             /* @__PURE__ */ e(
               "hr",
               {
-                className: o([
+                className: d([
                   n["drawer-navigation__separator"],
                   "drawer-navigation__separator"
                 ])
               }
             ),
-            /* @__PURE__ */ e(N, { items: g })
+            /* @__PURE__ */ e(S, { items: l })
           ] })
         ]
       }
     ),
-    a && /* @__PURE__ */ e(x, { appendToElement: w, state: d === null && !a ? "exiting" : "entering" })
+    a && /* @__PURE__ */ e(
+      E,
+      {
+        appendToElement: y,
+        state: s === null && !a ? "exiting" : "entering"
+      }
+    )
   ] });
 }
 export {
-  I as DrawerNavigation,
-  I as default
+  Y as DrawerNavigation,
+  Y as default
 };

package/dist/components/DrawerNavigation/index.d.ts

@@ -1 +1,2 @@
-export { DrawerNavigation, DrawerNavigation as default } from './DrawerNavigation';
+export { DrawerNavigation } from './DrawerNavigation';
+export { DrawerNavigation as default } from './DrawerNavigation';

package/dist/components/EqualSizeFlexRow/EqualSizeFlexRow.d.ts

@@ -1,6 +1,7 @@
-export function EqualSizeFlexRow({ children, gap, maxItemsPerRow }: {
-    children: any;
-    gap?: string | undefined;
-    maxItemsPerRow?: number | undefined;
-}): import("react/jsx-runtime").JSX.Element;
+type EqualSizeFlexRowProps = {
+    children: React.ReactNode;
+    gap?: string;
+    maxItemsPerRow?: number;
+};
+export declare function EqualSizeFlexRow({ children, gap, maxItemsPerRow, }: EqualSizeFlexRowProps): JSX.Element;
 export default EqualSizeFlexRow;