@codeandfunction/callaloo 4.9.3 → 4.9.5

package/dist/components/Containers/CLCarousel/CLCarousel.js

@@ -1,546 +1,3 @@
 import '../../../assets/core.css';
 import './CLCarousel.css';
-import { defineComponent as xe, computed as w, createElementBlock as h, openBlock as f, Fragment as te, createCommentVNode as P, unref as e, normalizeClass as r, renderList as ke, createBlock as ze, createElementVNode as x, createVNode as y, withCtx as de, createTextVNode as ue, toDisplayString as ee, useCssVars as Ie, ref as v, onMounted as Ee, nextTick as Y, onUnmounted as We, watch as Be, renderSlot as ve } from "vue";
-import { _ as M } from "../../../chunks/CLButton.vue_vue_type_style_index_0_lang-MvhnNzVW.js";
-import { _ as Te } from "../../../chunks/CLText.vue_vue_type_style_index_0_lang-B-L8ECJL.js";
-import { CLPaginationType as E, CLColorVariants as A, CLSizes as D, CLIconSizes as j, CLIconNames as q, CLTextTypes as Ne, CLAlign as Q, CLOrder as Z, CLColors as Me } from "../../../index.js";
-import { i as _, d as Ae, e as Ve } from "../../../chunks/helper-qUkciePY.js";
-import { useHasSlotContent as Oe } from "../../../composables/useHasSlotContent.js";
-const ce = /* @__PURE__ */ xe({
-  name: "CLCarouselNavigation",
-  __name: "CLCarouselNavigation",
-  props: {
-    color: {},
-    currentPage: {},
-    enabled: { type: Boolean },
-    gotoPage: {},
-    moreAriaLabel: { default: "Navigate to page to see more results" },
-    moreLabel: {},
-    nextPageEnabled: { type: Boolean },
-    paginationType: {},
-    prefix: {},
-    prevPageEnabled: { type: Boolean },
-    showMore: {},
-    showNextItems: {},
-    showPrevItems: {},
-    totalPages: {},
-    variant: {}
-  },
-  setup(t) {
-    const l = t, n = w(() => [
-      `${l.prefix}__dots-container`
-    ]), V = w(() => [
-      `${l.prefix}__arrows-container`
-    ]), B = w(() => [
-      `${l.prefix}__numbered-container`
-    ]), p = w(() => [
-      `${l.prefix}__inline-container`
-    ]), c = w(() => [
-      `${l.prefix}__prev-page`
-    ]), $ = w(() => [
-      `${l.prefix}__next-page`
-    ]), F = w(() => [
-      `${l.prefix}__page-indicator`
-    ]), W = w(() => [
-      `${l.prefix}__show-more`
-    ]), L = (k) => l.currentPage === k, C = w(() => !l.enabled || !l.prevPageEnabled), m = w(() => !l.enabled || !l.nextPageEnabled);
-    return (k, R) => (f(), h(te, null, [
-      t.paginationType === e(E).Dots ? (f(), h("div", {
-        key: 0,
-        class: r(e(n))
-      }, [
-        (f(!0), h(te, null, ke(t.totalPages, (b) => (f(), ze(e(M), {
-          key: `dot-${b}`,
-          "aria-label": `Show page ${b}`,
-          color: t.color,
-          disabled: L(b),
-          height: "0.75rem",
-          "on-click": () => t.gotoPage(b),
-          width: "0.75rem",
-          variant: L(b) ? e(A).Outline : t.variant,
-          wrap: ""
-        }, null, 8, ["aria-label", "color", "disabled", "on-click", "variant"]))), 128))
-      ], 2)) : P("", !0),
-      t.paginationType === e(E).Numbered ? (f(), h("div", {
-        key: 1,
-        class: r(e(B))
-      }, [
-        x("div", {
-          class: r(e(c))
-        }, [
-          y(e(M), {
-            "aria-label": "Show previous page of slides",
-            color: t.color,
-            disabled: e(C),
-            "icon-before": e(q).ChevronLeft,
-            "icon-size": e(j).Tiny,
-            size: e(D).Tiny,
-            "on-click": t.showPrevItems,
-            variant: e(C) ? e(A).Text : t.variant
-          }, null, 8, ["color", "disabled", "icon-before", "icon-size", "size", "on-click", "variant"])
-        ], 2),
-        x("div", {
-          class: r(e(F))
-        }, [
-          y(e(Te), {
-            type: e(Ne).Small
-          }, {
-            default: de(() => [
-              ue(ee(t.currentPage) + " / " + ee(t.totalPages), 1)
-            ]),
-            _: 1
-          }, 8, ["type"])
-        ], 2),
-        x("div", {
-          class: r(e($))
-        }, [
-          y(e(M), {
-            "aria-label": "Show next page of slides",
-            color: t.color,
-            disabled: e(m),
-            "icon-before": e(q).ChevronRight,
-            "icon-size": e(j).Tiny,
-            size: e(D).Tiny,
-            "on-click": t.showNextItems,
-            variant: e(m) ? e(A).Text : t.variant
-          }, null, 8, ["color", "disabled", "icon-before", "icon-size", "size", "on-click", "variant"])
-        ], 2),
-        t.showMore ? (f(), h("div", {
-          key: 0,
-          class: r(e(W))
-        }, [
-          y(e(M), {
-            "aria-label": t.moreAriaLabel,
-            color: t.color,
-            size: e(D).Small,
-            "on-click": t.showMore,
-            variant: t.variant
-          }, {
-            default: de(() => [
-              ue(ee(t.moreLabel), 1)
-            ]),
-            _: 1
-          }, 8, ["aria-label", "color", "size", "on-click", "variant"])
-        ], 2)) : P("", !0)
-      ], 2)) : P("", !0),
-      t.paginationType === e(E).Arrows ? (f(), h("div", {
-        key: 2,
-        class: r(e(V))
-      }, [
-        x("div", {
-          class: r(e(c))
-        }, [
-          y(e(M), {
-            "aria-label": "Show previous page of slides",
-            color: t.color,
-            disabled: e(C),
-            "icon-before": e(q).ChevronLeft,
-            "icon-size": e(j).Tiny,
-            size: e(D).Tiny,
-            "on-click": t.showPrevItems,
-            variant: e(C) ? e(A).Text : t.variant
-          }, null, 8, ["color", "disabled", "icon-before", "icon-size", "size", "on-click", "variant"])
-        ], 2),
-        x("div", {
-          class: r(e($))
-        }, [
-          y(e(M), {
-            "aria-label": "Show next page of slides",
-            color: t.color,
-            disabled: e(m),
-            "icon-before": e(q).ChevronRight,
-            "icon-size": e(j).Tiny,
-            size: e(D).Tiny,
-            "on-click": t.showNextItems,
-            variant: e(m) ? e(A).Text : t.variant
-          }, null, 8, ["color", "disabled", "icon-before", "icon-size", "size", "on-click", "variant"])
-        ], 2)
-      ], 2)) : P("", !0),
-      t.paginationType === e(E).Inline ? (f(), h("div", {
-        key: 3,
-        class: r(e(p))
-      }, [
-        x("div", {
-          class: r(e(c))
-        }, [
-          y(e(M), {
-            "aria-label": "Show previous page of slides",
-            "align-content": e(Q).Center,
-            color: t.color,
-            disabled: e(C),
-            "icon-before": e(q).ChevronLeft,
-            "icon-size": e(j).Small,
-            size: e(D).Tiny,
-            "on-click": t.showPrevItems,
-            variant: e(C) ? e(A).Text : t.variant,
-            width: "30px",
-            height: "30px",
-            wrap: ""
-          }, null, 8, ["align-content", "color", "disabled", "icon-before", "icon-size", "size", "on-click", "variant"])
-        ], 2),
-        x("div", {
-          class: r(e($))
-        }, [
-          y(e(M), {
-            "aria-label": "Show next page of slides",
-            "align-content": e(Q).Center,
-            color: t.color,
-            disabled: e(m),
-            "icon-before": e(q).ChevronRight,
-            "icon-size": e(j).Small,
-            size: e(D).Tiny,
-            "on-click": t.showNextItems,
-            variant: e(m) ? e(A).Text : t.variant,
-            width: "30px",
-            height: "30px",
-            wrap: ""
-          }, null, 8, ["align-content", "color", "disabled", "icon-before", "icon-size", "size", "on-click", "variant"])
-        ], 2)
-      ], 2)) : P("", !0)
-    ], 64));
-  }
-}), De = ["data-testid"], Re = ["hidden"], He = /* @__PURE__ */ xe({
-  name: "CLCarousel",
-  __name: "CLCarousel",
-  props: {
-    color: { default: Me.Neutral },
-    controlAlign: { default: Q.Right },
-    controlPosition: { default: Z.Before },
-    enabled: { type: Boolean, default: !0 },
-    infinite: { type: Boolean, default: !1 },
-    moreLabel: { default: "More" },
-    onShowMore: {},
-    paginationType: { default: E.Numbered },
-    perPage: { default: 3 },
-    perPageByBreakpoints: {},
-    testId: { default: "clll-carousel" },
-    title: {},
-    variant: { default: A.Soft },
-    width: { default: "100%" }
-  },
-  setup(t) {
-    Ie((o) => ({
-      v3ba68b74: o.width,
-      v1ab12a15: e(oe)
-    }));
-    const l = "clll-carousel", n = t, V = v(), B = v(!1), p = v(1), c = v(n.perPage), $ = v(0), F = Oe("title"), W = v(!1), L = v(!1), C = v(!1), m = v(0), k = v(!1), R = v(), b = v(!1), z = v(), J = v(), oe = v("100%"), T = v(0), N = v(0), fe = () => {
-      if (n.perPageByBreakpoints?.length) {
-        c.value = n.perPage;
-        for (const [o, a] of n.perPageByBreakpoints)
-          window.matchMedia(`(min-width: ${o}px)`).matches && (c.value = a);
-      }
-    }, ge = () => {
-      if (z?.value && N.value) {
-        const a = Math.ceil(N.value / c.value);
-        T.value = a, n.infinite ? (L.value = !0, C.value = !0) : a > 1 && (L.value = !0);
-      }
-    }, Se = () => {
-      W.value || Y(() => {
-        let o, a;
-        const i = z?.value;
-        if (i) {
-          const s = i?.querySelectorAll(
-            `div[class="${l}__slides"] > *`
-          ) ?? [];
-          if (n.infinite && n.enabled && m.value > 0) {
-            const u = i.offsetWidth, g = u / c.value, d = i.scrollLeft, S = $.value / 2, I = g * S, O = g * m.value;
-            let U = d - I;
-            U < 0 && (U = O + U);
-            const G = Math.floor(U / u) + 1;
-            if (G < 1 ? p.value = T.value : G > T.value ? p.value = 1 : p.value = G, !W.value) {
-              if (d < I) {
-                W.value = !0;
-                const K = d + O;
-                i.scrollTo({ left: K, behavior: "auto" }), setTimeout(() => {
-                  W.value = !1;
-                }, 50);
-              } else if (d >= I + O) {
-                W.value = !0;
-                const K = d - O;
-                i.scrollTo({ left: K, behavior: "auto" }), setTimeout(() => {
-                  W.value = !1;
-                }, 50);
-              }
-            }
-          } else {
-            const u = N.value - 1;
-            for (let g = 0; g < T.value; g++) {
-              const d = c.value * (g + 1) - 1, S = d < u ? s[d] : s[u], I = d < u ? d : u;
-              Ve({ parent: i, child: S, leftOffset: 40, rightOffset: 40, threshold: 0.5 }) && (I === u ? (a = u, o = g + 1) : (a = I, o = g + 1));
-            }
-            a !== void 0 && a > -1 && o && (p.value = o, o > 1 && (C.value = !0), o === 1 && (C.value = !1), o < T.value && (L.value = !0), o === T.value && (L.value = !1));
-          }
-        }
-      });
-    }, he = (o) => {
-      V.value && Y(() => {
-        const a = Ae(V.value) && !F.value;
-        !a && (o.title || o.controlPosition === Z.Before) ? B.value = !1 : B.value = a;
-      });
-    }, le = (o) => {
-      const a = z?.value, i = a.offsetWidth;
-      if (a && i)
-        if (n.infinite && n.enabled && m.value > 0) {
-          const s = i / c.value, u = $.value / 2, g = s * u, d = o - 1, S = g + i * d;
-          a.scrollTo({ left: S, behavior: "smooth" });
-        } else {
-          const s = o - 1, u = i * s;
-          a.scrollTo({ left: u, behavior: "smooth" });
-        }
-    }, me = () => {
-      k.value = !0;
-      const o = c.value;
-      fe(), we(), ge();
-      const a = z?.value, i = a.offsetWidth;
-      if (a)
-        if (n.infinite && n.enabled && m.value > 0) {
-          const s = i / c.value, u = i / o, g = $.value / 2, d = u * g, I = a.scrollLeft - d;
-          if (o !== c.value) {
-            const K = a.querySelectorAll(
-              `div[class="${l}__slides"] > *`
-            ), Ce = Array.from(K), H = Ce.slice(g, Ce.length - g);
-            a.innerHTML = "", H.forEach((ye) => a.appendChild(ye));
-            const X = Math.min(c.value, H.length);
-            X > 0 && H.length > 0 && (H.slice(-X).forEach((se) => {
-              const re = se.cloneNode(!0);
-              a.insertBefore(re, H[0]);
-            }), H.slice(0, X).forEach((se) => {
-              const re = se.cloneNode(!0);
-              a.appendChild(re);
-            }), $.value = X * 2);
-          }
-          const O = $.value / 2, G = s * O + I;
-          Y(() => {
-            a.scrollLeft = G;
-          });
-        } else {
-          p.value = 1;
-          const s = p.value - 1, u = i * s;
-          a.scrollLeft = u;
-        }
-      _ && k.value && (window.clearTimeout(R.value), R.value = window.setTimeout(() => {
-        k.value && (k.value = !1), window.clearTimeout(R.value);
-      }, 300));
-    }, be = () => {
-      k.value || (b.value = !0, _ && b.value && (window.clearTimeout(J.value), J.value = window.setTimeout(() => {
-        b.value && ae(), window.clearTimeout(J.value);
-      }, 200)));
-    }, ae = () => {
-      k.value || (b.value = !1, Se());
-    }, we = () => {
-      const o = z?.value;
-      if (o) {
-        const a = o.offsetWidth;
-        N.value >= c.value ? oe.value = `${a / c.value}px` : oe.value = `${a / N.value}px`;
-      }
-    }, ne = () => {
-      const o = z?.value, a = o.offsetWidth;
-      if (o && a)
-        if (n.infinite && n.enabled && m.value > 0) {
-          const s = o.scrollLeft + a;
-          o.scrollTo({ left: s, behavior: "smooth" });
-        } else {
-          const i = p.value, s = a * i;
-          o.scrollTo({ left: s, behavior: "smooth" });
-        }
-    }, ie = () => {
-      const o = z?.value, a = o.offsetWidth;
-      if (o && a)
-        if (n.infinite && n.enabled && m.value > 0) {
-          const s = o.scrollLeft - a;
-          o.scrollTo({ left: s, behavior: "smooth" });
-        } else {
-          const i = p.value - 1, s = a * (i - 1);
-          o.scrollTo({ left: s, behavior: "smooth" });
-        }
-    };
-    Ee(() => {
-      if (_) {
-        window.addEventListener("resize", me);
-        const o = z?.value;
-        if (o) {
-          const a = o?.querySelectorAll(
-            `div[class="${l}__slides"] > *`
-          ) ?? [];
-          if (m.value = a.length, N.value = a.length, n.infinite && n.enabled && a.length > 0) {
-            const i = Array.from(a), s = Math.min(c.value, i.length);
-            i.slice(-s).forEach((d) => {
-              const S = d.cloneNode(!0);
-              o.insertBefore(S, i[0]);
-            }), i.slice(0, s).forEach((d) => {
-              const S = d.cloneNode(!0);
-              o.appendChild(S);
-            }), $.value = s * 2, Y(() => {
-              const I = o.offsetWidth / c.value * s;
-              o.scrollLeft = I;
-            });
-          }
-          o.addEventListener("scroll", be), o.addEventListener("scrollend", ae);
-        }
-        he(n), fe(), we(), ge();
-      }
-    }), We(() => {
-      if (_) {
-        window.removeEventListener("resize", me), R.value && window.clearTimeout(R.value), J.value && window.clearTimeout(J.value);
-        const o = z?.value;
-        o && (o.removeEventListener("scroll", be), o.removeEventListener("scrollend", ae));
-      }
-    });
-    const Pe = w(() => [
-      l,
-      `${l}--${n.controlAlign}`,
-      `${l}--${n.controlPosition}`,
-      `${l}--${n.paginationType}`,
-      n.enabled ? `${l}--enabled` : `${l}--disabled`,
-      B.value ? "" : `${l}--hastitle`,
-      n.onShowMore ? `${l}--has-more` : ""
-    ]), $e = w(() => [
-      `${l}__slide-controls`,
-      F.value ? `${l}__slide-controls--hascustomtitle` : ""
-    ]), Le = w(() => [
-      `${l}__slides`,
-      k.value ? `${l}__slides--resizing` : "",
-      b.value ? `${l}__slides--scrolling` : "",
-      W.value ? `${l}__slides--jumping` : ""
-    ]), pe = w(() => [
-      `${l}__navigation`,
-      `${l}__navigation--${n.controlAlign}`,
-      `${l}__navigation--${n.controlPosition}`
-    ]);
-    return Be(n, (o) => {
-      he(o);
-    }), (o, a) => (f(), h("div", {
-      class: r(e(Pe)),
-      "data-testid": t.testId
-    }, [
-      x("div", {
-        ref_key: "beforeControls",
-        ref: V,
-        class: r(e($e)),
-        hidden: e(B)
-      }, [
-        x("div", {
-          class: r(`${l}__custom-title`)
-        }, [
-          ve(o.$slots, "title")
-        ], 2),
-        t.title ? (f(), h("div", {
-          key: 0,
-          class: r(`${l}__title`)
-        }, [
-          y(e(Te), {
-            align: e(F) ? e(Q).Center : e(Q).Left,
-            label: "",
-            truncate: ""
-          }, {
-            default: de(() => [
-              ue(ee(t.title), 1)
-            ]),
-            _: 1
-          }, 8, ["align"])
-        ], 2)) : P("", !0),
-        t.controlPosition === e(Z).Before && ![e(E).Inline, e(E).Hidden].includes(t.paginationType) ? (f(), h(te, { key: 1 }, [
-          e(T) && e(N) > e(c) ? (f(), h("div", {
-            key: 0,
-            class: r(e(pe))
-          }, [
-            y(ce, {
-              color: t.color,
-              "current-page": e(p),
-              enabled: !e(b),
-              "goto-page": le,
-              "more-label": t.moreLabel,
-              "next-page-enabled": e(L),
-              "pagination-type": t.paginationType,
-              "prev-page-enabled": e(C),
-              prefix: l,
-              "show-more": t.onShowMore,
-              "show-next-items": ne,
-              "show-prev-items": ie,
-              "total-pages": e(T),
-              variant: t.variant
-            }, null, 8, ["color", "current-page", "enabled", "more-label", "next-page-enabled", "pagination-type", "prev-page-enabled", "show-more", "total-pages", "variant"])
-          ], 2)) : P("", !0)
-        ], 64)) : P("", !0)
-      ], 10, Re),
-      x("div", {
-        ref_key: "scrollContainer",
-        ref: z,
-        class: r(e(Le)),
-        tabindex: "0"
-      }, [
-        ve(o.$slots, "default")
-      ], 2),
-      t.controlPosition === e(Z).After && ![e(E).Inline, e(E).Hidden].includes(t.paginationType) ? (f(), h(te, { key: 0 }, [
-        e(T) && e(N) > e(c) ? (f(), h("div", {
-          key: 0,
-          class: r(`${l}__slide-controls`)
-        }, [
-          x("div", {
-            class: r(e(pe))
-          }, [
-            y(ce, {
-              color: t.color,
-              "current-page": e(p),
-              enabled: !e(b),
-              "goto-page": le,
-              "more-label": t.moreLabel,
-              "next-page-enabled": e(L),
-              "pagination-type": t.paginationType,
-              prefix: l,
-              "prev-page-enabled": e(C),
-              "show-more": t.onShowMore,
-              "show-next-items": ne,
-              "show-prev-items": ie,
-              "total-pages": e(T),
-              variant: t.variant
-            }, null, 8, ["color", "current-page", "enabled", "more-label", "next-page-enabled", "pagination-type", "prev-page-enabled", "show-more", "total-pages", "variant"])
-          ], 2)
-        ], 2)) : P("", !0)
-      ], 64)) : P("", !0),
-      t.paginationType === e(E).Inline ? (f(), h("div", {
-        key: 1,
-        class: r(`${l}__slide-controls ${l}__slide-controls--inline`)
-      }, [
-        x("div", {
-          class: r(`${l}__navigation`)
-        }, [
-          y(ce, {
-            color: t.color,
-            "current-page": e(p),
-            enabled: !e(b),
-            "goto-page": le,
-            "more-label": t.moreLabel,
-            "next-page-enabled": e(L),
-            "pagination-type": t.paginationType,
-            prefix: l,
-            "prev-page-enabled": e(C),
-            "show-more": t.onShowMore,
-            "show-next-items": ne,
-            "show-prev-items": ie,
-            "total-pages": e(T),
-            variant: t.variant
-          }, null, 8, ["color", "current-page", "enabled", "more-label", "next-page-enabled", "pagination-type", "prev-page-enabled", "show-more", "total-pages", "variant"])
-        ], 2)
-      ], 2)) : P("", !0)
-    ], 10, De));
-  }
-}), je = (t, l) => {
-  const n = t.__vccOpts || t;
-  for (const [V, B] of l)
-    n[V] = B;
-  return n;
-}, qe = {}, Fe = {
-  class: /* @__PURE__ */ r(["clll-carousel__slide"])
-};
-function Je(t, l) {
-  return f(), h("div", Fe, [
-    ve(t.$slots, "default")
-  ]);
-}
-const Ue = /* @__PURE__ */ je(qe, [["render", Je]]), Ge = He;
-Ge.Slide = Ue;
-export {
-  Ge as CLCarousel,
-  Ge as default
-};
+import{defineComponent as e,computed as a,createElementBlock as l,openBlock as o,Fragment as i,createCommentVNode as t,unref as n,normalizeClass as s,renderList as r,createBlock as c,createElementVNode as v,createVNode as d,withCtx as u,createTextVNode as p,toDisplayString as f,useCssVars as g,ref as h,onMounted as b,nextTick as m,onUnmounted as _,watch as w,renderSlot as y}from"vue";import{_ as x}from"../../../chunks/CLButton.vue_vue_type_style_index_0_lang-3vGTMU-k.js";import{_ as T}from"../../../chunks/CLText.vue_vue_type_style_index_0_lang-CMXJdE-D.js";import{CLPaginationType as $,CLColorVariants as k,CLSizes as L,CLIconSizes as z,CLIconNames as P,CLTextTypes as C,CLAlign as S,CLOrder as B,CLColors as E}from"../../../index.js";import{i as M,d as I,e as N}from"../../../chunks/helper-C542dSLs.js";import{useHasSlotContent as A}from"../../../composables/useHasSlotContent.js";const W=/* @__PURE__ */e({name:"CLCarouselNavigation",__name:"CLCarouselNavigation",props:{color:{},currentPage:{},enabled:{type:Boolean},gotoPage:{},moreAriaLabel:{default:"Navigate to page to see more results"},moreLabel:{},nextPageEnabled:{type:Boolean},paginationType:{},prefix:{},prevPageEnabled:{type:Boolean},showMore:{},showNextItems:{},showPrevItems:{},totalPages:{},variant:{}},setup(e){const g=e,h=a(()=>[`${g.prefix}__dots-container`]),b=a(()=>[`${g.prefix}__arrows-container`]),m=a(()=>[`${g.prefix}__numbered-container`]),_=a(()=>[`${g.prefix}__inline-container`]),w=a(()=>[`${g.prefix}__prev-page`]),y=a(()=>[`${g.prefix}__next-page`]),B=a(()=>[`${g.prefix}__page-indicator`]),E=a(()=>[`${g.prefix}__show-more`]),M=e=>g.currentPage===e,I=a(()=>!g.enabled||!g.prevPageEnabled),N=a(()=>!g.enabled||!g.nextPageEnabled);return(a,g)=>(o(),l(i,null,[e.paginationType===n($).Dots?(o(),l("div",{key:0,class:s(n(h))},[(o(!0),l(i,null,r(e.totalPages,a=>(o(),c(n(x),{key:`dot-${a}`,"aria-label":`Show page ${a}`,color:e.color,disabled:M(a),height:"0.75rem","on-click":()=>e.gotoPage(a),width:"0.75rem",variant:M(a)?n(k).Outline:e.variant,wrap:""},null,8,["aria-label","color","disabled","on-click","variant"]))),128))],2)):t("",!0),e.paginationType===n($).Numbered?(o(),l("div",{key:1,class:s(n(m))},[v("div",{class:s(n(w))},[d(n(x),{"aria-label":"Show previous page of slides",color:e.color,disabled:n(I),"icon-before":n(P).ChevronLeft,"icon-size":n(z).Tiny,size:n(L).Tiny,"on-click":e.showPrevItems,variant:n(I)?n(k).Text:e.variant},null,8,["color","disabled","icon-before","icon-size","size","on-click","variant"])],2),v("div",{class:s(n(B))},[d(n(T),{type:n(C).Small},{default:u(()=>[p(f(e.currentPage)+" / "+f(e.totalPages),1)]),_:1},8,["type"])],2),v("div",{class:s(n(y))},[d(n(x),{"aria-label":"Show next page of slides",color:e.color,disabled:n(N),"icon-before":n(P).ChevronRight,"icon-size":n(z).Tiny,size:n(L).Tiny,"on-click":e.showNextItems,variant:n(N)?n(k).Text:e.variant},null,8,["color","disabled","icon-before","icon-size","size","on-click","variant"])],2),e.showMore?(o(),l("div",{key:0,class:s(n(E))},[d(n(x),{"aria-label":e.moreAriaLabel,color:e.color,size:n(L).Small,"on-click":e.showMore,variant:e.variant},{default:u(()=>[p(f(e.moreLabel),1)]),_:1},8,["aria-label","color","size","on-click","variant"])],2)):t("",!0)],2)):t("",!0),e.paginationType===n($).Arrows?(o(),l("div",{key:2,class:s(n(b))},[v("div",{class:s(n(w))},[d(n(x),{"aria-label":"Show previous page of slides",color:e.color,disabled:n(I),"icon-before":n(P).ChevronLeft,"icon-size":n(z).Tiny,size:n(L).Tiny,"on-click":e.showPrevItems,variant:n(I)?n(k).Text:e.variant},null,8,["color","disabled","icon-before","icon-size","size","on-click","variant"])],2),v("div",{class:s(n(y))},[d(n(x),{"aria-label":"Show next page of slides",color:e.color,disabled:n(N),"icon-before":n(P).ChevronRight,"icon-size":n(z).Tiny,size:n(L).Tiny,"on-click":e.showNextItems,variant:n(N)?n(k).Text:e.variant},null,8,["color","disabled","icon-before","icon-size","size","on-click","variant"])],2)],2)):t("",!0),e.paginationType===n($).Inline?(o(),l("div",{key:3,class:s(n(_))},[v("div",{class:s(n(w))},[d(n(x),{"aria-label":"Show previous page of slides","align-content":n(S).Center,color:e.color,disabled:n(I),"icon-before":n(P).ChevronLeft,"icon-size":n(z).Small,size:n(L).Tiny,"on-click":e.showPrevItems,variant:n(I)?n(k).Text:e.variant,width:"30px",height:"30px",wrap:""},null,8,["align-content","color","disabled","icon-before","icon-size","size","on-click","variant"])],2),v("div",{class:s(n(y))},[d(n(x),{"aria-label":"Show next page of slides","align-content":n(S).Center,color:e.color,disabled:n(N),"icon-before":n(P).ChevronRight,"icon-size":n(z).Small,size:n(L).Tiny,"on-click":e.showNextItems,variant:n(N)?n(k).Text:e.variant,width:"30px",height:"30px",wrap:""},null,8,["align-content","color","disabled","icon-before","icon-size","size","on-click","variant"])],2)],2)):t("",!0)],64))}}),j=["data-testid"],H=["hidden"],O=/* @__PURE__ */e({name:"CLCarousel",__name:"CLCarousel",props:{color:{default:E.Neutral},controlAlign:{default:S.Right},controlPosition:{default:B.Before},enabled:{type:Boolean,default:!0},infinite:{type:Boolean,default:!1},moreLabel:{default:"More"},onShowMore:{},paginationType:{default:$.Numbered},perPage:{default:3},perPageByBreakpoints:{},testId:{default:"clll-carousel"},title:{},variant:{default:k.Soft},width:{default:"100%"}},setup(e){g(e=>({v3ba68b74:e.width,v1ab12a15:n(Q)}));const r="clll-carousel",c=e,x=h(),k=h(!1),L=h(1),z=h(c.perPage),P=h(0),C=A("title"),E=h(!1),O=h(!1),R=h(!1),q=h(0),D=h(!1),F=h(),G=h(!1),J=h(),K=h(),Q=h("100%"),U=h(0),V=h(0),X=()=>{if(c.perPageByBreakpoints?.length){z.value=c.perPage;for(const[e,a]of c.perPageByBreakpoints){window.matchMedia(`(min-width: ${e}px)`).matches&&(z.value=a)}}},Y=()=>{const e=J?.value;if(e&&V.value){const e=Math.ceil(V.value/z.value);U.value=e,c.infinite?(O.value=!0,R.value=!0):e>1&&(O.value=!0)}},Z=e=>{x.value&&m(()=>{const a=I(x.value)&&!C.value;a||!e.title&&e.controlPosition!==B.Before?k.value=a:k.value=!1})},ee=e=>{const a=J?.value,l=a.offsetWidth;if(a&&l)if(c.infinite&&c.enabled&&q.value>0){const o=l/z.value*(P.value/2)+l*(e-1);a.scrollTo({left:o,behavior:"smooth"})}else{const o=l*(e-1);a.scrollTo({left:o,behavior:"smooth"})}},ae=()=>{D.value=!0;const e=z.value;X(),ie(),Y();const a=J?.value,l=a.offsetWidth;if(a)if(c.infinite&&c.enabled&&q.value>0){const o=l/z.value,i=l/e,t=P.value/2,n=i*t,s=a.scrollLeft-n;if(e!==z.value){const e=a.querySelectorAll(`div[class="${r}__slides"] > *`),l=Array.from(e),o=l.slice(t,l.length-t);a.innerHTML="",o.forEach(e=>a.appendChild(e));const i=Math.min(z.value,o.length);if(i>0&&o.length>0){o.slice(-i).forEach(e=>{const l=e.cloneNode(!0);a.insertBefore(l,o[0])});o.slice(0,i).forEach(e=>{const l=e.cloneNode(!0);a.appendChild(l)}),P.value=2*i}}const c=o*(P.value/2)+s;m(()=>{a.scrollLeft=c})}else{L.value=1;const e=l*(L.value-1);a.scrollLeft=e}M&&D.value&&(window.clearTimeout(F.value),F.value=window.setTimeout(()=>{D.value&&(D.value=!1),window.clearTimeout(F.value)},300))},le=()=>{D.value||(G.value=!0,M&&G.value&&(window.clearTimeout(K.value),K.value=window.setTimeout(()=>{G.value&&oe(),window.clearTimeout(K.value)},200)))},oe=()=>{D.value||(G.value=!1,E.value||m(()=>{let e,a;const l=J?.value;if(l){const o=l?.querySelectorAll(`div[class="${r}__slides"] > *`)??[];if(c.infinite&&c.enabled&&q.value>0){const e=l.offsetWidth,a=e/z.value,o=l.scrollLeft,i=a*(P.value/2),t=a*q.value;let n=o-i;n<0&&(n=t+n);const s=Math.floor(n/e)+1;if(s<1?L.value=U.value:s>U.value?L.value=1:L.value=s,!E.value)if(o<i){E.value=!0;const e=o+t;l.scrollTo({left:e,behavior:"auto"}),setTimeout(()=>{E.value=!1},50)}else if(o>=i+t){E.value=!0;const e=o-t;l.scrollTo({left:e,behavior:"auto"}),setTimeout(()=>{E.value=!1},50)}}else{const i=V.value-1;for(let t=0;t<U.value;t++){const n=z.value*(t+1)-1,s=n<i?o[n]:o[i],r=n<i?n:i;N({parent:l,child:s,leftOffset:40,rightOffset:40,threshold:.5})&&(r===i?(a=i,e=t+1):(a=r,e=t+1))}void 0!==a&&a>-1&&e&&(L.value=e,e>1&&(R.value=!0),1===e&&(R.value=!1),e<U.value&&(O.value=!0),e===U.value&&(O.value=!1))}}}))},ie=()=>{const e=J?.value;if(e){const a=e.offsetWidth;V.value>=z.value?Q.value=a/z.value+"px":Q.value=a/V.value+"px"}},te=()=>{const e=J?.value,a=e.offsetWidth;if(e&&a)if(c.infinite&&c.enabled&&q.value>0){const l=e.scrollLeft+a;e.scrollTo({left:l,behavior:"smooth"})}else{const l=a*L.value;e.scrollTo({left:l,behavior:"smooth"})}},ne=()=>{const e=J?.value,a=e.offsetWidth;if(e&&a)if(c.infinite&&c.enabled&&q.value>0){const l=e.scrollLeft-a;e.scrollTo({left:l,behavior:"smooth"})}else{const l=a*(L.value-1-1);e.scrollTo({left:l,behavior:"smooth"})}};b(()=>{if(M){window.addEventListener("resize",ae);const e=J?.value;if(e){const a=e?.querySelectorAll(`div[class="${r}__slides"] > *`)??[];if(q.value=a.length,V.value=a.length,c.infinite&&c.enabled&&a.length>0){const l=Array.from(a),o=Math.min(z.value,l.length);l.slice(-o).forEach(a=>{const o=a.cloneNode(!0);e.insertBefore(o,l[0])});l.slice(0,o).forEach(a=>{const l=a.cloneNode(!0);e.appendChild(l)}),P.value=2*o,m(()=>{const a=e.offsetWidth/z.value*o;e.scrollLeft=a})}e.addEventListener("scroll",le),e.addEventListener("scrollend",oe)}Z(c),X(),ie(),Y()}}),_(()=>{if(M){window.removeEventListener("resize",ae),F.value&&window.clearTimeout(F.value),K.value&&window.clearTimeout(K.value);const e=J?.value;e&&(e.removeEventListener("scroll",le),e.removeEventListener("scrollend",oe))}});const se=a(()=>[r,`${r}--${c.controlAlign}`,`${r}--${c.controlPosition}`,`${r}--${c.paginationType}`,c.enabled?`${r}--enabled`:`${r}--disabled`,k.value?"":`${r}--hastitle`,c.onShowMore?`${r}--has-more`:""]),re=a(()=>[`${r}__slide-controls`,C.value?`${r}__slide-controls--hascustomtitle`:""]),ce=a(()=>[`${r}__slides`,D.value?`${r}__slides--resizing`:"",G.value?`${r}__slides--scrolling`:"",E.value?`${r}__slides--jumping`:""]),ve=a(()=>[`${r}__navigation`,`${r}__navigation--${c.controlAlign}`,`${r}__navigation--${c.controlPosition}`]);return w(c,e=>{Z(e)}),(a,c)=>(o(),l("div",{class:s(n(se)),"data-testid":e.testId},[v("div",{ref_key:"beforeControls",ref:x,class:s(n(re)),hidden:n(k)},[v("div",{class:s(`${r}__custom-title`)},[y(a.$slots,"title")],2),e.title?(o(),l("div",{key:0,class:s(`${r}__title`)},[d(n(T),{align:n(C)?n(S).Center:n(S).Left,label:"",truncate:""},{default:u(()=>[p(f(e.title),1)]),_:1},8,["align"])],2)):t("",!0),e.controlPosition!==n(B).Before||[n($).Inline,n($).Hidden].includes(e.paginationType)?t("",!0):(o(),l(i,{key:1},[n(U)&&n(V)>n(z)?(o(),l("div",{key:0,class:s(n(ve))},[d(W,{color:e.color,"current-page":n(L),enabled:!n(G),"goto-page":ee,"more-label":e.moreLabel,"next-page-enabled":n(O),"pagination-type":e.paginationType,"prev-page-enabled":n(R),prefix:r,"show-more":e.onShowMore,"show-next-items":te,"show-prev-items":ne,"total-pages":n(U),variant:e.variant},null,8,["color","current-page","enabled","more-label","next-page-enabled","pagination-type","prev-page-enabled","show-more","total-pages","variant"])],2)):t("",!0)],64))],10,H),v("div",{ref_key:"scrollContainer",ref:J,class:s(n(ce)),tabindex:"0"},[y(a.$slots,"default")],2),e.controlPosition!==n(B).After||[n($).Inline,n($).Hidden].includes(e.paginationType)?t("",!0):(o(),l(i,{key:0},[n(U)&&n(V)>n(z)?(o(),l("div",{key:0,class:s(`${r}__slide-controls`)},[v("div",{class:s(n(ve))},[d(W,{color:e.color,"current-page":n(L),enabled:!n(G),"goto-page":ee,"more-label":e.moreLabel,"next-page-enabled":n(O),"pagination-type":e.paginationType,prefix:r,"prev-page-enabled":n(R),"show-more":e.onShowMore,"show-next-items":te,"show-prev-items":ne,"total-pages":n(U),variant:e.variant},null,8,["color","current-page","enabled","more-label","next-page-enabled","pagination-type","prev-page-enabled","show-more","total-pages","variant"])],2)],2)):t("",!0)],64)),e.paginationType===n($).Inline?(o(),l("div",{key:1,class:s(`${r}__slide-controls ${r}__slide-controls--inline`)},[v("div",{class:s(`${r}__navigation`)},[d(W,{color:e.color,"current-page":n(L),enabled:!n(G),"goto-page":ee,"more-label":e.moreLabel,"next-page-enabled":n(O),"pagination-type":e.paginationType,prefix:r,"prev-page-enabled":n(R),"show-more":e.onShowMore,"show-next-items":te,"show-prev-items":ne,"total-pages":n(U),variant:e.variant},null,8,["color","current-page","enabled","more-label","next-page-enabled","pagination-type","prev-page-enabled","show-more","total-pages","variant"])],2)],2)):t("",!0)],10,j))}}),R=(e,a)=>{const l=e.__vccOpts||e;for(const[o,i]of a)l[o]=i;return l},q={},D={class:/*@__PURE__*/s(["clll-carousel__slide"])};const F=/*#__PURE__*/R(q,[["render",function(e,a){return o(),l("div",D,[y(e.$slots,"default")])}]]),G=O;G.Slide=F;export{G as CLCarousel,G as default};