@scrippsproduct/networks-ui-library 2.0.4 → 2.0.5

package/dist/components/Carousel/CarouselUtils.class.js

@@ -1,82 +1,78 @@
-var L = Object.defineProperty;
-var b = (i) => {
-  throw TypeError(i);
+var T = Object.defineProperty;
+var g = (r) => {
+  throw TypeError(r);
 };
-var z = (i, t, e) => t in i ? L(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
-var l = (i, t, e) => z(i, typeof t != "symbol" ? t + "" : t, e), O = (i, t, e) => t.has(i) || b("Cannot " + e);
-var x = (i, t, e) => t.has(i) ? b("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(i) : t.set(i, e);
-var r = (i, t, e) => (O(i, t, "access private method"), e);
-let f = /* @__PURE__ */ new WeakMap();
-const P = new Event("scrollend"), I = /* @__PURE__ */ new Set();
-function h(i, t, e) {
-  let n = i[t];
-  i[t] = function() {
-    let c = Array.prototype.slice.apply(arguments, [0]);
-    n.apply(this, c), c.unshift(n), e.apply(this, c);
-  };
-}
-function m(i, t) {
-  if (t !== "scroll" && t !== "scrollend")
-    return;
-  let e = f.get(this);
-  if (e === void 0) {
-    let n = 0;
-    e = {
-      scrollListener: () => {
-        clearTimeout(n), n = setTimeout(() => {
-          I.size ? setTimeout(e.scrollListener, 100) : (this.dispatchEvent(P), n = 0);
+var B = (r, t, e) => t in r ? T(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
+var n = (r, t, e) => B(r, typeof t != "symbol" ? t + "" : t, e), L = (r, t, e) => t.has(r) || g("Cannot " + e);
+var w = (r, t, e) => t.has(r) ? g("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(r) : t.set(r, e);
+var l = (r, t, e) => (L(r, t, "access private method"), e);
+if (typeof window < "u" && !("onscrollend" in window)) {
+  let e = function(o, i, p) {
+    let d = o[i];
+    o[i] = function() {
+      let a = Array.prototype.slice.apply(arguments, [0]);
+      d.apply(this, a), a.unshift(d), p.apply(this, a);
+    };
+  }, h = function(o, i, p, d) {
+    if (i != "scroll" && i != "scrollend") return;
+    let a = this, u = t.get(a);
+    if (u === void 0) {
+      let m = 0;
+      u = { scrollListener: (O) => {
+        clearTimeout(m), m = setTimeout(() => {
+          r.size ? setTimeout(u.scrollListener, 100) : (a && a.dispatchEvent(new Event("scrollend")), m = 0);
         }, 100);
-      },
-      listeners: 0
-      // Count of number of listeners.
-    }, i.apply(this, ["scroll", e.scrollListener]), f.set(this, e);
-  }
-  e.listeners++;
-}
-function p(i, t) {
-  if (t !== "scroll" && t !== "scrollend") return;
-  let e = f.get(this);
-  e !== void 0 && (e[t]--, !(--e.listeners > 0) && (i.apply(this, ["scroll", e.scrollListener]), f.delete(this)));
+      }, listeners: 0 }, o.apply(a, ["scroll", u.scrollListener, { passive: !0 }]), t.set(a, u);
+    }
+    u.listeners++;
+  }, c = function(o, i, p) {
+    if (i != "scroll" && i != "scrollend") return;
+    let d = this, a = t.get(d);
+    a !== void 0 && (--a.listeners > 0 || (o.apply(d, ["scroll", a.scrollListener]), t.delete(d)));
+  };
+  const r = /* @__PURE__ */ new Set();
+  document.addEventListener("touchstart", (o) => {
+    for (let i of o.changedTouches) r.add(i.identifier);
+  }, { passive: !0 }), document.addEventListener("touchend", (o) => {
+    for (let i of o.changedTouches) r.delete(i.identifier);
+  }, { passive: !0 }), document.addEventListener("touchcancel", (o) => {
+    for (let i of o.changedTouches) r.delete(i.identifier);
+  }, { passive: !0 });
+  let t = /* @__PURE__ */ new WeakMap();
+  e(Element.prototype, "addEventListener", h), e(window, "addEventListener", h), e(document, "addEventListener", h), e(Element.prototype, "removeEventListener", c), e(window, "removeEventListener", c), e(document, "removeEventListener", c);
 }
-const G = "onscrollend" in window;
-var s, u, w, A, S, a, d, y, g, T;
-class M {
+var s, E, b, x, y, f, v, S, I, A;
+class C {
   constructor({
     carouselEl: t,
     scrollerEl: e,
-    paginationEl: n,
+    paginationEl: h,
     cells: c,
-    navBtnEls: B = {
+    navBtnEls: o = {
       next: {},
       previous: {}
     },
-    options: o
+    options: i
   }) {
-    x(this, s);
-    l(this, "carouselEl");
-    l(this, "scrollerEl");
-    l(this, "paginationEl");
-    l(this, "cells");
-    l(this, "currentIndex");
-    l(this, "slideEls");
-    l(this, "navBtnEls");
-    l(this, "currentIntersecting");
-    l(this, "options");
-    l(this, "timer");
-    l(this, "timerInterval");
-    l(this, "slideGutterSize");
-    l(this, "showPagination");
-    l(this, "isInitialScroll");
-    l(this, "totalSlideEls");
-    l(this, "totalSlides");
-    l(this, "carouselObserver");
-    G || (document.addEventListener("touchstart", (v) => {
-      for (let E of v.changedTouches)
-        I.add(E.identifier);
-    }, { passive: !0 }), document.addEventListener("touchend", (v) => {
-      for (let E of v.changedTouches)
-        I.delete(E.identifier);
-    }, { passive: !0 }), h(Element.prototype, "addEventListener", m), h(window, "addEventListener", m), h(document, "addEventListener", m), h(Element.prototype, "removeEventListener", p), h(window, "removeEventListener", p), h(document, "removeEventListener", p)), this.carouselEl = t, this.scrollerEl = e, this.paginationEl = n, this.currentIndex = 0, this.navBtnEls = B, this.currentIntersecting = {}, this.options = o, o.autoplay && (this.timer = null, this.timerInterval = (o == null ? void 0 : o.delay) ?? 3500, this.startTimer()), this.slideGutterSize = (o == null ? void 0 : o.slideGutterSize) ?? 25, this.showPagination = o == null ? void 0 : o.showPagination, this.isInitialScroll = !0, this.cells = c, this.slideEls = [...e.children], this.totalSlideEls = this.slideEls.length, this.totalSlides = Math.ceil(this.cells.length / (this.options.cellsPerSlide ?? 1)), r(this, s, w).call(this), r(this, s, S).call(this), r(this, s, A).call(this);
+    w(this, s);
+    n(this, "carouselEl");
+    n(this, "scrollerEl");
+    n(this, "paginationEl");
+    n(this, "cells");
+    n(this, "currentIndex");
+    n(this, "slideEls");
+    n(this, "navBtnEls");
+    n(this, "currentIntersecting");
+    n(this, "options");
+    n(this, "timer");
+    n(this, "timerInterval");
+    n(this, "slideGutterSize");
+    n(this, "showPagination");
+    n(this, "isInitialScroll");
+    n(this, "totalSlideEls");
+    n(this, "totalSlides");
+    n(this, "carouselObserver");
+    this.carouselEl = t, this.scrollerEl = e, this.paginationEl = h, this.currentIndex = 0, this.navBtnEls = o, this.currentIntersecting = null, this.options = i, this.timer = null, this.timerInterval = (i == null ? void 0 : i.delay) ?? 3500, i.autoplay && this.startTimer(), this.slideGutterSize = (i == null ? void 0 : i.slideGutterSize) ?? 25, this.showPagination = i == null ? void 0 : i.showPagination, this.isInitialScroll = !0, this.cells = c, this.slideEls = [...e.children], this.totalSlideEls = this.slideEls.length, this.totalSlides = Math.ceil(this.cells.length / (this.options.cellsPerSlide ?? 1)), this.options.wrapAround && this.totalSlideEls !== this.totalSlides + 2 && console.warn("CarouselUtils: expected two sentinel slides in wrapAround mode; wrap-around navigation may misbehave."), l(this, s, b).call(this), l(this, s, y).call(this), l(this, s, x).call(this);
   }
   /**
    * starts the autoplay timer
@@ -100,7 +96,7 @@ class M {
    * @param {number} dir - a number representing the direction of scroll 1 for forward, -1 for backward
    */
   determineScrollAction(t) {
-    this.options.autoplay && this.timer !== null && this.clearTimer(), t === 1 ? this.currentIndex === this.totalSlides - 1 ? this.options.wrapAround && (this.scrollerEl.style.scrollBehavior = "auto", this.scrollerEl.scrollTo(0, 0), r(this, s, a).call(this, t), this.currentIndex = 0) : (r(this, s, a).call(this, t), this.currentIndex += 1) : t === -1 && (this.currentIndex === 0 ? this.options.wrapAround && (this.scrollerEl.style.scrollBehavior = "auto", this.scrollerEl.scrollTo(99999, 0), this.currentIndex = this.totalSlides - 1, r(this, s, a).call(this, t)) : (r(this, s, a).call(this, t), this.currentIndex -= 1)), this.options.autoplay && this.timer === null && this.startTimer();
+    this.options.autoplay && this.timer !== null && this.clearTimer(), t === 1 ? this.currentIndex === this.totalSlides - 1 ? this.options.wrapAround && (this.scrollerEl.style.scrollBehavior = "auto", this.scrollerEl.scrollTo(0, 0), l(this, s, f).call(this, t), this.currentIndex = 0) : (l(this, s, f).call(this, t), this.currentIndex += 1) : t === -1 && (this.currentIndex === 0 ? this.options.wrapAround && (this.scrollerEl.style.scrollBehavior = "auto", this.scrollerEl.scrollTo(this.scrollerEl.scrollWidth, 0), this.currentIndex = this.totalSlides - 1, l(this, s, f).call(this, t)) : (l(this, s, f).call(this, t), this.currentIndex -= 1)), this.options.autoplay && this.timer === null && this.startTimer();
   }
   /**
    * Navigates the carousel to a specific index
@@ -111,8 +107,8 @@ class M {
   navigateToIndex(t) {
     if (t === this.currentIndex) return;
     this.options.autoplay && this.clearTimer();
-    let e = t > this.currentIndex ? t - this.currentIndex : this.currentIndex - t, n = t > this.currentIndex ? 1 : -1;
-    this.currentIndex = t, r(this, s, a).call(this, n, e), this.options.autoplay && this.startTimer(), r(this, s, d).call(this);
+    let e = t > this.currentIndex ? t - this.currentIndex : this.currentIndex - t, h = t > this.currentIndex ? 1 : -1;
+    this.currentIndex = t, l(this, s, f).call(this, h, e), this.options.autoplay && this.startTimer(), l(this, s, v).call(this);
   }
   /**
    * Returns the current index of the carousel
@@ -127,29 +123,38 @@ class M {
    * @returns void
    */
   handleScrollEnd() {
-    if (this.timer === null && this.options.autoplay && this.startTimer(), this.currentIntersecting.target) {
-      const t = Number.parseInt(this.currentIntersecting.target.getAttribute("data-index") ?? "0", 10);
+    var t;
+    if (this.timer === null && this.options.autoplay && this.startTimer(), (t = this.currentIntersecting) != null && t.target) {
+      const e = Number.parseInt(this.currentIntersecting.target.getAttribute("data-index") ?? "0", 10);
       if (!this.options.wrapAround) {
-        this.currentIndex = t, r(this, s, d).call(this);
+        this.currentIndex = e, l(this, s, v).call(this);
         return;
       }
-      t === 0 ? (this.currentIndex = this.totalSlides - 1, r(this, s, u).call(this, { scrollport: this.scrollerEl, element: this.slideEls[this.totalSlides] })) : t === this.totalSlideEls - 1 ? (this.currentIndex = 0, r(this, s, u).call(this, { scrollport: this.scrollerEl, element: this.slideEls[1] })) : this.currentIndex = t - 1;
+      e === 0 ? (this.currentIndex = this.totalSlides - 1, l(this, s, E).call(this, { scrollport: this.scrollerEl, element: this.slideEls[this.slideEls.length - 2] })) : e === this.totalSlideEls - 1 ? (this.currentIndex = 0, l(this, s, E).call(this, { scrollport: this.scrollerEl, element: this.slideEls[1] })) : this.currentIndex = e - 1;
     }
-    r(this, s, d).call(this);
+    l(this, s, v).call(this);
+  }
+  /**
+   * Cleans up the timer and disconnects the IntersectionObserver.
+   * Call this when the carousel is unmounted.
+   */
+  destroy() {
+    var t;
+    this.clearTimer(), (t = this.carouselObserver) == null || t.disconnect();
   }
 }
 s = new WeakSet(), /**
  * Scrolls the carousel to a specific child element
  * @param {*} param0 - an object containing the scrollport element and the child element to scroll to 
  */
-u = function({ scrollport: t, element: e }) {
-  const n = this.slideGutterSize * 2 / 100;
-  t.style.scrollBehavior = "auto", t.scrollTo(Math.abs(t.offsetLeft - e.offsetLeft + e.clientWidth * n), 0);
+E = function({ scrollport: t, element: e }) {
+  const h = this.slideGutterSize * 2 / 100;
+  t.style.scrollBehavior = "auto", t.scrollTo(Math.abs(t.offsetLeft - e.offsetLeft + e.clientWidth * h), 0);
 }, /**
  * adds an observer to the scroller element that we can use to 
  * determine which slide is intersecting
  */
-w = function() {
+b = function() {
   this.carouselObserver = new IntersectionObserver((t) => {
     for (let e of t)
       e.isIntersecting && (this.currentIntersecting = e);
@@ -160,56 +165,58 @@ w = function() {
 }, /**
  * sets listeners on the slide elements for the observer
  */
-A = function() {
+x = function() {
   for (let t of this.slideEls)
     this.carouselObserver && this.carouselObserver.observe(t);
 }, /**
- * sets some intial settings for the carousel based on some of the options
+ * sets some initial settings for the carousel based on some of the options
  */
-S = function() {
+y = function() {
   var t, e;
-  this.options.wrapAround ? (this.scrollerEl.style.scrollBehavior = "auto", this.scrollerEl.scrollTo(-9999, 0), r(this, s, u).call(this, { scrollport: this.scrollerEl, element: this.scrollerEl.children[1] })) : this.options.showControls ? (this.navBtnEls && ((t = this.navBtnEls) != null && t.previous) && ((e = this.navBtnEls) == null || e.previous.setAttribute("disabled", "disabled")), r(this, s, d).call(this)) : r(this, s, g).call(this), this.totalSlides === 1 && this.slideEls[0].removeAttribute("inert");
+  this.options.wrapAround ? (this.scrollerEl.style.scrollBehavior = "auto", this.scrollerEl.scrollTo(0, 0), l(this, s, E).call(this, { scrollport: this.scrollerEl, element: this.scrollerEl.children[1] })) : this.options.showControls ? (this.navBtnEls && ((t = this.navBtnEls) != null && t.previous) && ((e = this.navBtnEls) == null || e.previous.setAttribute("disabled", "disabled")), l(this, s, v).call(this)) : l(this, s, I).call(this), this.totalSlideEls === 1 && this.slideEls[0].removeAttribute("inert");
 }, /**
  * Scrolls the carousel in a specified direction by a specified distance
  * 
  * @param {number} dir - a number representing the direction of scroll 1 for forward, -1 for backward 
  * @param {number} distance - a number representing the number of slides to scroll
  */
-a = function(t, e = 1) {
+f = function(t, e = 1) {
+  var c;
+  const h = ((c = this.slideEls[0]) == null ? void 0 : c.getBoundingClientRect().width) ?? 0;
   this.scrollerEl.style.scrollBehavior = "smooth", this.scrollerEl.scrollBy({
-    left: this.scrollerEl.clientWidth * ((100 - this.slideGutterSize * 2) / 100) * e * t,
+    left: h * e * t,
     top: 0,
     behavior: "smooth"
   });
 }, /**
- * Syncronizes various elements of the carousel
+ * Synchronizes various elements of the carousel
  * 
  * add methods here to have them sync 
  * when scroller is scrolled
  */
-d = function() {
-  r(this, s, g).call(this), this.showPagination && r(this, s, T).call(this), this.options.wrapAround || r(this, s, y).call(this);
+v = function() {
+  l(this, s, I).call(this), this.showPagination && l(this, s, A).call(this), this.options.wrapAround || l(this, s, S).call(this);
 }, /**
  * Sets the control arrow buttons to disabled if the carousel is at the start or end
  */
-y = function() {
-  this.navBtnEls.previous && this.navBtnEls.next && (this.navBtnEls.previous.removeAttribute("disabled"), this.navBtnEls.next.removeAttribute("disabled"), this.currentIndex === 0 && this.navBtnEls.previous.toggleAttribute("disabled"), this.currentIndex === this.slideEls.length - 1 && this.navBtnEls.next.toggleAttribute("disabled"));
+S = function() {
+  this.navBtnEls.previous && this.navBtnEls.next && (this.navBtnEls.previous.removeAttribute("disabled"), this.navBtnEls.next.removeAttribute("disabled"), this.currentIndex === 0 && this.navBtnEls.previous.toggleAttribute("disabled"), this.currentIndex === this.totalSlides - 1 && this.navBtnEls.next.toggleAttribute("disabled"));
 }, /**
  * Sets the inert attribute on all slides that are not the current slide
  */
-g = function() {
+I = function() {
   const t = this.options.wrapAround ? this.currentIndex + 1 : this.currentIndex;
-  this.slideEls.length === 1 ? this.slideEls[0].removeAttribute("inert") : this.slideEls.forEach((e, n) => {
-    e.toggleAttribute("inert", n !== t);
+  this.slideEls.length === 1 ? this.slideEls[0].removeAttribute("inert") : this.slideEls.forEach((e, h) => {
+    e.toggleAttribute("inert", h !== t);
   });
 }, /**
  * Sets the pagination indicator to the current slide
  */
-T = function() {
+A = function() {
   [...this.paginationEl.children].forEach((t, e) => {
-    e === this.currentIndex ? t.setAttribute("data-current", "true") : t.setAttribute("data-current", "false");
+    t.toggleAttribute("data-current", e === this.currentIndex);
   });
 };
 export {
-  M as default
+  C as default
 };

package/dist/components/Carousel/navigations/Pagination.js

@@ -1,11 +1,11 @@
 import { jsx as e } from "react/jsx-runtime";
-import { c as r } from "../../../Carousel.module-BsPaZX5L.mjs";
+import { c as r } from "../../../Carousel.module-Nwf_zL9b.mjs";
 function n({ slides: l, carouselId: s, ref: t }) {
   return /* @__PURE__ */ e("div", { className: `${r["carousel-nav"]} carousel-nav`, children: /* @__PURE__ */ e("ol", { className: r["carousel-nav__list"], ref: t, children: l.map((o, a) => /* @__PURE__ */ e(
     "li",
     {
       className: `${r["carousel-nav__item"]} carousel-nav__item`,
-      "data-current": a === 0 ? "true" : "false",
+      "data-current": a === 0 ? "" : void 0,
       title: `Navigate to slide ${a + 1}`
     },
     `carousel${s}-nav-${a}`

package/dist/components/Carousel/navigations/Pagination.test.js

@@ -1,65 +1,65 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as o } from "react/jsx-runtime";
 import { createRef as m } from "react";
-import { d as c, i as l, r as o, s as a, g as t } from "../../../react.esm-S2Q_NbYC.mjs";
+import { d as c, i as l, r, s as a, g as t } from "../../../react.esm-S2Q_NbYC.mjs";
 import "../../../index-BZQHStQa.mjs";
 import { Pagination as i } from "./Pagination.js";
 const n = Array.from({ length: 5 }), u = Array.from({ length: 1 });
 c("Pagination", () => {
   c("Rendering", () => {
     l("renders the correct number of list items", () => {
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: n }));
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: n }));
       const e = a.getAllByRole("listitem");
       t(e).toHaveLength(5);
     }), l("renders nothing inside the list for empty slides", () => {
-      const { container: e } = o(/* @__PURE__ */ r(i, { carouselId: "test", slides: [] })), s = e.querySelector("ol");
+      const { container: e } = r(/* @__PURE__ */ o(i, { carouselId: "test", slides: [] })), s = e.querySelector("ol");
       t(s).toBeInTheDocument(), t(s == null ? void 0 : s.children).toHaveLength(0);
     }), l("renders the outer nav div", () => {
-      const { container: e } = o(/* @__PURE__ */ r(i, { carouselId: "test", slides: n })), s = e.querySelector(".carousel-nav");
+      const { container: e } = r(/* @__PURE__ */ o(i, { carouselId: "test", slides: n })), s = e.querySelector(".carousel-nav");
       t(s).toBeInTheDocument();
     }), l("renders an ordered list", () => {
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: n })), t(a.getByRole("list")).toBeInTheDocument();
-      const { container: e } = o(/* @__PURE__ */ r(i, { carouselId: "test", slides: n }));
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: n })), t(a.getByRole("list")).toBeInTheDocument();
+      const { container: e } = r(/* @__PURE__ */ o(i, { carouselId: "test", slides: n }));
       t(e.querySelector("ol")).toBeInTheDocument();
     }), l("renders the correct number of items for a single slide", () => {
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: u })), t(a.getAllByRole("listitem")).toHaveLength(1);
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: u })), t(a.getAllByRole("listitem")).toHaveLength(1);
     }), l("renders the correct number of items for many slides", () => {
       const e = Array.from({ length: 12 });
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: e })), t(a.getAllByRole("listitem")).toHaveLength(12);
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: e })), t(a.getAllByRole("listitem")).toHaveLength(12);
     });
   }), c("data-current attribute", () => {
-    l('sets data-current="true" on the first item', () => {
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: n }));
+    l("sets data-current on the first item", () => {
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: n }));
       const e = a.getAllByRole("listitem");
-      t(e[0]).toHaveAttribute("data-current", "true");
-    }), l('sets data-current="false" on all items after the first', () => {
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: n }));
+      t(e[0]).toHaveAttribute("data-current");
+    }), l("does not set data-current on items after the first", () => {
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: n }));
       const e = a.getAllByRole("listitem");
       for (let s = 1; s < e.length; s++)
-        t(e[s]).toHaveAttribute("data-current", "false");
-    }), l('sets data-current="true" on the single item when there is one slide', () => {
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: u }));
+        t(e[s]).not.toHaveAttribute("data-current");
+    }), l("sets data-current on the single item when there is one slide", () => {
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: u }));
       const e = a.getByRole("listitem");
-      t(e).toHaveAttribute("data-current", "true");
+      t(e).toHaveAttribute("data-current");
     });
   }), c("title attribute", () => {
     l("sets the correct title on each item (1-indexed)", () => {
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: n })), a.getAllByRole("listitem").forEach((s, d) => {
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: n })), a.getAllByRole("listitem").forEach((s, d) => {
         t(s).toHaveAttribute("title", `Navigate to slide ${d + 1}`);
       });
     }), l('sets title="Navigate to slide 1" on a single-slide pagination', () => {
-      o(/* @__PURE__ */ r(i, { carouselId: "test", slides: u })), t(a.getByRole("listitem")).toHaveAttribute("title", "Navigate to slide 1");
+      r(/* @__PURE__ */ o(i, { carouselId: "test", slides: u })), t(a.getByRole("listitem")).toHaveAttribute("title", "Navigate to slide 1");
     });
   }), c("carouselId in keys", () => {
     l("uses carouselId in the rendered item titles to distinguish instances", () => {
-      const { container: e } = o(/* @__PURE__ */ r(i, { carouselId: "alpha", slides: n })), { container: s } = o(/* @__PURE__ */ r(i, { carouselId: "beta", slides: n }));
+      const { container: e } = r(/* @__PURE__ */ o(i, { carouselId: "alpha", slides: n })), { container: s } = r(/* @__PURE__ */ o(i, { carouselId: "beta", slides: n }));
       t(e.querySelectorAll("li")).toHaveLength(5), t(s.querySelectorAll("li")).toHaveLength(5);
     });
   }), c("ref forwarding", () => {
     l("forwards the ref to the <ol> element", () => {
-      const e = m(), { container: s } = o(/* @__PURE__ */ r(i, { carouselId: "test", ref: e, slides: n })), d = s.querySelector("ol");
+      const e = m(), { container: s } = r(/* @__PURE__ */ o(i, { carouselId: "test", ref: e, slides: n })), d = s.querySelector("ol");
       t(e.current).toBe(d);
     }), l("ref is null when no ref is provided", () => {
-      const { container: e } = o(/* @__PURE__ */ r(i, { carouselId: "test", slides: n }));
+      const { container: e } = r(/* @__PURE__ */ o(i, { carouselId: "test", slides: n }));
       t(e.querySelector("ol")).toBeInTheDocument();
     });
   });