@wikicasa-dev/components 2.4.2-alpha.13 → 2.4.2-alpha.14

package/dist/Swiper/Autoplay/index.js

@@ -1,4 +1,4 @@
-import '../../assets/swiper-keyboard.css';/* empty css                                                                              */
+import '../../assets/swiper-thumbs.css';/* empty css                                                                              */
 import { Autoplay as p } from "swiper/modules";
 export {
   p as default

package/dist/Swiper/Controller/index.js

@@ -1,4 +1,4 @@
-import '../../assets/swiper-keyboard.css';/* empty css                                                                                */
+import '../../assets/swiper-thumbs.css';/* empty css                                                                                */
 import { Controller as e } from "swiper/modules";
 export {
   e as default

package/dist/Swiper/Keyboard/index.js

@@ -1,4 +1,4 @@
-import '../../assets/swiper-keyboard.css';/* empty css                                                                              */
+import '../../assets/swiper-thumbs.css';/* empty css                                                                              */
 import { Keyboard as e } from "swiper/modules";
 export {
   e as default

package/dist/Swiper/Thumbs/index.js

@@ -1,4 +1,4 @@
-import '../../assets/swiper-keyboard.css';/* empty css                                                                            */
+import '../../assets/swiper-thumbs.css';/* empty css                                                                            */
 import { Thumbs as t } from "swiper/modules";
 export {
   t as default

package/dist/Swiper/factory.js

@@ -1,20 +1,13 @@
-const c = async (o, r, t) => {
-  const n = t.map((e) => e.loader()), [{ Swiper: l }, ...p] = await Promise.all([
+const p = async (s, t, o) => {
+  const r = o.map((e) => e.loader()), [{ Swiper: i }, ...n] = await Promise.all([
     import("./index.js"),
-    ...n
-  ]), s = t.reduce(
-    (e, i) => (console.log("DEBUG:", {
-      left: e,
-      right: i.options
-    }), Object.assign(e, i.options)),
-    { ...r, modules: p }
+    ...r
+  ]), a = o.reduce(
+    (e, c) => Object.assign(e, c.options),
+    { ...t, modules: n }
   );
-  return console.log("DEBUG:createSwiper", {
-    container: o,
-    mergedOptions: s,
-    baseOptions: r
-  }), new l(o, s);
+  return new i(s, a);
 };
 export {
-  c as createSwiper
+  p as createSwiper
 };

package/dist/assets/SwiperCarousel.css

@@ -1 +1 @@
-.uikit-carousel.swiper{visibility:hidden}.uikit-carousel.swiper.swiper-initialized{visibility:visible}.swiper-pagination-bullet{--swiper-pagination-color: #ccc}.swiper-pagination-bullet-active{--swiper-pagination-color: #fff}
+.swiper-pagination-bullet{--swiper-pagination-color: #ccc}.swiper-pagination-bullet-active{--swiper-pagination-color: #fff}

package/dist/assets/SwiperCarousel2.css

@@ -1 +1 @@
-.no-transition[data-v-d2a14d6f]{transition-duration:0ms!important}.disable-select[data-v-d2a14d6f]{-webkit-user-select:none;-moz-user-select:none;user-select:none}.swiper-button-disabled[data-v-d2a14d6f]{pointer-events:auto!important}
+.no-transition[data-v-f8f3d52a]{transition-duration:0ms!important}.disable-select[data-v-f8f3d52a]{-webkit-user-select:none;-moz-user-select:none;user-select:none}.swiper-button-disabled[data-v-f8f3d52a]{pointer-events:auto!important}

package/dist/components/carousel/SwiperCarousel.d.ts

@@ -18,6 +18,7 @@ declare function __VLS_template(): {
     slots: {
         default?(_: {}): any;
         last_slide?(_: {}): any;
+        placeholder?(_: {}): any;
     };
     refs: {
         swiperRef: HTMLDivElement;

package/dist/components/carousel/SwiperCarousel.js

@@ -2,7 +2,7 @@ import o from "../../packages/components/lib/components/carousel/SwiperCarousel.
 import '../../assets/SwiperCarousel2.css';import '../../assets/SwiperCarousel.css';/* empty css                                                                    */
 /* empty css                                                                    */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const e = /* @__PURE__ */ r(o, [["__scopeId", "data-v-d2a14d6f"]]);
+const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-f8f3d52a"]]);
 export {
-  e as default
+  m as default
 };

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

@@ -1,13 +1,13 @@
-import { defineComponent as W, shallowRef as z, useTemplateRef as C, useId as X, computed as Y, onMounted as x, watch as _, nextTick as M, createElementBlock as n, openBlock as l, normalizeClass as d, createElementVNode as w, createCommentVNode as y, unref as ee, renderSlot as L, Fragment as k, renderList as V, mergeProps as B, withModifiers as O } from "vue";
-import { createSwiper as R } from "../../../../../Swiper/factory.js";
-import { AutoplayModule as te } from "../../../../../Swiper/Autoplay/factory.js";
-import { FreemodeModule as ie } from "../../../../../Swiper/FreeMode/factory.js";
-import { KeyboardModule as se } from "../../../../../Swiper/Keyboard/factory.js";
-import { NavigationModule as ae } from "../../../../../Swiper/Navigation/factory.js";
-import { PaginationModule as re } from "../../../../../Swiper/Pagination/factory.js";
-import { ThumbsModule as oe } from "../../../../../Swiper/Thumbs/factory.js";
-import { ZoomModule as ne } from "../../../../../Swiper/Zoom/factory.js";
-const le = ["id", "data-cy"], de = ["data-idx", "alt", "width", "height", "onLoad"], ue = ["id"], ce = ["alt"], $e = /* @__PURE__ */ W({
+import { defineComponent as W, shallowRef as L, useTemplateRef as V, useId as X, computed as Y, onMounted as x, watch as _, nextTick as S, createElementBlock as n, openBlock as l, Fragment as $, withDirectives as ee, renderSlot as I, createCommentVNode as h, createElementVNode as f, normalizeClass as u, unref as te, renderList as R, mergeProps as T, withModifiers as P, vShow as ie } from "vue";
+import { createSwiper as B } from "../../../../../Swiper/factory.js";
+import { AutoplayModule as se } from "../../../../../Swiper/Autoplay/factory.js";
+import { FreemodeModule as ae } from "../../../../../Swiper/FreeMode/factory.js";
+import { KeyboardModule as re } from "../../../../../Swiper/Keyboard/factory.js";
+import { NavigationModule as oe } from "../../../../../Swiper/Navigation/factory.js";
+import { PaginationModule as ne } from "../../../../../Swiper/Pagination/factory.js";
+import { ThumbsModule as le } from "../../../../../Swiper/Thumbs/factory.js";
+import { ZoomModule as ue } from "../../../../../Swiper/Zoom/factory.js";
+const de = ["id", "data-cy"], ce = ["data-idx", "alt", "width", "height", "onLoad"], pe = ["id"], we = ["alt"], Oe = /* @__PURE__ */ W({
   inheritAttrs: !1,
   __name: "SwiperCarousel",
   props: {
@@ -21,8 +21,8 @@ const le = ["id", "data-cy"], de = ["data-idx", "alt", "width", "height", "onLoa
     shiftFirstImage: { type: Boolean, default: !1 }
   },
   emits: ["moved", "click", "firstSlideLoaded", "init"],
-  setup(t, { expose: T, emit: D }) {
-    const h = D, u = z(null), $ = C("swiperRef"), F = C("thumbsRef"), A = z(!1), N = X(), m = Y(() => t.id ?? N), v = t.swiperOptions?.slidesPerView || 1, j = !!t.swiperOptions?.keyboard, S = !!t.swiperOptions.navigation, I = !!t.swiperOptions.pagination, E = !!t.swiperOptions.autoplay, q = t.swiperOptions?.effect || "slider", P = (e, i = -1, s = !1) => {
+  setup(t, { expose: D, emit: F }) {
+    const b = F, d = L(null), k = V("swiperRef"), A = V("thumbsRef"), O = L(!1), E = X(), m = Y(() => t.id ?? E), v = t.swiperOptions?.slidesPerView || 1, N = !!t.swiperOptions?.keyboard, z = !!t.swiperOptions.navigation, M = !!t.swiperOptions.pagination, j = !!t.swiperOptions.autoplay, q = t.swiperOptions?.effect || "slider", C = (e, i = -1, s = !1) => {
       if (!e.images)
         return { src: e.src || "" };
       let a = "", r = "", g = "";
@@ -32,15 +32,15 @@ const le = ["id", "data-cy"], de = ["data-idx", "alt", "width", "height", "onLoa
           p && (g += g ? `,${c} ${parseInt(p)}px` : `${c} ${parseInt(p)}px`);
         }
         r = e.images.reduce((o, c, p) => {
-          const f = Object.values(t.artDirection)[p];
-          return !f || !f.width || (o += o ? `, ${c.storagePath} ${f.width}` : `${c.storagePath} ${f.width}`), o;
+          const w = Object.values(t.artDirection)[p];
+          return !w || !w.width || (o += o ? `, ${c.storagePath} ${w.width}` : `${c.storagePath} ${w.width}`), o;
         }, ""), a = e.images[0].storagePath;
       } else {
         let o = e.images;
-        e.images.length > 3 ? o = e.images.slice(2, 5) : t.shiftFirstImage && (o[0] = o[1]), r = o.reduce((c, p, f) => (f === 0 && (a = `${p.storagePath}`), f > 0 && (c += ", "), `${c}${p.storagePath} ${f + 1}x`), "");
+        e.images.length > 3 ? o = e.images.slice(2, 5) : t.shiftFirstImage && (o[0] = o[1]), r = o.reduce((c, p, w) => (w === 0 && (a = `${p.storagePath}`), w > 0 && (c += ", "), `${c}${p.storagePath} ${w + 1}x`), "");
       }
-      const J = a, Q = r;
-      return typeof v == "number" && i > v ? (a = "", r = "", { sizes: g, "data-src": J, "data-srcset": Q }) : s ? {
+      const Q = a, U = r;
+      return typeof v == "number" && i > v ? (a = "", r = "", { sizes: g, "data-src": Q, "data-srcset": U }) : s ? {
         src: a,
         srcset: r,
         sizes: g,
@@ -53,43 +53,41 @@ const le = ["id", "data-cy"], de = ["data-idx", "alt", "width", "height", "onLoa
         loading: t.lazyLoadImages || i >= v ? "lazy" : void 0,
         fetchpriority: !t.lazyLoadImages && i === 0 ? "high" : "low"
       };
-    }, b = [], G = (e) => {
+    }, y = [], K = (e) => {
       if (typeof v == "string") return;
-      const i = b[e];
+      const i = y[e];
       if (i && !i.src && (i.src = i.dataset.src || "", i.srcset = i.dataset.srcset || ""), e < v || e + 1 >= (t.images ?? []).length)
         return;
-      const s = b[e + 1];
+      const s = y[e + 1];
       s && !s.src && (s.src = s?.dataset.src || "", s.srcset = s?.dataset.srcset || "");
-    }, K = (e) => {
-      e || !b?.[e] || M(() => {
-        $.value?.setAttribute("data-first-slide-loaded", "true"), h("firstSlideLoaded");
+    }, Z = (e) => {
+      e || !y?.[e] || S(() => {
+        k.value?.setAttribute("data-first-slide-loaded", "true"), b("firstSlideLoaded");
       });
-    }, U = (e) => t.thumbSwiperOptions ? R(e, t.thumbSwiperOptions, [
-      ie(t.thumbSwiperOptions.freeMode)
-    ]) : null, Z = async (e, i) => {
-      console.log("DEBUG:SwiperCarousel", {
-        rootEl: e,
-        thumbEl: i
-      });
-      const s = i ? await U(i) : null;
-      u.value = await R(
+    }, G = (e) => t.thumbSwiperOptions ? B(e, t.thumbSwiperOptions, [
+      ae(t.thumbSwiperOptions.freeMode)
+    ]) : null, H = async (e, i) => {
+      const s = i ? await G(i) : null;
+      d.value = await B(
         e,
         {
           on: {
             init: () => {
-              A.value = !0, h("init");
+              S(() => {
+                O.value = !0, b("init");
+              });
             },
             slideChange: (a) => {
-              G(a.activeIndex), h("moved", { activeIndex: a.activeIndex });
+              K(a.activeIndex), b("moved", { activeIndex: a.activeIndex });
             }
           },
           ...s ? { thumbs: { ...t.swiperOptions.thumbs, swiper: s } } : {},
           ...t.swiperOptions
         },
         [
-          ne(t.swiperOptions.zoom),
-          j ? se(t.swiperOptions.keyboard) : void 0,
-          I ? re({
+          ue(t.swiperOptions.zoom),
+          N ? re(t.swiperOptions.keyboard) : void 0,
+          M ? ne({
             el: ".swiper-pagination",
             renderFraction: (a, r) => `<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>
@@ -98,126 +96,131 @@ const le = ["id", "data-cy"], de = ["data-idx", "alt", "width", "height", "onLoa
           </div>`,
             ...typeof t.swiperOptions.pagination == "boolean" ? {} : t.swiperOptions.pagination
           }) : void 0,
-          S ? ae({
+          z ? oe({
             nextEl: ".swiper-button-next",
             prevEl: ".swiper-button-prev",
             ...typeof t.swiperOptions.navigation == "boolean" ? {} : t.swiperOptions.navigation
           }) : void 0,
-          E ? te(t.swiperOptions.autoplay) : void 0,
+          j ? se(t.swiperOptions.autoplay) : void 0,
           //Thumbs specific modules
-          s ? oe() : void 0
+          s ? le() : void 0
         ].filter(Boolean)
       );
     };
     x(() => {
-      $.value && setTimeout(() => Z($.value, F.value));
+      k.value && setTimeout(() => H(k.value, A.value));
     });
-    const H = (e) => {
-      !u.value || u.value.params.slidesPerView === e || (u.value.params.slidesPerView = e, u.value.update());
+    const J = (e) => {
+      !d.value || d.value.params.slidesPerView === e || (d.value.params.slidesPerView = e, d.value.update());
     };
     return _(
       () => t.images,
       () => {
-        M(() => {
-          u.value?.update();
+        S(() => {
+          d.value?.update();
         });
       }
-    ), T({
-      swiper: u,
+    ), D({
+      swiper: d,
       moveTo(e, i = 0, s = !0) {
-        u.value?.slideTo(e, i, s);
+        d.value?.slideTo(e, i, s);
       },
-      updateSlidesPerView: H
-    }), (e, i) => (l(), n("div", {
-      class: d(["swiper-carousel-root", e.$attrs["root-classes"]])
-    }, [
-      w("div", {
-        ref: "swiperRef",
-        id: m.value,
-        "data-cy": e.$attrs["data-cy"],
-        class: d(["swiper uikit-carousel", e.$attrs["swiper-classes"]])
+      updateSlidesPerView: J
+    }), (e, i) => (l(), n($, null, [
+      ee(f("div", {
+        class: u(["swiper-carousel-root", e.$attrs["root-classes"]])
       }, [
-        w("div", {
-          class: d(["swiper-wrapper", [
-            e.$attrs["swiper-wrapper-classes"],
-            ee(q) === "none" && "no-transition"
-          ]]),
-          onClick: i[0] || (i[0] = (s) => h("click"))
+        f("div", {
+          ref: "swiperRef",
+          id: m.value,
+          "data-cy": e.$attrs["data-cy"],
+          class: u(["swiper uikit-carousel", e.$attrs["swiper-classes"]])
         }, [
-          L(e.$slots, "default", {}, () => [
-            (l(!0), n(k, null, V(t.images, (s, a) => (l(), n("div", {
-              key: `swiper_${m.value}_${a}`,
-              class: d(["swiper-slide", e.$attrs["swiper-slide-classes"]])
-            }, [
-              w("div", {
-                class: d(["swiper-zoom-container", e.$attrs["swiper-zoom-container-classes"]])
+          f("div", {
+            class: u(["swiper-wrapper", [
+              e.$attrs["swiper-wrapper-classes"],
+              te(q) === "none" && "no-transition"
+            ]]),
+            onClick: i[0] || (i[0] = (s) => b("click"))
+          }, [
+            I(e.$slots, "default", {}, () => [
+              (l(!0), n($, null, R(t.images, (s, a) => (l(), n("div", {
+                key: `swiper_${m.value}_${a}`,
+                class: u(["swiper-slide", e.$attrs["swiper-slide-classes"]])
               }, [
-                t.backgroundImage ? y("", !0) : (l(), n("img", B({
-                  key: 0,
-                  ref_for: !0,
-                  ref: (r) => {
-                    b.push(r);
-                  },
-                  class: ["disable-select", [e.$attrs["slide-img-classes"] || s.classes]],
-                  "data-idx": `${m.value}-slide-img-${a}`
-                }, { ref_for: !0 }, P(s, a), {
-                  alt: s.alt,
-                  itemprop: "image",
-                  width: s.width,
-                  height: s.height,
-                  onLoad: (r) => K(a)
-                }), null, 16, de))
-              ], 2)
-            ], 2))), 128)),
-            L(e.$slots, "last_slide", {}, void 0, !0)
-          ], !0)
-        ], 2),
-        I ? (l(), n("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] = O(() => {
-          }, ["stop"]))
-        }, null, 2)) : y("", !0),
-        S ? (l(), n(k, { key: 1 }, [
-          w("div", {
-            class: "swiper-button-prev",
-            "data-cy": "swiper-button-prev",
-            onClick: i[2] || (i[2] = O(() => {
+                f("div", {
+                  class: u(["swiper-zoom-container", e.$attrs["swiper-zoom-container-classes"]])
+                }, [
+                  t.backgroundImage ? h("", !0) : (l(), n("img", T({
+                    key: 0,
+                    ref_for: !0,
+                    ref: (r) => {
+                      y.push(r);
+                    },
+                    class: ["disable-select", [e.$attrs["slide-img-classes"] || s.classes]],
+                    "data-idx": `${m.value}-slide-img-${a}`
+                  }, { ref_for: !0 }, C(s, a), {
+                    alt: s.alt,
+                    itemprop: "image",
+                    width: s.width,
+                    height: s.height,
+                    onLoad: (r) => Z(a)
+                  }), null, 16, ce))
+                ], 2)
+              ], 2))), 128)),
+              I(e.$slots, "last_slide", {}, void 0, !0)
+            ], !0)
+          ], 2),
+          M ? (l(), n("div", {
+            key: 0,
+            class: u([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"]))
-          }),
-          w("div", {
-            class: "swiper-button-next",
-            "data-cy": "swiper-button-next",
-            onClick: i[3] || (i[3] = O(() => {
-            }, ["stop"]))
-          })
-        ], 64)) : y("", !0)
-      ], 10, le),
-      t.thumbSwiperOptions ? (l(), n("div", {
-        key: 0,
-        id: `thumb_${m.value}`,
-        ref: "thumbsRef",
-        class: d(["swiper", e.$attrs["thumb-swiper-classes"]]),
-        thumbsSlider: ""
-      }, [
-        w("div", {
-          class: d(["swiper-wrapper", e.$attrs["thumb-swiper-wrapper-classes"]])
+          }, null, 2)) : h("", !0),
+          z ? (l(), n($, { key: 1 }, [
+            f("div", {
+              class: "swiper-button-prev",
+              "data-cy": "swiper-button-prev",
+              onClick: i[2] || (i[2] = P(() => {
+              }, ["stop"]))
+            }),
+            f("div", {
+              class: "swiper-button-next",
+              "data-cy": "swiper-button-next",
+              onClick: i[3] || (i[3] = P(() => {
+              }, ["stop"]))
+            })
+          ], 64)) : h("", !0)
+        ], 10, de),
+        t.thumbSwiperOptions ? (l(), n("div", {
+          key: 0,
+          id: `thumb_${m.value}`,
+          ref: "thumbsRef",
+          class: u(["swiper", e.$attrs["thumb-swiper-classes"]]),
+          thumbsSlider: ""
         }, [
-          (l(!0), n(k, null, V(t.images, (s, a) => (l(), n("div", {
-            key: `thumb_${m.value}_${a}`,
-            class: d(["swiper-slide", e.$attrs["thumb-img-wrapper-classes"]])
+          f("div", {
+            class: u(["swiper-wrapper", e.$attrs["thumb-swiper-wrapper-classes"]])
           }, [
-            w("img", B({
-              class: e.$attrs["thumb-img-classes"]
-            }, { ref_for: !0 }, P(s, -1, !1), {
-              alt: s.alt
-            }), null, 16, ce)
-          ], 2))), 128))
-        ], 2)
-      ], 10, ue)) : y("", !0)
-    ], 2));
+            (l(!0), n($, null, R(t.images, (s, a) => (l(), n("div", {
+              key: `thumb_${m.value}_${a}`,
+              class: u(["swiper-slide", e.$attrs["thumb-img-wrapper-classes"]])
+            }, [
+              f("img", T({
+                class: e.$attrs["thumb-img-classes"]
+              }, { ref_for: !0 }, C(s, -1, !1), {
+                alt: s.alt
+              }), null, 16, we)
+            ], 2))), 128))
+          ], 2)
+        ], 10, pe)) : h("", !0)
+      ], 2), [
+        [ie, O.value]
+      ]),
+      O.value ? h("", !0) : I(e.$slots, "placeholder", { key: 0 }, void 0, !0)
+    ], 64));
   }
 });
 export {
-  $e as default
+  Oe as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wikicasa-dev/components",
-  "version": "2.4.2-alpha.13",
+  "version": "2.4.2-alpha.14",
   "description": "Wikicasa frontend components",
   "type": "module",
   "main": "./dist/index.js",