@wikicasa-dev/components 2.1.2-alpha.3 → 2.1.2

package/dist/packages/components/lib/components/carousel/SwiperCarousel.vue.js

@@ -1,242 +0,0 @@
-import { defineComponent as J, reactive as Q, ref as $, useId as U, computed as f, onMounted as X, watch as Y, nextTick as L, createElementBlock as l, openBlock as u, normalizeClass as d, createElementVNode as v, createCommentVNode as b, renderSlot as M, Fragment as k, renderList as E, mergeProps as F, withModifiers as P } from "vue";
-import { Swiper as T } from "swiper";
-import x from "../../../../../node_modules/.pnpm/swiper@11.2.6/node_modules/swiper/modules/zoom.js";
-import '../../../../../assets/node_modules/.pnpm/swiper@11.2.6/node_modules/swiper/modules/zoom.css';import '../../../../../assets/node_modules/.pnpm/swiper@11.2.6/node_modules/swiper/swiper.css';/* empty css                                                                             */
-/* empty css                                                                                   */
-import "../../../../../node_modules/.pnpm/js-cookie@3.0.5/node_modules/js-cookie/dist/js.cookie.js";
-import { shallowCopyObjectTo as _ } from "../../../../../node_modules/.pnpm/@wikicasa-dev_utilities@1.1.21/node_modules/@wikicasa-dev/utilities/dist/utils/ObjectUtils.js";
-import "../../../../../_virtual/polyline.js";
-const ee = ["id"], te = ["id", "data-cy"], se = ["data-idx", "alt", "width", "height", "onLoad"], ie = ["id"], ae = ["loading", "alt"], me = /* @__PURE__ */ J({
-  inheritAttrs: !1,
-  __name: "SwiperCarousel",
-  props: {
-    id: {},
-    swiperOptions: {},
-    thumbSwiperOptions: {},
-    lazyLoadImages: { type: Boolean, default: !0 },
-    backgroundImage: { type: Boolean, default: !1 },
-    images: { default: () => [] },
-    artDirection: {},
-    shiftFirstImage: { type: Boolean, default: !1 }
-  },
-  emits: ["moved", "click", "firstSlideLoaded"],
-  setup(s, { expose: V, emit: B }) {
-    const y = B, r = Q({
-      swiperParams: { modules: [x] },
-      swiper: null,
-      initCarousel: !1
-    }), O = $(), D = $(!1), j = U(), p = f(() => s.id ?? j), g = f(() => s.swiperOptions?.slidesPerView || 1), A = f(() => s.thumbSwiperOptions?.slidesPerView || 1), N = f(() => !!s.swiperOptions?.keyboard), S = f(() => !!s.swiperOptions.navigation), C = f(() => !!s.swiperOptions.pagination), W = f(() => !!s.swiperOptions.autoplay), q = f(
-      () => s.swiperOptions?.effect || "slider"
-    ), K = () => {
-      s.swiperOptions && _(s.swiperOptions, r.swiperParams);
-    }, I = (e, i = -1) => {
-      if (!e.images)
-        return { src: e.src || "" };
-      let t = "", a = "", o = "";
-      if (s.artDirection) {
-        for (const n in s.artDirection) {
-          const { mq: c, width: m } = s.artDirection[n];
-          m && (o += o ? `,${c} ${parseInt(m)}px` : `${c} ${parseInt(m)}px`);
-        }
-        a = e.images.reduce((n, c, m) => {
-          const w = Object.values(s.artDirection)[m];
-          return !w || !w.width || (n += n ? `, ${c.storagePath} ${w.width}` : `${c.storagePath} ${w.width}`), n;
-        }, ""), t = e.images[0].storagePath;
-      } else {
-        let n = e.images;
-        e.images.length > 3 ? n = e.images.slice(2, 5) : s.shiftFirstImage && (n[0] = n[1]), a = n.reduce((c, m, w) => (w === 0 && (t = `${m.storagePath}`), w > 0 && (c += ", "), `${c}${m.storagePath} ${w + 1}x`), "");
-      }
-      const G = t, H = a;
-      return typeof g.value == "number" && i > g.value ? (t = "", a = "", { sizes: o, "data-src": G, "data-srcset": H }) : {
-        src: t,
-        srcset: a,
-        sizes: o,
-        loading: s.lazyLoadImages || i >= g.value ? "lazy" : void 0,
-        fetchpriority: !s.lazyLoadImages && i === 0 ? "high" : "low"
-      };
-    }, h = [], R = (e) => {
-      if (typeof g.value == "string") return;
-      const i = h[e];
-      if (i && !i.src && (i.src = i.dataset.src || "", i.srcset = i.dataset.srcset || ""), e < g.value || e + 1 >= (s.images ?? []).length)
-        return;
-      const t = h[e + 1];
-      t && !t.src && (t.src = t?.dataset.src || "", t.srcset = t?.dataset.srcset || "");
-    };
-    V({
-      moveTo(e, i = 0, t = !0) {
-        r.swiper?.slideTo(e, i, t);
-      }
-    });
-    const z = $(null), Z = (e) => {
-      e === 0 && h && h[e] && L(() => {
-        z.value?.setAttribute("data-first-slide-loaded", "true"), y("firstSlideLoaded");
-      });
-    };
-    return X(async () => {
-      if (K(), N.value) {
-        const { Keyboard: t } = await import("../../../lazyModules/Swiper/keyboard.js");
-        r.swiperParams.modules?.push(t), r.swiperParams.keyboard = s.swiperOptions.keyboard;
-      }
-      if (C.value) {
-        const { Pagination: t } = await import("../../../lazyModules/Swiper/pagination.js");
-        r.swiperParams.modules?.push(t), r.swiperParams.pagination = {
-          el: ".swiper-pagination",
-          renderFraction: (a, o) => `<div class="uikit-rounded-xs uikit-border-w-black uikit-border uikit-border-solid uikit-px-3 uikit-bg-white uikit-pt-[3px] uikit-pb-[3px]">
-                    <span data-cy="swiper-pagination-current" class="${a}"></span>
-                    /
-                    <span data-cy="swiper-pagination-total" class="${o}"></span>
-                 </div>`,
-          ...typeof r.swiperParams.pagination == "boolean" ? {} : r.swiperParams.pagination
-        };
-      }
-      if (S.value) {
-        const { Navigation: t } = await import("../../../lazyModules/Swiper/navigation.js");
-        r.swiperParams.modules?.push(t);
-        const a = {
-          ...s.swiperOptions.navigation.nextEl ?? {
-            nextEl: ".swiper-button-next"
-          },
-          ...s.swiperOptions.navigation.prevEl ?? {
-            prevEl: ".swiper-button-prev"
-          }
-        };
-        r.swiperParams.navigation = {
-          ...typeof s.swiperOptions.navigation == "object" ? s.swiperOptions.navigation : {},
-          ...a
-        };
-      }
-      if (W.value) {
-        const { Autoplay: t } = await import("../../../lazyModules/Swiper/autoplay.js");
-        r.swiperParams.modules?.push(t), r.swiperParams.autoplay = s.swiperOptions.autoplay;
-      }
-      const e = {
-        ...r.swiperParams,
-        on: {
-          init: () => {
-            D.value = !0;
-          },
-          slideChange: (t) => {
-            R(t.activeIndex), y("moved", { activeIndex: t.activeIndex });
-          }
-        }
-      };
-      let i = null;
-      if (s.thumbSwiperOptions) {
-        const [t, a, o] = await Promise.all([
-          import("../../../lazyModules/Swiper/thumbs.js"),
-          import("../../../lazyModules/Swiper/free-mode.js"),
-          import("../../../lazyModules/Swiper/controller.js")
-        ]);
-        r.swiperParams.modules?.push(t.Thumbs), r.swiperParams.modules?.push(o.Controller), i = new T(`#thumb_${p.value}`, {
-          ...s.thumbSwiperOptions,
-          modules: [a.FreeMode]
-        }), e.thumbs = {
-          swiper: i
-        };
-      }
-      e.lazyPreloadPrevNext = 1, r.swiper = new T(`#${p.value}`, e), O.value?.classList.remove("uikit-hidden");
-    }), Y(
-      () => s.images,
-      () => {
-        L(() => {
-          r.swiper?.update();
-        });
-      }
-    ), (e, i) => (u(), l("div", {
-      id: `root-${p.value}`,
-      ref_key: "root",
-      ref: z,
-      class: d(["swiper-carousel-root", e.$attrs["root-classes"]])
-    }, [
-      v("div", {
-        id: p.value,
-        "data-cy": e.$attrs["data-cy"],
-        class: d(["swiper", e.$attrs["swiper-classes"]])
-      }, [
-        v("div", {
-          ref_key: "swiperWrapper",
-          ref: O,
-          class: d(["swiper-wrapper", [
-            e.$attrs["swiper-wrapper-classes"],
-            q.value === "none" && "no-transition"
-          ]]),
-          onClick: i[0] || (i[0] = (t) => y("click"))
-        }, [
-          M(e.$slots, "default", {}, () => [
-            (u(!0), l(k, null, E(e.images, (t, a) => (u(), l("div", {
-              key: `swiper_${p.value}_${a}`,
-              class: d(["swiper-slide", e.$attrs["swiper-slide-classes"]])
-            }, [
-              v("div", {
-                class: d(["swiper-zoom-container", e.$attrs["swiper-zoom-container-classes"]])
-              }, [
-                e.backgroundImage ? b("", !0) : (u(), l("img", F({
-                  key: 0,
-                  ref_for: !0,
-                  ref: (o) => {
-                    h.push(o);
-                  },
-                  class: ["disable-select", [e.$attrs["slide-img-classes"] || t.classes]],
-                  "data-idx": `${p.value}-slide-img-${a}`
-                }, I(t, a), {
-                  alt: t.alt,
-                  itemprop: "image",
-                  width: t.width,
-                  height: t.height,
-                  onLoad: (o) => Z(a)
-                }), null, 16, se))
-              ], 2)
-            ], 2))), 128)),
-            M(e.$slots, "last_slide", {}, void 0, !0)
-          ], !0)
-        ], 2),
-        C.value ? (u(), l("div", {
-          key: 0,
-          class: d([e.$attrs["swiper-pagination-classes"], "swiper-pagination [&.swiper-pagination-fraction]:uikit-flex [&.swiper-pagination-fraction]:uikit-justify-center"]),
-          onClick: i[1] || (i[1] = P(() => {
-          }, ["stop"]))
-        }, null, 2)) : b("", !0),
-        S.value ? (u(), l(k, { key: 1 }, [
-          v("div", {
-            class: "swiper-button-prev",
-            "data-cy": "swiper-button-prev",
-            onClick: i[2] || (i[2] = P(() => {
-            }, ["stop"]))
-          }),
-          v("div", {
-            class: "swiper-button-next",
-            "data-cy": "swiper-button-next",
-            onClick: i[3] || (i[3] = P(() => {
-            }, ["stop"]))
-          })
-        ], 64)) : b("", !0)
-      ], 10, te),
-      e.thumbSwiperOptions ? (u(), l("div", {
-        key: 0,
-        id: `thumb_${p.value}`,
-        thumbsSlider: "",
-        class: d(["swiper", e.$attrs["thumb-swiper-classes"]])
-      }, [
-        v("div", {
-          class: d(["swiper-wrapper", e.$attrs["thumb-swiper-wrapper-classes"]])
-        }, [
-          (u(!0), l(k, null, E(e.images, (t, a) => (u(), l("div", {
-            key: `thumb_${p.value}_${a}`,
-            class: d(["swiper-slide", e.$attrs["thumb-img-wrapper-classes"]])
-          }, [
-            v("img", F({
-              class: e.$attrs["thumb-img-classes"],
-              ref_for: !0
-            }, I(t), {
-              loading: a >= A.value ? "lazy" : void 0,
-              alt: t.alt
-            }), null, 16, ae)
-          ], 2))), 128))
-        ], 2)
-      ], 10, ie)) : b("", !0)
-    ], 10, ee));
-  }
-});
-export {
-  me as default
-};