@chaibuilder/sdk 2.0.0-beta.17 → 2.0.0-beta.19

package/dist/web-blocks.js

@@ -1,19 +1,19 @@
-import { registerChaiBlockSchema as p, StylesProp as c, registerChaiBlock as d } from "@chaibuilder/runtime";
+import { registerChaiBlockSchema as p, StylesProp as c, registerChaiBlock as u } from "@chaibuilder/runtime";
 import { j as r } from "./jsx-runtime-Sp0orL4X.js";
 import * as y from "react";
-import { c as I, G as T, g as w } from "./iconBase-Ief2hJUZ.js";
-import { ButtonIcon as P, CodeIcon as $, HeadingIcon as N, TextIcon as D, CursorTextIcon as H, Link1Icon as z, ImageIcon as j, RowsIcon as A, ColumnsIcon as R, SketchLogoIcon as q, VideoIcon as F, DividerHorizontalIcon as G, MoonIcon as W, SpaceBetweenVerticallyIcon as V, InputIcon as S, RadiobuttonIcon as O, DropdownMenuIcon as U, CheckboxIcon as X, LetterCaseToggleIcon as Y } from "@radix-ui/react-icons";
-import { isNull as Z, isEmpty as b, get as v, pick as J, omit as K, map as _ } from "lodash-es";
-import { GlobeIcon as Q, GroupIcon as ee } from "lucide-react";
+import { c as I, G as E, g as w } from "./iconBase-Ief2hJUZ.js";
+import { ButtonIcon as C, CodeIcon as T, HeadingIcon as $, TextIcon as N, CursorTextIcon as H, Link1Icon as z, ImageIcon as j, RowsIcon as R, ColumnsIcon as A, SketchLogoIcon as D, VideoIcon as q, DividerHorizontalIcon as F, MoonIcon as G, SpaceBetweenVerticallyIcon as V, InputIcon as S, RadiobuttonIcon as O, DropdownMenuIcon as U, CheckboxIcon as W, LetterCaseToggleIcon as X } from "@radix-ui/react-icons";
+import { isNull as Y, isEmpty as b, get as v, pick as Z, omit as J, map as L } from "lodash-es";
+import { GlobeIcon as K, GroupIcon as Q } from "lucide-react";
 import "clsx";
 import "tailwind-merge";
-const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("div", { className: I("pointer-events-none flex h-20 flex-col items-center justify-center p-2", e), children: /* @__PURE__ */ r.jsx("div", { className: "h-full w-full rounded bg-gray-200 p-2 dark:bg-gray-800", children: /* @__PURE__ */ r.jsx("div", { className: "flex h-full w-full items-center justify-center outline-dashed outline-1 -outline-offset-1 outline-gray-400 duration-300 dark:outline-gray-700" }) }) }) : null, x = te, oe = (e) => {
-  const { blockProps: t, inBuilder: o, backgroundImage: n, children: l, tag: i = "div", styles: s } = e;
+const ee = ({ className: e = "", inBuilder: o }) => o ? /* @__PURE__ */ r.jsx("div", { className: I("pointer-events-none flex h-20 flex-col items-center justify-center p-2", e), children: /* @__PURE__ */ r.jsx("div", { className: "h-full w-full rounded bg-gray-200 p-2 dark:bg-gray-800", children: /* @__PURE__ */ r.jsx("div", { className: "flex h-full w-full items-center justify-center outline-dashed outline-1 -outline-offset-1 outline-gray-400 duration-300 dark:outline-gray-700" }) }) }) : null, x = ee, te = (e) => {
+  const { blockProps: o, inBuilder: t, backgroundImage: n, children: l, tag: i = "div", styles: s } = e;
   let a = l;
-  l || (a = /* @__PURE__ */ r.jsx(x, { inBuilder: o }));
-  let u = {};
-  return n && (u = { backgroundImage: `url(${n})` }), y.createElement(i, { ...t, ...s, style: u }, a);
-}, le = {
+  l || (a = /* @__PURE__ */ r.jsx(x, { inBuilder: t }));
+  let d = {};
+  return n && (d = { backgroundImage: `url(${n})` }), y.createElement(i, { ...o, ...s, style: d }, a);
+}, oe = {
   type: "Box",
   label: "Box",
   category: "core",
@@ -54,32 +54,32 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
     }
   }),
   canAcceptBlock: () => !0
-}, ne = (e) => {
-  const { blockProps: t, iconSize: o, icon: n, content: l, styles: i, children: s, iconPos: a } = e, u = n, g = s || /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+}, le = (e) => {
+  const { blockProps: o, iconSize: t, icon: n, content: l, styles: i, children: s, iconPos: a } = e, d = n, g = s || /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
     /* @__PURE__ */ r.jsx("span", { "data-ai-key": "content", children: l }),
-    u && /* @__PURE__ */ r.jsx(
+    d && /* @__PURE__ */ r.jsx(
       "div",
       {
-        style: { width: o + "px" },
+        style: { width: t + "px" },
         className: a + " " + (a === "order-first" ? "mr-2" : "ml-2") || "",
-        dangerouslySetInnerHTML: { __html: u }
+        dangerouslySetInnerHTML: { __html: d }
       }
     )
   ] });
   return y.createElement(
     "button",
     {
-      ...t,
+      ...o,
       ...i,
       type: "button"
     },
     g
   );
-}, re = {
+}, ne = {
   type: "Button",
   label: "Button",
   category: "core",
-  icon: P,
+  icon: C,
   group: "basic",
   ...p({
     properties: {
@@ -110,24 +110,24 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   }),
   i18nProps: ["content"],
   aiProps: ["content"]
-}, ie = (e) => {
-  const { blockProps: t, styles: o, htmlCode: n, inBuilder: l } = e;
+}, re = (e) => {
+  const { blockProps: o, styles: t, htmlCode: n, inBuilder: l } = e;
   return l ? /* @__PURE__ */ r.jsxs("div", { className: "relative", children: [
-    l ? /* @__PURE__ */ r.jsx("div", { ...t, ...o, className: "absolute z-20 h-full w-full" }) : null,
+    l ? /* @__PURE__ */ r.jsx("div", { ...o, ...t, className: "absolute z-20 h-full w-full" }) : null,
     y.createElement("div", {
-      ...o,
+      ...t,
       dangerouslySetInnerHTML: { __html: n.replace(/<script.*?>.*?<\/script>/g, "") }
     })
   ] }) : y.createElement("div", {
-    ...t,
     ...o,
+    ...t,
     dangerouslySetInnerHTML: { __html: n }
   });
-}, se = {
+}, ie = {
   type: "CustomHTML",
   label: "web_blocks.custom_html",
   category: "core",
-  icon: $,
+  icon: T,
   group: "advanced",
   ...p({
     properties: {
@@ -139,11 +139,11 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
       }
     }
   })
-}, ae = (e) => {
-  const { blockProps: t, styles: o, backgroundImage: n } = e;
+}, se = (e) => {
+  const { blockProps: o, styles: t, backgroundImage: n } = e;
   let l = {};
-  return n && (l = { backgroundImage: `url(${n})` }), y.createElement("div", { ...t, ...o, style: l });
-}, ce = {
+  return n && (l = { backgroundImage: `url(${n})` }), y.createElement("div", { ...o, ...t, style: l });
+}, ae = {
   type: "EmptyBox",
   label: "Empty Box",
   category: "core",
@@ -159,18 +159,18 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
       }
     }
   })
-}, de = (e) => {
-  const { blockProps: t, styles: o, content: n, level: l = "h1", children: i = null } = e;
-  return i ? y.createElement(l, { ...o, ...t }, i) : y.createElement(l, {
-    ...o,
+}, ce = (e) => {
+  const { blockProps: o, styles: t, content: n, level: l = "h1", children: i = null } = e;
+  return i ? y.createElement(l, { ...t, ...o }, i) : y.createElement(l, {
     ...t,
+    ...o,
     dangerouslySetInnerHTML: { __html: n }
   });
-}, pe = {
+}, de = {
   type: "Heading",
   label: "web_blocks.heading",
   category: "core",
-  icon: N,
+  icon: $,
   group: "typography",
   ...p({
     properties: {
@@ -193,17 +193,17 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   i18nProps: ["content"],
   canAcceptBlock: (e) => e === "Span" || e === "Text"
 }, ue = (e) => {
-  const { blockProps: t, styles: o, content: n } = e;
-  return Z(e.children) ? y.createElement("p", {
-    ...o,
+  const { blockProps: o, styles: t, content: n } = e;
+  return Y(e.children) ? y.createElement("p", {
     ...t,
+    ...o,
     dangerouslySetInnerHTML: { __html: n }
-  }) : y.createElement("p", { ...o, ...t }, e.children);
-}, ge = {
+  }) : y.createElement("p", { ...t, ...o }, e.children);
+}, pe = {
   type: "Paragraph",
   label: "Paragraph",
   category: "core",
-  icon: D,
+  icon: N,
   group: "typography",
   ...p({
     properties: {
@@ -221,14 +221,14 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   i18nProps: ["content"],
   aiProps: ["content"],
   canAcceptBlock: (e) => e === "Span" || e === "Link" || e === "Text"
-}, ye = (e) => {
-  const { blockProps: t, styles: o, content: n, children: l = null, tag: i } = e;
-  return l ? y.createElement("span", { ...o, ...t }, l) : y.createElement(i || "span", {
-    ...o,
+}, ge = (e) => {
+  const { blockProps: o, styles: t, content: n, children: l = null, tag: i } = e;
+  return l ? y.createElement("span", { ...t, ...o }, l) : y.createElement(i || "span", {
     ...t,
+    ...o,
     dangerouslySetInnerHTML: { __html: n || "" }
   });
-}, me = {
+}, ye = {
   type: "Span",
   label: "Span",
   category: "core",
@@ -247,10 +247,10 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   aiProps: ["content"],
   i18nProps: ["content"],
   canAcceptBlock: () => !0
-}, he = (e) => {
-  const { blockProps: t, content: o, styles: n } = e;
-  return /* @__PURE__ */ r.jsx("div", { className: "max-w-full", children: /* @__PURE__ */ r.jsx("div", { ...t, ...n, dangerouslySetInnerHTML: { __html: o } }) });
-}, fe = {
+}, me = (e) => {
+  const { blockProps: o, content: t, styles: n } = e;
+  return /* @__PURE__ */ r.jsx("div", { className: "max-w-full", children: /* @__PURE__ */ r.jsx("div", { ...o, ...n, dangerouslySetInnerHTML: { __html: t } }) });
+}, he = {
   type: "RichText",
   label: "Rich Text",
   category: "core",
@@ -269,28 +269,28 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   }),
   aiProps: ["content"],
   i18nProps: ["content"]
-}, be = (e) => {
-  const { blockProps: t, link: o, children: n, styles: l, inBuilder: i, content: s } = e;
+}, fe = (e) => {
+  const { blockProps: o, link: t, children: n, styles: l, inBuilder: i, content: s } = e;
   let a = {};
-  return !n && b(s) && (a = { minHeight: "50px", display: "flex", alignItems: "center", justifyContent: "center" }), i ? n ? /* @__PURE__ */ r.jsx("span", { ...t, style: a, ...l, children: n }) : y.createElement(
+  return !n && b(s) && (a = { minHeight: "50px", display: "flex", alignItems: "center", justifyContent: "center" }), i ? n ? /* @__PURE__ */ r.jsx("span", { ...o, style: a, ...l, children: n }) : y.createElement(
     "span",
     {
-      ...t,
+      ...o,
       ...l,
       style: a
     },
     s
-  ) : n ? /* @__PURE__ */ r.jsx("a", { href: (o == null ? void 0 : o.href) || "#/", target: o == null ? void 0 : o.target, ...t, ...l, children: n }) : y.createElement(
+  ) : n ? /* @__PURE__ */ r.jsx("a", { href: (t == null ? void 0 : t.href) || "#/", target: t == null ? void 0 : t.target, ...o, ...l, children: n }) : y.createElement(
     "a",
     {
-      ...t,
+      ...o,
       ...l,
-      href: (o == null ? void 0 : o.href) || "#",
-      target: (o == null ? void 0 : o.target) || "_self"
+      href: (t == null ? void 0 : t.href) || "#",
+      target: (t == null ? void 0 : t.target) || "_self"
     },
     s
   );
-}, ke = {
+}, be = {
   type: "Link",
   label: "Link",
   category: "core",
@@ -325,28 +325,28 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   aiProps: ["content"],
   i18nProps: ["content"],
   canAcceptBlock: (e) => e !== "Link"
-}, M = (e, ...t) => ({
+}, M = (e, ...o) => ({
   ...e,
-  className: I(e.className, ...t)
-}), xe = (e) => {
-  const { blockProps: t, children: o, styles: n, inBuilder: l, content: i, href: s } = e, { hrefType: a, autoplay: u, maxWidth: g, backdropColor: h, galleryName: f } = e, m = M(n, "cb-lightbox");
-  if (!o && b(n == null ? void 0 : n.className) && b(i))
+  className: I(e.className, ...o)
+}), ke = (e) => {
+  const { blockProps: o, children: t, styles: n, inBuilder: l, content: i, href: s } = e, { hrefType: a, autoplay: d, maxWidth: g, backdropColor: h, galleryName: f } = e, m = M(n, "cb-lightbox");
+  if (!t && b(n == null ? void 0 : n.className) && b(i))
     return /* @__PURE__ */ r.jsx(x, { inBuilder: l });
   if (l)
-    return o ? /* @__PURE__ */ r.jsx("span", { ...t, ...m, children: o }) : y.createElement("span", {
-      ...t,
+    return t ? /* @__PURE__ */ r.jsx("span", { ...o, ...m, children: t }) : y.createElement("span", {
+      ...o,
       ...m,
       dangerouslySetInnerHTML: { __html: i }
     });
   const k = {};
-  return k["data-vbtype"] = a, u && (k["data-autoplay"] = "true"), g && (k["data-maxwidth"] = g + "px"), h && (k["data-overlay"] = h), f && (k["data-gall"] = f), o ? /* @__PURE__ */ r.jsx("a", { ...k, href: s || "#/", ...t, ...m, children: o }) : y.createElement("a", {
-    ...t,
+  return k["data-vbtype"] = a, d && (k["data-autoplay"] = "true"), g && (k["data-maxwidth"] = g + "px"), h && (k["data-overlay"] = h), f && (k["data-gall"] = f), t ? /* @__PURE__ */ r.jsx("a", { ...k, href: s || "#/", ...o, ...m, children: t }) : y.createElement("a", {
+    ...o,
     ...m,
     ...k,
     href: s || "#",
     dangerouslySetInnerHTML: { __html: i }
   });
-}, we = {
+}, xe = {
   type: "LightBoxLink",
   label: "Lightbox Link",
   category: "core",
@@ -420,17 +420,17 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   i18nProps: ["content"],
   aiProps: ["content"],
   canAcceptBlock: (e) => e !== "Link" && e !== "LightBoxLink"
-}, ve = (e) => {
-  const { blockProps: t, children: o, listType: n, styles: l, tag: i, inBuilder: s } = e, a = I(v(l, "className", ""), n);
-  return !o && b(l == null ? void 0 : l.className) ? /* @__PURE__ */ r.jsx(x, { inBuilder: s }) : y.createElement(
+}, we = (e) => {
+  const { blockProps: o, children: t, listType: n, styles: l, tag: i, inBuilder: s } = e, a = I(v(l, "className", ""), n);
+  return !t && b(l == null ? void 0 : l.className) ? /* @__PURE__ */ r.jsx(x, { inBuilder: s }) : y.createElement(
     i || (n === "list-decimal" ? "ol" : "ul"),
-    { ...t, ...l, className: a },
-    o
+    { ...o, ...l, className: a },
+    t
   );
-}, Ie = {
+}, ve = {
   type: "List",
   label: "web_blocks.list",
-  icon: A,
+  icon: R,
   category: "core",
   group: "basic",
   ...p({
@@ -473,17 +473,17 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
       content: "Item 3"
     }
   ]
-}, _e = (e) => {
-  const { blockProps: t, content: o, styles: n, children: l, tag: i } = e;
-  return l ? y.createElement(i || "li", { ...n, ...t }, l) : y.createElement(i || "li", {
+}, Ie = (e) => {
+  const { blockProps: o, content: t, styles: n, children: l, tag: i } = e;
+  return l ? y.createElement(i || "li", { ...n, ...o }, l) : y.createElement(i || "li", {
     ...n,
-    ...t,
-    dangerouslySetInnerHTML: { __html: o }
+    ...o,
+    dangerouslySetInnerHTML: { __html: t }
   });
 }, Le = {
   type: "ListItem",
   label: "List Item",
-  icon: R,
+  icon: A,
   category: "core",
   group: "basic",
   ...p({
@@ -503,21 +503,21 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   aiProps: ["content"],
   canAcceptBlock: (e) => e !== "ListItem",
   canBeNested: (e) => e === "List"
-}, Be = (e) => {
-  const { blockProps: t, icon: o, styles: n, width: l, inBuilder: i, height: s } = e, a = M(n, I(l ? `w-[${l}px]` : "", s ? `h-[${s}px]` : ""));
-  if (b(o))
+}, _e = (e) => {
+  const { blockProps: o, icon: t, styles: n, width: l, inBuilder: i, height: s } = e, a = M(n, I(l ? `w-[${l}px]` : "", s ? `h-[${s}px]` : ""));
+  if (b(t))
     return /* @__PURE__ */ r.jsx(x, { inBuilder: i, className: "h-8 w-14" });
-  const u = o.replace(/<svg /g, '<svg class="w-[inherit] h-[inherit]" ');
+  const d = t.replace(/<svg /g, '<svg class="w-[inherit] h-[inherit]" ');
   return y.createElement("span", {
-    ...t,
+    ...o,
     ...a,
-    dangerouslySetInnerHTML: { __html: u }
+    dangerouslySetInnerHTML: { __html: d }
   });
-}, Ce = {
+}, Be = {
   type: "Icon",
   label: "web_blocks.icon",
   category: "core",
-  icon: q,
+  icon: D,
   group: "media",
   ...p({
     properties: {
@@ -541,17 +541,17 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
     }
   })
 }, Pe = (e) => {
-  const { blockProps: t, image: o, styles: n, alt: l, height: i, width: s, lazyLoading: a } = e;
-  return b(o) ? /* @__PURE__ */ r.jsx(x, { className: "h-36" }) : y.createElement("img", {
-    ...t,
+  const { blockProps: o, image: t, styles: n, alt: l, height: i, width: s, lazyLoading: a } = e;
+  return b(t) ? /* @__PURE__ */ r.jsx(x, { className: "h-36" }) : y.createElement("img", {
+    ...o,
     ...n,
-    src: o,
+    src: t,
     alt: l,
     loading: a ? "lazy" : "eager",
     height: i,
     width: s
   });
-}, je = {
+}, Ce = {
   type: "Image",
   label: "Image",
   category: "core",
@@ -611,57 +611,57 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
   }),
   aiProps: ["alt"],
   i18nProps: ["alt"]
-}, L = /^(https?:\/\/)?(www\.)?youtube\.com\/(watch\?v=|embed\/)([a-zA-Z0-9_-]{11})/, B = /^(https?:\/\/)?(www\.)?player.vimeo\.com/, C = /^(https?:\/\/)?(www\.)?dailymotion\.com\/(video|embed\/video)\/([a-zA-Z0-9_-]+)/, Se = (e) => {
-  if (L.test(e)) {
-    const t = e.match(L);
-    return t ? `https://www.youtube.com/embed/${t[4]}` : e;
+}, _ = /^(https?:\/\/)?(www\.)?youtube\.com\/(watch\?v=|embed\/)([a-zA-Z0-9_-]{11})/, B = /^(https?:\/\/)?(www\.)?player.vimeo\.com/, P = /^(https?:\/\/)?(www\.)?dailymotion\.com\/(video|embed\/video)\/([a-zA-Z0-9_-]+)/, je = (e) => {
+  if (_.test(e)) {
+    const o = e.match(_);
+    return o ? `https://www.youtube.com/embed/${o[4]}` : e;
   }
   if (B.test(e)) {
-    const t = e.match(B);
-    return t ? `https://player.vimeo.com/video/${t[3]}` : e;
+    const o = e.match(B);
+    return o ? `https://player.vimeo.com/video/${o[3]}` : e;
   }
-  if (C.test(e)) {
-    const t = e.match(C);
-    return t ? `https://www.dailymotion.com/embed/video/${t[4]}` : e;
+  if (P.test(e)) {
+    const o = e.match(P);
+    return o ? `https://www.dailymotion.com/embed/video/${o[4]}` : e;
   }
   return null;
-}, Me = y.memo((e) => {
-  const { blockProps: t, inBuilder: o, styles: n, url: l, controls: i } = e, s = v(i, "autoPlay", !1), a = v(i, "controls", !1), u = s || v(i, "muted", !0), g = v(i, "loop", !1);
+}, Se = y.memo((e) => {
+  const { blockProps: o, inBuilder: t, styles: n, url: l, controls: i } = e, s = v(i, "autoPlay", !1), a = v(i, "controls", !1), d = s || v(i, "muted", !0), g = v(i, "loop", !1);
   if (b(l))
-    return /* @__PURE__ */ r.jsx(x, { inBuilder: o, className: "h-36" });
-  let h = Se(l), f = null;
+    return /* @__PURE__ */ r.jsx(x, { inBuilder: t, className: "h-36" });
+  let h = je(l), f = null;
   if (h) {
     if (!b(h)) {
       const m = [];
-      m.push(`autoplay=${s ? 1 : 0}`), m.push(`controls=${i ? 1 : 0}`), m.push(`mute=${u ? 1 : 0}&muted=${u ? 1 : 0}`), m.push(`loop=${g ? 1 : 0}`), h = `${h}?${m.join("&")}`;
+      m.push(`autoplay=${s ? 1 : 0}`), m.push(`controls=${i ? 1 : 0}`), m.push(`mute=${d ? 1 : 0}&muted=${d ? 1 : 0}`), m.push(`loop=${g ? 1 : 0}`), h = `${h}?${m.join("&")}`;
     }
     f = y.createElement("iframe", {
-      ...t,
+      ...o,
       className: "absolute inset-0 w-full h-full",
       src: h,
-      allow: o ? "" : "autoplay *; fullscreen *",
+      allow: t ? "" : "autoplay *; fullscreen *",
       allowFullScreen: !0,
       frameBorder: 0
     });
   } else
     f = y.createElement("video", {
-      ...t,
+      ...o,
       className: "absolute inset-0 w-full h-full",
       src: l,
       controls: a,
-      muted: u,
-      autoPlay: o ? !1 : s,
+      muted: d,
+      autoPlay: t ? !1 : s,
       loop: g
     });
-  return /* @__PURE__ */ r.jsx("div", { ...J(n, ["className"]), children: /* @__PURE__ */ r.jsxs("div", { className: "relative w-full overflow-hidden", style: { paddingBottom: "56.25%" }, children: [
-    o ? /* @__PURE__ */ r.jsx("div", { ...t, ...K(n, ["className"]), className: "absolute inset-0 z-20 h-full w-full" }) : null,
+  return /* @__PURE__ */ r.jsx("div", { ...Z(n, ["className"]), children: /* @__PURE__ */ r.jsxs("div", { className: "relative w-full overflow-hidden", style: { paddingBottom: "56.25%" }, children: [
+    t ? /* @__PURE__ */ r.jsx("div", { ...o, ...J(n, ["className"]), className: "absolute inset-0 z-20 h-full w-full" }) : null,
     f
   ] }) });
-}), Ee = {
+}), Me = {
   type: "Video",
   label: "Video",
   category: "core",
-  icon: F,
+  icon: q,
   group: "media",
   ...p({
     properties: {
@@ -706,14 +706,14 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
     }
   }),
   i18nProps: ["url"]
-}, Te = (e) => {
-  const { blockProps: t, styles: o } = e;
-  return y.createElement("hr", { ...o, ...t });
-}, $e = {
+}, Ee = (e) => {
+  const { blockProps: o, styles: t } = e;
+  return y.createElement("hr", { ...t, ...o });
+}, Te = {
   type: "Divider",
   label: "web_blocks.divider",
   category: "core",
-  icon: G,
+  icon: F,
   group: "basic",
   ...p({
     properties: {
@@ -721,17 +721,17 @@ const te = ({ className: e = "", inBuilder: t }) => t ? /* @__PURE__ */ r.jsx("d
     }
   })
 };
-function Ne(e) {
-  return T({ tag: "svg", attr: { version: "1.1", viewBox: "0 0 32 32" }, child: [{ tag: "path", attr: { d: "M4.698 3.419l2.057 23.073 9.231 2.563 9.256-2.566 2.059-23.069h-22.604zM13.226 9.394l-0.409 4.441 9.671 0.001-0.069 0.76-0.665 7.45-0.042 0.478-5.804 1.609-5.796-1.609-0.396-4.443h2.84l0.202 2.257 3.154 0.85 3.156-0.852 0.328-3.67-9.671-0.001 0.069-0.76 0.665-7.45 0.209-2.086h11.287l0.131 1.598 0.403 4.453h-2.841l-0.262-2.922-2.889-0.174h-0.515v-0.004l-2.755 0.074z" }, child: [] }] })(e);
+function $e(e) {
+  return E({ tag: "svg", attr: { version: "1.1", viewBox: "0 0 32 32" }, child: [{ tag: "path", attr: { d: "M4.698 3.419l2.057 23.073 9.231 2.563 9.256-2.566 2.059-23.069h-22.604zM13.226 9.394l-0.409 4.441 9.671 0.001-0.069 0.76-0.665 7.45-0.042 0.478-5.804 1.609-5.796-1.609-0.396-4.443h2.84l0.202 2.257 3.154 0.85 3.156-0.852 0.328-3.67-9.671-0.001 0.069-0.76 0.665-7.45 0.209-2.086h11.287l0.131 1.598 0.403 4.453h-2.841l-0.262-2.922-2.889-0.174h-0.515v-0.004l-2.755 0.074z" }, child: [] }] })(e);
 }
-const De = (e) => {
-  const { scripts: t, inBuilder: o, blockProps: n } = e;
-  return o ? /* @__PURE__ */ r.jsx("div", { ...n, children: /* @__PURE__ */ r.jsx("div", { className: I("pointer-events-none flex flex-col items-center justify-center p-2", ""), children: /* @__PURE__ */ r.jsx("div", { className: "h-full w-full rounded bg-gray-200 p-1 dark:bg-gray-800", children: /* @__PURE__ */ r.jsx("p", { className: "text-left text-xs text-gray-400", children: "Scripts will be only executed in preview and live mode. Place your script at the bottom of the" }) }) }) }) : /* @__PURE__ */ r.jsx("div", { dangerouslySetInnerHTML: { __html: t } });
+const Ne = (e) => {
+  const { scripts: o, inBuilder: t, blockProps: n } = e;
+  return t ? /* @__PURE__ */ r.jsx("div", { ...n, children: /* @__PURE__ */ r.jsx("div", { className: I("pointer-events-none flex flex-col items-center justify-center p-2", ""), children: /* @__PURE__ */ r.jsx("div", { className: "h-full w-full rounded bg-gray-200 p-1 dark:bg-gray-800", children: /* @__PURE__ */ r.jsx("p", { className: "text-left text-xs text-gray-400", children: "Scripts will be only executed in preview and live mode. Place your script at the bottom of the" }) }) }) }) : /* @__PURE__ */ r.jsx("div", { dangerouslySetInnerHTML: { __html: o } });
 }, He = {
   type: "CustomScript",
   label: "web_blocks.custom_script",
   category: "core",
-  icon: Ne,
+  icon: $e,
   group: "advanced",
   ...p({
     properties: {
@@ -744,11 +744,11 @@ const De = (e) => {
       }
     }
   })
-}, ze = (e) => null, Ae = {
+}, ze = (e) => null, Re = {
   type: "Dark Mode",
   label: "web_blocks.dark_mode",
   category: "core",
-  icon: W,
+  icon: G,
   group: "advanced",
   ...p({
     properties: {}
@@ -802,13 +802,13 @@ const De = (e) => {
       icon: "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='4'></circle><path d='M12 2v2'></path><path d='M12 20v2'></path><path d='m4.93 4.93 1.41 1.41'></path><path d='m17.66 17.66 1.41 1.41'></path><path d='M2 12h2'></path><path d='M20 12h2'></path><path d='m6.34 17.66-1.41 1.41'></path><path d='m19.07 4.93-1.41 1.41'></path></svg>"
     }
   ]
-}, Re = (e) => {
-  const { blockProps: t, inBuilder: o, children: n, globalBlock: l } = e;
-  return o && !l ? /* @__PURE__ */ r.jsxs(
+}, Ae = (e) => {
+  const { blockProps: o, inBuilder: t, children: n, globalBlock: l } = e;
+  return t && !l ? /* @__PURE__ */ r.jsxs(
     "div",
     {
       className: "flex flex-col items-center justify-center gap-y-1 rounded-lg bg-gray-100 py-4 dark:bg-gray-800",
-      ...t,
+      ...o,
       children: [
         /* @__PURE__ */ r.jsxs("h1", { children: [
           "Global Block - ",
@@ -817,11 +817,11 @@ const De = (e) => {
         /* @__PURE__ */ r.jsx("p", { children: "Choose a block from the sidebar to add it to this page." })
       ]
     }
-  ) : y.createElement("div", { ...t }, n);
-}, qe = {
+  ) : y.createElement("div", { ...o }, n);
+}, De = {
   type: "GlobalBlock",
   label: "Global Block",
-  icon: Q,
+  icon: K,
   category: "core",
   group: "advanced",
   ...p({
@@ -836,7 +836,7 @@ const De = (e) => {
       }
     }
   })
-}, Fe = (e) => e.inBuilder || e.forceWrapper ? /* @__PURE__ */ r.jsx("span", { ...e.blockProps, children: e.content }) : `${e.content}`, Ge = {
+}, qe = (e) => e.inBuilder || e.forceWrapper ? /* @__PURE__ */ r.jsx("span", { ...e.blockProps, children: e.content }) : `${e.content}`, Fe = {
   type: "Text",
   label: "Text",
   hidden: !0,
@@ -854,10 +854,10 @@ const De = (e) => {
   }),
   aiProps: ["content"],
   i18nProps: ["content"]
-}, We = (e) => {
-  const { blockProps: t, backgroundImage: o, children: n, styles: l, tag: i } = e;
+}, Ge = (e) => {
+  const { blockProps: o, backgroundImage: t, children: n, styles: l, tag: i } = e;
   let s = {};
-  return o && (s = { backgroundImage: `url(${o})` }), y.createElement(i || "div", { ...t, ...l, style: s }, n);
+  return t && (s = { backgroundImage: `url(${t})` }), y.createElement(i || "div", { ...o, ...l, style: s }, n);
 }, Ve = {
   type: "Body",
   label: "Body",
@@ -904,8 +904,8 @@ const De = (e) => {
   canMove: () => !1,
   canDuplicate: () => !1
 }, Oe = (e) => {
-  const { blockProps: t, styles: o } = e;
-  return y.createElement("br", { ...t, ...o });
+  const { blockProps: o, styles: t } = e;
+  return y.createElement("br", { ...o, ...t });
 }, Ue = {
   type: "LineBreak",
   label: "Line Break",
@@ -921,11 +921,11 @@ const De = (e) => {
   canDelete: () => !1,
   canMove: () => !1,
   canDuplicate: () => !1
-}, Xe = (e) => {
-  const { children: t, blockProps: o, errorMessage: n, successMessage: l, action: i, styles: s } = e;
-  let a = t;
-  t || (a = /* @__PURE__ */ r.jsx(x, {}));
-  const u = {
+}, We = (e) => {
+  const { children: o, blockProps: t, errorMessage: n, successMessage: l, action: i, styles: s } = e;
+  let a = o;
+  o || (a = /* @__PURE__ */ r.jsx(x, {}));
+  const d = {
     "x-data": "{}",
     "x-on:submit.prevent": "post"
   }, g = {
@@ -935,12 +935,12 @@ const De = (e) => {
   return /* @__PURE__ */ r.jsxs(
     "form",
     {
-      ...u,
+      ...d,
       "data-error": n,
       "data-success": l,
       method: "post",
       action: i,
-      ...o,
+      ...t,
       ...s,
       children: [
         /* @__PURE__ */ r.jsx("div", { ...g }),
@@ -948,11 +948,11 @@ const De = (e) => {
       ]
     }
   );
-}, Ye = {
+}, Xe = {
   type: "Form",
   label: "Form",
   category: "core",
-  icon: ee,
+  icon: Q,
   group: "form",
   ...p({
     properties: {
@@ -979,8 +979,8 @@ const De = (e) => {
   i18nProps: ["errorMessage", "successMessage"],
   aiProps: ["errorMessage", "successMessage"],
   canAcceptBlock: () => !0
-}, Ze = (e) => {
-  const { blockProps: t, inBuilder: o, label: n, styles: l, inputStyles: i, icon: s, iconSize: a, iconPos: u } = e, g = w(), h = {
+}, Ye = (e) => {
+  const { blockProps: o, inBuilder: t, label: n, styles: l, inputStyles: i, icon: s, iconSize: a, iconPos: d } = e, g = w(), h = {
     "x-bind:disabled": "formLoading"
   };
   return /* @__PURE__ */ r.jsxs(
@@ -990,26 +990,26 @@ const De = (e) => {
       ...h,
       ...i,
       ...l,
-      ...t || {},
-      type: o ? "button" : "submit",
+      ...o || {},
+      type: t ? "button" : "submit",
       children: [
         n,
         s && /* @__PURE__ */ r.jsx(
           "div",
           {
             style: { width: a + "px" },
-            className: u + " " + (u === "order-first" ? "mr-2" : "ml-2") || "",
+            className: d + " " + (d === "order-first" ? "mr-2" : "ml-2") || "",
             dangerouslySetInnerHTML: { __html: s }
           }
         )
       ]
     }
   );
-}, Je = {
+}, Ze = {
   type: "FormButton",
   label: "Submit Button",
   category: "core",
-  icon: P,
+  icon: C,
   group: "form",
   ...p({
     properties: {
@@ -1045,35 +1045,35 @@ const De = (e) => {
   }),
   i18nProps: ["label"],
   aiProps: ["label"]
-}, Ke = (e) => {
-  const { blockProps: t, fieldName: o, label: n, placeholder: l, styles: i, inputStyles: s, showLabel: a, required: u, inputType: g } = e, h = w();
-  return a ? /* @__PURE__ */ r.jsxs("div", { ...i, ...t, children: [
+}, Je = (e) => {
+  const { blockProps: o, fieldName: t, label: n, placeholder: l, styles: i, inputStyles: s, showLabel: a, required: d, inputType: g } = e, h = w();
+  return a ? /* @__PURE__ */ r.jsxs("div", { ...i, ...o, children: [
     a && /* @__PURE__ */ r.jsx("label", { htmlFor: h, children: n }),
     /* @__PURE__ */ r.jsx(
       "input",
       {
-        name: o,
+        name: t,
         ...s,
         id: h,
         type: g,
         placeholder: l,
-        required: u
+        required: d
       }
     )
   ] }) : /* @__PURE__ */ r.jsx(
     "input",
     {
       id: h,
-      name: o,
-      ...t,
+      name: t,
+      ...o,
       ...s,
       ...i,
       type: g,
       placeholder: l,
-      required: u
+      required: d
     }
   );
-}, Qe = {
+}, Ke = {
   type: "Input",
   label: "web_blocks.input",
   category: "core",
@@ -1128,25 +1128,25 @@ const De = (e) => {
   }),
   aiProps: ["label", "placeholder"],
   i18nProps: ["label", "placeholder"]
-}, et = (e) => {
-  const { blockProps: t, fieldName: o, label: n, styles: l, inputStyles: i, required: s, checked: a, showLabel: u = !0 } = e, g = w();
-  return u ? /* @__PURE__ */ r.jsxs("div", { ...l, ...t, children: [
-    /* @__PURE__ */ r.jsx("input", { ...i, name: o, id: g, type: "radio", required: s, defaultChecked: a }),
+}, Qe = (e) => {
+  const { blockProps: o, fieldName: t, label: n, styles: l, inputStyles: i, required: s, checked: a, showLabel: d = !0 } = e, g = w();
+  return d ? /* @__PURE__ */ r.jsxs("div", { ...l, ...o, children: [
+    /* @__PURE__ */ r.jsx("input", { ...i, name: t, id: g, type: "radio", required: s, defaultChecked: a }),
     n && /* @__PURE__ */ r.jsx("label", { htmlFor: g, children: n })
   ] }) : /* @__PURE__ */ r.jsx(
     "input",
     {
       id: g,
-      ...t,
+      ...o,
       ...i,
       ...l,
       type: "radio",
       required: s,
       checked: a,
-      name: o
+      name: t
     }
   );
-}, tt = {
+}, et = {
   type: "Radio",
   label: "web_blocks.radio",
   category: "core",
@@ -1180,19 +1180,19 @@ const De = (e) => {
   }),
   aiProps: ["label"],
   i18nProps: ["label"]
-}, ot = (e) => {
-  const { blockProps: t, fieldName: o, label: n, placeholder: l, styles: i, inputStyles: s, required: a, showLabel: u, _multiple: g, options: h } = e, f = w();
-  return u ? /* @__PURE__ */ r.jsxs("div", { ...i, ...t, children: [
-    u && /* @__PURE__ */ r.jsx("label", { htmlFor: f, children: n }),
-    /* @__PURE__ */ r.jsxs("select", { ...s, id: f, required: a, multiple: g, name: o, children: [
+}, tt = (e) => {
+  const { blockProps: o, fieldName: t, label: n, placeholder: l, styles: i, inputStyles: s, required: a, showLabel: d, _multiple: g, options: h } = e, f = w();
+  return d ? /* @__PURE__ */ r.jsxs("div", { ...i, ...o, children: [
+    d && /* @__PURE__ */ r.jsx("label", { htmlFor: f, children: n }),
+    /* @__PURE__ */ r.jsxs("select", { ...s, id: f, required: a, multiple: g, name: t, children: [
       /* @__PURE__ */ r.jsx("option", { value: "", disabled: !0, selected: !0, hidden: !0, children: l }),
-      _(h, (m) => /* @__PURE__ */ r.jsx("option", { value: m.value, dangerouslySetInnerHTML: { __html: m.label } }, m.value))
+      L(h, (m) => /* @__PURE__ */ r.jsx("option", { value: m.value, dangerouslySetInnerHTML: { __html: m.label } }, m.value))
     ] })
-  ] }) : /* @__PURE__ */ r.jsxs("select", { id: f, ...i, ...t, required: a, multiple: g, name: o, children: [
+  ] }) : /* @__PURE__ */ r.jsxs("select", { id: f, ...i, ...o, required: a, multiple: g, name: t, children: [
     /* @__PURE__ */ r.jsx("option", { value: "", disabled: !0, selected: !0, hidden: !0, children: l }),
-    _(h, (m) => /* @__PURE__ */ r.jsx("option", { value: m.value, dangerouslySetInnerHTML: { __html: m.label } }, m.value))
+    L(h, (m) => /* @__PURE__ */ r.jsx("option", { value: m.value, dangerouslySetInnerHTML: { __html: m.label } }, m.value))
   ] });
-}, lt = {
+}, ot = {
   type: "Select",
   label: "web_blocks.select",
   category: "core",
@@ -1251,24 +1251,24 @@ const De = (e) => {
   }),
   aiProps: ["label", "placeholder"],
   i18nProps: ["label", "placeholder"]
-}, nt = (e) => {
-  const { blockProps: t, fieldName: o, label: n, placeholder: l, styles: i, inputStyles: s, _rows: a, showLabel: u } = e, g = w();
-  return u ? /* @__PURE__ */ r.jsxs("div", { ...i, ...t, children: [
-    u && /* @__PURE__ */ r.jsx("label", { htmlFor: g, children: n }),
-    /* @__PURE__ */ r.jsx("textarea", { name: o, ...s, id: g, placeholder: l, rows: a })
+}, lt = (e) => {
+  const { blockProps: o, fieldName: t, label: n, placeholder: l, styles: i, inputStyles: s, _rows: a, showLabel: d } = e, g = w();
+  return d ? /* @__PURE__ */ r.jsxs("div", { ...i, ...o, children: [
+    d && /* @__PURE__ */ r.jsx("label", { htmlFor: g, children: n }),
+    /* @__PURE__ */ r.jsx("textarea", { name: t, ...s, id: g, placeholder: l, rows: a })
   ] }) : /* @__PURE__ */ r.jsx(
     "textarea",
     {
       id: g,
-      name: o,
-      ...t,
+      name: t,
+      ...o,
       ...s,
       ...i,
       placeholder: l,
       rows: a
     }
   );
-}, rt = {
+}, nt = {
   type: "TextArea",
   label: "web_blocks.textarea",
   category: "core",
@@ -1303,14 +1303,14 @@ const De = (e) => {
   }),
   aiProps: ["label", "placeholder"],
   i18nProps: ["label", "placeholder"]
-}, it = (e) => {
-  const { blockProps: t, fieldName: o, label: n, styles: l, inputStyles: i, required: s, checked: a, showLabel: u = !0 } = e, g = w();
-  return u ? /* @__PURE__ */ r.jsxs("div", { ...l, ...t, children: [
+}, rt = (e) => {
+  const { blockProps: o, fieldName: t, label: n, styles: l, inputStyles: i, required: s, checked: a, showLabel: d = !0 } = e, g = w();
+  return d ? /* @__PURE__ */ r.jsxs("div", { ...l, ...o, children: [
     /* @__PURE__ */ r.jsx(
       "input",
       {
         ...i,
-        name: o,
+        name: t,
         id: g,
         type: "checkbox",
         required: s,
@@ -1322,19 +1322,19 @@ const De = (e) => {
     "input",
     {
       id: g,
-      ...t,
+      ...o,
       ...i,
       ...l,
       type: "checkbox",
       required: s,
-      name: o
+      name: t
     }
   );
-}, st = {
+}, it = {
   type: "Checkbox",
   label: "web_blocks.checkbox",
   category: "core",
-  icon: X,
+  icon: W,
   group: "form",
   ...p({
     properties: {
@@ -1364,17 +1364,17 @@ const De = (e) => {
   }),
   aiProps: ["label"],
   i18nProps: ["label"]
-}, at = (e) => {
-  const { blockProps: t, content: o, styles: n, children: l } = e, i = { ...n, ...t };
+}, st = (e) => {
+  const { blockProps: o, content: t, styles: n, children: l } = e, i = { ...n, ...o };
   return l ? y.createElement("label", i, l) : y.createElement("label", {
     ...i,
-    dangerouslySetInnerHTML: { __html: o }
+    dangerouslySetInnerHTML: { __html: t }
   });
-}, ct = {
+}, at = {
   type: "Label",
   label: "Label",
   category: "core",
-  icon: Y,
+  icon: X,
   group: "form",
   ...p({
     properties: {
@@ -1386,89 +1386,9 @@ const De = (e) => {
       }
     }
   })
-}, E = {
-  wrapper: { "x-data": "{ open: false }" },
-  button: { "x-on:click": "open = !open" },
-  menu: { "x-show": "open", "x-on:click.away": "open = false" }
-}, dt = (e) => {
-  const { blockProps: t, title: o, icon: n, iconWidth: l, iconHeight: i, styles: s } = e;
-  return /* @__PURE__ */ r.jsxs("button", { ...t, ...E.button, ...s, children: [
-    o,
-    /* @__PURE__ */ r.jsx("span", { dangerouslySetInnerHTML: { __html: n }, style: { width: l, height: i } })
-  ] });
-};
-d(dt, {
-  type: "DropdownButton",
-  label: "Dropdown Button",
-  group: "advanced",
-  category: "core",
-  hidden: !0,
-  canMove: () => !1,
-  canDelete: () => !1,
-  ...p({
-    properties: {
-      title: { type: "string", title: "Title", default: "Menu Item" },
-      icon: { type: "string", title: "Icon", default: "", ui: { "ui:widget": "icon" } },
-      iconWidth: { type: "string", title: "Icon Width", default: "16px" },
-      iconHeight: { type: "string", title: "Icon Height", default: "16px" },
-      styles: c("flex items-center gap-2 px-4 py-1")
-    }
-  })
-});
-const pt = (e) => {
-  const { blockProps: t, children: o, styles: n } = e;
-  return /* @__PURE__ */ r.jsx("div", { ...t, ...E.wrapper, className: "relative", children: /* @__PURE__ */ r.jsx("div", { ...n, children: o }) });
-};
-d(pt, {
-  type: "DropdownMenuContent",
-  label: "Dropdown Content",
-  hidden: !0,
-  canMove: () => !1,
-  canDelete: () => !1,
-  canAcceptBlock: () => !0,
-  ...p({
-    properties: {
-      styles: c("absolute left-0 w-80 mt-2 bg-white rounded-lg shadow-lg z-50")
-    }
-  })
-});
-const ut = (e) => {
-  const { children: t } = e;
-  return t;
-}, gt = {
-  type: "DropdownMenu",
-  label: "Dropdown Menu",
-  group: "advanced",
-  blocks: () => [
-    { _type: "DropdownMenu", _id: "menu" },
-    {
-      _type: "DropdownButton",
-      _id: "button",
-      _parent: "menu",
-      title: "Menu Item",
-      icon: "",
-      styles: "#styles:,flex items-center gap-2 px-4 py-1"
-    },
-    {
-      _type: "DropdownMenuContent",
-      _id: "content",
-      _parent: "menu",
-      styles: "#styles:,absolute left-0 w-80 mt-2 bg-white rounded-lg shadow-lg z-50"
-    }
-  ],
-  category: "core",
-  ...p({
-    properties: {
-      showDropdown: {
-        type: "boolean",
-        title: "Show Dropdown",
-        default: !1
-      }
-    }
-  })
-}, vt = () => {
-  d(oe, le), d(ae, ce), d(ne, re), d(de, pe), d(ue, ge), d(ye, me), d(he, fe), d(be, ke), d(xe, we), d(ve, Ie), d(_e, Le), d(Be, Ce), d(Pe, je), d(Me, Ee), d(ie, se), d(De, He), d(Fe, Ge), d(Xe, Ye), d(Ze, Je), d(Ke, Qe), d(it, st), d(et, tt), d(ot, lt), d(nt, rt), d(at, ct), d(Oe, Ue), d(We, Ve), d(Te, $e), d(ze, Ae), d(Re, qe), d(ut, gt);
+}, ft = () => {
+  u(te, oe), u(se, ae), u(le, ne), u(ce, de), u(ue, pe), u(ge, ye), u(me, he), u(fe, be), u(ke, xe), u(we, ve), u(Ie, Le), u(_e, Be), u(Pe, Ce), u(Se, Me), u(re, ie), u(Ne, He), u(qe, Fe), u(We, Xe), u(Ye, Ze), u(Je, Ke), u(rt, it), u(Qe, et), u(tt, ot), u(lt, nt), u(st, at), u(Oe, Ue), u(Ge, Ve), u(Ee, Te), u(ze, Re), u(Ae, De);
 };
 export {
-  vt as loadWebBlocks
+  ft as loadWebBlocks
 };