@myissue/vue-website-page-builder
Version:
Vue 3 page builder component with drag & drop functionality.
1,670 lines • 1.18 MB
JavaScript
var e1 = Object.defineProperty;
var t1 = (n, e, t) => e in n ? e1(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
var de = (n, e, t) => t1(n, typeof e != "symbol" ? e + "" : e, t);
import * as ya from "vue";
import { defineComponent as tt, computed as P, createBlock as oe, openBlock as y, Teleport as n1, createElementVNode as p, createElementBlock as w, createCommentVNode as E, normalizeClass as V, toDisplayString as C, renderSlot as xn, ref as k, watchEffect as ci, Fragment as J, withCtx as q, nextTick as te, readonly as i1, effectScope as rp, markRaw as Yt, toRaw as ze, hasInjectionContext as r1, inject as an, getCurrentInstance as op, watch as Y, unref as g, reactive as o1, isRef as Di, isReactive as fl, toRef as Qo, getCurrentScope as s1, onScopeDispose as l1, toRefs as va, withDirectives as le, renderList as ie, vModelSelect as Se, createTextVNode as we, withKeys as As, vModelText as Bn, withModifiers as Xe, provide as Ut, resolveDynamicComponent as sp, createVNode as F, vShow as Is, onMounted as Ln, cloneVNode as a1, h as Pn, onUnmounted as d1, Transition as Ht, shallowRef as p1, onBeforeUnmount as lp, customRef as c1, onBeforeMount as u1, createStaticVNode as h1, normalizeStyle as f1 } from "vue";
const b1 = {
id: "pbx-modal",
class: "pbx-font-sans"
}, m1 = {
key: 0,
class: "pbx-fixed pbx-inset-0 pbx-z-40 pbx-flex pbx-items-center pbx-justify-center pbx-mx-4",
role: "dialog",
"aria-modal": "true",
"aria-labelledby": "dialog-title"
}, x1 = { class: "pbx-px-4 pbx-min-h-32" }, $t = /* @__PURE__ */ tt({
__name: "ModalBuilder",
props: {
title: {
type: String,
required: !0
},
showModalBuilder: {
type: Boolean,
default: !1
},
type: {
type: String,
default: "success"
},
maxWidth: {
type: String,
default: "2xl"
},
minHeight: {
type: String
},
maxHeight: {
type: String
},
noBackgroundOpacity: {
type: Boolean
}
},
emits: ["closeMainModalBuilder"],
setup(n, { emit: e }) {
const t = n, i = e, r = () => {
i("closeMainModalBuilder");
}, o = P(() => ({
sm: "md:pbx-max-w-sm pbx-w-screen",
md: "md:pbx-max-w-md pbx-w-screen",
lg: "md:pbx-max-w-lg pbx-w-screen",
xl: "md:pbx-max-w-xl pbx-w-screen",
"2xl": "md:pbx-max-w-2xl pbx-w-screen",
"3xl": "md:pbx-max-w-3xl pbx-w-screen",
"4xl": "md:pbx-max-w-4xl pbx-w-screen",
"5xl": "md:pbx-max-w-5xl pbx-w-screen",
"6xl": "md:pbx-max-w-6xl pbx-w-screen",
"7xl": "md:pbx-max-w-7xl pbx-w-screen",
full: "md:pbx-max-w-full pbx-w-screen",
// 100% width
screen: "md:pbx-w-screen pbx-w-screen pbx-max-w-none"
// truly full screen
})[t.maxWidth]);
return (s, l) => (y(), oe(n1, { to: "body" }, [
p("div", b1, [
n.showModalBuilder ? (y(), w("div", m1, [
p("div", {
class: V(["pbx-fixed pbx-inset-0 pbx-bg-black/50 pbx-transition-opacity", [n.noBackgroundOpacity ? "pbx-bg-black/100" : ""]]),
onClick: r
}, null, 2),
p("div", {
class: V(["pbx-relative pbx-inline-block pbx-bg-white pbx-rounded-xl pbx-text-left pbx-shadow-xl pbx-transform pbx-transition-all pbx-max-w-[96vh] lg:pbx-max-h-[98vh] pbx-max-h-[85vh] pbx-overflow-y-auto pbx-w-full", [
o.value ? o.value : "",
n.minHeight ? n.minHeight : "",
n.maxHeight ? n.maxHeight : ""
]])
}, [
p("div", {
class: V(["pbx-h-16 pbx-px-4 pbx-border-0 pbx-border-solid pbx-border-b pbx-border-gray-200 pbx-mb-2 pbx-flex pbx-items-center pbx-justify-between", [
n.type === "success" ? "pbx-bg-white" : "",
n.type === "warning" ? "pbx-bg-white" : "",
n.type === "danger" ? "pbx-bg-white" : "",
n.type === "delete" ? "pbx-bg-white" : ""
]])
}, [
p("h3", {
as: "h3",
class: V(["pbx-myQuaternaryHeader pbx-my-0 pbx-py-0", [
n.type === "success" ? "pbx-text-black" : "",
n.type === "warning" ? "pbx-text-black" : "",
n.type === "danger" ? "pbx-text-black" : "",
n.type === "delete" ? "pbx-text-black" : ""
]])
}, C(n.title), 3),
p("div", {
class: "pbx-h-10 pbx-w-10 pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-50 pbx-aspect-square hover:pbx-bg-myPrimaryLinkColor hover:pbx-text-white focus-visible:pbx-ring-0 pbx-text-black",
onClick: r
}, [...l[0] || (l[0] = [
p("span", { class: "material-symbols-outlined" }, " close ", -1)
])])
], 2),
p("div", x1, [
xn(s.$slots, "default")
])
], 2)
])) : E("", !0)
])
]));
}
}), g1 = { key: 0 }, y1 = { class: "pbx-text-black pbx-w-full pbx-inset-x-0 pbx-h-[90vh] pbx-bg-white pbx-overflow-x-scroll lg:pbx-pt-2 pbx-pt-2" }, v1 = { id: "pagebuilder" }, S1 = ["innerHTML"], w1 = { key: 1 }, Sa = {
__name: "Preview",
props: {
mobile: {
type: Boolean
}
},
setup(n) {
const e = n, t = k(""), i = k(null), r = localStorage.getItem("preview");
if (r)
try {
const o = JSON.parse(r);
t.value = Array.isArray(o) ? o.join("") : "";
} catch (o) {
console.error("Invalid preview data:", o), t.value = "";
}
return ci(() => {
if (e.mobile && i.value && t.value) {
const s = i.value.contentWindow.document;
s.open(), s.write(
`<!DOCTYPE html><html><head><meta name="viewport" content="width=device-width, initial-scale=1.0"></head><body><div id="pagebuilder" class="pbx-font-sans pbx-text-black">${t.value}</div></body></html>`
), s.close(), document.querySelectorAll('link[rel="stylesheet"], style').forEach((l) => {
s.head.appendChild(l.cloneNode(!0));
});
}
}), (o, s) => (y(), w(J, null, [
n.mobile ? E("", !0) : (y(), w("div", g1, [
p("div", y1, [
p("div", v1, [
p("div", {
class: "",
innerHTML: t.value
}, null, 8, S1)
])
])
])),
n.mobile ? (y(), w("div", w1, [
p("iframe", {
ref_key: "iframeRef",
ref: i,
class: "pbx-mx-auto pbx-w-full pbx-bg-white pbx-shadow-lg pbx-h-[80vh] pbx-border-0",
src: "about:blank"
}, null, 512)
])) : E("", !0)
], 64));
}
}, C1 = { class: "pbx-min-h-32 pbx-h-max pbx-font-sans pbx-w-full pbx-relative pbx-inline-block pbx-align-bottom pbx-text-left pbx-overflow-hidden pbx-transform pbx-transition-all sm:pbx-align-middle" }, k1 = ["innerHTML"], T1 = { class: "pbx-border-0 pbx-border-solid pbx-border-t pbx-border-gray-200 pbx-mt-4 pbx-flex pbx-items-center pbx-justify-end" }, M1 = {
key: 0,
class: "pbx-py-4 pbx-flex sm:pbx-justify-end pbx-justify-center"
}, E1 = {
key: 1,
class: "pbx-flex pbx-items-center pbx-my-2 pbx-py-4 pbx-px-2 pbx-justify-end"
}, wn = {
__name: "DynamicModalBuilder",
props: {
showDynamicModalBuilder: {
type: Boolean,
default: !1,
required: !0
},
simpleModal: {
type: Boolean,
default: !1,
required: !1
},
disabled: {
type: Boolean,
default: !1,
required: !1
},
isLoading: {
type: Boolean,
default: !1,
required: !1
},
disabledWhichButton: {
type: String,
default: "",
required: !1
},
maxWidth: {
type: String,
required: !1,
default: "2xl"
},
gridColumnAmount: {
type: Number,
required: !0
},
type: {
type: String,
required: !0
},
title: {
type: String,
required: !0
},
description: {
required: !0
},
firstButtonText: {
type: String
},
secondButtonText: {
type: String
},
thirdButtonText: {
type: String
}
},
emits: [
"firstModalButtonFunctionDynamicModalBuilder",
"secondModalButtonFunctionDynamicModalBuilder",
"thirdModalButtonFunctionDynamicModalBuilder"
],
setup(n, { emit: e }) {
const t = e, i = function() {
t("firstModalButtonFunctionDynamicModalBuilder");
}, r = function() {
t("secondModalButtonFunctionDynamicModalBuilder");
}, o = function() {
t("thirdModalButtonFunctionDynamicModalBuilder");
};
return (s, l) => (y(), oe($t, {
title: n.title,
showModalBuilder: n.showDynamicModalBuilder,
type: n.type,
onCloseMainModalBuilder: i,
maxWidth: n.maxWidth
}, {
default: q(() => [
xn(s.$slots, "content"),
p("div", C1, [
p("div", {
class: V({ "pbx-pr-4 pbx-pb-4": !n.simpleModal })
}, [
n.simpleModal !== !0 ? (y(), w("div", {
key: 0,
innerHTML: n.description,
class: "pbx-myPrimaryParagraph pbx-mb-6"
}, null, 8, k1)) : E("", !0),
xn(s.$slots, "header"),
xn(s.$slots, "default")
], 2)
]),
p("div", T1, [
n.simpleModal !== !0 && !n.isLoading ? (y(), w("div", M1, [
xn(s.$slots, "footer"),
p("div", {
class: V([{
"sm:pbx-grid-cols-1": n.gridColumnAmount === 1,
"sm:pbx-grid-cols-2": n.gridColumnAmount === 2,
"sm:pbx-grid-cols-3": n.gridColumnAmount === 3
}, "sm:pbx-items-end sm:pbx-justify-end pbx-flex sm:pbx-flex-row pbx-flex-col pbx-myPrimaryGap sm:pbx-w-5/6 pbx-w-full"])
}, [
n.firstButtonText ? (y(), w("button", {
key: 0,
ref: "firstButtonRef",
class: "pbx-mySecondaryButton",
type: "button",
onClick: i
}, C(n.firstButtonText), 513)) : E("", !0),
n.secondButtonText ? (y(), w("button", {
key: 1,
class: "pbx-myPrimaryButton pbx-bg-yellow-300 hover:pbx-bg-yellow-400 pbx-text-myPrimaryDarkGrayColor hover:pbx-text-myPrimaryDarkGrayColor focus:pbx-ring-yellow-400 pbx-w-full",
type: "button",
onClick: r
}, C(n.secondButtonText), 1)) : E("", !0),
n.thirdButtonText ? (y(), w("button", {
key: 2,
class: V(["pbx-myPrimaryButton pbx-bg-myPrimaryLinkColor focus-visible:pbx-ring-myPrimaryLinkColor focus:pbx-ring-myPrimaryLinkColor hover:pbx-bg-myPrimaryLinkColor pbx-w-full", [
n.type === "danger" || n.type === "delete" ? "pbx-bg-red-600 focus-visible:pbx-ring-red-600 focus:pbx-ring-red-600 hover:pbx-bg-red-600" : "pbx-bg-myPrimaryLinkColor focus-visible:pbx-ring-myPrimaryLinkColor focus:pbx-ring-myPrimaryLinkColor hover:pbx-bg-myPrimaryLinkColor"
]]),
type: "button",
onClick: o
}, C(n.thirdButtonText), 3)) : E("", !0)
], 2)
])) : E("", !0),
n.isLoading ? (y(), w("div", E1, [...l[0] || (l[0] = [
p("div", { class: "pbx-inline-block pbx-h-8 pbx-w-8 pbx-animate-spin pbx-rounded-full pbx-border-4 pbx-border-solid pbx-border-current pbx-border-r-transparent pbx-align-[-0.125em] motion-reduce:pbx-animate-[spin_1.5s_linear_infinite]" }, [
p("span", { class: "!pbx-absolute !pbx-m-px !pbx-h-px !pbx-w-px !pbx-overflow-hidden !pbx-whitespace-nowrap !pbx-border-0 !pbx-p-0 !pbx-[clip:rect(0,0,0,0)]" }, "Loading...")
], -1)
])])) : E("", !0)
])
]),
_: 3
}, 8, ["title", "showModalBuilder", "type", "maxWidth"]));
}
};
class Xn {
static getHistory(e) {
const t = e + this.HISTORY_KEY_SUFFIX, i = localStorage.getItem(t);
return i ? JSON.parse(i) : [];
}
static addToHistory(e, t) {
const i = e + this.HISTORY_KEY_SUFFIX;
let r = this.getHistory(e);
r.push(t), r.length > this.MAX_HISTORY_SIZE && (r = r.slice(r.length - this.MAX_HISTORY_SIZE)), localStorage.setItem(i, JSON.stringify(r));
}
static clearHistory(e) {
const t = e + this.HISTORY_KEY_SUFFIX;
localStorage.removeItem(t);
}
}
de(Xn, "HISTORY_KEY_SUFFIX", "-history"), de(Xn, "MAX_HISTORY_SIZE", 10);
const Zn = {
fontBase: [
"none",
"pbx-text-xs",
"pbx-text-sm",
"pbx-text-base",
"pbx-text-lg",
"pbx-text-xl",
"pbx-text-2xl",
"pbx-text-3xl",
"pbx-text-4xl",
"pbx-text-5xl",
"pbx-text-6xl",
"pbx-text-7xl",
"pbx-text-8xl",
"pbx-text-9xl"
],
fontDesktop: [
"none",
"lg:pbx-text-xs",
"lg:pbx-text-sm",
"lg:pbx-text-base",
"lg:pbx-text-lg",
"lg:pbx-text-xl",
"lg:pbx-text-2xl",
"lg:pbx-text-3xl",
"lg:pbx-text-4xl",
"lg:pbx-text-5xl",
"lg:pbx-text-6xl",
"lg:pbx-text-7xl",
"lg:pbx-text-8xl",
"lg:pbx-text-9xl"
],
fontTablet: [
"none",
"md:pbx-text-xs",
"md:pbx-text-sm",
"md:pbx-text-base",
"md:pbx-text-lg",
"md:pbx-text-xl",
"md:pbx-text-2xl",
"md:pbx-text-3xl",
"md:pbx-text-4xl",
"md:pbx-text-5xl",
"md:pbx-text-6xl",
"md:pbx-text-7xl",
"md:pbx-text-8xl",
"md:pbx-text-9xl"
],
fontMobile: [
"none",
"sm:pbx-text-xs",
"sm:pbx-text-sm",
"sm:pbx-text-base",
"sm:pbx-text-lg",
"sm:pbx-text-xl",
"sm:pbx-text-2xl",
"sm:pbx-text-3xl",
"sm:pbx-text-4xl",
"sm:pbx-text-5xl",
"sm:pbx-text-6xl",
"sm:pbx-text-7xl",
"sm:pbx-text-8xl",
"sm:pbx-text-9xl"
]
}, _r = {
backgroundColorVariables: [
"none",
"pbx-bg-white",
"pbx-bg-black",
"pbx-bg-slate-50",
"pbx-bg-slate-100",
"pbx-bg-slate-200",
"pbx-bg-slate-300",
"pbx-bg-slate-400",
"pbx-bg-slate-500",
"pbx-bg-slate-600",
"pbx-bg-slate-700",
"pbx-bg-slate-800",
"pbx-bg-slate-900",
"pbx-bg-gray-50",
"pbx-bg-gray-100",
"pbx-bg-gray-200",
"pbx-bg-gray-300",
"pbx-bg-gray-400",
"pbx-bg-gray-500",
"pbx-bg-gray-600",
"pbx-bg-gray-700",
"pbx-bg-gray-800",
"pbx-bg-gray-900",
"pbx-bg-zinc-50",
"pbx-bg-zinc-100",
"pbx-bg-zinc-200",
"pbx-bg-zinc-300",
"pbx-bg-zinc-400",
"pbx-bg-zinc-500",
"pbx-bg-zinc-600",
"pbx-bg-zinc-700",
"pbx-bg-zinc-800",
"pbx-bg-zinc-900",
"pbx-bg-neutral-50",
"pbx-bg-neutral-100",
"pbx-bg-neutral-200",
"pbx-bg-neutral-300",
"pbx-bg-neutral-400",
"pbx-bg-neutral-500",
"pbx-bg-neutral-600",
"pbx-bg-neutral-700",
"pbx-bg-neutral-800",
"pbx-bg-neutral-900",
"pbx-bg-stone-50",
"pbx-bg-stone-100",
"pbx-bg-stone-200",
"pbx-bg-stone-300",
"pbx-bg-stone-400",
"pbx-bg-stone-500",
"pbx-bg-stone-600",
"pbx-bg-stone-700",
"pbx-bg-stone-800",
"pbx-bg-stone-900",
"pbx-bg-red-50",
"pbx-bg-red-100",
"pbx-bg-red-200",
"pbx-bg-red-300",
"pbx-bg-red-400",
"pbx-bg-red-500",
"pbx-bg-red-600",
"pbx-bg-red-700",
"pbx-bg-red-800",
"pbx-bg-red-900",
"pbx-bg-orange-50",
"pbx-bg-orange-100",
"pbx-bg-orange-200",
"pbx-bg-orange-300",
"pbx-bg-orange-400",
"pbx-bg-orange-500",
"pbx-bg-orange-600",
"pbx-bg-orange-700",
"pbx-bg-orange-800",
"pbx-bg-orange-900",
"pbx-bg-amber-50",
"pbx-bg-amber-100",
"pbx-bg-amber-200",
"pbx-bg-amber-300",
"pbx-bg-amber-400",
"pbx-bg-amber-500",
"pbx-bg-amber-600",
"pbx-bg-amber-700",
"pbx-bg-amber-800",
"pbx-bg-amber-900",
"pbx-bg-yellow-50",
"pbx-bg-yellow-100",
"pbx-bg-yellow-200",
"pbx-bg-yellow-300",
"pbx-bg-yellow-400",
"pbx-bg-yellow-500",
"pbx-bg-yellow-600",
"pbx-bg-yellow-700",
"pbx-bg-yellow-800",
"pbx-bg-yellow-900",
"pbx-bg-lime-50",
"pbx-bg-lime-100",
"pbx-bg-lime-200",
"pbx-bg-lime-300",
"pbx-bg-lime-400",
"pbx-bg-lime-500",
"pbx-bg-lime-600",
"pbx-bg-lime-700",
"pbx-bg-lime-800",
"pbx-bg-lime-900",
"pbx-bg-green-50",
"pbx-bg-green-100",
"pbx-bg-green-200",
"pbx-bg-green-300",
"pbx-bg-green-400",
"pbx-bg-green-500",
"pbx-bg-green-600",
"pbx-bg-green-700",
"pbx-bg-green-800",
"pbx-bg-green-900",
"pbx-bg-emerald-50",
"pbx-bg-emerald-100",
"pbx-bg-emerald-200",
"pbx-bg-emerald-300",
"pbx-bg-emerald-400",
"pbx-bg-emerald-500",
"pbx-bg-emerald-600",
"pbx-bg-emerald-700",
"pbx-bg-emerald-800",
"pbx-bg-emerald-900",
"pbx-bg-teal-50",
"pbx-bg-teal-100",
"pbx-bg-teal-200",
"pbx-bg-teal-300",
"pbx-bg-teal-400",
"pbx-bg-teal-500",
"pbx-bg-teal-600",
"pbx-bg-teal-700",
"pbx-bg-teal-800",
"pbx-bg-teal-900",
"pbx-bg-cyan-50",
"pbx-bg-cyan-100",
"pbx-bg-cyan-200",
"pbx-bg-cyan-300",
"pbx-bg-cyan-400",
"pbx-bg-cyan-500",
"pbx-bg-cyan-600",
"pbx-bg-cyan-700",
"pbx-bg-cyan-800",
"pbx-bg-cyan-900",
"pbx-bg-sky-50",
"pbx-bg-sky-100",
"pbx-bg-sky-200",
"pbx-bg-sky-300",
"pbx-bg-sky-400",
"pbx-bg-sky-500",
"pbx-bg-sky-600",
"pbx-bg-sky-700",
"pbx-bg-sky-800",
"pbx-bg-sky-900",
"pbx-bg-blue-50",
"pbx-bg-blue-100",
"pbx-bg-blue-200",
"pbx-bg-blue-300",
"pbx-bg-blue-400",
"pbx-bg-blue-500",
"pbx-bg-blue-600",
"pbx-bg-blue-700",
"pbx-bg-blue-800",
"pbx-bg-blue-900",
"pbx-bg-indigo-50",
"pbx-bg-indigo-100",
"pbx-bg-indigo-200",
"pbx-bg-indigo-300",
"pbx-bg-indigo-400",
"pbx-bg-indigo-500",
"pbx-bg-indigo-600",
"pbx-bg-indigo-700",
"pbx-bg-indigo-800",
"pbx-bg-indigo-900",
"pbx-bg-violet-50",
"pbx-bg-violet-100",
"pbx-bg-violet-200",
"pbx-bg-violet-300",
"pbx-bg-violet-400",
"pbx-bg-violet-500",
"pbx-bg-violet-600",
"pbx-bg-violet-700",
"pbx-bg-violet-800",
"pbx-bg-violet-900",
"pbx-bg-purple-50",
"pbx-bg-purple-100",
"pbx-bg-purple-200",
"pbx-bg-purple-300",
"pbx-bg-purple-400",
"pbx-bg-purple-500",
"pbx-bg-purple-600",
"pbx-bg-purple-700",
"pbx-bg-purple-800",
"pbx-bg-purple-900",
"pbx-bg-fuchsia-50",
"pbx-bg-fuchsia-100",
"pbx-bg-fuchsia-200",
"pbx-bg-fuchsia-300",
"pbx-bg-fuchsia-400",
"pbx-bg-fuchsia-500",
"pbx-bg-fuchsia-600",
"pbx-bg-fuchsia-700",
"pbx-bg-fuchsia-800",
"pbx-bg-fuchsia-900",
"pbx-bg-pink-50",
"pbx-bg-pink-100",
"pbx-bg-pink-200",
"pbx-bg-pink-300",
"pbx-bg-pink-400",
"pbx-bg-pink-500",
"pbx-bg-pink-600",
"pbx-bg-pink-700",
"pbx-bg-pink-800",
"pbx-bg-pink-900",
"pbx-bg-rose-50",
"pbx-bg-rose-100",
"pbx-bg-rose-200",
"pbx-bg-rose-300",
"pbx-bg-rose-400",
"pbx-bg-rose-500",
"pbx-bg-rose-600",
"pbx-bg-rose-700",
"pbx-bg-rose-800",
"pbx-bg-rose-900"
],
textColorVariables: [
"none",
"pbx-text-white",
"pbx-text-black",
"pbx-text-slate-50",
"pbx-text-slate-100",
"pbx-text-slate-200",
"pbx-text-slate-300",
"pbx-text-slate-400",
"pbx-text-slate-500",
"pbx-text-slate-600",
"pbx-text-slate-700",
"pbx-text-slate-800",
"pbx-text-slate-900",
"pbx-text-gray-50",
"pbx-text-gray-100",
"pbx-text-gray-200",
"pbx-text-gray-300",
"pbx-text-gray-400",
"pbx-text-gray-500",
"pbx-text-gray-600",
"pbx-text-gray-700",
"pbx-text-gray-800",
"pbx-text-gray-900",
"pbx-text-zinc-50",
"pbx-text-zinc-100",
"pbx-text-zinc-200",
"pbx-text-zinc-300",
"pbx-text-zinc-400",
"pbx-text-zinc-500",
"pbx-text-zinc-600",
"pbx-text-zinc-700",
"pbx-text-zinc-800",
"pbx-text-zinc-900",
"pbx-text-neutral-50",
"pbx-text-neutral-100",
"pbx-text-neutral-200",
"pbx-text-neutral-300",
"pbx-text-neutral-400",
"pbx-text-neutral-500",
"pbx-text-neutral-600",
"pbx-text-neutral-700",
"pbx-text-neutral-800",
"pbx-text-neutral-900",
"pbx-text-stone-50",
"pbx-text-stone-100",
"pbx-text-stone-200",
"pbx-text-stone-300",
"pbx-text-stone-400",
"pbx-text-stone-500",
"pbx-text-stone-600",
"pbx-text-stone-700",
"pbx-text-stone-800",
"pbx-text-stone-900",
"pbx-text-red-50",
"pbx-text-red-100",
"pbx-text-red-200",
"pbx-text-red-300",
"pbx-text-red-400",
"pbx-text-red-500",
"pbx-text-red-600",
"pbx-text-red-700",
"pbx-text-red-800",
"pbx-text-red-900",
"pbx-text-orange-50",
"pbx-text-orange-100",
"pbx-text-orange-200",
"pbx-text-orange-300",
"pbx-text-orange-400",
"pbx-text-orange-500",
"pbx-text-orange-600",
"pbx-text-orange-700",
"pbx-text-orange-800",
"pbx-text-orange-900",
"pbx-text-amber-50",
"pbx-text-amber-100",
"pbx-text-amber-200",
"pbx-text-amber-300",
"pbx-text-amber-400",
"pbx-text-amber-500",
"pbx-text-amber-600",
"pbx-text-amber-700",
"pbx-text-amber-800",
"pbx-text-amber-900",
"pbx-text-yellow-50",
"pbx-text-yellow-100",
"pbx-text-yellow-200",
"pbx-text-yellow-300",
"pbx-text-yellow-400",
"pbx-text-yellow-500",
"pbx-text-yellow-600",
"pbx-text-yellow-700",
"pbx-text-yellow-800",
"pbx-text-yellow-900",
"pbx-text-lime-50",
"pbx-text-lime-100",
"pbx-text-lime-200",
"pbx-text-lime-300",
"pbx-text-lime-400",
"pbx-text-lime-500",
"pbx-text-lime-600",
"pbx-text-lime-700",
"pbx-text-lime-800",
"pbx-text-lime-900",
"pbx-text-green-50",
"pbx-text-green-100",
"pbx-text-green-200",
"pbx-text-green-300",
"pbx-text-green-400",
"pbx-text-green-500",
"pbx-text-green-600",
"pbx-text-green-700",
"pbx-text-green-800",
"pbx-text-green-900",
"pbx-text-emerald-50",
"pbx-text-emerald-100",
"pbx-text-emerald-200",
"pbx-text-emerald-300",
"pbx-text-emerald-400",
"pbx-text-emerald-500",
"pbx-text-emerald-600",
"pbx-text-emerald-700",
"pbx-text-emerald-800",
"pbx-text-emerald-900",
"pbx-text-teal-50",
"pbx-text-teal-100",
"pbx-text-teal-200",
"pbx-text-teal-300",
"pbx-text-teal-400",
"pbx-text-teal-500",
"pbx-text-teal-600",
"pbx-text-teal-700",
"pbx-text-teal-800",
"pbx-text-teal-900",
"pbx-text-cyan-50",
"pbx-text-cyan-100",
"pbx-text-cyan-200",
"pbx-text-cyan-300",
"pbx-text-cyan-400",
"pbx-text-cyan-500",
"pbx-text-cyan-600",
"pbx-text-cyan-700",
"pbx-text-cyan-800",
"pbx-text-cyan-900",
"pbx-text-sky-50",
"pbx-text-sky-100",
"pbx-text-sky-200",
"pbx-text-sky-300",
"pbx-text-sky-400",
"pbx-text-sky-500",
"pbx-text-sky-600",
"pbx-text-sky-700",
"pbx-text-sky-800",
"pbx-text-sky-900",
"pbx-text-blue-50",
"pbx-text-blue-100",
"pbx-text-blue-200",
"pbx-text-blue-300",
"pbx-text-blue-400",
"pbx-text-blue-500",
"pbx-text-blue-600",
"pbx-text-blue-700",
"pbx-text-blue-800",
"pbx-text-blue-900",
"pbx-text-indigo-50",
"pbx-text-indigo-100",
"pbx-text-indigo-200",
"pbx-text-indigo-300",
"pbx-text-indigo-400",
"pbx-text-indigo-500",
"pbx-text-indigo-600",
"pbx-text-indigo-700",
"pbx-text-indigo-800",
"pbx-text-indigo-900",
"pbx-text-violet-50",
"pbx-text-violet-100",
"pbx-text-violet-200",
"pbx-text-violet-300",
"pbx-text-violet-400",
"pbx-text-violet-500",
"pbx-text-violet-600",
"pbx-text-violet-700",
"pbx-text-violet-800",
"pbx-text-violet-900",
"pbx-text-purple-50",
"pbx-text-purple-100",
"pbx-text-purple-200",
"pbx-text-purple-300",
"pbx-text-purple-400",
"pbx-text-purple-500",
"pbx-text-purple-600",
"pbx-text-purple-700",
"pbx-text-purple-800",
"pbx-text-purple-900",
"pbx-text-fuchsia-50",
"pbx-text-fuchsia-100",
"pbx-text-fuchsia-200",
"pbx-text-fuchsia-300",
"pbx-text-fuchsia-400",
"pbx-text-fuchsia-500",
"pbx-text-fuchsia-600",
"pbx-text-fuchsia-700",
"pbx-text-fuchsia-800",
"pbx-text-fuchsia-900",
"pbx-text-pink-50",
"pbx-text-pink-100",
"pbx-text-pink-200",
"pbx-text-pink-300",
"pbx-text-pink-400",
"pbx-text-pink-500",
"pbx-text-pink-600",
"pbx-text-pink-700",
"pbx-text-pink-800",
"pbx-text-pink-900",
"pbx-text-rose-50",
"pbx-text-rose-100",
"pbx-text-rose-200",
"pbx-text-rose-300",
"pbx-text-rose-400",
"pbx-text-rose-500",
"pbx-text-rose-600",
"pbx-text-rose-700",
"pbx-text-rose-800",
"pbx-text-rose-900"
]
}, Or = {
opacities: [
"none",
"pbx-opacity-0",
"pbx-opacity-5",
"pbx-opacity-10",
"pbx-opacity-20",
"pbx-opacity-25",
"pbx-opacity-30",
"pbx-opacity-40",
"pbx-opacity-50",
"pbx-opacity-60",
"pbx-opacity-70",
"pbx-opacity-75",
"pbx-opacity-80",
"pbx-opacity-90",
"pbx-opacity-95",
"pbx-opacity-100"
],
backgroundOpacities: [
"none",
"pbx-bg-opacity-0",
"pbx-bg-opacity-5",
"pbx-bg-opacity-10",
"pbx-bg-opacity-20",
"pbx-bg-opacity-25",
"pbx-bg-opacity-30",
"pbx-bg-opacity-40",
"pbx-bg-opacity-50",
"pbx-bg-opacity-60",
"pbx-bg-opacity-70",
"pbx-bg-opacity-75",
"pbx-bg-opacity-80",
"pbx-bg-opacity-90",
"pbx-bg-opacity-95",
"pbx-bg-opacity-100"
]
}, _t = {
fontWeight: [
"none",
"pbx-font-thin",
"pbx-font-extralight",
"pbx-font-light",
"pbx-font-normal",
"pbx-font-medium",
"pbx-font-bold",
"pbx-font-extrabold",
"pbx-font-black"
],
fontFamily: [
"none",
"pbx-font-sans",
"pbx-font-serif",
"pbx-font-mono",
"pbx-font-arial",
"pbx-font-helvetica",
"pbx-font-georgia",
"pbx-font-times",
"pbx-font-times-new-roman",
"pbx-font-courier",
"pbx-font-courier-new",
"pbx-font-verdana",
"pbx-font-tahoma",
"pbx-font-trebuchet",
"pbx-font-garamond",
"pbx-font-palantino",
"pbx-font-bookman",
"pbx-font-comic-sans",
"pbx-font-impact",
"pbx-font-lucida",
"pbx-font-lucida-console",
"pbx-font-lucida-sans",
"pbx-font-candara",
"pbx-font-optima",
"pbx-font-avenir",
"pbx-font-futura",
"pbx-font-calibri",
"pbx-font-cambria",
"pbx-font-didot",
"pbx-font-franklin-gothic",
"pbx-font-rockwell",
"pbx-font-baskerville"
],
fontStyle: ["none", "pbx-italic", "pbx-non-italic"]
}, Qt = {
verticalPadding: [
"none",
"lg:pbx-py-0",
"lg:pbx-py-0.5",
"lg:pbx-py-1",
"lg:pbx-py-1.5",
"lg:pbx-py-2",
"lg:pbx-py-2.5",
"lg:pbx-py-3",
"lg:pbx-py-3.5",
"lg:pbx-py-4",
"lg:pbx-py-5",
"lg:pbx-py-6",
"lg:pbx-py-7",
"lg:pbx-py-8",
"lg:pbx-py-9",
"lg:pbx-py-10",
"lg:pbx-py-11",
"lg:pbx-py-12",
"lg:pbx-py-14",
"lg:pbx-py-16",
"lg:pbx-py-20",
"lg:pbx-py-24",
"lg:pbx-py-28",
"lg:pbx-py-32",
"lg:pbx-py-36",
"lg:pbx-py-40",
"lg:pbx-py-44",
"lg:pbx-py-48",
"lg:pbx-py-52",
"lg:pbx-py-56",
"lg:pbx-py-60",
"lg:pbx-py-64",
"lg:pbx-py-72",
"lg:pbx-py-80",
"lg:pbx-py-96"
],
horizontalPadding: [
"none",
"lg:pbx-px-0",
"lg:pbx-px-0.5",
"lg:pbx-px-1",
"lg:pbx-px-1.5",
"lg:pbx-px-2",
"lg:pbx-px-2.5",
"lg:pbx-px-3",
"lg:pbx-px-3.5",
"lg:pbx-px-4",
"lg:pbx-px-5",
"lg:pbx-px-6",
"lg:pbx-px-7",
"lg:pbx-px-8",
"lg:pbx-px-9",
"lg:pbx-px-10",
"lg:pbx-px-11",
"lg:pbx-px-12",
"lg:pbx-px-14",
"lg:pbx-px-16",
"lg:pbx-px-20",
"lg:pbx-px-24",
"lg:pbx-px-28",
"lg:pbx-px-32",
"lg:pbx-px-36",
"lg:pbx-px-40",
"lg:pbx-px-44",
"lg:pbx-px-48",
"lg:pbx-px-52",
"lg:pbx-px-56",
"lg:pbx-px-60",
"lg:pbx-px-64",
"lg:pbx-px-72",
"lg:pbx-px-80",
"lg:pbx-px-96"
],
verticalMargin: [
"none",
"lg:pbx-my-0",
"lg:pbx-my-0.5",
"lg:pbx-my-1",
"lg:pbx-my-1.5",
"lg:pbx-my-2",
"lg:pbx-my-2.5",
"lg:pbx-my-3",
"lg:pbx-my-3.5",
"lg:pbx-my-4",
"lg:pbx-my-5",
"lg:pbx-my-6",
"lg:pbx-my-7",
"lg:pbx-my-8",
"lg:pbx-my-9",
"lg:pbx-my-10",
"lg:pbx-my-11",
"lg:pbx-my-12",
"lg:pbx-my-14",
"lg:pbx-my-16",
"lg:pbx-my-20",
"lg:pbx-my-24",
"lg:pbx-my-28",
"lg:pbx-my-32",
"lg:pbx-my-36",
"lg:pbx-my-40",
"lg:pbx-my-44",
"lg:pbx-my-48",
"lg:pbx-my-52",
"lg:pbx-my-56",
"lg:pbx-my-60",
"lg:pbx-my-64",
"lg:pbx-my-72",
"lg:pbx-my-80",
"lg:pbx-my-96"
],
horizontalMargin: [
"none",
"lg:pbx-mx-0",
"lg:pbx-mx-0.5",
"lg:pbx-mx-1",
"lg:pbx-mx-1.5",
"lg:pbx-mx-2",
"lg:pbx-mx-2.5",
"lg:pbx-mx-3",
"lg:pbx-mx-3.5",
"lg:pbx-mx-4",
"lg:pbx-mx-5",
"lg:pbx-mx-6",
"lg:pbx-mx-7",
"lg:pbx-mx-8",
"lg:pbx-mx-9",
"lg:pbx-mx-10",
"lg:pbx-mx-11",
"lg:pbx-mx-12",
"lg:pbx-mx-14",
"lg:pbx-mx-16",
"lg:pbx-mx-20",
"lg:pbx-mx-24",
"lg:pbx-mx-28",
"lg:pbx-mx-32",
"lg:pbx-mx-36",
"lg:pbx-mx-40",
"lg:pbx-mx-44",
"lg:pbx-mx-48",
"lg:pbx-mx-52",
"lg:pbx-mx-56",
"lg:pbx-mx-60",
"lg:pbx-mx-64",
"lg:pbx-mx-72",
"lg:pbx-mx-80",
"lg:pbx-mx-96"
]
}, wt = {
roundedGlobal: [
"none",
"pbx-rounded-sm",
"pbx-rounded",
"pbx-rounded-md",
"pbx-rounded-lg",
"pbx-rounded-xl",
"pbx-rounded-2xl",
"pbx-rounded-3xl",
"pbx-rounded-full"
],
roundedTopLeft: [
"none",
"pbx-rounded-tl-sm",
"pbx-rounded-tl",
"pbx-rounded-tl-md",
"pbx-rounded-tl-lg",
"pbx-rounded-tl-xl",
"pbx-rounded-tl-2xl",
"pbx-rounded-tl-3xl",
"pbx-rounded-tl-full"
],
roundedTopRight: [
"none",
"pbx-rounded-tr-sm",
"pbx-rounded-tr",
"pbx-rounded-tr-md",
"pbx-rounded-tr-lg",
"pbx-rounded-tr-xl",
"pbx-rounded-tr-2xl",
"pbx-rounded-tr-3xl",
"pbx-rounded-tr-full"
],
roundedBottomLeft: [
"none",
"pbx-rounded-bl-sm",
"pbx-rounded-bl",
"pbx-rounded-bl-md",
"pbx-rounded-bl-lg",
"pbx-rounded-bl-xl",
"pbx-rounded-bl-2xl",
"pbx-rounded-bl-3xl",
"pbx-rounded-bl-full"
],
roundedBottomRight: [
"none",
"pbx-rounded-br-sm",
"pbx-rounded-br",
"pbx-rounded-br-md",
"pbx-rounded-br-lg",
"pbx-rounded-br-xl",
"pbx-rounded-br-2xl",
"pbx-rounded-br-3xl",
"pbx-rounded-br-full"
]
}, ni = {
borderStyle: [
"none",
"pbx-border-solid",
"pbx-border-dashed",
"pbx-border-dotted",
"pbx-border-double",
"pbx-border-hidden"
],
borderWidth: [
"none",
"pbx-border",
// 1px
"pbx-border-2",
// 2px
"pbx-border-4",
// 4px
"pbx-border-8"
// 8px
],
borderColor: [
"none",
"pbx-border-white",
"pbx-border-black",
"pbx-border-slate-50",
"pbx-border-slate-100",
"pbx-border-slate-200",
"pbx-border-slate-300",
"pbx-border-slate-400",
"pbx-border-slate-500",
"pbx-border-slate-600",
"pbx-border-slate-700",
"pbx-border-slate-800",
"pbx-border-slate-900",
"pbx-border-gray-50",
"pbx-border-gray-100",
"pbx-border-gray-200",
"pbx-border-gray-300",
"pbx-border-gray-400",
"pbx-border-gray-500",
"pbx-border-gray-600",
"pbx-border-gray-700",
"pbx-border-gray-800",
"pbx-border-gray-900",
"pbx-border-zinc-50",
"pbx-border-zinc-100",
"pbx-border-zinc-200",
"pbx-border-zinc-300",
"pbx-border-zinc-400",
"pbx-border-zinc-500",
"pbx-border-zinc-600",
"pbx-border-zinc-700",
"pbx-border-zinc-800",
"pbx-border-zinc-900",
"pbx-border-neutral-50",
"pbx-border-neutral-100",
"pbx-border-neutral-200",
"pbx-border-neutral-300",
"pbx-border-neutral-400",
"pbx-border-neutral-500",
"pbx-border-neutral-600",
"pbx-border-neutral-700",
"pbx-border-neutral-800",
"pbx-border-neutral-900",
"pbx-border-stone-50",
"pbx-border-stone-100",
"pbx-border-stone-200",
"pbx-border-stone-300",
"pbx-border-stone-400",
"pbx-border-stone-500",
"pbx-border-stone-600",
"pbx-border-stone-700",
"pbx-border-stone-800",
"pbx-border-stone-900",
"pbx-border-red-50",
"pbx-border-red-100",
"pbx-border-red-200",
"pbx-border-red-300",
"pbx-border-red-400",
"pbx-border-red-500",
"pbx-border-red-600",
"pbx-border-red-700",
"pbx-border-red-800",
"pbx-border-red-900",
"pbx-border-orange-50",
"pbx-border-orange-100",
"pbx-border-orange-200",
"pbx-border-orange-300",
"pbx-border-orange-400",
"pbx-border-orange-500",
"pbx-border-orange-600",
"pbx-border-orange-700",
"pbx-border-orange-800",
"pbx-border-orange-900",
"pbx-border-amber-50",
"pbx-border-amber-100",
"pbx-border-amber-200",
"pbx-border-amber-300",
"pbx-border-amber-400",
"pbx-border-amber-500",
"pbx-border-amber-600",
"pbx-border-amber-700",
"pbx-border-amber-800",
"pbx-border-amber-900",
"pbx-border-yellow-50",
"pbx-border-yellow-100",
"pbx-border-yellow-200",
"pbx-border-yellow-300",
"pbx-border-yellow-400",
"pbx-border-yellow-500",
"pbx-border-yellow-600",
"pbx-border-yellow-700",
"pbx-border-yellow-800",
"pbx-border-yellow-900",
"pbx-border-lime-50",
"pbx-border-lime-100",
"pbx-border-lime-200",
"pbx-border-lime-300",
"pbx-border-lime-400",
"pbx-border-lime-500",
"pbx-border-lime-600",
"pbx-border-lime-700",
"pbx-border-lime-800",
"pbx-border-lime-900",
"pbx-border-green-50",
"pbx-border-green-100",
"pbx-border-green-200",
"pbx-border-green-300",
"pbx-border-green-400",
"pbx-border-green-500",
"pbx-border-green-600",
"pbx-border-green-700",
"pbx-border-green-800",
"pbx-border-green-900",
"pbx-border-emerald-50",
"pbx-border-emerald-100",
"pbx-border-emerald-200",
"pbx-border-emerald-300",
"pbx-border-emerald-400",
"pbx-border-emerald-500",
"pbx-border-emerald-600",
"pbx-border-emerald-700",
"pbx-border-emerald-800",
"pbx-border-emerald-900",
"pbx-border-teal-50",
"pbx-border-teal-100",
"pbx-border-teal-200",
"pbx-border-teal-300",
"pbx-border-teal-400",
"pbx-border-teal-500",
"pbx-border-teal-600",
"pbx-border-teal-700",
"pbx-border-teal-800",
"pbx-border-teal-900",
"pbx-border-cyan-50",
"pbx-border-cyan-100",
"pbx-border-cyan-200",
"pbx-border-cyan-300",
"pbx-border-cyan-400",
"pbx-border-cyan-500",
"pbx-border-cyan-600",
"pbx-border-cyan-700",
"pbx-border-cyan-800",
"pbx-border-cyan-900",
"pbx-border-sky-50",
"pbx-border-sky-100",
"pbx-border-sky-200",
"pbx-border-sky-300",
"pbx-border-sky-400",
"pbx-border-sky-500",
"pbx-border-sky-600",
"pbx-border-sky-700",
"pbx-border-sky-800",
"pbx-border-sky-900",
"pbx-border-blue-50",
"pbx-border-blue-100",
"pbx-border-blue-200",
"pbx-border-blue-300",
"pbx-border-blue-400",
"pbx-border-blue-500",
"pbx-border-blue-600",
"pbx-border-blue-700",
"pbx-border-blue-800",
"pbx-border-blue-900",
"pbx-border-indigo-50",
"pbx-border-indigo-100",
"pbx-border-indigo-200",
"pbx-border-indigo-300",
"pbx-border-indigo-400",
"pbx-border-indigo-500",
"pbx-border-indigo-600",
"pbx-border-indigo-700",
"pbx-border-indigo-800",
"pbx-border-indigo-900",
"pbx-border-violet-50",
"pbx-border-violet-100",
"pbx-border-violet-200",
"pbx-border-violet-300",
"pbx-border-violet-400",
"pbx-border-violet-500",
"pbx-border-violet-600",
"pbx-border-violet-700",
"pbx-border-violet-800",
"pbx-border-violet-900",
"pbx-border-purple-50",
"pbx-border-purple-100",
"pbx-border-purple-200",
"pbx-border-purple-300",
"pbx-border-purple-400",
"pbx-border-purple-500",
"pbx-border-purple-600",
"pbx-border-purple-700",
"pbx-border-purple-800",
"pbx-border-purple-900",
"pbx-border-fuchsia-50",
"pbx-border-fuchsia-100",
"pbx-border-fuchsia-200",
"pbx-border-fuchsia-300",
"pbx-border-fuchsia-400",
"pbx-border-fuchsia-500",
"pbx-border-fuchsia-600",
"pbx-border-fuchsia-700",
"pbx-border-fuchsia-800",
"pbx-border-fuchsia-900",
"pbx-border-pink-50",
"pbx-border-pink-100",
"pbx-border-pink-200",
"pbx-border-pink-300",
"pbx-border-pink-400",
"pbx-border-pink-500",
"pbx-border-pink-600",
"pbx-border-pink-700",
"pbx-border-pink-800",
"pbx-border-pink-900",
"pbx-border-rose-50",
"pbx-border-rose-100",
"pbx-border-rose-200",
"pbx-border-rose-300",
"pbx-border-rose-400",
"pbx-border-rose-500",
"pbx-border-rose-600",
"pbx-border-rose-700",
"pbx-border-rose-800",
"pbx-border-rose-900"
]
};
let ur;
const B1 = new Uint8Array(16);
function L1() {
if (!ur && (ur = typeof crypto < "u" && crypto.getRandomValues && crypto.getRandomValues.bind(crypto), !ur))
throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
return ur(B1);
}
const De = [];
for (let n = 0; n < 256; ++n)
De.push((n + 256).toString(16).slice(1));
function P1(n, e = 0) {
return De[n[e + 0]] + De[n[e + 1]] + De[n[e + 2]] + De[n[e + 3]] + "-" + De[n[e + 4]] + De[n[e + 5]] + "-" + De[n[e + 6]] + De[n[e + 7]] + "-" + De[n[e + 8]] + De[n[e + 9]] + "-" + De[n[e + 10]] + De[n[e + 11]] + De[n[e + 12]] + De[n[e + 13]] + De[n[e + 14]] + De[n[e + 15]];
}
const A1 = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), wa = {
randomUUID: A1
};
function Ca(n, e, t) {
if (wa.randomUUID && !n)
return wa.randomUUID();
n = n || {};
const i = n.random || (n.rng || L1)();
return i[6] = i[6] & 15 | 64, i[8] = i[8] & 63 | 128, P1(i);
}
const ve = function(e = 200) {
return new Promise((t) => {
setTimeout(t, e);
});
}, Gt = function(n) {
return !n || typeof n == "object" && n.constructor === Object && Object.keys(n).length === 0;
};
function ap(n, e) {
if (!n)
return console.warn("No valid pagebuilder element passed"), "";
const t = n.cloneNode(!0);
if (t.removeAttribute("id"), t.querySelectorAll(
"[data-componentid], [data-component-title], #page-builder-editor-editable-area"
).forEach((o) => {
o.removeAttribute("data-componentid"), o.removeAttribute("data-component-title"), o.id === "page-builder-editor-editable-area" && o.removeAttribute("id");
}), e && e && typeof e.imageUrlPrefix == "string") {
const o = e.imageUrlPrefix;
t.querySelectorAll("img").forEach((l) => {
const a = l.getAttribute("src") || "";
!a.startsWith("http") && // extra safety
o && !a.startsWith(o) && l.setAttribute("src", o + a.replace(/^\/+/, ""));
});
}
const r = (o) => {
for (let s = o.childNodes.length - 1; s >= 0; s--) {
const l = o.childNodes[s];
l.nodeType === Node.COMMENT_NODE ? o.removeChild(l) : l.nodeType === Node.ELEMENT_NODE && r(l);
}
};
return r(t), t.outerHTML;
}
const I1 = [
"en",
"zh-Hans",
"fr",
"ja",
"ru",
"es",
"pt",
"de",
"ar",
"hi"
];
class $1 {
constructor(e) {
// Class properties with types
de(this, "fontSizeRegex", /^(sm:|md:|lg:|xl:|2xl:)?pbx-text-(xs|sm|base|lg|xl|2xl|3xl|4xl|5xl|6xl|7xl|8xl|9xl)$/);
de(this, "pageBuilderStateStore");
de(this, "getLocalStorageItemName");
de(this, "getApplyImageToSelection");
de(this, "getHyberlinkEnable");
de(this, "getComponents");
de(this, "getComponent");
de(this, "getElement");
de(this, "getComponentArrayAddMethod");
de(this, "NoneListernesTags");
de(this, "hasStartedEditing", !1);
// Hold data from Database or Backend for updated post
de(this, "originalComponents");
// Holds data to be mounted when pagebuilder is not yet present in the DOM
de(this, "savedMountComponents", null);
de(this, "pendingMountComponents", null);
de(this, "isPageBuilderMissingOnStart", !1);
// Add a class-level WeakMap to track elements and their listeners
// Use class-level WeakMap from being a local variable inside addListenersToEditableElements to a private class-level property.
// This ensures that the map persists across multiple calls to the method and retains knowledge of
// which elements already have listeners.
// This prevents multiple event listeners being attached to the same HTML elements
de(this, "elementsWithListeners", /* @__PURE__ */ new WeakMap());
/**
* Handles the mouseover event for editable elements, showing a hover state.
* @param {Event} e - The mouse event.
* @param {HTMLElement} element - The element being hovered over.
* @private
*/
de(this, "handleMouseOver", (e, t) => {
e.preventDefault(), e.stopPropagation();
const i = document.querySelector("#pagebuilder");
if (!i) return;
const r = i.querySelector("[hovered]");
r && r.removeAttribute("hovered"), t.hasAttribute("selected") || t.setAttribute("hovered", "");
});
/**
* Handles the mouseleave event for editable elements, removing the hover state.
* @param {Event} e - The mouse event.
* @private
*/
de(this, "handleMouseLeave", (e) => {
e.preventDefault(), e.stopPropagation();
const t = document.querySelector("#pagebuilder");
if (!t) return;
const i = t.querySelector("[hovered]");
i && i.removeAttribute("hovered");
});
/**
* Attaches click, mouseover, and mouseleave event listeners to all editable elements in the page builder.
* @private
*/
de(this, "addListenersToEditableElements", async () => {
const e = document.querySelector("#pagebuilder");
e && (await te(), e.querySelectorAll("section *").forEach((t) => {
if (this.isEditableElement(t)) {
const i = t;
if (this.elementsWithListeners.has(i)) {
const l = this.elementsWithListeners.get(i);
l && (i.removeEventListener("click", l.click), i.removeEventListener("mouseover", l.mouseover), i.removeEventListener("mouseleave", l.mouseleave));
}
const r = (l) => this.handleElementClick(l, i), o = (l) => this.handleMouseOver(l, i), s = (l) => this.handleMouseLeave(l);
i.addEventListener("click", r), i.addEventListener("mouseover", o), i.addEventListener("mouseleave", s), this.elementsWithListeners.set(i, {
click: r,
mouseover: o,
mouseleave: s
});
}
}));
});
/**
* Handles the click event for editable elements, setting the element as selected.
* @param {Event} e - The click event.
* @param {HTMLElement} element - The clicked element.
* @private
*/
de(this, "handleElementClick", async (e, t) => {
e.preventDefault(), e.stopPropagation();
const i = document.querySelector("#pagebuilder");
if (!i) return;
this.pageBuilderStateStore.setMenuRight(!0);
const r = i.querySelector("[selected]");
r && r.removeAttribute("selected"), t.removeAttribute("hovered"), t.setAttribute("selected", ""), this.pageBuilderStateStore.setElement(t), await this.handleAutoSave();
});
/**
* Triggers an auto-save of the current page builder content to local storage if enabled.
*/
de(this, "handleAutoSave", async () => {
this.startEditing();
const e = this.pageBuilderStateStore.getPageBuilderConfig;
if (e && e.userSettings && typeof e.userSettings.autoSave == "boolean" && e.userSettings.autoSave !== !1) {
if (this.pageBuilderStateStore.getIsSaving) return;
try {
this.pageBuilderStateStore.setIsSaving(!0), this.saveDomComponentsToLocalStorage(), await ve(400);
} catch (t) {
console.error("Error trying auto save.", t);
} finally {
this.pageBuilderStateStore.setIsSaving(!1);
}
}
if (e && !e.userSettings)
try {
this.pageBuilderStateStore.setIsSaving(!0), this.saveDomComponentsToLocalStorage(), await ve(400);
} catch (t) {
console.error("Error trying saving.", t);
} finally {
this.pageBuilderStateStore.setIsSaving(!1);
}
});
/**
* Manually saves the current page builder content to local storage.
*/
de(this, "handleManualSave", async (e) => {
this.pageBuilderStateStore.setIsSaving(!0), e || this.clearHtmlSelection(), this.startEditing(), this.saveDomComponentsToLocalStorage(), await ve(300), this.pageBuilderStateStore.setIsSaving(!1);
});
/**
* Ensures that a text area element has content, adding a visual indicator if it's empty.
*/
de(this, "ensureTextAreaHasContent", () => {
if (!this.getElement.value || typeof this.getElement.value.innerHTML != "string")
return;
const e = this.getElement.value, t = e.tagName;
["DIV"].includes(t) && e.tagName.toLowerCase() !== "img" && e.textContent && Number(e.textContent.length) === 0 ? (e.classList.add("h-6"), e.classList.add("bg-red-50")) : (e.classList.remove("h-6"), e.classList.remove("bg-red-50"));
});
/**
* Handles text input for an element, updating its content.
* @param {string} textContentVueModel - The new text content from the Vue model.
* @returns {Promise<void>}
*/
de(this, "handleTextInput", async (e) => {
var t;
typeof ((t = this.getElement.value) == null ? void 0 : t.innerHTML) == "string" && (typeof this.getElement.value.innerHTML == "string" && (await te(), this.getElement.value.textContent = e, this.pageBuilderStateStore.setTextAreaVueModel(this.getElement.value.innerHTML), this.getElement.value.innerHTML = e), this.ensureTextAreaHasContent());
});
this.hasStartedEditing = !1, this.pageBuilderStateStore = e, this.getApplyImageToSelection = P(
() => this.pageBuilderStateStore.getApplyImageToSelection
), this.getLocalStorageItemName = P(
() => this.pageBuilderStateStore.getLocalStorageItemName
), this.getHyberlinkEnable = P(() => this.pageBuilderStateStore.getHyberlinkEnable), this.getComponents = P(() => this.pageBuilderStateStore.getComponents), this.getComponent = P(() => this.pageBuilderStateStore.getComponent), this.getElement = P(() => this.pageBuilderStateStore.getElement), this.getComponentArrayAddMethod = P(
() => this.pageBuilderStateStore.getComponentArrayAddMethod
), this.NoneListernesTags = [
"P",
"H1",
"H2",
"H3",
"H4",
"H5",
"H6",
"IFRAME",
"UL",
"OL",
"LI",
"EM",
"STRONG",
"B",
"A",
"SPAN",
"BLOCKQUOTE",
"BR",
"PRE",
"CODE",
"MARK",
"DEL",
"INS",
"U",
"FIGURE",
"FIGCAPTION"
];
}
/**
* Returns an array of available languages.
* @returns {AvailableLanguage[]} An array of available language codes.
*/
availableLanguage() {
return I1;
}
/**
* Sets the current language in the page builder state.
* @param {string} lang - The language code to set.
*/
changeLanguage(e) {
this.pageBuilderStateStore.setCurrentLanguage(e);
}
/**
* Deselects any selected or hovered elements in the builder UI.
* @returns {Promise<void>}
*/
async clearHtmlSelection() {
this.pageBuilderStateStore.setComponent(null), this.pageBuilderStateStore.setElement(null), await this.removeHoveredAndSelected();
}
/**
* Ensures that the `updateOrCreate` configuration is valid and sets default values if necessary.
* @param {PageBuilderConfig} config - The page builder configuration.
* @private
*/
ensureUpdateOrCreateConfig(e) {
if (!e.updateOrCreate || e.updateOrCreate && Gt(e.updateOrCreate)) {
const t = {
...e,
updateOrCreate: {
formType: "create",
formName: "post"
}
};
this.pageBuilderStateStore.setPageBuilderConfig(t);
return;
}
if (e.updateOrCreate && typeof e.updateOrCreate.formType == "string" && (e.updateOrCreate.formType === "create" || e.updateOrCreate.formType === "update") && typeof e.updateOrCreate.formName != "string" || typeof e.updateOrCreate.formName == "string" && e.updateOrCreate.formName.length === 0) {
const t = {
...e,
updateOrCreate: {
formType: e.updateOrCreate.formType,
formName: "post"
}
};
this.pageBuilderStateStore.setPageBuilderConfig(t);
}
if (e.updateOrCreate && typeof e.updateOrCreate.formType != "string" || typeof e.updateOrCreate.formType == "string" && e.updateOrCreate.formType !== "create" && e.updateOrCreate.formType !== "update" && typeof e.updateOrCreate.formName == "string" && e.updateOrCreate.formName.length !== 0) {
const t = {
...e,
updateOrCreate: {
formType: "create",
formName: e.updateOrCreate.formName
}
};
this.pageBuilderStateStore.setPageBuilderConfig(t);
return;
}
if (e.updateOrCreate && typeof e.updateOrCreate.formType == "string" && e.updateOrCreate.formType !== "create" && e.updateOrCreate.formType !== "update" && typeof e.formName != "string") {
const t = {
...e,
updateOrCreate: {
formType: "create",
formName: "post"
}
};
thi