@phillips/seldon 1.249.0 → 1.251.0

package/dist/components/Carousel/Carousel.js

@@ -1,50 +1,50 @@
-import { jsx as c } from "react/jsx-runtime";
-import { createContext as R, forwardRef as K, useState as f, useEffect as m, useCallback as u } from "react";
+import { jsx as m } from "react/jsx-runtime";
+import { createContext as K, forwardRef as L, useState as u, useEffect as d, useCallback as p } from "react";
 import { getCommonProps as W } from "../../utils/index.js";
 import j from "../../_virtual/index.js";
 import B from "../../node_modules/embla-carousel-class-names/esm/embla-carousel-class-names.esm.js";
 import G from "../../node_modules/embla-carousel-react/esm/embla-carousel-react.esm.js";
-import { WheelGesturesPlugin as L } from "../../node_modules/embla-carousel-wheel-gestures/dist/embla-carousel-wheel-gestures.esm.js";
-const q = R(null), z = K(
+import { WheelGesturesPlugin as q } from "../../node_modules/embla-carousel-wheel-gestures/dist/embla-carousel-wheel-gestures.esm.js";
+const z = K(null), F = L(
   ({
-    element: d,
-    loop: p = !1,
-    startIndex: w = 0,
-    onSlideChange: o,
-    className: x,
-    children: N,
-    columnGap: v,
-    useWheelGestures: C = !1,
-    disableDrag: n = !1,
-    disableNavigationDrag: b = null,
-    inViewThreshold: h = 0.99,
-    ...i
-  }, g) => {
-    const k = d || "div", { className: P, ...D } = W(i, "Carousel");
-    let l = {};
-    switch (b) {
+    element: w,
+    loop: x = !1,
+    startIndex: v = 0,
+    onSlideChange: r,
+    className: N,
+    children: C,
+    columnGap: b,
+    useWheelGestures: h = !1,
+    disableDrag: i = !1,
+    disableNavigationDrag: g = null,
+    inViewThreshold: k = 0.99,
+    ...c
+  }, P) => {
+    const t = w || "div", f = t === "ul" || t === "ol", { className: D, ...S } = W(c, "Carousel");
+    let o = {};
+    switch (g) {
       case "mobile":
-        l = { breakpoints: { "(max-width: 960px)": { watchDrag: !1 } } };
+        o = { breakpoints: { "(max-width: 960px)": { watchDrag: !1 } } };
         break;
       case "desktop":
-        l = { breakpoints: { "(min-width: 961px)": { watchDrag: !1 } } };
+        o = { breakpoints: { "(min-width: 961px)": { watchDrag: !1 } } };
         break;
       case "all":
-        l = { watchDrag: !1 };
+        o = { watchDrag: !1 };
         break;
       default:
-        l = {};
+        o = {};
     }
-    const [S, I] = f(!1), [E, y] = f(!1), [V, e] = G(
+    const [E, I] = u(!1), [y, V] = u(!1), [A, e] = G(
       {
-        loop: p,
-        startIndex: w,
-        inViewThreshold: h,
-        ...l
+        loop: x,
+        startIndex: v,
+        inViewThreshold: k,
+        ...o
       },
       [
-        ...C ? [
-          L({
+        ...h ? [
+          q({
             forceWheelAxis: "x"
           })
         ] : [],
@@ -53,72 +53,72 @@ const q = R(null), z = K(
         })
       ]
     );
-    m(() => {
-      n ? e?.reInit({
+    d(() => {
+      i ? e?.reInit({
         watchDrag: () => !1
       }) : e?.reInit({
         watchDrag: () => !0
       });
-    }, [n, e]);
-    const A = u(
-      (r) => {
-        if (r.key === "ArrowLeft") {
-          r.preventDefault(), e?.scrollPrev();
-          const s = e?.slideNodes().filter((a) => a === document.activeElement)[0]?.previousElementSibling;
-          s && s?.focus();
-        } else if (r.key === "ArrowRight") {
-          r.preventDefault(), e?.scrollNext();
-          const s = e?.slideNodes().filter((a) => a === document.activeElement)[0]?.nextElementSibling;
-          s && s?.focus();
+    }, [i, e]);
+    const R = p(
+      (s) => {
+        if (s.key === "ArrowLeft") {
+          s.preventDefault(), e?.scrollPrev();
+          const l = e?.slideNodes().filter((n) => n === document.activeElement)[0]?.previousElementSibling;
+          l && l?.focus();
+        } else if (s.key === "ArrowRight") {
+          s.preventDefault(), e?.scrollNext();
+          const l = e?.slideNodes().filter((n) => n === document.activeElement)[0]?.nextElementSibling;
+          l && l?.focus();
         }
       },
       [e]
-    ), t = u(
-      (r) => {
-        if (!r) return;
-        I(r?.canScrollPrev()), y(r?.canScrollNext());
-        const s = r.slidesInView()?.[0];
-        s !== void 0 && o?.(s);
+    ), a = p(
+      (s) => {
+        if (!s) return;
+        I(s?.canScrollPrev()), V(s?.canScrollNext());
+        const l = s.slidesInView()?.[0];
+        l !== void 0 && r?.(l);
       },
-      [o]
+      [r]
     );
-    return m(() => {
+    return d(() => {
       if (e)
-        return e.on("slidesInView", t), () => {
-          e.off("slidesInView", t);
+        return e.on("slidesInView", a), () => {
+          e.off("slidesInView", a);
         };
-    }, [e, t]), /* @__PURE__ */ c(
-      q.Provider,
+    }, [e, a]), /* @__PURE__ */ m(
+      z.Provider,
       {
         value: {
-          carouselRef: V,
+          carouselRef: A,
           api: e,
           scrollPrev: () => e?.scrollPrev(),
           scrollNext: () => e?.scrollNext(),
-          canScrollPrev: S,
-          canScrollNext: E,
-          columnGap: v,
-          onSlideChange: o
+          canScrollPrev: E,
+          canScrollNext: y,
+          columnGap: b,
+          onSlideChange: r
         },
-        children: /* @__PURE__ */ c(
-          k,
+        children: /* @__PURE__ */ m(
+          t,
           {
-            ref: g,
-            onKeyDownCapture: A,
-            className: j(P, x),
-            role: "region",
-            "aria-roledescription": "carousel",
-            ...i,
-            ...D,
-            children: N
+            ref: P,
+            onKeyDownCapture: R,
+            className: j(D, N),
+            role: f ? void 0 : "region",
+            "aria-roledescription": f ? void 0 : "carousel",
+            ...c,
+            ...S,
+            children: C
           }
         )
       }
     );
   }
 );
-z.displayName = "Carousel";
+F.displayName = "Carousel";
 export {
-  q as CarouselContext,
-  z as default
+  z as CarouselContext,
+  F as default
 };

package/dist/components/Carousel/CarouselArrows.js

@@ -1,46 +1,47 @@
-import { jsxs as b, jsx as r } from "react/jsx-runtime";
-import n from "../../_virtual/index.js";
-import { forwardRef as p, useCallback as l } from "react";
-import { getCommonProps as u } from "../../utils/index.js";
+import { jsxs as h, jsx as r } from "react/jsx-runtime";
+import l from "../../_virtual/index.js";
+import { forwardRef as u, useCallback as t } from "react";
+import { getCommonProps as p } from "../../utils/index.js";
 import { useCarousel as f } from "./utils.js";
 import a from "../Icon/Icon.js";
-const C = p(
-  ({ className: c, areArrowsAlwaysVisible: i, ...t }, d) => {
-    const { className: s, ...m } = u(t, "CarouselArrows"), { api: e } = f(), w = l(() => {
+const x = u(
+  ({ className: c, areArrowsAlwaysVisible: o, ...n }, d) => {
+    const { className: s, ...m } = p(n, "CarouselArrows"), { api: e } = f(), b = t(() => {
       if (e)
         if (e?.slidesInView().length <= 1)
           e.scrollPrev(!0);
         else {
-          const o = e?.slidesInView();
-          e?.scrollTo(Math.max(0, o[0] - (o.length ?? 1)));
+          const i = e?.slidesInView();
+          e?.scrollTo(Math.max(0, i[0] - (i.length ?? 1)));
         }
-    }, [e]), h = l(() => {
+    }, [e]), v = t(() => {
       if (e)
         if (e?.slidesInView().length <= 1)
           e?.scrollNext(!0);
         else {
-          const v = (e?.slidesInView()).slice(-1)[0] + 1;
-          e?.scrollTo(v);
+          const w = (e?.slidesInView()).slice(-1)[0] + 1;
+          e?.scrollTo(w);
         }
     }, [e]);
-    return /* @__PURE__ */ b(
+    return /* @__PURE__ */ h(
       "div",
       {
         ref: d,
         "aria-roledescription": "carousel-arrow-navigation",
-        className: n(`${s}`, c),
-        ...t,
+        className: l(`${s}`, c),
+        ...n,
         ...m,
         children: [
           /* @__PURE__ */ r(
             "button",
             {
               "data-testid": "prev-arrow",
-              className: n(`${s}-prev-btn`, {
-                [`${s}-prev-btn--always-visible`]: i,
+              "aria-label": "Previous slide",
+              className: l(`${s}-prev-btn`, {
+                [`${s}-prev-btn--always-visible`]: o,
                 [`${s}-prev-btn--disabled`]: !e?.canScrollPrev()
               }),
-              onClick: w,
+              onClick: b,
               children: /* @__PURE__ */ r("div", { className: `${s}-prev-btn__icon`, children: /* @__PURE__ */ r(a, { icon: "ChevronLeft", height: "2rem" }) })
             }
           ),
@@ -48,11 +49,12 @@ const C = p(
             "button",
             {
               "data-testid": "next-arrow",
-              className: n(`${s}-next-btn`, {
-                [`${s}-next-btn--always-visible`]: i,
+              "aria-label": "Next slide",
+              className: l(`${s}-next-btn`, {
+                [`${s}-next-btn--always-visible`]: o,
                 [`${s}-next-btn--disabled`]: !e?.canScrollNext()
               }),
-              onClick: h,
+              onClick: v,
               children: /* @__PURE__ */ r("div", { className: `${s}-next-btn__icon`, children: /* @__PURE__ */ r(a, { icon: "ChevronRight", height: "2rem" }) })
             }
           )
@@ -61,7 +63,7 @@ const C = p(
     );
   }
 );
-C.displayName = "CarouselArrows";
+x.displayName = "CarouselArrows";
 export {
-  C as default
+  x as default
 };

package/dist/components/Carousel/CarouselDot.js

@@ -21,7 +21,7 @@ const N = ({
     "button",
     {
       ref: p,
-      role: "button",
+      type: "button",
       onClick: m,
       className: r(`${o}__container`),
       ...l,

package/dist/components/Carousel/CarouselDots.js

@@ -1,14 +1,14 @@
-import { jsx as m } from "react/jsx-runtime";
-import E from "../../_virtual/index.js";
-import { forwardRef as G, useState as S, useRef as L, useCallback as l, useEffect as M, useMemo as q } from "react";
+import { jsx as u } from "react/jsx-runtime";
+import B from "../../_virtual/index.js";
+import { forwardRef as E, useState as S, useRef as L, useCallback as l, useEffect as M, useMemo as q } from "react";
 import { useCarousel as z } from "./utils.js";
 import { getCommonProps as A } from "../../utils/index.js";
 import { CarouselDot as F } from "./CarouselDot.js";
-const h = 10, C = 12, H = (h + C) / 2, J = G(
-  ({ className: v, maxDots: g = 9, position: V = "inline", numberOfSlides: b = 0, id: I, ...D }, k) => {
-    const { className: c, ...y } = A({ id: I, ...D }, "CarouselDots"), { api: t, onSlideChange: a } = z(), [R, T] = S(0), [i, O] = S(
-      Array.from({ length: b }, (e, o) => o)
-    ), r = L(null), [$, w] = S([]), N = l((e) => {
+const h = 10, C = 12, H = (h + C) / 2, J = E(
+  ({ className: b, maxDots: g = 9, position: V = "inline", numberOfSlides: k = 0, id: I, ...D }, y) => {
+    const { className: c, ...R } = A({ id: I, ...D }, "CarouselDots"), { api: t, onSlideChange: a } = z(), [T, G] = S(0), [i, O] = S(
+      Array.from({ length: k }, (e, o) => o)
+    ), r = L(null), [$, w] = S([]), v = l((e) => {
       r.current && r.current.scrollTo?.({
         left: e * (h + C) - r.current.offsetWidth / 2 + H,
         // Center dot in container
@@ -23,10 +23,10 @@ const h = 10, C = 12, H = (h + C) / 2, J = G(
       O(e.scrollSnapList());
     }, []), n = l(
       (e) => {
-        T(e.selectedScrollSnap()), N(e.selectedScrollSnap());
+        G(e.selectedScrollSnap()), v(e.selectedScrollSnap());
       },
-      [N]
-    ), u = l(
+      [v]
+    ), m = l(
       (e) => {
         a?.(e.selectedScrollSnap());
       },
@@ -34,45 +34,47 @@ const h = 10, C = 12, H = (h + C) / 2, J = G(
     );
     M(() => {
       if (t)
-        return f(t), n(t), t.on("reInit", f).on("reInit", n).on("select", n).on("settle", u), () => {
-          t.off("reInit", f).off("reInit", n).off("select", n).off("settle", u);
+        return f(t), n(t), t.on("reInit", f).on("reInit", n).on("select", n).on("settle", m), () => {
+          t.off("reInit", f).off("reInit", n).off("select", n).off("settle", m);
         };
-    }, [t, f, n, u]);
+    }, [t, f, n, m]);
     const s = q(() => $.sort((e, o) => e - o), [$]);
-    return /* @__PURE__ */ m(
+    return /* @__PURE__ */ u(
       "div",
       {
-        ref: k,
+        ref: y,
         role: "group",
         "aria-roledescription": "pagination",
         "aria-label": "pagination",
-        className: E(`${c}`, v, `${c}-${V}`),
+        className: B(`${c}`, b, `${c}-${V}`),
         ...D,
-        ...y,
-        children: /* @__PURE__ */ m("div", { className: `${c}-container`, children: /* @__PURE__ */ m(
+        ...R,
+        children: /* @__PURE__ */ u("div", { className: `${c}-container`, children: /* @__PURE__ */ u(
           "div",
           {
             style: { "--max-width": `${g * h + (g - 1) * C + 2}px` },
             className: `${c}-container-inner`,
             ref: r,
             children: i.map((e, o) => {
-              const W = R === o, d = s.indexOf(o), _ = (
+              const N = T === o, d = s.indexOf(o), W = (
                 // The dot is out of view
                 d === -1 || // The dot must be either among the first two or last two visible dots
                 (d <= 1 || d >= s.length - 2) && // Don't shrink if we're showing the first two dots (index 0,1) and both are visible
                 !(o <= 1 && s.includes(0) && s.includes(1)) && // Don't shrink if we're showing the last two dots and both are visible
                 !(o >= i.length - 2 && s.includes(i.length - 1) && s.includes(i.length - 2))
               );
-              return /* @__PURE__ */ m(
+              return /* @__PURE__ */ u(
                 F,
                 {
                   onClick: () => P(o),
-                  isSelected: W,
+                  isSelected: N,
+                  "aria-label": `Go to slide ${o + 1}`,
+                  "aria-current": N ? "true" : void 0,
                   scrollableContainerRef: r,
-                  onInViewChange: (j) => {
-                    w(j ? (p) => [...p, o] : (p) => p.filter((B) => B !== o));
+                  onInViewChange: (_) => {
+                    w(_ ? (p) => [...p, o] : (p) => p.filter((j) => j !== o));
                   },
-                  variant: _ ? "sm" : "md"
+                  variant: W ? "sm" : "md"
                 },
                 `${I}-dot-${o}`
               );

package/dist/components/Carousel/CarouselItem.js

@@ -1,28 +1,28 @@
-import { jsx as n } from "react/jsx-runtime";
-import i from "../../_virtual/index.js";
-import { forwardRef as c } from "react";
-import { getCommonProps as u } from "../../utils/index.js";
-import { useCarousel as p } from "./utils.js";
-const C = c(
-  ({ element: m, className: s, ...o }, a) => {
-    const t = m || "div", { className: e, ...l } = u(o, "CarouselItem"), { columnGap: r } = p();
-    return /* @__PURE__ */ n(
-      t,
+import { jsx as i } from "react/jsx-runtime";
+import c from "../../_virtual/index.js";
+import { forwardRef as u } from "react";
+import { getCommonProps as p } from "../../utils/index.js";
+import { useCarousel as C } from "./utils.js";
+const f = u(
+  ({ element: r, className: t, ...o }, a) => {
+    const m = r || "div", l = m === "li", { className: e, ...n } = p(o, "CarouselItem"), { columnGap: s } = C();
+    return /* @__PURE__ */ i(
+      m,
       {
         ref: a,
-        role: o.onClick ? "button" : "group",
+        role: l ? void 0 : o.onClick ? "button" : "group",
         "aria-roledescription": "slide",
-        className: i(`${e}`, s, {
-          [`${e}--gap-${r}`]: !!r,
+        className: c(`${e}`, t, {
+          [`${e}--gap-${s}`]: !!s,
           [`${e}--cursor-pointer`]: !!o.onClick
         }),
         ...o,
-        ...l
+        ...n
       }
     );
   }
 );
-C.displayName = "CarouselItem";
+f.displayName = "CarouselItem";
 export {
-  C as default
+  f as default
 };