@grapesjs/studio-sdk-plugins 1.0.10 → 1.0.11

package/dist/swiperComponent/index.es.js

@@ -0,0 +1,1082 @@
+import "grapesjs";
+const X = "app.grapesjs.com", J = "app-stage.grapesjs.com", q = [
+  X,
+  J,
+  "localhost",
+  "127.0.0.1",
+  ".local-credentialless.webcontainer.io",
+  // For stackblitz.com demos
+  ".local.webcontainer.io",
+  // For stackblitz.com demos
+  "-sandpack.codesandbox.io"
+  // For Sandpack demos
+], Q = "license:check:start", ee = "license:check:end", te = () => typeof window < "u", ae = ({ isDev: t, isStage: l }) => `${t ? "" : `https://${l ? J : X}`}/api`, le = () => {
+  const t = te() && window.location.hostname;
+  return !!t && (q.includes(t) || q.some((l) => t.endsWith(l)));
+}, se = (t) => t.replace(/[A-Z]+(?![a-z])|[A-Z]/g, (l, a) => (a ? "-" : "") + l.toLowerCase()), ne = (t) => typeof t < "u";
+var E = /* @__PURE__ */ ((t) => (t.free = "free", t.startup = "startup", t.business = "business", t.enterprise = "enterprise", t))(E || {});
+async function ie({
+  path: t,
+  baseApiUrl: l,
+  method: a = "GET",
+  headers: s = {},
+  params: i,
+  body: r
+}) {
+  const u = `${l || ae({ isDev: !1, isStage: !1 })}${t}`, d = {
+    method: a,
+    headers: {
+      "Content-Type": "application/json",
+      ...s
+    }
+  };
+  r && (d.body = JSON.stringify(r));
+  const b = i ? new URLSearchParams(i).toString() : "", e = b ? `?${b}` : "", n = await fetch(`${u}${e}`, d);
+  if (!n.ok)
+    throw new Error(`HTTP error! status: ${n.status}`);
+  return n.json();
+}
+const z = {
+  [E.free]: 0,
+  [E.startup]: 10,
+  [E.business]: 20,
+  [E.enterprise]: 30
+};
+function oe(t) {
+  const l = t;
+  return l.init = (a) => (s) => t(s, a), l;
+}
+const re = (t) => /* @__PURE__ */ oe(t);
+async function ce({
+  editor: t,
+  plan: l,
+  pluginName: a,
+  licenseKey: s,
+  cleanup: i
+}) {
+  let r = "", c = !1;
+  const u = le(), d = (e) => {
+    console.warn("Cleanup plugin:", a, "Reason:", e), i();
+  }, b = (e = {}) => {
+    var R;
+    const { error: n, sdkLicense: m } = e, g = (R = e.plan) == null ? void 0 : R.category;
+    if (!(m || e.license) || n)
+      d(n || "Invalid license");
+    else if (g) {
+      const A = z[l], C = z[g];
+      A > C && d({ pluginRequiredPlan: l, licensePlan: g });
+    }
+  };
+  t.on(Q, (e) => {
+    r = e == null ? void 0 : e.baseApiUrl, c = !0;
+  }), t.on(ee, (e) => {
+    b(e);
+  }), setTimeout(async () => {
+    if (!c) {
+      if (u) return;
+      if (s) {
+        const e = await de({ licenseKey: s, pluginName: a, baseApiUrl: r });
+        e && b(e);
+      } else
+        d("The `licenseKey` option not provided");
+    }
+  }, 2e3);
+}
+async function de(t) {
+  const { licenseKey: l, pluginName: a, baseApiUrl: s } = t;
+  try {
+    return (await ie({
+      baseApiUrl: s,
+      path: `/sdk/${l || "na"}`,
+      method: "POST",
+      params: {
+        d: window.location.hostname,
+        pn: a
+      }
+    })).result || {};
+  } catch (i) {
+    return console.error("Error during SDK license check:", i), !1;
+  }
+}
+const w = (t, l) => {
+  var a;
+  return !!((a = t == null ? void 0 : t.classList) != null && a.contains(l));
+}, pe = (t, l = {}) => {
+  var r;
+  const a = {}, s = [], i = [];
+  for (const c in t) {
+    const { value: u, ...d } = t[c];
+    s.push({ id: c, name: c, changeProp: !0, category: l.category, ...d }), a[c] = u, !ne(u) && i.push(c);
+    const { subTraits: b = {} } = d;
+    for (const e in d.subTraits)
+      (r = b[e]) == null || r.forEach((n) => {
+        const m = n.id || n.name;
+        a[m] = n.value;
+      });
+  }
+  return {
+    propKeys: Object.keys(a),
+    propsNoValues: i,
+    props: a,
+    traits: s
+  };
+}, ue = (t, l) => {
+  l.forEach((a) => {
+    if (a.subTraits) {
+      const s = `${a.id || a.name}`, i = a.changeProp ? `change:${s}` : `change:attributes:${s}`;
+      t.on(i, () => H(t, s)), H(t, s);
+    }
+  });
+}, H = (t, l) => {
+  const a = t.getTrait(l), s = a.get("category"), i = a.get("subTraits") || {}, c = (Object.values(i).flat() || []).map((b) => b.id || b.name);
+  t.removeTrait(c);
+  const u = i[a.getValue()], d = t.getTraitIndex(l) + 1;
+  u && t.addTrait(
+    u.map((b) => ({ category: s, ...b })),
+    { at: d }
+  );
+}, be = (t, l) => {
+  l.forEach((a) => {
+    const s = se(a);
+    s !== a && t.has(s) && t.set({ [a]: t.get(s), [s]: void 0 });
+  });
+}, h = "swiper", M = `${h}-slide`, T = `${h}-wrapper`, x = `${h}-nav-prev`, V = `${h}-nav-next`, L = `${h}-pagination`, N = `${h}-scrollbar`, p = {
+  slider: `<svg viewBox="0 0 24 24">
+  <path d="M22 7.6c0-1-.5-1.6-1.3-1.6H3.4C2.5 6 2 6.7 2 7.6v9.8c0 1 .5 1.6 1.3 1.6h17.4c.8 0 1.3-.6 1.3-1.6V7.6zM21 18H3V7h18v11z" fill-rule="nonzero"/>
+  <path d="M4 12.5L6 14v-3zM20 12.5L18 14v-3z"/>
+</svg>`,
+  effect: `<svg viewBox="0 0 24 24">
+  <path d="M7.5 5.6 5 7l1.4-2.5L5 2l2.5 1.4L10 2 8.6 4.5 10 7 7.5 5.6m12 9.8L22 14l-1.4 2.5L22 19l-2.5-1.4L17 19l1.4-2.5L17 14l2.5 1.4M22 2l-1.4 2.5L22 7l-2.5-1.4L17 7l1.4-2.5L17 2l2.5 1.4L22 2m-8.7 10.8 2.5-2.5-2.1-2-2.5 2.4 2.1 2m1-5.4 2.4 2.3c.4.4.4 1 0 1.4L5 22.7a1 1 0 0 1-1.4 0l-2.3-2.3a1 1 0 0 1 0-1.4L13 7.3a1 1 0 0 1 1.4 0Z"/>
+</svg>`,
+  autoplay: `<svg viewBox="0 0 24 24">
+  <path d="M5 6.3A1 1 0 0 1 5 5a1 1 0 0 1 1.3 0l6.8 5.4.3.3a2 2 0 0 1-2.8 2.8l-.3-.3L5 6.3M12 20a8 8 0 0 0 8-8 8 8 0 0 0-2.3-5.7L19 5a10 10 0 0 1 3 7 10 10 0 0 1-10 10A10 10 0 0 1 2 12h2a8 8 0 0 0 8 8m0-19a2 2 0 0 1 2 2 2 2 0 0 1-2 2 2 2 0 0 1-2-2 2 2 0 0 1 2-2Z"/>
+</svg>`,
+  pagination: `<svg viewBox="0 0 24 24">
+  <path d="M16 12a2 2 0 0 1 2-2 2 2 0 0 1 2 2 2 2 0 0 1-2 2 2 2 0 0 1-2-2m-6 0a2 2 0 0 1 2-2 2 2 0 0 1 2 2 2 2 0 0 1-2 2 2 2 0 0 1-2-2m-6 0a2 2 0 0 1 2-2 2 2 0 0 1 2 2 2 2 0 0 1-2 2 2 2 0 0 1-2-2Z"/>
+</svg>`,
+  scrollbar: `<svg viewBox="0 0 24 24">
+  <path d="M7.2 9.2 5.8 7.8 1.5 12l4.3 4.2 1.4-1.4L4.4 12zm9.6 5.6 1.4 1.4 4.3-4.2-4.3-4.2-1.4 1.4 2.8 2.8z"/>
+  <path fill-rule="evenodd" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0m-2 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0" clip-rule="evenodd"/>
+</svg>`,
+  parallax: `<svg viewBox="0 0 24 24">
+  <path d="M12.6 23.3h-.2v.5h.2v-.5m.3-.2-.2.1v.5l.2.1v-.6m-.8 0v.6h.2v-.5z"/>
+  <path fill="currentColor" d="M18 9.4a2.5 2.5 0 0 1 3 2.3v5.7a3 3 0 0 1-2.2 2.9h-.2L13 21.4a2.5 2.5 0 0 1-3-2.3v-5.7a3 3 0 0 1 2.2-2.9h.2zM14.5 6a2.5 2.5 0 0 1 3 2.3v.4l-5.3 1A4 4 0 0 0 9 13.4v4.8a2.5 2.5 0 0 1-2.5-2.4v-5.7a3 3 0 0 1 2.2-2.9H9zM11 2.6a2.5 2.5 0 0 1 3 2.3v.3l-5.3 1A4 4 0 0 0 5.5 10v4.8A2.5 2.5 0 0 1 3 12.3V6.6a3 3 0 0 1 2.2-2.9h.2z"/>
+</svg>`,
+  responsive: `<svg viewBox="0 0 24 24">
+  <path d="M17 21q-.4 0-.7-.3T16 20V10q0-.8-.6-1.4T14 8h-3.5q-.4 0-.7-.3T9.5 7V4q0-.4.3-.7t.7-.3H20q.4 0 .7.3t.3.7v16q0 .4-.3.7t-.7.3zm-6.5 0q-.4 0-.7-.3t-.3-.7v-9q0-.4.3-.7t.7-.3H13q.4 0 .7.3t.3.7v9q0 .4-.3.7t-.7.3zM4 21q-.4 0-.7-.3T3 20v-9q0-.4.3-.7T4 10h2.5q.4 0 .7.3t.3.7v9q0 .4-.3.7t-.7.3z"/>
+</svg>`,
+  extra: `<svg viewBox="0 0 24 24">
+  <path fill-rule="evenodd" d="M5.4 3h13.2A2.4 2.4 0 0 1 21 5.4v13.2a2.4 2.4 0 0 1-2.4 2.4H5.4A2.4 2.4 0 0 1 3 18.6V5.4A2.4 2.4 0 0 1 5.4 3M5 12a2 2 0 1 1 4 0 2 2 0 0 1-4 0m5 0a2 2 0 1 1 4 0 2 2 0 0 1-4 0m7-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4" clip-rule="evenodd"/>
+</svg>`,
+  reload: `<svg viewBox="0 0 24 24">
+  <path d="M2 12c0 5 4 9 9 9 2.4 0 4.7-1 6.4-2.6l-1.5-1.5A6.7 6.7 0 0 1 11 19a7 7 0 1 1 7-7h-3l4 4h.1l3.9-4h-3a9 9 0 0 0-18 0Z"/>
+</svg>`,
+  prev: '<svg viewBox="0 0 24 24"><path d="M15.4 16.6 10.8 12l4.6-4.6L14 6l-6 6 6 6 1.4-1.4Z"/></svg>',
+  next: '<svg viewBox="0 0 24 24"><path d="m8.6 16.6 4.6-4.6-4.6-4.6L10 6l6 6-6 6-1.4-1.4Z"/></svg>',
+  add: `<svg viewBox="0 0 24 24">
+  <path d="M12 20a8 8 0 1 1 0-16 8 8 0 0 1 0 16m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2m1 5h-2v4H7v2h4v4h2v-4h4v-2h-4V7Z"/>
+</svg>`
+}, G = { id: "swiper-responsive", label: "Responsive", icon: p.responsive }, U = { id: "swiper-extra", label: "Extra", icon: p.extra }, fe = {
+  actions: {
+    type: "radio",
+    label: !1,
+    labelToTitle: !0,
+    options: [
+      { id: "r", label: "Reload slider", icon: p.reload },
+      { id: "p", label: "Previous slide", icon: p.prev },
+      { id: "n", label: "Next slide", icon: p.next },
+      { id: "a", label: "Add new slide", icon: p.add }
+    ],
+    setValue: ({ component: t, value: l }) => {
+      var s;
+      const a = (s = t.getView()) == null ? void 0 : s.getSwiper();
+      switch (l) {
+        case "r":
+          t.reloadSlider();
+          break;
+        case "p":
+          a == null || a.slidePrev();
+          break;
+        case "n":
+          a == null || a.slideNext();
+          break;
+        case "a":
+          t.addSlide();
+          break;
+      }
+    }
+  },
+  vertical: {
+    type: "checkbox",
+    label: "Vertical",
+    value: !1
+  },
+  loop: {
+    type: "checkbox",
+    label: "Loop",
+    value: !1
+  },
+  freeMode: {
+    type: "checkbox",
+    label: "Free mode",
+    value: !1
+  },
+  autoHeight: {
+    type: "checkbox",
+    label: "Auto height",
+    value: !1
+  },
+  navigation: {
+    type: "checkbox",
+    label: "Navigation",
+    getValue: ({ component: t }) => !!t.findFirstType(x),
+    setValue: ({ component: t, value: l }) => {
+      var a, s;
+      l ? t.append([{ type: x }, { type: V }]) : ((a = t.findFirstType(x)) == null || a.remove(), (s = t.findFirstType(V)) == null || s.remove()), t.set({ navigation: l });
+    }
+  },
+  initialSlide: {
+    type: "number",
+    label: "Initial slide",
+    min: 0,
+    value: "0"
+  },
+  speed: {
+    type: "number",
+    label: "Speed",
+    tip: "Transition duration (in ms)",
+    step: 500,
+    min: 0,
+    value: 300
+  },
+  effect: {
+    category: { id: "swiper-effect", label: "Effects", icon: p.effect },
+    type: "select",
+    label: "Effect Type",
+    value: "slide",
+    options: [
+      { id: "slide", label: "Slide" },
+      { id: "fade", label: "Fade" },
+      { id: "cube", label: "Cube" },
+      { id: "coverflow", label: "Coverflow" },
+      { id: "flip", label: "Flip" },
+      { id: "cards", label: "Cards" }
+    ],
+    subTraits: {
+      slide: [
+        {
+          type: "number",
+          name: "slidesPerView",
+          label: "Slides per view",
+          changeProp: !0,
+          min: 1,
+          value: 1
+        },
+        {
+          type: "number",
+          name: "slidesPerGroup",
+          label: "Slides per group",
+          tip: "Numbers of slides for group sliding",
+          changeProp: !0,
+          min: 1,
+          value: 1
+        },
+        {
+          type: "number",
+          name: "spaceBetween",
+          label: "Space between",
+          tip: "Distance between slides in px",
+          changeProp: !0,
+          min: 0,
+          value: 0
+        },
+        {
+          type: "number",
+          name: "slidesOffsetBefore",
+          label: "Slides offset before",
+          tip: "Add additional slide offset in the beginning of the container (in px, before all slides)",
+          changeProp: !0,
+          min: 0,
+          value: 0
+        },
+        {
+          type: "number",
+          name: "slidesOffsetAfter",
+          label: "Slides offset after",
+          tip: "Add additional slide offset in the end of the container (in px, after all slides)",
+          changeProp: !0,
+          min: 0,
+          value: 0
+        },
+        {
+          type: "checkbox",
+          name: "centeredSlides",
+          label: "Centered slides",
+          tip: "If enabled, the active slide will be centered",
+          changeProp: !0,
+          value: !1
+        }
+      ],
+      fade: [
+        {
+          type: "checkbox",
+          name: "crossFade",
+          tip: "Enables slides cross fade",
+          label: "Cross fade",
+          changeProp: !0,
+          value: !1
+        }
+      ],
+      cube: [
+        {
+          type: "checkbox",
+          name: "cubeEffectShadow",
+          label: "Shadow",
+          changeProp: !0,
+          value: !0
+        },
+        {
+          type: "checkbox",
+          name: "cubeEffectSlideShadows",
+          label: "Slide shadows",
+          changeProp: !0,
+          value: !0
+        },
+        {
+          type: "number",
+          name: "cubeEffectShadowOffset",
+          label: "Shadow offset",
+          changeProp: !0,
+          value: 20
+        },
+        {
+          type: "number",
+          name: "cubeEffectShadowScale",
+          label: "Shadow scale",
+          changeProp: !0,
+          value: 0.94
+        }
+      ],
+      coverflow: [
+        {
+          type: "number",
+          name: "coverflowEffectDepth",
+          tip: "Depth offset in px (slides translate in Z axis)",
+          label: "Depth",
+          changeProp: !0,
+          min: 0,
+          value: 100
+        },
+        {
+          type: "number",
+          name: "coverflowEffectModifier",
+          tip: "Effect multiplier",
+          label: "Modifier",
+          changeProp: !0,
+          step: 0.1,
+          min: 0,
+          value: 1
+        },
+        {
+          type: "number",
+          name: "coverflowEffectRotate",
+          tip: "Slide rotate in degrees",
+          label: "Rotate",
+          changeProp: !0,
+          min: 0,
+          value: 50
+        },
+        {
+          type: "number",
+          name: "coverflowEffectScale",
+          tip: "Slide scale effect",
+          label: "Scale",
+          changeProp: !0,
+          min: 0,
+          step: 0.1,
+          value: 1
+        },
+        {
+          type: "number",
+          name: "coverflowEffectStretch",
+          tip: "Stretch space between slides (in px)",
+          label: "Stretch",
+          changeProp: !0,
+          min: 0,
+          value: 0
+        },
+        {
+          type: "checkbox",
+          name: "coverflowEffectSlideShadows",
+          tip: "Enables slides shadows",
+          label: "Slide shadow",
+          changeProp: !0,
+          value: !0
+        }
+      ],
+      flip: [
+        {
+          type: "checkbox",
+          name: "flipEffectLimitRotation",
+          tip: "Limit edge slides rotation",
+          label: "Limit rotation",
+          changeProp: !0,
+          value: !0
+        },
+        {
+          type: "checkbox",
+          name: "flipEffectSlideShadows",
+          tip: "Enables slides shadows",
+          label: "Slide shadows",
+          changeProp: !0,
+          value: !0
+        }
+      ],
+      cards: [
+        {
+          type: "number",
+          name: "cardsEffectPerSlideOffset",
+          tip: "Offset distance per slide (in px)",
+          label: "Slide offset",
+          changeProp: !0,
+          min: 0,
+          value: 8
+        },
+        {
+          type: "number",
+          name: "cardsEffectPerSlideRotate",
+          tip: "Rotate angle per slide (in degrees)",
+          label: "Slide rotate",
+          changeProp: !0,
+          min: 0,
+          value: 2
+        },
+        {
+          type: "checkbox",
+          name: "cardsEffectRotate",
+          tip: "Enables cards rotation",
+          label: "Rotate",
+          changeProp: !0,
+          value: !0
+        },
+        {
+          type: "checkbox",
+          name: "cardsEffectSlideShadows",
+          tip: "Enables slides shadows",
+          label: "Slide shadows",
+          changeProp: !0,
+          value: !0
+        }
+      ]
+    }
+  },
+  autoplay: {
+    category: { id: "swiper-autoplay", label: "Autoplay", icon: p.autoplay },
+    type: "checkbox",
+    label: "Enable Autoplay",
+    value: !1,
+    subTraits: {
+      true: [
+        {
+          type: "number",
+          name: "autoplayDelay",
+          label: "Delay",
+          changeProp: !0,
+          value: 3e3
+        },
+        {
+          type: "checkbox",
+          name: "autoplayDisableOnInteraction",
+          label: "Disable on interaction",
+          changeProp: !0,
+          value: !0
+        },
+        {
+          type: "checkbox",
+          name: "autoplayWaitForTransition",
+          label: "Wait for transition",
+          changeProp: !0,
+          value: !0
+        },
+        {
+          type: "checkbox",
+          name: "autoplayPauseOnMouseEnter",
+          label: "Pause on mouse enter",
+          changeProp: !0,
+          value: !1
+        },
+        {
+          type: "checkbox",
+          name: "autoplayReverseDirection",
+          label: "Reverse direction",
+          changeProp: !0,
+          value: !1
+        },
+        {
+          type: "checkbox",
+          name: "autoplayStopOnLastSlide",
+          label: "Stop on last slide",
+          changeProp: !0,
+          value: !1
+        }
+      ]
+    }
+  },
+  pagination: {
+    category: { id: "swiper-pagination", label: "Pagination", icon: p.pagination },
+    type: "select",
+    label: "Pagination Type",
+    options: [
+      { id: "none", label: "None" },
+      { id: "bullets", label: "Bullets" },
+      { id: "progressbar", label: "Progressbar" },
+      { id: "fraction", label: "Fraction" }
+    ],
+    getValue: ({ component: t }) => t.findFirstType(L) ? t.get("pagination") || "bullets" : "none",
+    setValue: ({ component: t, value: l }) => {
+      const a = t.findFirstType(L);
+      a == null || a.remove(), l !== "none" && t.append({ type: L }), t.set({ pagination: l });
+    },
+    subTraits: {
+      bullets: [
+        {
+          type: "checkbox",
+          name: "dynamicBullets",
+          label: "Dynamic bullets",
+          changeProp: !0,
+          value: !1
+        },
+        {
+          type: "checkbox",
+          name: "clickableBullets",
+          label: "Clickable bullets",
+          changeProp: !0,
+          value: !0
+        }
+      ],
+      progressbar: [
+        {
+          type: "checkbox",
+          name: "progressbarOpposite",
+          label: "Progress opposite",
+          changeProp: !0,
+          value: !1
+        }
+      ]
+    }
+  },
+  scrollbar: {
+    category: { id: "swiper-scrollbar", label: "Scrollbar", icon: p.scrollbar },
+    type: "checkbox",
+    label: "Enable Scrollbar",
+    getValue: ({ component: t }) => !!t.findFirstType(N),
+    setValue: ({ component: t, value: l }) => {
+      const a = t.findFirstType(N);
+      a == null || a.remove(), l && t.append({ type: N }), t.set({ scrollbar: l });
+    },
+    subTraits: {
+      false: [],
+      true: [
+        {
+          type: "checkbox",
+          name: "scrollbarDraggable",
+          label: "Draggable",
+          changeProp: !0,
+          value: !1
+        },
+        {
+          type: "checkbox",
+          name: "scrollbarHide",
+          label: "Hide",
+          tip: "Hide scrollbar automatically after user interaction",
+          changeProp: !0,
+          value: !0
+        }
+      ]
+    }
+  },
+  parallax: {
+    category: { id: "swiper-parallax", label: "Parallax", icon: p.parallax },
+    type: "checkbox",
+    label: "Enable Parallax",
+    value: !1
+  },
+  mobile: {
+    category: G,
+    type: "checkbox",
+    label: "Enable mobile breakpoint",
+    value: !1,
+    subTraits: {
+      true: [
+        {
+          type: "number",
+          name: "mobileBreakpoint",
+          label: "Mobile breakpoint",
+          tip: "Slide values below will be applied when the screen width is greater than this value",
+          changeProp: !0,
+          min: 1,
+          value: 460
+        },
+        {
+          type: "number",
+          name: "mobileSlidesPerView",
+          label: "Slides per view",
+          changeProp: !0,
+          min: 1,
+          value: 1
+        },
+        {
+          type: "number",
+          name: "mobileSlidesPerGroup",
+          label: "Slides per group",
+          changeProp: !0,
+          min: 1,
+          value: 1
+        },
+        {
+          type: "number",
+          name: "mobileSpaceBetween",
+          label: "Space between",
+          changeProp: !0,
+          min: 0,
+          value: 0
+        }
+      ]
+    }
+  },
+  tablet: {
+    category: G,
+    type: "checkbox",
+    label: "Enable tablet breakpoint",
+    value: !1,
+    subTraits: {
+      true: [
+        {
+          type: "number",
+          name: "tabletBreakpoint",
+          label: "Tablet breakpoint",
+          tip: "Slide values below will be applied when the screen width is greater than this value",
+          changeProp: !0,
+          min: 1,
+          value: 991
+        },
+        {
+          type: "number",
+          name: "tabletSlidesPerView",
+          label: "Slides per view",
+          changeProp: !0,
+          min: 1,
+          value: 1
+        },
+        {
+          type: "number",
+          name: "tabletSlidesPerGroup",
+          label: "Slides per group",
+          changeProp: !0,
+          min: 1,
+          value: 1
+        },
+        {
+          type: "number",
+          name: "tabletSpaceBetween",
+          label: "Space between",
+          changeProp: !0,
+          min: 0,
+          value: 0
+        }
+      ]
+    }
+  },
+  allowTouchMove: {
+    category: U,
+    type: "checkbox",
+    label: "Allow touch move",
+    tip: "Allow touch interactions",
+    value: !0
+  },
+  grabCursor: {
+    category: U,
+    type: "checkbox",
+    label: "Grab cursor",
+    tip: 'If enabled, the user will see the "grab" cursor when hover the slider',
+    value: !1
+  }
+}, j = "Slider", F = "swiper", k = `${F}-`, he = (t, l) => {
+  const { Components: a, Blocks: s } = t, { block: i } = l, r = pe(fe), c = "core:preview", u = function(e) {
+    const n = this, m = window, g = n.__onLoad, D = n.__activeSlide, R = n.__inPreview, { cdnScript: A, cdnStyle: C, slidesPerView: $ } = e || {}, o = (f) => isNaN(f) ? void 0 : parseFloat(f), W = () => {
+      const f = {
+        loop: e.loop,
+        speed: e.speed,
+        initialSlide: e.initialSlide,
+        direction: e.vertical ? "vertical" : "horizontal",
+        effect: e.effect,
+        freeMode: e.freeMode,
+        parallax: e.parallax,
+        autoHeight: e.autoHeight,
+        allowTouchMove: e.allowTouchMove,
+        grabCursor: e.grabCursor,
+        simulateTouch: !0,
+        breakpoints: {},
+        slidesPerView: isNaN($) ? $ : o($),
+        slidesPerGroup: o(e.slidesPerGroup),
+        spaceBetween: o(e.spaceBetween),
+        slidesOffsetBefore: o(e.slidesOffsetBefore),
+        slidesOffsetAfter: o(e.slidesOffsetAfter),
+        centeredSlides: e.centeredSlides,
+        fadeEffect: { crossFade: e.crossFade },
+        cubeEffect: {
+          shadow: e.cubeEffectShadow,
+          slideShadows: e.cubeEffectSlideShadows,
+          shadowOffset: o(e.cubeEffectShadowOffset),
+          shadowScale: o(e.cubeEffectShadowScale)
+        },
+        coverflowEffect: {
+          depth: o(e.coverflowEffectDepth),
+          modifier: o(e.coverflowEffectModifier),
+          rotate: o(e.coverflowEffectRotate),
+          scale: o(e.coverflowEffectScale),
+          stretch: o(e.coverflowEffectStretch),
+          slideShadows: e.coverflowEffectSlideShadows
+        },
+        flipEffect: {
+          limitRotation: e.flipEffectLimitRotation,
+          slideShadows: e.flipEffectSlideShadows
+        },
+        cardsEffect: {
+          perSlideOffset: o(e.cardsEffectPerSlideOffset),
+          perSlideRotate: o(e.cardsEffectPerSlideRotate),
+          rotate: e.cardsEffectRotate,
+          slideShadows: e.cardsEffectSlideShadows
+        },
+        navigation: {
+          nextEl: n.querySelector(".swiper-button-next"),
+          prevEl: n.querySelector(".swiper-button-prev")
+        },
+        pagination: {
+          type: e.pagination || "bullets",
+          dynamicBullets: e.dynamicBullets,
+          clickable: e.clickableBullets,
+          progressbarOpposite: e.progressbarOpposite,
+          el: n.querySelector(".swiper-pagination")
+        },
+        scrollbar: {
+          el: n.querySelector(".swiper-scrollbar"),
+          draggable: e.scrollbarDraggable,
+          hide: e.scrollbarHide
+        },
+        autoplay: e.autoplay && {
+          delay: e.autoplayDelay,
+          disableOnInteraction: e.autoplayDisableOnInteraction,
+          pauseOnMouseEnter: e.autoplayPauseOnMouseEnter,
+          reverseDirection: e.autoplayReverseDirection,
+          stopOnLastSlide: e.autoplayStopOnLastSlide,
+          waitForTransition: e.autoplayWaitForTransition
+        }
+      };
+      if (e.tablet) {
+        const { tabletBreakpoint: _, tabletSlidesPerView: v } = e, P = o(_);
+        f.breakpoints[P] = {
+          slidesPerView: isNaN(v) ? v : o(v),
+          slidesPerGroup: o(e.tabletSlidesPerGroup),
+          spaceBetween: o(e.tabletSpaceBetween)
+        };
+      }
+      if (e.mobile) {
+        const { mobileBreakpoint: _, mobileSlidesPerView: v } = e, P = o(_);
+        f.breakpoints[P] = {
+          slidesPerView: isNaN(v) ? v : o(v),
+          slidesPerGroup: o(e.mobileSlidesPerGroup),
+          spaceBetween: o(e.mobileSpaceBetween)
+        };
+      }
+      g && !R && (f.simulateTouch = !1), D && (f.initialSlide = D);
+      const I = new m.Swiper(n, f);
+      g == null || g(I);
+    };
+    if (m.Swiper)
+      W();
+    else {
+      const { head: f } = document, I = Array.isArray(A) ? [...A] : [A], _ = Array.isArray(C) ? [...C] : [C], v = (S) => {
+        if (S.length) {
+          const y = document.createElement("link");
+          y.href = S.shift(), y.rel = "stylesheet", f.appendChild(y), v(S);
+        }
+      }, P = (S) => {
+        if (S.length) {
+          const y = document.createElement("script");
+          y.src = S.shift(), y.onerror = y.onload = P.bind(null, S), f.appendChild(y);
+        } else
+          W();
+      };
+      v(_), P(I);
+    }
+  }, d = (e = 0) => ({
+    type: M,
+    style: { padding: "50px" },
+    components: { type: "text", components: { type: "textnode", content: `Slide ${e}` } }
+  }), b = a.getType("default").model;
+  return a.addType(h, {
+    block: i && {
+      label: j,
+      media: p.slider,
+      category: "Extra",
+      select: !0,
+      ...l.block
+    },
+    isComponent: (e) => w(e, F),
+    model: {
+      defaults: () => ({
+        name: j,
+        icon: p.slider,
+        classes: F,
+        draggable: (e, n) => !n.is(h),
+        components: [
+          {
+            type: T,
+            components: [d(1), d(2), d(3)]
+          },
+          { type: L }
+        ],
+        script: u,
+        cdnScript: l.cdnScript,
+        cdnStyle: l.cdnStyle,
+        "script-props": ["cdnScript", "cdnStyle", ...r.propKeys],
+        ...r.props,
+        traits: [...r.traits]
+      }),
+      init() {
+        const { em: e } = this;
+        ue(this, r.traits), be(this, r.propKeys), this.listenTo(e, `run:${c}`, this.onPreviewOn), this.listenTo(e, `stop:${c}`, this.onPreviewOff);
+      },
+      onPreviewOn() {
+        this.__inPreview = !0, this.reloadSlider();
+      },
+      onPreviewOff() {
+        this.__inPreview = !1, this.reloadSlider();
+      },
+      reloadSlider() {
+        this.trigger("rerender");
+      },
+      addSlide() {
+        const e = this.findFirstType(T);
+        e == null || e.append(this.getNewSlideComponentDef());
+      },
+      getNewSlideComponentDef() {
+        var n;
+        const e = ((n = this.findFirstType(T)) == null ? void 0 : n.components().length) || 0;
+        return {
+          type: M,
+          components: { type: "text", components: { type: "textnode", content: `Slide ${e + 1}` } }
+        };
+      },
+      toJSON(...e) {
+        const n = b.prototype.toJSON.apply(this, e);
+        return r.propsNoValues.forEach((m) => delete n[m]), delete n["script-props"], n;
+      }
+    },
+    view: {
+      init() {
+        const e = a.events.scriptUnmount;
+        e && this.listenTo(this.model, e, this.destroySwiper);
+      },
+      getSwiper() {
+        return this.el.swiper;
+      },
+      destroySwiper() {
+        var e;
+        (e = this.getSwiper()) == null || e.destroy();
+      },
+      onRender() {
+        const e = this.el;
+        e.__onLoad = (n) => n.on("slideChange", () => this.__activeSlide = n.activeIndex), e.__activeSlide = this.__activeSlide, e.__inPreview = this.model.__inPreview;
+      }
+    }
+  }), () => {
+    a.removeType(h), s.remove(h);
+  };
+}, ve = "Nav Prev", me = "Nav Next", O = `${k}button-prev`, B = `${k}button-next`, ge = (t) => {
+  const { Components: l } = t, a = (s) => ({
+    type: "svg",
+    selectable: !1,
+    hoverable: !1,
+    attributes: { viewBox: "0 0 27 44" },
+    components: {
+      type: "svg-in",
+      tagName: "path",
+      attributes: { d: s, fill: "currentColor" }
+    }
+  });
+  return l.addType(x, {
+    isComponent: (s) => w(s, O),
+    model: {
+      defaults: {
+        name: ve,
+        classes: O,
+        copyable: !1,
+        highlightable: !1,
+        droppable: !1,
+        draggable: !1,
+        selectable: !1,
+        hoverable: !1,
+        layerable: !1,
+        components: a("M0,22L22,0l2.1,2.1L4.2,22l19.9,19.9L22,44L0,22L0,22L0,22z"),
+        styles: `
+          .${O} {
+            color: inherit;
+          }
+          .${O}:after {
+            content: none;
+          }
+        `
+      }
+    }
+  }), l.addType(V, {
+    extend: x,
+    isComponent: (s) => w(s, B),
+    model: {
+      defaults: {
+        name: me,
+        classes: B,
+        components: a("M27,22L27,22L5,44l-2.1-2.1L22.8,22L2.9,2.1L5,0L27,22L27,22z"),
+        styles: `
+          .${B} {
+            color: inherit;
+          }
+          .${B}:after {
+            content: none;
+          }
+        `
+      }
+    }
+  }), () => {
+    l.removeType(x), l.removeType(V);
+  };
+}, ye = (t) => {
+  const { Components: l } = t, a = `${k}pagination`;
+  return l.addType(L, {
+    isComponent: (s) => w(s, a),
+    model: {
+      defaults: {
+        name: "Pagination",
+        classes: a,
+        copyable: !1,
+        highlightable: !1,
+        droppable: !1,
+        draggable: !1,
+        selectable: !1,
+        hoverable: !1,
+        layerable: !1,
+        styles: `
+          .${a}-bullet-active {
+            background-color: currentColor;
+          }
+          .${a}-progressbar-fill {
+            --swiper-pagination-color: currentColor;
+          }
+        `
+      }
+    }
+  }), () => {
+    l.removeType(L);
+  };
+}, Se = "Scrollbar", K = `${k}scrollbar`, we = (t) => {
+  const { Components: l } = t;
+  return l.addType(N, {
+    isComponent: (a) => w(a, K),
+    model: {
+      defaults: {
+        name: Se,
+        classes: K,
+        copyable: !1,
+        highlightable: !1,
+        removable: !1,
+        selectable: !1,
+        hoverable: !1,
+        layerable: !1,
+        droppable: !1,
+        draggable: !1
+      }
+    }
+  }), () => {
+    l.removeType(N);
+  };
+}, Pe = "Slide", Z = `${k}slide`, Ee = (t) => {
+  const { Components: l } = t;
+  return l.addType(M, {
+    isComponent: (a) => w(a, Z),
+    model: {
+      defaults: {
+        name: Pe,
+        classes: Z,
+        icon: p.slider,
+        draggable: (a, s) => s.is(T)
+      }
+      // TODO VIEW slide to this slide when selected
+    }
+  }), () => {
+    l.removeType(M);
+  };
+}, Te = "Wrapper", Y = `${k}wrapper`, xe = (t) => {
+  const { Components: l } = t, { events: a } = l;
+  return l.addType(T, {
+    isComponent: (s) => w(s, Y),
+    model: {
+      defaults: {
+        name: Te,
+        icon: p.slider,
+        classes: Y,
+        copyable: !1,
+        removable: !1,
+        draggable: !1,
+        highlightable: !1,
+        droppable: (s) => s.is(M)
+      },
+      init() {
+        const s = this.components();
+        this.listenTo(s, "add remove", this.updateSlider);
+      },
+      updateSlider(s) {
+        const i = this.closestType(h);
+        if (i) {
+          const r = i.getView();
+          i.reloadSlider();
+          const c = a.scriptMount;
+          c && this.em.once(c, () => {
+            setTimeout(() => {
+              var u;
+              return (u = r.getSwiper()) == null ? void 0 : u.slideTo(s.index());
+            }, 100);
+          });
+        }
+      }
+    }
+  }), () => {
+    l.removeType(T);
+  };
+}, Le = "swiperComponent", ke = function(t, l = {}) {
+  const a = {
+    block: {},
+    cdnScript: "https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js",
+    cdnStyle: "https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css",
+    ...l
+  }, s = [
+    he(t, a),
+    ge(t),
+    xe(t),
+    Ee(t),
+    ye(t),
+    we(t)
+  ];
+  ce({
+    editor: t,
+    plan: E.startup,
+    licenseKey: a.licenseKey,
+    pluginName: Le,
+    cleanup: () => {
+      s.forEach((i) => i());
+    }
+  });
+}, Ce = re(ke);
+export {
+  Ce as default
+};