@scrippsproduct/networks-ui-library 1.1.9 → 1.1.10-alpha.0

package/dist/components/DateNavigation/DateNavigation.test.js

@@ -0,0 +1,370 @@
+import { jsx as o } from "react/jsx-runtime";
+import { v as b, d, b as S, i as a, r as s, g as n, s as r, w as h } from "../../react.esm-DLSrfVwM.mjs";
+import { u as i } from "../../index-BUN4jQ3m.mjs";
+import "../../index-BVxBrkZB.mjs";
+import { DateNavigation as l } from "./DateNavigation.js";
+import { S as v } from "../../useScheduleContext-D7FdzNxe.mjs";
+const y = b.fn(), w = () => [[
+  {
+    date: /* @__PURE__ */ new Date("2026-01-05"),
+    dayStr: "Mon",
+    dateStr: "5",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-05"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-06"),
+    dayStr: "Tue",
+    dateStr: "6",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-06"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-07"),
+    dayStr: "Wed",
+    dateStr: "7",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-07"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-08"),
+    dayStr: "Thu",
+    dateStr: "8",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-08"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-09"),
+    dayStr: "Fri",
+    dateStr: "9",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-09"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-10"),
+    dayStr: "Sat",
+    dateStr: "10",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-10"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-11"),
+    dayStr: "Sun",
+    dateStr: "11",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-11"
+  }
+], [
+  {
+    date: /* @__PURE__ */ new Date("2026-01-12"),
+    dayStr: "Mon",
+    dateStr: "12",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-12"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-13"),
+    dayStr: "Tue",
+    dateStr: "13",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-13"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-14"),
+    dayStr: "Wed",
+    dateStr: "14",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-14"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-15"),
+    dayStr: "Thu",
+    dateStr: "15",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-15"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-16"),
+    dayStr: "Fri",
+    dateStr: "16",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-16"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-17"),
+    dayStr: "Sat",
+    dateStr: "17",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-17"
+  },
+  {
+    date: /* @__PURE__ */ new Date("2026-01-18"),
+    dayStr: "Sun",
+    dateStr: "18",
+    monthStr: "Jan",
+    fullDateStr: "2026-01-18"
+  }
+]];
+d("DateNavigation", () => {
+  S(() => {
+    y.mockClear(), b.spyOn(v, "useScheduleContext").mockReturnValue({
+      weeks: w(),
+      setCurrentDate: y,
+      schedule: [],
+      currentDate: /* @__PURE__ */ new Date("2026-01-05"),
+      isLoading: !1,
+      isError: !1
+    });
+  }), d("Basic Rendering", () => {
+    a("should render navigation component", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelector("date-navigation");
+      n(e).toBeInTheDocument();
+    }), a("should render navigation controls", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelector("date-navigation-controls");
+      n(e).toBeInTheDocument();
+    }), a("should render navigation list", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelector("date-navigation-list");
+      n(e).toBeInTheDocument();
+    }), a("should render previous week button", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getByRole("button", { name: /current week/i });
+      n(t).toBeInTheDocument();
+    }), a("should render next week button", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getByRole("button", { name: /next week/i });
+      n(t).toBeInTheDocument();
+    }), a("should render tablist with correct role", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getByRole("tablist", { name: "Date Tabs" });
+      n(t).toBeInTheDocument();
+    }), a("should render all days of the week", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getAllByRole("tab");
+      n(t).toHaveLength(7);
+    });
+  }), d("Day Rendering", () => {
+    a("should display day names", () => {
+      s(/* @__PURE__ */ o(l, {})), n(r.getByText("Mon")).toBeInTheDocument(), n(r.getByText("Tue")).toBeInTheDocument(), n(r.getByText("Wed")).toBeInTheDocument(), n(r.getByText("Thu")).toBeInTheDocument(), n(r.getByText("Fri")).toBeInTheDocument(), n(r.getByText("Sat")).toBeInTheDocument(), n(r.getByText("Sun")).toBeInTheDocument();
+    }), a("should display month abbreviation", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll(".date-navigation__date");
+      n(e[0].textContent).toContain("Jan");
+    }), a("should display date numbers", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll(".date-navigation__date");
+      n(e[0].textContent).toContain("5"), n(e[1].textContent).toContain("6"), n(e[2].textContent).toContain("7");
+    }), a("should have correct aria-controls attribute", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getAllByRole("tab");
+      n(t[0]).toHaveAttribute("aria-controls", "2026-01-05");
+    }), a("should apply day class to buttons", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll(".date-navigation__day");
+      n(e.length).toBe(7);
+    });
+  }), d("Selection State", () => {
+    a("should mark first day as selected by default", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getAllByRole("tab");
+      n(t[0]).toHaveAttribute("aria-selected", "true");
+    }), a("should only have one selected day", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getAllByRole("tab").filter((c) => c.getAttribute("aria-selected") === "true");
+      n(e).toHaveLength(1);
+    }), a("should update selected day when clicked", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getAllByRole("tab");
+      await t.click(e[2]), n(e[2]).toHaveAttribute("aria-selected", "true");
+    }), a("should deselect previous day when new day selected", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getAllByRole("tab");
+      await t.click(e[3]), n(e[0]).toHaveAttribute("aria-selected", "false"), n(e[3]).toHaveAttribute("aria-selected", "true");
+    }), a("should not call setCurrentDate when clicking already selected day", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getAllByRole("tab");
+      y.mockClear(), await t.click(e[0]), n(y).not.toHaveBeenCalled();
+    });
+  }), d("Week Navigation", () => {
+    a("should disable previous button on first week", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getByRole("button", { name: /current week/i });
+      n(t).toBeDisabled();
+    }), a("should enable next button on first week", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getByRole("button", { name: /next week/i });
+      n(t).not.toBeDisabled();
+    }), a("should navigate to next week when next button clicked", async () => {
+      const t = i.setup(), { container: e } = s(/* @__PURE__ */ o(l, {})), c = r.getByRole("button", { name: /next week/i });
+      await t.click(c), await h(() => {
+        const u = e.querySelectorAll(".date-navigation__date");
+        n(u[0].textContent).toContain("12");
+      });
+    }), a("should navigate to previous week when previous button clicked", async () => {
+      const t = i.setup(), { container: e } = s(/* @__PURE__ */ o(l, {})), c = r.getByRole("button", { name: /next week/i });
+      await t.click(c), await h(() => {
+        const g = e.querySelectorAll(".date-navigation__date");
+        n(g[0].textContent).toContain("12");
+      });
+      const u = r.getByRole("button", { name: /current week/i });
+      await t.click(u), await h(() => {
+        const g = e.querySelectorAll(".date-navigation__date");
+        n(g[0].textContent).toContain("5");
+      });
+    }), a("should disable next button on last week", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getByRole("button", { name: /next week/i });
+      await t.click(e), await h(() => {
+        n(e).toBeDisabled();
+      });
+    }), a("should enable previous button on second week", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getByRole("button", { name: /next week/i }), c = r.getByRole("button", { name: /current week/i });
+      await t.click(e), await h(() => {
+        n(c).not.toBeDisabled();
+      });
+    });
+  }), d("Navigation State", () => {
+    a("should start with idle state", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelector("date-navigation");
+      n(e).toHaveAttribute("data-state", "idle");
+    }), a("should set advancing state when navigating forward", async () => {
+      const t = i.setup(), { container: e } = s(/* @__PURE__ */ o(l, {})), c = r.getByRole("button", { name: /next week/i });
+      await t.click(c);
+      const u = e.querySelector("date-navigation");
+      n(u).toHaveAttribute("data-state", "advancing");
+    }), a("should set retracting state when navigating backward", async () => {
+      const t = i.setup(), { container: e } = s(/* @__PURE__ */ o(l, {})), c = r.getByRole("button", { name: /next week/i });
+      await t.click(c), await h(() => {
+        const m = e.querySelectorAll(".date-navigation__date");
+        n(m[0].textContent).toContain("12");
+      });
+      const u = r.getByRole("button", { name: /current week/i });
+      await t.click(u);
+      const g = e.querySelector("date-navigation");
+      n(g).toHaveAttribute("data-state", "retracting");
+    });
+  }), d("Context Integration", () => {
+    a("should call setCurrentDate when day is selected", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getAllByRole("tab");
+      y.mockClear(), await t.click(e[2]), n(y).toHaveBeenCalledWith(/* @__PURE__ */ new Date("2026-01-07"));
+    }), a("should use weeks from context", () => {
+      const t = w();
+      b.spyOn(v, "useScheduleContext").mockReturnValue({
+        weeks: t,
+        setCurrentDate: y,
+        schedule: [],
+        currentDate: /* @__PURE__ */ new Date("2026-01-05"),
+        isLoading: !1,
+        isError: !1
+      });
+      const { container: e } = s(/* @__PURE__ */ o(l, {})), c = e.querySelectorAll(".date-navigation__date");
+      n(c[0].textContent).toContain("5");
+    }), a("should preserve day selection when switching weeks", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getAllByRole("tab");
+      await t.click(e[2]);
+      const c = r.getByRole("button", { name: /next week/i });
+      await t.click(c), await h(() => {
+        const u = r.getAllByRole("tab");
+        n(u[2]).toHaveAttribute("aria-selected", "true");
+      });
+    });
+  }), d("CSS Classes", () => {
+    a("should apply date-navigation class to list", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelector(".date-navigation__list");
+      n(e).toBeInTheDocument();
+    }), a("should apply date-navigation__item class to list items", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll(".date-navigation__item");
+      n(e).toHaveLength(7);
+    }), a("should apply date-navigation__control class to buttons", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll(".date-navigation__control");
+      n(e).toHaveLength(2);
+    }), a("should apply previous control class", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelector(".date-navigation__control--previous");
+      n(e).toBeInTheDocument();
+    }), a("should apply next control class", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelector(".date-navigation__control--next");
+      n(e).toBeInTheDocument();
+    }), a("should apply weekday class", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll(".date-navigation__weekday");
+      n(e).toHaveLength(7);
+    }), a("should apply date class", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll(".date-navigation__date");
+      n(e).toHaveLength(7);
+    }), a("should apply month-day-break class to br element", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll(".date-navigation__month-day-break");
+      n(e).toHaveLength(7);
+    });
+  }), d("Accessibility", () => {
+    a("should have proper ARIA roles", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getByRole("tablist"), e = r.getAllByRole("tab");
+      n(t).toBeInTheDocument(), n(e).toHaveLength(7);
+    }), a("should have aria-label on tablist", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const t = r.getByRole("tablist", { name: "Date Tabs" });
+      n(t).toBeInTheDocument();
+    }), a("should have aria-selected on tabs", () => {
+      s(/* @__PURE__ */ o(l, {})), r.getAllByRole("tab").forEach((e) => {
+        n(e).toHaveAttribute("aria-selected");
+      });
+    }), a("should have aria-controls on tabs", () => {
+      s(/* @__PURE__ */ o(l, {})), r.getAllByRole("tab").forEach((e) => {
+        n(e).toHaveAttribute("aria-controls");
+      });
+    }), a("should have screen reader text for controls", () => {
+      s(/* @__PURE__ */ o(l, {})), n(r.getByText("Current Week")).toHaveClass("sr-only"), n(r.getByText("Next Week")).toHaveClass("sr-only");
+    }), a("should have aria-hidden on control icons", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll('i[aria-hidden="true"]');
+      n(e).toHaveLength(2);
+    }), a('should have role="presentation" on list items', () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {})), e = t.querySelectorAll('li[role="presentation"]');
+      n(e).toHaveLength(7);
+    });
+  }), d("Icons", () => {
+    a("should render ChevronLeft icon in previous button", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getByRole("button", { name: /current week/i }).querySelector("svg");
+      n(e).toBeInTheDocument();
+    }), a("should render ChevronRight icon in next button", () => {
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getByRole("button", { name: /next week/i }).querySelector("svg");
+      n(e).toBeInTheDocument();
+    }), a("should set icon size to 48x48", () => {
+      const { container: t } = s(/* @__PURE__ */ o(l, {}));
+      t.querySelectorAll("svg").forEach((c) => {
+        n(c).toHaveAttribute("height", "48"), n(c).toHaveAttribute("width", "48");
+      });
+    });
+  }), d("Edge Cases", () => {
+    a("should handle clicking same day multiple times", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getAllByRole("tab");
+      y.mockClear(), await t.click(e[0]), await t.click(e[0]), await t.click(e[0]), n(y).not.toHaveBeenCalled();
+    }), a("should handle rapid week navigation", async () => {
+      const t = i.setup(), { container: e } = s(/* @__PURE__ */ o(l, {})), c = r.getByRole("button", { name: /next week/i });
+      await t.click(c), await h(() => {
+        const u = e.querySelectorAll(".date-navigation__date");
+        n(u[0].textContent).toContain("12");
+      });
+    }), a("should handle empty weeks array gracefully", () => {
+      n(!0).toBe(!0);
+    }), a("should maintain selection across week changes", async () => {
+      const t = i.setup();
+      s(/* @__PURE__ */ o(l, {}));
+      const e = r.getAllByRole("tab");
+      await t.click(e[4]);
+      const c = r.getByRole("button", { name: /next week/i });
+      await t.click(c), await h(() => {
+        const u = r.getAllByRole("tab");
+        n(u[4]).toHaveAttribute("aria-selected", "true");
+      });
+    });
+  });
+});

package/dist/components/DatePicker/DatePicker.js

@@ -7,7 +7,7 @@ import m, { useLayoutEffect as ar, cloneElement as or, createRef as Oe, Componen
 import { a as ye, b as ve } from "../../addMonths-FatsTLmU.mjs";
 import { t as M, c as G, m as Lt, a as Ft, s as tt, d as nt, g as cn, b as $r, e as qr, h as xt, i as sr, j as jr, k as ir, l as lr, n as Xr, o as Jt, p as zr, w as _n, q as Gr, r as Pe, u as en, v as un, f as tn } from "../../format-YhWt2D8M.mjs";
 import { s as Le, a as Zr } from "../../subMonths-BtMU5A9u.mjs";
-import { r as Jr, R as ea } from "../../index-C-kn9Zhn.mjs";
+import { r as Jr, R as ea } from "../../index-DzfYkULW.mjs";
 import { Input as ta } from "../Input/Input.js";
 function dn(r, a) {
   const t = +M(r);

package/dist/components/DeviceAndPlatformLists/DeviceAndPlatformLists.test.js

@@ -0,0 +1,288 @@
+import { jsx as n } from "react/jsx-runtime";
+import { d as p, i as l, r, g as s, s as a } from "../../react.esm-DLSrfVwM.mjs";
+import "../../index-BVxBrkZB.mjs";
+import { DeviceAndPlatformLists as c } from "./DeviceAndPlatformLists.js";
+const f = () => [
+  {
+    id: 1,
+    alt_text: "Device 1",
+    image_url: "/images/device1.png",
+    link: "https://example.com/device1",
+    target: "_blank"
+  },
+  {
+    id: 2,
+    alt_text: "Device 2",
+    image_url: "/images/device2.png",
+    link: "https://example.com/device2",
+    target: "_blank"
+  }
+], m = (e) => {
+  const o = /* @__PURE__ */ new Map();
+  for (let t = 0; t < e; t++)
+    o.set(
+      { name: `Platform ${t + 1}`, slug: `platform-${t + 1}` },
+      f()
+    );
+  return o;
+};
+p("DeviceAndPlatformLists", () => {
+  p("Basic Rendering", () => {
+    l("should render section element", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelector("section");
+      s(t).toBeInTheDocument();
+    }), l("should apply devices-platforms class", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelector(".devices-platforms");
+      s(t).toBeInTheDocument();
+    }), l("should render at least one column", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column");
+      s(t.length).toBeGreaterThanOrEqual(1);
+    });
+  }), p("Single Platform Resource", () => {
+    l("should render one platform with size 1", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column-item");
+      s(t).toHaveLength(1);
+    }), l("should display platform header text in lowercase", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Streaming Devices", slug: "streaming-devices" },
+        f()
+      ), r(/* @__PURE__ */ n(c, { platformResources: e })), s(a.getByText("streaming devices")).toBeInTheDocument();
+    }), l("should only render first column for single platform", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column");
+      s(t).toHaveLength(1);
+    }), l("should set first column to span full width (1/3) for single platform", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelector(".devices-platforms__column");
+      s(t).toHaveStyle({ gridColumn: "1/3" });
+    });
+  }), p("Multiple Platform Resources (< 4)", () => {
+    l("should render two platforms", () => {
+      const e = m(2), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column-item");
+      s(t).toHaveLength(2);
+    }), l("should render three platforms", () => {
+      const e = m(3), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column-item");
+      s(t).toHaveLength(3);
+    }), l("should only render first column for platforms < 4", () => {
+      const e = m(3), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column");
+      s(t).toHaveLength(1);
+    }), l("should set first column to span full width (1/3) for platforms < 4", () => {
+      const e = m(3), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelector(".devices-platforms__column");
+      s(t).toHaveStyle({ gridColumn: "1/3" });
+    });
+  }), p("Multiple Platform Resources (>= 4)", () => {
+    l("should render four platforms", () => {
+      const e = m(4), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column-item");
+      s(t).toHaveLength(4);
+    }), l("should render six platforms", () => {
+      const e = m(6), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column-item");
+      s(t).toHaveLength(6);
+    }), l("should render two columns for platforms >= 4", () => {
+      const e = m(4), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column");
+      s(t).toHaveLength(2);
+    }), l("should set first column to grid 1/2 for platforms >= 4", () => {
+      const e = m(4), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column");
+      s(t[0]).toHaveStyle({ gridColumn: "1/2" });
+    }), l("should set second column to grid 2/3 for platforms >= 4", () => {
+      const e = m(4), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column");
+      s(t[1]).toHaveStyle({ gridColumn: "2/3" });
+    }), l("should split 4 platforms evenly (2 per column)", () => {
+      const e = m(4), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column"), u = t[0].querySelectorAll(".devices-platforms__column-item"), i = t[1].querySelectorAll(".devices-platforms__column-item");
+      s(u).toHaveLength(2), s(i).toHaveLength(2);
+    }), l("should split 5 platforms (3 in first, 2 in second)", () => {
+      const e = m(5), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column"), u = t[0].querySelectorAll(".devices-platforms__column-item"), i = t[1].querySelectorAll(".devices-platforms__column-item");
+      s(u).toHaveLength(3), s(i).toHaveLength(2);
+    }), l("should split 6 platforms evenly (3 per column)", () => {
+      const e = m(6), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column"), u = t[0].querySelectorAll(".devices-platforms__column-item"), i = t[1].querySelectorAll(".devices-platforms__column-item");
+      s(u).toHaveLength(3), s(i).toHaveLength(3);
+    });
+  }), p("Video Platforms Special Case", () => {
+    l("should put video-platforms in first column alone when first", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Video Platforms", slug: "video-platforms" },
+        f()
+      ), e.set(
+        { name: "Platform 2", slug: "platform-2" },
+        f()
+      ), e.set(
+        { name: "Platform 3", slug: "platform-3" },
+        f()
+      ), e.set(
+        { name: "Platform 4", slug: "platform-4" },
+        f()
+      );
+      const { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column"), u = t[0].querySelectorAll(".devices-platforms__column-item"), i = t[1].querySelectorAll(".devices-platforms__column-item");
+      s(u).toHaveLength(1), s(i).toHaveLength(3), s(a.getByText("video platforms")).toBeInTheDocument();
+    }), l("should render video platforms header in lowercase", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Video Platforms", slug: "video-platforms" },
+        f()
+      ), r(/* @__PURE__ */ n(c, { platformResources: e })), s(a.getByText("video platforms")).toBeInTheDocument();
+    });
+  }), p("GridList Rendering", () => {
+    l("should render GridList for each platform", () => {
+      const e = m(2), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll('[class*="grid-list"]');
+      s(t.length).toBeGreaterThanOrEqual(2);
+    }), l("should pass headerText prop to GridList", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Test Platform", slug: "test-platform" },
+        f()
+      ), r(/* @__PURE__ */ n(c, { platformResources: e })), s(a.getByText("test platform")).toBeInTheDocument();
+    }), l("should pass numberOfColumns prop to GridList when provided", () => {
+      const e = m(1);
+      r(/* @__PURE__ */ n(c, { numberOfColumns: 3, platformResources: e })), s(a.getByText("platform 1")).toBeInTheDocument();
+    }), l("should not pass numberOfColumns when not provided", () => {
+      const e = m(1);
+      r(/* @__PURE__ */ n(c, { platformResources: e })), s(a.getByText("platform 1")).toBeInTheDocument();
+    });
+  }), p("LogoListItem Rendering", () => {
+    l("should render LogoListItem components for each item", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Platform 1", slug: "platform-1" },
+        [
+          {
+            id: 1,
+            alt_text: "Logo 1",
+            image_url: "/logo1.png",
+            link: "https://example.com/1",
+            target: "_blank"
+          },
+          {
+            id: 2,
+            alt_text: "Logo 2",
+            image_url: "/logo2.png",
+            link: "https://example.com/2",
+            target: "_blank"
+          }
+        ]
+      ), r(/* @__PURE__ */ n(c, { platformResources: e })), s(a.getByAltText("Logo 1 logo")).toBeInTheDocument(), s(a.getByAltText("Logo 2 logo")).toBeInTheDocument();
+    }), l("should pass correct props to LogoListItem", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Platform 1", slug: "platform-1" },
+        [
+          {
+            id: 1,
+            alt_text: "Test Logo",
+            image_url: "/test-logo.png",
+            link: "https://example.com/test",
+            target: "_blank"
+          }
+        ]
+      ), r(/* @__PURE__ */ n(c, { platformResources: e }));
+      const o = a.getByAltText("Test Logo logo");
+      s(o).toHaveAttribute("src", "/test-logo.png");
+      const t = o.closest("a");
+      s(t).toHaveAttribute("href", "https://example.com/test"), s(t).toHaveAttribute("target", "_blank");
+    }), l("should default target to _blank when not provided", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Platform 1", slug: "platform-1" },
+        [
+          {
+            id: 1,
+            alt_text: "Test Logo",
+            image_url: "/test-logo.png",
+            link: "https://example.com/test"
+          }
+        ]
+      ), r(/* @__PURE__ */ n(c, { platformResources: e }));
+      const t = a.getByAltText("Test Logo logo").closest("a");
+      s(t).toHaveAttribute("target", "_blank");
+    }), l("should use custom target when provided", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Platform 1", slug: "platform-1" },
+        [
+          {
+            id: 1,
+            alt_text: "Test Logo",
+            image_url: "/test-logo.png",
+            link: "https://example.com/test",
+            target: "_self"
+          }
+        ]
+      ), r(/* @__PURE__ */ n(c, { platformResources: e }));
+      const t = a.getByAltText("Test Logo logo").closest("a");
+      s(t).toHaveAttribute("target", "_self");
+    }), l("should generate unique keys for LogoListItem components", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Platform 1", slug: "platform-1" },
+        [
+          { id: "unique-1", alt_text: "Logo 1", image_url: "/1.png", link: "https://example.com/1" },
+          { id: "unique-2", alt_text: "Logo 2", image_url: "/2.png", link: "https://example.com/2" },
+          { id: 123, alt_text: "Logo 3", image_url: "/3.png", link: "https://example.com/3" }
+        ]
+      ), r(/* @__PURE__ */ n(c, { platformResources: e })), s(a.getByAltText("Logo 1 logo")).toBeInTheDocument(), s(a.getByAltText("Logo 2 logo")).toBeInTheDocument(), s(a.getByAltText("Logo 3 logo")).toBeInTheDocument();
+    });
+  }), p("CSS Classes", () => {
+    l("should apply devices-platforms class to section", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelector(".devices-platforms");
+      s(t).toBeInTheDocument();
+    }), l("should apply devices-platforms__column class", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelector(".devices-platforms__column");
+      s(t).toBeInTheDocument();
+    }), l("should apply devices-platforms__column-item class", () => {
+      const e = m(1), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelector(".devices-platforms__column-item");
+      s(t).toBeInTheDocument();
+    });
+  }), p("Edge Cases", () => {
+    l("should handle empty Map", () => {
+      s(!0).toBe(!0);
+    }), l("should handle platform with empty items array", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Empty Platform", slug: "empty-platform" },
+        []
+      ), r(/* @__PURE__ */ n(c, { platformResources: e })), s(a.getByText("empty platform")).toBeInTheDocument();
+    }), l("should handle large number of platforms", () => {
+      const e = m(10), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column-item");
+      s(t).toHaveLength(10);
+    }), l("should handle mixed string and number IDs", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Platform 1", slug: "platform-1" },
+        [
+          { id: "string-id-1", alt_text: "Logo 1", image_url: "/1.png", link: "https://example.com/1" },
+          { id: 999, alt_text: "Logo 2", image_url: "/2.png", link: "https://example.com/2" }
+        ]
+      ), r(/* @__PURE__ */ n(c, { platformResources: e })), s(a.getByAltText("Logo 1 logo")).toBeInTheDocument(), s(a.getByAltText("Logo 2 logo")).toBeInTheDocument();
+    }), l("should preserve platform order in Map", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set({ name: "First", slug: "first" }, f()), e.set({ name: "Second", slug: "second" }, f()), e.set({ name: "Third", slug: "third" }, f());
+      const { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column-item");
+      s(t[0].textContent).toContain("first"), s(t[1].textContent).toContain("second"), s(t[2].textContent).toContain("third");
+    }), l("should handle numberOfColumns as 0", () => {
+      const e = m(1);
+      r(/* @__PURE__ */ n(c, { numberOfColumns: 0, platformResources: e })), s(a.getByText("platform 1")).toBeInTheDocument();
+    }), l("should handle all possible target values", () => {
+      const e = /* @__PURE__ */ new Map();
+      e.set(
+        { name: "Platform 1", slug: "platform-1" },
+        [
+          { id: 1, alt_text: "Logo 1", image_url: "/1.png", link: "#", target: "_blank" },
+          { id: 2, alt_text: "Logo 2", image_url: "/2.png", link: "#", target: "_self" },
+          { id: 3, alt_text: "Logo 3", image_url: "/3.png", link: "#", target: "_parent" },
+          { id: 4, alt_text: "Logo 4", image_url: "/4.png", link: "#", target: "_top" }
+        ]
+      ), r(/* @__PURE__ */ n(c, { platformResources: e }));
+      const o = a.getByAltText("Logo 1 logo").closest("a"), t = a.getByAltText("Logo 2 logo").closest("a"), u = a.getByAltText("Logo 3 logo").closest("a"), i = a.getByAltText("Logo 4 logo").closest("a");
+      s(o).toHaveAttribute("target", "_blank"), s(t).toHaveAttribute("target", "_self"), s(u).toHaveAttribute("target", "_parent"), s(i).toHaveAttribute("target", "_top");
+    });
+  }), p("Column Distribution", () => {
+    l("should calculate firstColumnTotal correctly for size 7", () => {
+      const e = m(7), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column"), u = t[0].querySelectorAll(".devices-platforms__column-item"), i = t[1].querySelectorAll(".devices-platforms__column-item");
+      s(u).toHaveLength(4), s(i).toHaveLength(3);
+    }), l("should calculate firstColumnTotal correctly for size 8", () => {
+      const e = m(8), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column"), u = t[0].querySelectorAll(".devices-platforms__column-item"), i = t[1].querySelectorAll(".devices-platforms__column-item");
+      s(u).toHaveLength(4), s(i).toHaveLength(4);
+    }), l("should calculate firstColumnTotal correctly for size 9", () => {
+      const e = m(9), { container: o } = r(/* @__PURE__ */ n(c, { platformResources: e })), t = o.querySelectorAll(".devices-platforms__column"), u = t[0].querySelectorAll(".devices-platforms__column-item"), i = t[1].querySelectorAll(".devices-platforms__column-item");
+      s(u).toHaveLength(5), s(i).toHaveLength(4);
+    });
+  });
+});