@revolugo/elements 6.8.2-beta.4 → 6.8.2-beta.40

package/dist/revolugo.bimagecarousel.DQ1sFuh7.min.js

@@ -0,0 +1,566 @@
+import { d as I, H as R, i as B, D as y, o as l, u as z, a1 as V, c as u, w as d, B as D, e as v, C as w, F as L, a2 as T, a6 as O, ag as H, k as j, O as S, X as q, a as n, ad as W, a3 as F, J as _, aH as Y, g as J, r as K } from "./revolugo.index.wc.BQFDR_sN.min.js";
+import { _ as U, u as E, n as X, p as Z, e as Q, o as x, m as ee, M as te, C as se, V as b } from "./revolugo.webcomponentwrapper.DZKKwbYN.min.js";
+import { i as ie, u as re, a as le, V as ae, f as C, q as oe, I as ne } from "./revolugo.index.DjbDWbUi.min.js";
+import { V as ue, a as de } from "./revolugo.vslidegroup.D2bT55Zr.min.js";
+import { V as P, m as me, a as N, b as ce } from "./revolugo.vwindowitem.Diu-UkPx.min.js";
+import { a as he } from "./revolugo.vbtn.BhtxkRpd.min.js";
+import { V as ge } from "./revolugo.vskeletonloader.-h_KwzQ3.min.js";
+function M(e) {
+  try {
+    if (typeof document < "u") {
+      window.REVOLUGO_ELEMENTS_STYLES = window.REVOLUGO_ELEMENTS_STYLES || {
+        sheets: [],
+        components: []
+      };
+      const t = import.meta.url, s = t.slice(0, t.lastIndexOf("/") + 1) + e;
+      window.REVOLUGO_ELEMENTS_STYLES.sheets.push(s);
+      for (const i of REVOLUGO_ELEMENTS_STYLES.components)
+        i(s);
+      if (e.indexOf("fonts") >= 0) {
+        const i = document.createElement("link");
+        i.rel = "stylesheet", linK.href = s, document.head.appendChild(i);
+      }
+    }
+  } catch (t) {
+    console.error("[revolugo-elements] ", t);
+  }
+}
+function k(e, t) {
+  return t.map((s) => e[s]).find(Boolean);
+}
+const Me = (e) => e ? {
+  highres: e.map(
+    (t) => k(t, ["xl", "l", "m"])
+  ),
+  lowres: e.map(
+    (t) => k(t, ["l", "xl", "m"])
+  ),
+  thumbnails: e.map(
+    (t) => k(t, ["m", "l", "xl"])
+  )
+} : null, fe = ["src"], pe = /* @__PURE__ */ I({
+  __name: "BGoogleMapIframe",
+  props: {
+    address: {},
+    city: {},
+    height: {},
+    width: { default: "100%" }
+  },
+  setup(e) {
+    const t = e, s = R(() => {
+      if (!t.address || !t.city)
+        return "";
+      const i = t.address.toLowerCase().replace(/ /gu, "+"), a = t.city.toLowerCase().replace(/[ "'.1-9_]/gu, "");
+      return `https://maps.google.com/maps?q=${i},+${a}&output=embed`;
+    });
+    return (i, a) => (l(), B("iframe", y({ frameborder: "0" }, i.$props, {
+      src: s.value,
+      style: { "margin-bottom": "-6px" }
+    }), null, 16, fe));
+  }
+}), Re = /* @__PURE__ */ U(pe, [["__scopeId", "data-v-142233e1"]]), ve = {
+  height: {
+    default: "70px",
+    type: [String, Number]
+  },
+  imageUrls: { required: !0, type: Array },
+  rounded: { type: Boolean },
+  slide: { type: Number }
+}, ye = I({
+  data() {
+    return {
+      currentSlide: this.slide || 0
+    };
+  },
+  model: {
+    event: "change",
+    prop: "slide"
+  },
+  name: "BImageCarouselThumbnails",
+  props: ve,
+  setup() {
+    const { t: e } = z();
+    return {
+      t: e
+    };
+  },
+  watch: {
+    slide(e) {
+      this.currentSlide = e;
+    }
+  }
+}), we = V()({
+  name: "VSlideGroupItem",
+  props: ie(),
+  emits: {
+    "group:selected": (e) => !0
+  },
+  setup(e, t) {
+    let {
+      slots: s
+    } = t;
+    const i = re(e, ue);
+    return () => s.default?.({
+      isSelected: i.isSelected.value,
+      select: i.select,
+      toggle: i.toggle,
+      selectedClass: i.selectedClass.value
+    });
+  }
+}), Ve = ["data-index", "onClick"], Se = ["height", "src"];
+function be(e, t, s, i, a, m) {
+  return l(), u(de, {
+    ref: "slide-group",
+    modelValue: e.currentSlide,
+    "onUpdate:modelValue": t[0] || (t[0] = (o) => e.currentSlide = o),
+    "center-active": "",
+    mandatory: "",
+    "show-arrows": !1
+  }, {
+    default: d(() => [
+      (l(!0), B(L, null, D(e.imageUrls, (o, r) => (l(), u(we, { key: r }, {
+        default: d(({ isSelected: c, toggle: h }) => [
+          v("div", {
+            class: w(["thumb cursor-pointer", { active: c, "mr-1": r < e.imageUrls.length - 1 }]),
+            "data-index": r,
+            onClick: (f) => {
+              h(), e.$emit("change", r);
+            }
+          }, [
+            v("img", {
+              class: w({ rounded: e.rounded }),
+              height: e.height,
+              "max-width": "105",
+              src: o
+            }, null, 10, Se)
+          ], 10, Ve)
+        ]),
+        _: 2
+      }, 1024))), 128))
+    ]),
+    _: 1
+  }, 8, ["modelValue"]);
+}
+const ke = /* @__PURE__ */ U(ye, [["render", be], ["__scopeId", "data-v-80ffae56"]]), Ce = {
+  clickable: {
+    default: !1,
+    type: Boolean
+  },
+  height: { type: String },
+  imageUrls: { required: !0, type: Array },
+  isLoading: { default: !1, type: Boolean },
+  lazy: {
+    default: 0,
+    type: Number
+  },
+  limit: {
+    default: 80,
+    type: Number
+  },
+  rounded: { type: Boolean },
+  showThumbnails: { type: Boolean },
+  slide: { type: Number },
+  thumbnailUrls: { type: Array },
+  thumbnailsHeight: {
+    type: [String, Number]
+  },
+  width: { type: String }
+}, A = (e) => {
+  if (!e)
+    return {
+      val: 0
+    };
+  const t = /(-?[\d.]+)([%a-z]*)/u.exec(e.toString());
+  return !t || !t[1] ? {
+    val: 0
+  } : {
+    unit: t[2],
+    val: Number.parseInt(t[1])
+  };
+}, Ie = I({
+  components: {
+    BImageCarouselThumbnails: ke
+  },
+  computed: {
+    carouselImages() {
+      return this.isLoading ? [
+        {
+          type: "loading",
+          url: void 0
+        }
+      ] : !this.imageUrls || this.imageUrls.length === 0 ? [
+        {
+          type: "placeholder",
+          url: void 0
+        }
+      ] : this.imageUrls.slice(0, this.limit).map((e) => ({
+        type: "image",
+        url: e
+      }));
+    },
+    imagesToLoad() {
+      if (!this.isVisible)
+        return [];
+      if (this.lazy === 0)
+        return [this.currentSlide];
+      const e = this.imageUrls.length;
+      return this.lazy < 0 ? Array.from({ length: e }, (t, s) => s) : Array.from(
+        { length: 2 * this.lazy + 1 },
+        (t, s) => (this.currentSlide + s + e - this.lazy) % e
+      );
+    },
+    totalHeight() {
+      const e = A(this.height);
+      if (!e)
+        return "0px";
+      const t = A(
+        this.showThumbnails && this.imageUrls.length > 1 && this.thumbnailsHeight || void 0
+      );
+      if (!t)
+        return e.val + (e.unit || "px");
+      const s = e.unit || t.unit || "px";
+      return e.val + t.val + (s === "px" ? 4 : 0) + s;
+    }
+  },
+  data() {
+    return {
+      currentSlide: this.slide || 0,
+      isActive: !1,
+      isVisible: !1
+    };
+  },
+  methods: {
+    moveSlide(e) {
+      const t = this.imageUrls.length;
+      this.currentSlide = (t + this.currentSlide + e) % t, this.onCarouselChange();
+    },
+    onCarouselChange() {
+      this.$emit("change", this.currentSlide), this.isActive = !0;
+    },
+    onClick() {
+      this.$emit("click", this.currentSlide), this.clickable && (this.isActive = !1);
+    },
+    onClickOutside() {
+      this.isActive = !1;
+    },
+    onIntersect(e) {
+      this.isVisible = e[0].isIntersecting;
+    }
+  },
+  model: {
+    event: "change",
+    prop: "slide"
+  },
+  mounted() {
+    document.addEventListener("keyup", (e) => {
+      this.isActive && (e.key === "ArrowLeft" ? this.moveSlide(-1) : e.key === "ArrowRight" && this.moveSlide(1));
+    });
+  },
+  name: "BImageCarousel",
+  props: Ce,
+  setup() {
+    const { t: e } = z();
+    return {
+      t: e
+    };
+  },
+  watch: {
+    slide(e) {
+      this.currentSlide = e;
+    }
+  }
+}), Be = T({
+  color: String,
+  cycle: Boolean,
+  delimiterIcon: {
+    type: F,
+    default: "$delimiter"
+  },
+  height: {
+    type: [Number, String],
+    default: 500
+  },
+  hideDelimiters: Boolean,
+  hideDelimiterBackground: Boolean,
+  interval: {
+    type: [Number, String],
+    default: 6e3,
+    validator: (e) => Number(e) > 0
+  },
+  progress: [Boolean, String],
+  verticalDelimiters: [Boolean, String],
+  ...me({
+    continuous: !0,
+    mandatory: "force",
+    showArrows: !0
+  })
+}, "VCarousel"), Le = V()({
+  name: "VCarousel",
+  props: Be(),
+  emits: {
+    "update:modelValue": (e) => !0
+  },
+  setup(e, t) {
+    let {
+      slots: s
+    } = t;
+    const i = O(e, "modelValue"), {
+      t: a
+    } = H(), m = j();
+    let o = -1;
+    S(i, c), S(() => e.interval, c), S(() => e.cycle, (h) => {
+      h ? c() : window.clearTimeout(o);
+    }), q(r);
+    function r() {
+      !e.cycle || !m.value || (o = window.setTimeout(m.value.group.next, Number(e.interval) > 0 ? Number(e.interval) : 6e3));
+    }
+    function c() {
+      window.clearTimeout(o), window.requestAnimationFrame(r);
+    }
+    return E(() => {
+      const h = P.filterProps(e);
+      return n(P, y({
+        ref: m
+      }, h, {
+        modelValue: i.value,
+        "onUpdate:modelValue": (f) => i.value = f,
+        class: ["v-carousel", {
+          "v-carousel--hide-delimiter-background": e.hideDelimiterBackground,
+          "v-carousel--vertical-delimiters": e.verticalDelimiters
+        }, e.class],
+        style: [{
+          height: W(e.height)
+        }, e.style]
+      }), {
+        default: s.default,
+        additional: (f) => {
+          let {
+            group: g
+          } = f;
+          return n(L, null, [!e.hideDelimiters && n("div", {
+            class: "v-carousel__controls",
+            style: {
+              left: e.verticalDelimiters === "left" && e.verticalDelimiters ? 0 : "auto",
+              right: e.verticalDelimiters === "right" ? 0 : "auto"
+            }
+          }, [g.items.value.length > 0 && n(le, {
+            defaults: {
+              VBtn: {
+                color: e.color,
+                icon: e.delimiterIcon,
+                size: "x-small",
+                variant: "text"
+              }
+            },
+            scoped: !0
+          }, {
+            default: () => [g.items.value.map((p, G) => {
+              const $ = {
+                id: `carousel-item-${p.id}`,
+                "aria-label": a("$vuetify.carousel.ariaLabel.delimiter", G + 1, g.items.value.length),
+                class: ["v-carousel__controls__item", g.isSelected(p.id) && "v-btn--active"],
+                onClick: () => g.select(p.id, !0)
+              };
+              return s.item ? s.item({
+                props: $,
+                item: p
+              }) : n(he, y(p, $), null);
+            })]
+          })]), e.progress && n(ae, {
+            class: "v-carousel__progress",
+            color: typeof e.progress == "string" ? e.progress : void 0,
+            modelValue: (g.getItemIndex(i.value) + 1) / g.items.value.length * 100
+          }, null)]);
+        },
+        prev: s.prev,
+        next: s.next
+      });
+    }), {};
+  }
+}), Te = T({
+  ...oe(),
+  ...ce()
+}, "VCarouselItem"), Ue = V()({
+  name: "VCarouselItem",
+  inheritAttrs: !1,
+  props: Te(),
+  setup(e, t) {
+    let {
+      slots: s,
+      attrs: i
+    } = t;
+    E(() => {
+      const a = C.filterProps(e), m = N.filterProps(e);
+      return n(N, y({
+        class: ["v-carousel-item", e.class]
+      }, m), {
+        default: () => [n(C, y(i, a), s)]
+      });
+    });
+  }
+}), Ee = T({
+  modelValue: Boolean,
+  options: {
+    type: Object,
+    // For more information on types, navigate to:
+    // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
+    default: () => ({
+      root: void 0,
+      rootMargin: void 0,
+      threshold: void 0
+    })
+  },
+  ...ee(),
+  ...x(),
+  ...Q(),
+  ...Z({
+    transition: "fade-transition"
+  })
+}, "VLazy"), $e = V()({
+  name: "VLazy",
+  directives: {
+    intersect: ne
+  },
+  props: Ee(),
+  emits: {
+    "update:modelValue": (e) => !0
+  },
+  setup(e, t) {
+    let {
+      slots: s
+    } = t;
+    const {
+      dimensionStyles: i
+    } = X(e), a = O(e, "modelValue");
+    function m(o) {
+      a.value || (a.value = o);
+    }
+    return E(() => _(n(e.tag, {
+      class: ["v-lazy", e.class],
+      style: [i.value, e.style]
+    }, {
+      default: () => [a.value && n(te, {
+        transition: e.transition,
+        appear: !0
+      }, {
+        default: () => [s.default?.()]
+      })]
+    }), [[Y("intersect"), {
+      handler: m,
+      options: e.options
+    }, null]])), {};
+  }
+});
+function Pe(e, t, s, i, a, m) {
+  const o = K("BImageCarouselThumbnails");
+  return l(), u($e, {
+    height: e.height === "100%" ? "100%" : void 0,
+    "min-height": e.height,
+    width: e.width
+  }, {
+    default: d(() => [
+      _((l(), u(Le, {
+        modelValue: e.currentSlide,
+        "onUpdate:modelValue": [
+          t[1] || (t[1] = (r) => e.currentSlide = r),
+          e.onCarouselChange
+        ],
+        class: w(["carousel", { rounded: e.rounded }]),
+        height: e.height || "100%",
+        "hide-delimiters": "",
+        "show-arrows": e.imageUrls.length > 1 ? "hover" : !1,
+        width: e.width
+      }, {
+        default: d(() => [
+          (l(!0), B(L, null, D(e.carouselImages, ({ url: r, type: c }, h) => (l(), u(Ue, {
+            key: h,
+            eager: e.imagesToLoad.includes(h),
+            onClick: t[0] || (t[0] = (f) => e.isActive = !0)
+          }, {
+            default: d(() => [
+              c === "placeholder" ? (l(), u(b, {
+                key: 0,
+                align: "center",
+                class: "fill-height ma-0 bg-grey-lighten-2",
+                justify: "center"
+              }, {
+                default: d(() => t[3] || (t[3] = [
+                  v("div", { class: "text-grey-lighten-5 text-h1 font-weight-black" }, "R", -1)
+                ])),
+                _: 1,
+                __: [3]
+              })) : (l(), u(C, {
+                key: 1,
+                class: w({ "cursor-pointer": e.clickable }),
+                eager: "",
+                cover: "",
+                height: e.height || "100%",
+                src: r,
+                width: e.width || "100%",
+                onClick: e.onClick
+              }, {
+                error: d(() => [
+                  n(b, {
+                    align: "center",
+                    class: "fill-height ma-0 bg-grey-lighten-2",
+                    justify: "center"
+                  }, {
+                    default: d(() => t[4] || (t[4] = [
+                      v("div", { class: "text-grey-lighten-5 text-h1 font-weight-black" }, "R", -1)
+                    ])),
+                    _: 1,
+                    __: [4]
+                  })
+                ]),
+                placeholder: d(() => [
+                  c === "loading" || c === "image" ? (l(), u(ge, {
+                    key: 0,
+                    class: "rounded",
+                    height: e.height,
+                    width: e.width,
+                    type: "image"
+                  }, null, 8, ["height", "width"])) : (l(), u(b, {
+                    key: 1,
+                    align: "center",
+                    class: "fill-height ma-0 bg-grey-lighten-2",
+                    justify: "center"
+                  }, {
+                    default: d(() => t[5] || (t[5] = [
+                      v("div", { class: "text-grey-lighten-5 text-h1 font-weight-black" }, "R", -1)
+                    ])),
+                    _: 1,
+                    __: [5]
+                  }))
+                ]),
+                _: 2
+              }, 1032, ["class", "height", "src", "width", "onClick"]))
+            ]),
+            _: 2
+          }, 1032, ["eager"]))), 128))
+        ]),
+        _: 1
+      }, 8, ["modelValue", "class", "height", "show-arrows", "width", "onUpdate:modelValue"])), [
+        [se, e.onClickOutside]
+      ]),
+      e.showThumbnails && e.imageUrls.length > 1 ? (l(), u(o, {
+        key: 0,
+        modelValue: e.currentSlide,
+        "onUpdate:modelValue": t[2] || (t[2] = (r) => e.currentSlide = r),
+        class: "mt-1",
+        height: e.thumbnailsHeight,
+        "image-urls": e.thumbnailUrls?.slice(0, e.limit) || e.imageUrls.slice(0, e.limit),
+        rounded: e.rounded
+      }, null, 8, ["modelValue", "height", "image-urls", "rounded"])) : J("", !0)
+    ]),
+    _: 1
+  }, 8, ["height", "min-height", "width"]);
+}
+const He = /* @__PURE__ */ U(Ie, [["render", Pe], ["__scopeId", "data-v-e9cc62c5"]]);
+M("css/revolugo.bimagecarousel.B2SxWMbZ.css");
+export {
+  He as B,
+  $e as V,
+  Re as a,
+  Me as m
+};
+//# sourceMappingURL=revolugo.bimagecarousel.DQ1sFuh7.min.js.map