@binarycastle/vue-html-editor
Version:
A powerful and extensible HTML editor component for Vue 3 with plugin support
1,239 lines (1,238 loc) • 41.9 kB
JavaScript
import { defineComponent as kt, mergeModels as Ct, useModel as At, computed as Et, ref as ne, onMounted as Xe, watch as Ye, onUnmounted as Pt, createElementBlock as Ee, openBlock as oe, createElementVNode as Pe, createBlock as _e, createCommentVNode as Rt, normalizeStyle as Tt, normalizeClass as Ge, Teleport as Lt, withDirectives as Bt, Fragment as Mt, renderList as St, unref as jt, vShow as Dt, resolveDynamicComponent as $t, withCtx as Ht, createTextVNode as Vt, toDisplayString as Wt, nextTick as Ft } from "vue";
var L = "top", D = "bottom", $ = "right", B = "left", Le = "auto", ue = [L, D, $, B], J = "start", le = "end", It = "clippingParents", it = "viewport", ie = "popper", Nt = "reference", Ke = /* @__PURE__ */ ue.reduce(function(t, e) {
return t.concat([e + "-" + J, e + "-" + le]);
}, []), at = /* @__PURE__ */ [].concat(ue, [Le]).reduce(function(t, e) {
return t.concat([e, e + "-" + J, e + "-" + le]);
}, []), qt = "beforeRead", Ut = "read", zt = "afterRead", Xt = "beforeMain", Yt = "main", _t = "afterMain", Gt = "beforeWrite", Kt = "write", Jt = "afterWrite", Qt = [qt, Ut, zt, Xt, Yt, _t, Gt, Kt, Jt];
function F(t) {
return t ? (t.nodeName || "").toLowerCase() : null;
}
function S(t) {
if (t == null)
return window;
if (t.toString() !== "[object Window]") {
var e = t.ownerDocument;
return e && e.defaultView || window;
}
return t;
}
function G(t) {
var e = S(t).Element;
return t instanceof e || t instanceof Element;
}
function j(t) {
var e = S(t).HTMLElement;
return t instanceof e || t instanceof HTMLElement;
}
function Be(t) {
if (typeof ShadowRoot > "u")
return !1;
var e = S(t).ShadowRoot;
return t instanceof e || t instanceof ShadowRoot;
}
function Zt(t) {
var e = t.state;
Object.keys(e.elements).forEach(function(r) {
var o = e.styles[r] || {}, n = e.attributes[r] || {}, i = e.elements[r];
!j(i) || !F(i) || (Object.assign(i.style, o), Object.keys(n).forEach(function(c) {
var a = n[c];
a === !1 ? i.removeAttribute(c) : i.setAttribute(c, a === !0 ? "" : a);
}));
});
}
function er(t) {
var e = t.state, r = {
popper: {
position: e.options.strategy,
left: "0",
top: "0",
margin: "0"
},
arrow: {
position: "absolute"
},
reference: {}
};
return Object.assign(e.elements.popper.style, r.popper), e.styles = r, e.elements.arrow && Object.assign(e.elements.arrow.style, r.arrow), function() {
Object.keys(e.elements).forEach(function(o) {
var n = e.elements[o], i = e.attributes[o] || {}, c = Object.keys(e.styles.hasOwnProperty(o) ? e.styles[o] : r[o]), a = c.reduce(function(s, f) {
return s[f] = "", s;
}, {});
!j(n) || !F(n) || (Object.assign(n.style, a), Object.keys(i).forEach(function(s) {
n.removeAttribute(s);
}));
});
};
}
const tr = {
name: "applyStyles",
enabled: !0,
phase: "write",
fn: Zt,
effect: er,
requires: ["computeStyles"]
};
function W(t) {
return t.split("-")[0];
}
var _ = Math.max, xe = Math.min, Q = Math.round;
function Re() {
var t = navigator.userAgentData;
return t != null && t.brands && Array.isArray(t.brands) ? t.brands.map(function(e) {
return e.brand + "/" + e.version;
}).join(" ") : navigator.userAgent;
}
function st() {
return !/^((?!chrome|android).)*safari/i.test(Re());
}
function Z(t, e, r) {
e === void 0 && (e = !1), r === void 0 && (r = !1);
var o = t.getBoundingClientRect(), n = 1, i = 1;
e && j(t) && (n = t.offsetWidth > 0 && Q(o.width) / t.offsetWidth || 1, i = t.offsetHeight > 0 && Q(o.height) / t.offsetHeight || 1);
var c = G(t) ? S(t) : window, a = c.visualViewport, s = !st() && r, f = (o.left + (s && a ? a.offsetLeft : 0)) / n, l = (o.top + (s && a ? a.offsetTop : 0)) / i, m = o.width / n, b = o.height / i;
return {
width: m,
height: b,
top: l,
right: f + m,
bottom: l + b,
left: f,
x: f,
y: l
};
}
function Me(t) {
var e = Z(t), r = t.offsetWidth, o = t.offsetHeight;
return Math.abs(e.width - r) <= 1 && (r = e.width), Math.abs(e.height - o) <= 1 && (o = e.height), {
x: t.offsetLeft,
y: t.offsetTop,
width: r,
height: o
};
}
function lt(t, e) {
var r = e.getRootNode && e.getRootNode();
if (t.contains(e))
return !0;
if (r && Be(r)) {
var o = e;
do {
if (o && t.isSameNode(o))
return !0;
o = o.parentNode || o.host;
} while (o);
}
return !1;
}
function I(t) {
return S(t).getComputedStyle(t);
}
function rr(t) {
return ["table", "td", "th"].indexOf(F(t)) >= 0;
}
function U(t) {
return ((G(t) ? t.ownerDocument : (
// $FlowFixMe[prop-missing]
t.document
)) || window.document).documentElement;
}
function be(t) {
return F(t) === "html" ? t : (
// this is a quicker (but less type safe) way to save quite some bytes from the bundle
// $FlowFixMe[incompatible-return]
// $FlowFixMe[prop-missing]
t.assignedSlot || // step into the shadow DOM of the parent of a slotted node
t.parentNode || // DOM Element detected
(Be(t) ? t.host : null) || // ShadowRoot detected
// $FlowFixMe[incompatible-call]: HTMLElement is a Node
U(t)
);
}
function Je(t) {
return !j(t) || // https://github.com/popperjs/popper-core/issues/837
I(t).position === "fixed" ? null : t.offsetParent;
}
function nr(t) {
var e = /firefox/i.test(Re()), r = /Trident/i.test(Re());
if (r && j(t)) {
var o = I(t);
if (o.position === "fixed")
return null;
}
var n = be(t);
for (Be(n) && (n = n.host); j(n) && ["html", "body"].indexOf(F(n)) < 0; ) {
var i = I(n);
if (i.transform !== "none" || i.perspective !== "none" || i.contain === "paint" || ["transform", "perspective"].indexOf(i.willChange) !== -1 || e && i.willChange === "filter" || e && i.filter && i.filter !== "none")
return n;
n = n.parentNode;
}
return null;
}
function fe(t) {
for (var e = S(t), r = Je(t); r && rr(r) && I(r).position === "static"; )
r = Je(r);
return r && (F(r) === "html" || F(r) === "body" && I(r).position === "static") ? e : r || nr(t) || e;
}
function Se(t) {
return ["top", "bottom"].indexOf(t) >= 0 ? "x" : "y";
}
function ae(t, e, r) {
return _(t, xe(e, r));
}
function or(t, e, r) {
var o = ae(t, e, r);
return o > r ? r : o;
}
function ct() {
return {
top: 0,
right: 0,
bottom: 0,
left: 0
};
}
function ut(t) {
return Object.assign({}, ct(), t);
}
function ft(t, e) {
return e.reduce(function(r, o) {
return r[o] = t, r;
}, {});
}
var ir = function(e, r) {
return e = typeof e == "function" ? e(Object.assign({}, r.rects, {
placement: r.placement
})) : e, ut(typeof e != "number" ? e : ft(e, ue));
};
function ar(t) {
var e, r = t.state, o = t.name, n = t.options, i = r.elements.arrow, c = r.modifiersData.popperOffsets, a = W(r.placement), s = Se(a), f = [B, $].indexOf(a) >= 0, l = f ? "height" : "width";
if (!(!i || !c)) {
var m = ir(n.padding, r), b = Me(i), d = s === "y" ? L : B, k = s === "y" ? D : $, h = r.rects.reference[l] + r.rects.reference[s] - c[s] - r.rects.popper[l], g = c[s] - r.rects.reference[s], C = fe(i), E = C ? s === "y" ? C.clientHeight || 0 : C.clientWidth || 0 : 0, A = h / 2 - g / 2, v = m[d], y = E - b[l] - m[k], w = E / 2 - b[l] / 2 + A, O = ae(v, w, y), T = s;
r.modifiersData[o] = (e = {}, e[T] = O, e.centerOffset = O - w, e);
}
}
function sr(t) {
var e = t.state, r = t.options, o = r.element, n = o === void 0 ? "[data-popper-arrow]" : o;
n != null && (typeof n == "string" && (n = e.elements.popper.querySelector(n), !n) || lt(e.elements.popper, n) && (e.elements.arrow = n));
}
const lr = {
name: "arrow",
enabled: !0,
phase: "main",
fn: ar,
effect: sr,
requires: ["popperOffsets"],
requiresIfExists: ["preventOverflow"]
};
function ee(t) {
return t.split("-")[1];
}
var cr = {
top: "auto",
right: "auto",
bottom: "auto",
left: "auto"
};
function ur(t, e) {
var r = t.x, o = t.y, n = e.devicePixelRatio || 1;
return {
x: Q(r * n) / n || 0,
y: Q(o * n) / n || 0
};
}
function Qe(t) {
var e, r = t.popper, o = t.popperRect, n = t.placement, i = t.variation, c = t.offsets, a = t.position, s = t.gpuAcceleration, f = t.adaptive, l = t.roundOffsets, m = t.isFixed, b = c.x, d = b === void 0 ? 0 : b, k = c.y, h = k === void 0 ? 0 : k, g = typeof l == "function" ? l({
x: d,
y: h
}) : {
x: d,
y: h
};
d = g.x, h = g.y;
var C = c.hasOwnProperty("x"), E = c.hasOwnProperty("y"), A = B, v = L, y = window;
if (f) {
var w = fe(r), O = "clientHeight", T = "clientWidth";
if (w === S(r) && (w = U(r), I(w).position !== "static" && a === "absolute" && (O = "scrollHeight", T = "scrollWidth")), w = w, n === L || (n === B || n === $) && i === le) {
v = D;
var R = m && w === y && y.visualViewport ? y.visualViewport.height : (
// $FlowFixMe[prop-missing]
w[O]
);
h -= R - o.height, h *= s ? 1 : -1;
}
if (n === B || (n === L || n === D) && i === le) {
A = $;
var u = m && w === y && y.visualViewport ? y.visualViewport.width : (
// $FlowFixMe[prop-missing]
w[T]
);
d -= u - o.width, d *= s ? 1 : -1;
}
}
var p = Object.assign({
position: a
}, f && cr), x = l === !0 ? ur({
x: d,
y: h
}, S(r)) : {
x: d,
y: h
};
if (d = x.x, h = x.y, s) {
var P;
return Object.assign({}, p, (P = {}, P[v] = E ? "0" : "", P[A] = C ? "0" : "", P.transform = (y.devicePixelRatio || 1) <= 1 ? "translate(" + d + "px, " + h + "px)" : "translate3d(" + d + "px, " + h + "px, 0)", P));
}
return Object.assign({}, p, (e = {}, e[v] = E ? h + "px" : "", e[A] = C ? d + "px" : "", e.transform = "", e));
}
function fr(t) {
var e = t.state, r = t.options, o = r.gpuAcceleration, n = o === void 0 ? !0 : o, i = r.adaptive, c = i === void 0 ? !0 : i, a = r.roundOffsets, s = a === void 0 ? !0 : a, f = {
placement: W(e.placement),
variation: ee(e.placement),
popper: e.elements.popper,
popperRect: e.rects.popper,
gpuAcceleration: n,
isFixed: e.options.strategy === "fixed"
};
e.modifiersData.popperOffsets != null && (e.styles.popper = Object.assign({}, e.styles.popper, Qe(Object.assign({}, f, {
offsets: e.modifiersData.popperOffsets,
position: e.options.strategy,
adaptive: c,
roundOffsets: s
})))), e.modifiersData.arrow != null && (e.styles.arrow = Object.assign({}, e.styles.arrow, Qe(Object.assign({}, f, {
offsets: e.modifiersData.arrow,
position: "absolute",
adaptive: !1,
roundOffsets: s
})))), e.attributes.popper = Object.assign({}, e.attributes.popper, {
"data-popper-placement": e.placement
});
}
const pr = {
name: "computeStyles",
enabled: !0,
phase: "beforeWrite",
fn: fr,
data: {}
};
var ye = {
passive: !0
};
function dr(t) {
var e = t.state, r = t.instance, o = t.options, n = o.scroll, i = n === void 0 ? !0 : n, c = o.resize, a = c === void 0 ? !0 : c, s = S(e.elements.popper), f = [].concat(e.scrollParents.reference, e.scrollParents.popper);
return i && f.forEach(function(l) {
l.addEventListener("scroll", r.update, ye);
}), a && s.addEventListener("resize", r.update, ye), function() {
i && f.forEach(function(l) {
l.removeEventListener("scroll", r.update, ye);
}), a && s.removeEventListener("resize", r.update, ye);
};
}
const vr = {
name: "eventListeners",
enabled: !0,
phase: "write",
fn: function() {
},
effect: dr,
data: {}
};
var mr = {
left: "right",
right: "left",
bottom: "top",
top: "bottom"
};
function we(t) {
return t.replace(/left|right|bottom|top/g, function(e) {
return mr[e];
});
}
var hr = {
start: "end",
end: "start"
};
function Ze(t) {
return t.replace(/start|end/g, function(e) {
return hr[e];
});
}
function je(t) {
var e = S(t), r = e.pageXOffset, o = e.pageYOffset;
return {
scrollLeft: r,
scrollTop: o
};
}
function De(t) {
return Z(U(t)).left + je(t).scrollLeft;
}
function gr(t, e) {
var r = S(t), o = U(t), n = r.visualViewport, i = o.clientWidth, c = o.clientHeight, a = 0, s = 0;
if (n) {
i = n.width, c = n.height;
var f = st();
(f || !f && e === "fixed") && (a = n.offsetLeft, s = n.offsetTop);
}
return {
width: i,
height: c,
x: a + De(t),
y: s
};
}
function yr(t) {
var e, r = U(t), o = je(t), n = (e = t.ownerDocument) == null ? void 0 : e.body, i = _(r.scrollWidth, r.clientWidth, n ? n.scrollWidth : 0, n ? n.clientWidth : 0), c = _(r.scrollHeight, r.clientHeight, n ? n.scrollHeight : 0, n ? n.clientHeight : 0), a = -o.scrollLeft + De(t), s = -o.scrollTop;
return I(n || r).direction === "rtl" && (a += _(r.clientWidth, n ? n.clientWidth : 0) - i), {
width: i,
height: c,
x: a,
y: s
};
}
function $e(t) {
var e = I(t), r = e.overflow, o = e.overflowX, n = e.overflowY;
return /auto|scroll|overlay|hidden/.test(r + n + o);
}
function pt(t) {
return ["html", "body", "#document"].indexOf(F(t)) >= 0 ? t.ownerDocument.body : j(t) && $e(t) ? t : pt(be(t));
}
function se(t, e) {
var r;
e === void 0 && (e = []);
var o = pt(t), n = o === ((r = t.ownerDocument) == null ? void 0 : r.body), i = S(o), c = n ? [i].concat(i.visualViewport || [], $e(o) ? o : []) : o, a = e.concat(c);
return n ? a : (
// $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here
a.concat(se(be(c)))
);
}
function Te(t) {
return Object.assign({}, t, {
left: t.x,
top: t.y,
right: t.x + t.width,
bottom: t.y + t.height
});
}
function wr(t, e) {
var r = Z(t, !1, e === "fixed");
return r.top = r.top + t.clientTop, r.left = r.left + t.clientLeft, r.bottom = r.top + t.clientHeight, r.right = r.left + t.clientWidth, r.width = t.clientWidth, r.height = t.clientHeight, r.x = r.left, r.y = r.top, r;
}
function et(t, e, r) {
return e === it ? Te(gr(t, r)) : G(e) ? wr(e, r) : Te(yr(U(t)));
}
function xr(t) {
var e = se(be(t)), r = ["absolute", "fixed"].indexOf(I(t).position) >= 0, o = r && j(t) ? fe(t) : t;
return G(o) ? e.filter(function(n) {
return G(n) && lt(n, o) && F(n) !== "body";
}) : [];
}
function br(t, e, r, o) {
var n = e === "clippingParents" ? xr(t) : [].concat(e), i = [].concat(n, [r]), c = i[0], a = i.reduce(function(s, f) {
var l = et(t, f, o);
return s.top = _(l.top, s.top), s.right = xe(l.right, s.right), s.bottom = xe(l.bottom, s.bottom), s.left = _(l.left, s.left), s;
}, et(t, c, o));
return a.width = a.right - a.left, a.height = a.bottom - a.top, a.x = a.left, a.y = a.top, a;
}
function dt(t) {
var e = t.reference, r = t.element, o = t.placement, n = o ? W(o) : null, i = o ? ee(o) : null, c = e.x + e.width / 2 - r.width / 2, a = e.y + e.height / 2 - r.height / 2, s;
switch (n) {
case L:
s = {
x: c,
y: e.y - r.height
};
break;
case D:
s = {
x: c,
y: e.y + e.height
};
break;
case $:
s = {
x: e.x + e.width,
y: a
};
break;
case B:
s = {
x: e.x - r.width,
y: a
};
break;
default:
s = {
x: e.x,
y: e.y
};
}
var f = n ? Se(n) : null;
if (f != null) {
var l = f === "y" ? "height" : "width";
switch (i) {
case J:
s[f] = s[f] - (e[l] / 2 - r[l] / 2);
break;
case le:
s[f] = s[f] + (e[l] / 2 - r[l] / 2);
break;
}
}
return s;
}
function ce(t, e) {
e === void 0 && (e = {});
var r = e, o = r.placement, n = o === void 0 ? t.placement : o, i = r.strategy, c = i === void 0 ? t.strategy : i, a = r.boundary, s = a === void 0 ? It : a, f = r.rootBoundary, l = f === void 0 ? it : f, m = r.elementContext, b = m === void 0 ? ie : m, d = r.altBoundary, k = d === void 0 ? !1 : d, h = r.padding, g = h === void 0 ? 0 : h, C = ut(typeof g != "number" ? g : ft(g, ue)), E = b === ie ? Nt : ie, A = t.rects.popper, v = t.elements[k ? E : b], y = br(G(v) ? v : v.contextElement || U(t.elements.popper), s, l, c), w = Z(t.elements.reference), O = dt({
reference: w,
element: A,
placement: n
}), T = Te(Object.assign({}, A, O)), R = b === ie ? T : w, u = {
top: y.top - R.top + C.top,
bottom: R.bottom - y.bottom + C.bottom,
left: y.left - R.left + C.left,
right: R.right - y.right + C.right
}, p = t.modifiersData.offset;
if (b === ie && p) {
var x = p[n];
Object.keys(u).forEach(function(P) {
var H = [$, D].indexOf(P) >= 0 ? 1 : -1, N = [L, D].indexOf(P) >= 0 ? "y" : "x";
u[P] += x[N] * H;
});
}
return u;
}
function Or(t, e) {
e === void 0 && (e = {});
var r = e, o = r.placement, n = r.boundary, i = r.rootBoundary, c = r.padding, a = r.flipVariations, s = r.allowedAutoPlacements, f = s === void 0 ? at : s, l = ee(o), m = l ? a ? Ke : Ke.filter(function(k) {
return ee(k) === l;
}) : ue, b = m.filter(function(k) {
return f.indexOf(k) >= 0;
});
b.length === 0 && (b = m);
var d = b.reduce(function(k, h) {
return k[h] = ce(t, {
placement: h,
boundary: n,
rootBoundary: i,
padding: c
})[W(h)], k;
}, {});
return Object.keys(d).sort(function(k, h) {
return d[k] - d[h];
});
}
function kr(t) {
if (W(t) === Le)
return [];
var e = we(t);
return [Ze(t), e, Ze(e)];
}
function Cr(t) {
var e = t.state, r = t.options, o = t.name;
if (!e.modifiersData[o]._skip) {
for (var n = r.mainAxis, i = n === void 0 ? !0 : n, c = r.altAxis, a = c === void 0 ? !0 : c, s = r.fallbackPlacements, f = r.padding, l = r.boundary, m = r.rootBoundary, b = r.altBoundary, d = r.flipVariations, k = d === void 0 ? !0 : d, h = r.allowedAutoPlacements, g = e.options.placement, C = W(g), E = C === g, A = s || (E || !k ? [we(g)] : kr(g)), v = [g].concat(A).reduce(function(K, q) {
return K.concat(W(q) === Le ? Or(e, {
placement: q,
boundary: l,
rootBoundary: m,
padding: f,
flipVariations: k,
allowedAutoPlacements: h
}) : q);
}, []), y = e.rects.reference, w = e.rects.popper, O = /* @__PURE__ */ new Map(), T = !0, R = v[0], u = 0; u < v.length; u++) {
var p = v[u], x = W(p), P = ee(p) === J, H = [L, D].indexOf(x) >= 0, N = H ? "width" : "height", M = ce(e, {
placement: p,
boundary: l,
rootBoundary: m,
altBoundary: b,
padding: f
}), V = H ? P ? $ : B : P ? D : L;
y[N] > w[N] && (V = we(V));
var de = we(V), z = [];
if (i && z.push(M[x] <= 0), a && z.push(M[V] <= 0, M[de] <= 0), z.every(function(K) {
return K;
})) {
R = p, T = !1;
break;
}
O.set(p, z);
}
if (T)
for (var ve = k ? 3 : 1, Oe = function(q) {
var re = v.find(function(he) {
var X = O.get(he);
if (X)
return X.slice(0, q).every(function(ke) {
return ke;
});
});
if (re)
return R = re, "break";
}, te = ve; te > 0; te--) {
var me = Oe(te);
if (me === "break") break;
}
e.placement !== R && (e.modifiersData[o]._skip = !0, e.placement = R, e.reset = !0);
}
}
const Ar = {
name: "flip",
enabled: !0,
phase: "main",
fn: Cr,
requiresIfExists: ["offset"],
data: {
_skip: !1
}
};
function tt(t, e, r) {
return r === void 0 && (r = {
x: 0,
y: 0
}), {
top: t.top - e.height - r.y,
right: t.right - e.width + r.x,
bottom: t.bottom - e.height + r.y,
left: t.left - e.width - r.x
};
}
function rt(t) {
return [L, $, D, B].some(function(e) {
return t[e] >= 0;
});
}
function Er(t) {
var e = t.state, r = t.name, o = e.rects.reference, n = e.rects.popper, i = e.modifiersData.preventOverflow, c = ce(e, {
elementContext: "reference"
}), a = ce(e, {
altBoundary: !0
}), s = tt(c, o), f = tt(a, n, i), l = rt(s), m = rt(f);
e.modifiersData[r] = {
referenceClippingOffsets: s,
popperEscapeOffsets: f,
isReferenceHidden: l,
hasPopperEscaped: m
}, e.attributes.popper = Object.assign({}, e.attributes.popper, {
"data-popper-reference-hidden": l,
"data-popper-escaped": m
});
}
const Pr = {
name: "hide",
enabled: !0,
phase: "main",
requiresIfExists: ["preventOverflow"],
fn: Er
};
function Rr(t, e, r) {
var o = W(t), n = [B, L].indexOf(o) >= 0 ? -1 : 1, i = typeof r == "function" ? r(Object.assign({}, e, {
placement: t
})) : r, c = i[0], a = i[1];
return c = c || 0, a = (a || 0) * n, [B, $].indexOf(o) >= 0 ? {
x: a,
y: c
} : {
x: c,
y: a
};
}
function Tr(t) {
var e = t.state, r = t.options, o = t.name, n = r.offset, i = n === void 0 ? [0, 0] : n, c = at.reduce(function(l, m) {
return l[m] = Rr(m, e.rects, i), l;
}, {}), a = c[e.placement], s = a.x, f = a.y;
e.modifiersData.popperOffsets != null && (e.modifiersData.popperOffsets.x += s, e.modifiersData.popperOffsets.y += f), e.modifiersData[o] = c;
}
const Lr = {
name: "offset",
enabled: !0,
phase: "main",
requires: ["popperOffsets"],
fn: Tr
};
function Br(t) {
var e = t.state, r = t.name;
e.modifiersData[r] = dt({
reference: e.rects.reference,
element: e.rects.popper,
placement: e.placement
});
}
const Mr = {
name: "popperOffsets",
enabled: !0,
phase: "read",
fn: Br,
data: {}
};
function Sr(t) {
return t === "x" ? "y" : "x";
}
function jr(t) {
var e = t.state, r = t.options, o = t.name, n = r.mainAxis, i = n === void 0 ? !0 : n, c = r.altAxis, a = c === void 0 ? !1 : c, s = r.boundary, f = r.rootBoundary, l = r.altBoundary, m = r.padding, b = r.tether, d = b === void 0 ? !0 : b, k = r.tetherOffset, h = k === void 0 ? 0 : k, g = ce(e, {
boundary: s,
rootBoundary: f,
padding: m,
altBoundary: l
}), C = W(e.placement), E = ee(e.placement), A = !E, v = Se(C), y = Sr(v), w = e.modifiersData.popperOffsets, O = e.rects.reference, T = e.rects.popper, R = typeof h == "function" ? h(Object.assign({}, e.rects, {
placement: e.placement
})) : h, u = typeof R == "number" ? {
mainAxis: R,
altAxis: R
} : Object.assign({
mainAxis: 0,
altAxis: 0
}, R), p = e.modifiersData.offset ? e.modifiersData.offset[e.placement] : null, x = {
x: 0,
y: 0
};
if (w) {
if (i) {
var P, H = v === "y" ? L : B, N = v === "y" ? D : $, M = v === "y" ? "height" : "width", V = w[v], de = V + g[H], z = V - g[N], ve = d ? -T[M] / 2 : 0, Oe = E === J ? O[M] : T[M], te = E === J ? -T[M] : -O[M], me = e.elements.arrow, K = d && me ? Me(me) : {
width: 0,
height: 0
}, q = e.modifiersData["arrow#persistent"] ? e.modifiersData["arrow#persistent"].padding : ct(), re = q[H], he = q[N], X = ae(0, O[M], K[M]), ke = A ? O[M] / 2 - ve - X - re - u.mainAxis : Oe - X - re - u.mainAxis, gt = A ? -O[M] / 2 + ve + X + he + u.mainAxis : te + X + he + u.mainAxis, Ce = e.elements.arrow && fe(e.elements.arrow), yt = Ce ? v === "y" ? Ce.clientTop || 0 : Ce.clientLeft || 0 : 0, He = (P = p?.[v]) != null ? P : 0, wt = V + ke - He - yt, xt = V + gt - He, Ve = ae(d ? xe(de, wt) : de, V, d ? _(z, xt) : z);
w[v] = Ve, x[v] = Ve - V;
}
if (a) {
var We, bt = v === "x" ? L : B, Ot = v === "x" ? D : $, Y = w[y], ge = y === "y" ? "height" : "width", Fe = Y + g[bt], Ie = Y - g[Ot], Ae = [L, B].indexOf(C) !== -1, Ne = (We = p?.[y]) != null ? We : 0, qe = Ae ? Fe : Y - O[ge] - T[ge] - Ne + u.altAxis, Ue = Ae ? Y + O[ge] + T[ge] - Ne - u.altAxis : Ie, ze = d && Ae ? or(qe, Y, Ue) : ae(d ? qe : Fe, Y, d ? Ue : Ie);
w[y] = ze, x[y] = ze - Y;
}
e.modifiersData[o] = x;
}
}
const Dr = {
name: "preventOverflow",
enabled: !0,
phase: "main",
fn: jr,
requiresIfExists: ["offset"]
};
function $r(t) {
return {
scrollLeft: t.scrollLeft,
scrollTop: t.scrollTop
};
}
function Hr(t) {
return t === S(t) || !j(t) ? je(t) : $r(t);
}
function Vr(t) {
var e = t.getBoundingClientRect(), r = Q(e.width) / t.offsetWidth || 1, o = Q(e.height) / t.offsetHeight || 1;
return r !== 1 || o !== 1;
}
function Wr(t, e, r) {
r === void 0 && (r = !1);
var o = j(e), n = j(e) && Vr(e), i = U(e), c = Z(t, n, r), a = {
scrollLeft: 0,
scrollTop: 0
}, s = {
x: 0,
y: 0
};
return (o || !o && !r) && ((F(e) !== "body" || // https://github.com/popperjs/popper-core/issues/1078
$e(i)) && (a = Hr(e)), j(e) ? (s = Z(e, !0), s.x += e.clientLeft, s.y += e.clientTop) : i && (s.x = De(i))), {
x: c.left + a.scrollLeft - s.x,
y: c.top + a.scrollTop - s.y,
width: c.width,
height: c.height
};
}
function Fr(t) {
var e = /* @__PURE__ */ new Map(), r = /* @__PURE__ */ new Set(), o = [];
t.forEach(function(i) {
e.set(i.name, i);
});
function n(i) {
r.add(i.name);
var c = [].concat(i.requires || [], i.requiresIfExists || []);
c.forEach(function(a) {
if (!r.has(a)) {
var s = e.get(a);
s && n(s);
}
}), o.push(i);
}
return t.forEach(function(i) {
r.has(i.name) || n(i);
}), o;
}
function Ir(t) {
var e = Fr(t);
return Qt.reduce(function(r, o) {
return r.concat(e.filter(function(n) {
return n.phase === o;
}));
}, []);
}
function Nr(t) {
var e;
return function() {
return e || (e = new Promise(function(r) {
Promise.resolve().then(function() {
e = void 0, r(t());
});
})), e;
};
}
function qr(t) {
var e = t.reduce(function(r, o) {
var n = r[o.name];
return r[o.name] = n ? Object.assign({}, n, o, {
options: Object.assign({}, n.options, o.options),
data: Object.assign({}, n.data, o.data)
}) : o, r;
}, {});
return Object.keys(e).map(function(r) {
return e[r];
});
}
var nt = {
placement: "bottom",
modifiers: [],
strategy: "absolute"
};
function ot() {
for (var t = arguments.length, e = new Array(t), r = 0; r < t; r++)
e[r] = arguments[r];
return !e.some(function(o) {
return !(o && typeof o.getBoundingClientRect == "function");
});
}
function Ur(t) {
t === void 0 && (t = {});
var e = t, r = e.defaultModifiers, o = r === void 0 ? [] : r, n = e.defaultOptions, i = n === void 0 ? nt : n;
return function(a, s, f) {
f === void 0 && (f = i);
var l = {
placement: "bottom",
orderedModifiers: [],
options: Object.assign({}, nt, i),
modifiersData: {},
elements: {
reference: a,
popper: s
},
attributes: {},
styles: {}
}, m = [], b = !1, d = {
state: l,
setOptions: function(C) {
var E = typeof C == "function" ? C(l.options) : C;
h(), l.options = Object.assign({}, i, l.options, E), l.scrollParents = {
reference: G(a) ? se(a) : a.contextElement ? se(a.contextElement) : [],
popper: se(s)
};
var A = Ir(qr([].concat(o, l.options.modifiers)));
return l.orderedModifiers = A.filter(function(v) {
return v.enabled;
}), k(), d.update();
},
// Sync update – it will always be executed, even if not necessary. This
// is useful for low frequency updates where sync behavior simplifies the
// logic.
// For high frequency updates (e.g. `resize` and `scroll` events), always
// prefer the async Popper#update method
forceUpdate: function() {
if (!b) {
var C = l.elements, E = C.reference, A = C.popper;
if (ot(E, A)) {
l.rects = {
reference: Wr(E, fe(A), l.options.strategy === "fixed"),
popper: Me(A)
}, l.reset = !1, l.placement = l.options.placement, l.orderedModifiers.forEach(function(u) {
return l.modifiersData[u.name] = Object.assign({}, u.data);
});
for (var v = 0; v < l.orderedModifiers.length; v++) {
if (l.reset === !0) {
l.reset = !1, v = -1;
continue;
}
var y = l.orderedModifiers[v], w = y.fn, O = y.options, T = O === void 0 ? {} : O, R = y.name;
typeof w == "function" && (l = w({
state: l,
options: T,
name: R,
instance: d
}) || l);
}
}
}
},
// Async and optimistically optimized update – it will not be executed if
// not necessary (debounced to run at most once-per-tick)
update: Nr(function() {
return new Promise(function(g) {
d.forceUpdate(), g(l);
});
}),
destroy: function() {
h(), b = !0;
}
};
if (!ot(a, s))
return d;
d.setOptions(f).then(function(g) {
!b && f.onFirstUpdate && f.onFirstUpdate(g);
});
function k() {
l.orderedModifiers.forEach(function(g) {
var C = g.name, E = g.options, A = E === void 0 ? {} : E, v = g.effect;
if (typeof v == "function") {
var y = v({
state: l,
name: C,
instance: d,
options: A
}), w = function() {
};
m.push(y || w);
}
});
}
function h() {
m.forEach(function(g) {
return g();
}), m = [];
}
return d;
};
}
var zr = [vr, Mr, pr, tr, Lr, Ar, Dr, lr, Pr], Xr = /* @__PURE__ */ Ur({
defaultModifiers: zr
});
class vt {
plugins = /* @__PURE__ */ new Map();
register(e) {
this.plugins.set(e.command, e);
}
unregister(e) {
this.plugins.delete(e);
}
getPlugins() {
return Array.from(this.plugins.values());
}
getPlugin(e) {
return this.plugins.get(e);
}
executeCommand(e, r) {
const o = this.plugins.get(e);
return o ? (o.execute(r), !0) : !1;
}
clear() {
this.plugins.clear();
}
}
const un = new vt(), pe = {
bold: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 4h8a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"/><path d="M6 12h9a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"/></svg>',
italic: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="19" y1="4" x2="10" y2="4"/><line x1="14" y1="20" x2="5" y2="20"/><line x1="15" y1="4" x2="9" y2="20"/></svg>',
underline: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 3v7a6 6 0 0 0 6 6 6 6 0 0 0 6-6V3"/><line x1="4" y1="21" x2="20" y2="21"/></svg>',
strikeThrough: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 4H9a3 3 0 0 0-2.83 4"/><path d="M14 12a4 4 0 0 1 0 8H6"/><line x1="4" y1="12" x2="20" y2="12"/></svg>',
removeFormat: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3,6 5,6 21,6"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/><line x1="10" y1="11" x2="10" y2="17"/><line x1="14" y1="11" x2="14" y2="17"/></svg>'
}, Yr = {
command: "bold",
icon: pe.bold,
title: "Bold",
execute: () => {
document.execCommand("bold", !1);
},
isActive: () => document.queryCommandState("bold")
}, _r = {
command: "italic",
icon: pe.italic,
title: "Italic",
execute: () => {
document.execCommand("italic", !1);
},
isActive: () => document.queryCommandState("italic")
}, Gr = {
command: "underline",
icon: pe.underline,
title: "Underline",
execute: () => {
document.execCommand("underline", !1);
},
isActive: () => document.queryCommandState("underline")
}, Kr = {
command: "strikeThrough",
icon: pe.strikeThrough,
title: "Strikethrough",
execute: () => {
document.execCommand("strikeThrough", !1);
},
isActive: () => document.queryCommandState("strikeThrough")
}, Jr = {
command: "removeFormat",
icon: pe.removeFormat,
title: "Remove Format",
execute: () => {
document.execCommand("removeFormatting", !1);
},
isActive: () => !1
}, mt = {
insertUnorderedList: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/></svg>',
insertOrderedList: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="10" y1="6" x2="21" y2="6"/><line x1="10" y1="12" x2="21" y2="12"/><line x1="10" y1="18" x2="21" y2="18"/><path d="M4 6h1v4"/><path d="M4 10h2"/><path d="M6 18H4c0-1 2-2 2-3s-1-1.5-2-1.5"/></svg>'
}, Qr = {
command: "insertUnorderedList",
icon: mt.insertUnorderedList,
title: "Bullet List",
execute: () => {
document.execCommand("insertUnorderedList", !1);
},
isActive: () => document.queryCommandState("insertUnorderedList")
}, Zr = {
command: "insertOrderedList",
icon: mt.insertOrderedList,
title: "Numbered List",
execute: () => {
document.execCommand("insertOrderedList", !1);
},
isActive: () => document.queryCommandState("insertOrderedList")
}, ht = {
createLink: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>',
insertImage: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><circle cx="9" cy="9" r="2"/><path d="M21 15l-3.086-3.086a2 2 0 0 0-2.828 0L6 21"/></svg>'
}, en = {
command: "createLink",
icon: ht.createLink,
title: "Link",
execute: () => {
const t = prompt("Enter URL:");
t && document.execCommand("createLink", !1, t);
},
isActive: () => !1
}, tn = {
command: "insertImage",
icon: ht.insertImage,
title: "Image",
execute: () => {
const t = prompt("Enter image URL (http/https only):");
t && (t.startsWith("http://") || t.startsWith("https://") ? document.execCommand("insertImage", !1, t) : alert("Only HTTP/HTTPS image URLs are allowed."));
},
isActive: () => !1
}, rn = [
Yr,
_r,
Gr,
Kr,
Jr,
Qr,
Zr,
en,
tn
], nn = { class: "v-html-editor relative" }, on = ["onClick", "title"], an = ["innerHTML"], sn = /* @__PURE__ */ kt({
__name: "VHtmlEditor",
props: /* @__PURE__ */ Ct({
toolbarAlwaysShow: { type: Boolean, default: !1 },
plugins: { default: () => rn },
css: { default: "" },
noEditorClasses: { type: Boolean, default: !1 }
}, {
modelValue: {},
modelModifiers: {}
}),
emits: ["update:modelValue"],
setup(t) {
const e = t, r = At(t, "modelValue"), o = Et(() => e.css ? e.css.replace(/([^{}]+){/g, (u, p) => {
const x = p.trim();
return x.startsWith("@") ? u : `${x.split(",").map((H) => `.v-html-editor ${H.trim()}`).join(", ")} {`;
}) : ""), n = ne(), i = ne();
let c = null;
const a = ne(!1), s = ne(!1), f = ne(!1);
let l = null;
const m = new vt();
Xe(() => {
e.plugins.forEach((u) => {
m.register(u);
});
}), Ye(() => e.plugins, (u) => {
m.clear(), u.forEach((p) => {
m.register(p);
});
}, { deep: !0 });
const b = (u) => {
const p = u.target;
r.value = p.innerHTML;
}, d = () => {
c && (c.destroy(), c = null);
}, k = (u) => {
if (!u.rangeCount || !n.value) return !1;
const x = u.getRangeAt(0).commonAncestorContainer;
return n.value.contains(x) || n.value === x;
}, h = () => {
l && clearTimeout(l), l = window.setTimeout(() => {
const u = window.getSelection();
if (!u || u.rangeCount === 0) {
O();
return;
}
if (!k(u)) {
O();
return;
}
const p = u.getRangeAt(0);
!p.collapsed && u.toString().trim() || e.toolbarAlwaysShow ? y(p) : O();
}, 50);
}, g = () => {
e.toolbarAlwaysShow && (l && clearTimeout(l), l = window.setTimeout(() => {
const u = window.getSelection();
if (u && u.rangeCount > 0 && k(u)) {
const p = u.getRangeAt(0);
y(p);
}
}, 50));
}, C = () => {
f.value = !0;
}, E = () => {
f.value = !1, setTimeout(() => {
s.value || (a.value = !1, d());
}, 100);
}, A = () => {
a.value && c && c.update();
}, v = (u, p) => {
if (!p) return !1;
const x = p.getBoundingClientRect();
return u.top > 0 && u.left > 0 && u.top >= x.top - 100 && u.top <= x.bottom + 100 && u.left >= x.left - 100 && u.left <= x.right + 100;
}, y = (u) => {
if (!i.value || !n.value) return;
const p = u.getBoundingClientRect();
if (!v(p, n.value)) {
const P = n.value.getBoundingClientRect();
if (P.top === 0 && P.left === 0) {
O();
return;
}
const H = new DOMRect(
P.left + 20,
P.top + 20,
0,
0
);
w({
getBoundingClientRect: () => H
});
return;
}
w({
getBoundingClientRect: () => new DOMRect(
u.collapsed ? p.left : p.left + p.width / 2,
p.top - 10,
0,
0
)
});
}, w = (u) => {
i.value && (d(), c = Xr(u, i.value, {
placement: "top",
modifiers: [
{
name: "offset",
options: {
offset: [0, 10]
}
},
{
name: "preventOverflow",
options: {
boundary: "viewport",
padding: 8
}
},
{
name: "flip",
options: {
fallbackPlacements: ["bottom", "top"]
}
}
]
}), a.value = !0);
}, O = () => {
e.toolbarAlwaysShow || setTimeout(() => {
s.value || (a.value = !1, d());
}, 100);
}, T = (u) => {
n.value && (m.executeCommand(u, n.value), Ft(() => {
n.value && (r.value = n.value.innerHTML);
}));
}, R = (u) => {
const p = m.getPlugin(u);
return p?.isActive ? p.isActive() : !1;
};
return Ye(r, (u) => {
n.value && n.value.innerHTML !== u && (n.value.innerHTML = u || "");
}, { immediate: !0 }), Xe(() => {
document.addEventListener("selectionchange", h), window.addEventListener("scroll", A, !0), n.value && r.value && (n.value.innerHTML = r.value);
}), Pt(() => {
document.removeEventListener("selectionchange", h), window.removeEventListener("scroll", A, !0), l && clearTimeout(l), d();
}), (u, p) => (oe(), Ee("div", nn, [
Pe("div", {
ref_key: "editorRef",
ref: n,
contenteditable: "true",
onInput: b,
onMouseup: h,
onKeyup: h,
onClick: g,
onFocus: C,
onBlur: E,
class: Ge(e.noEditorClasses ? { "editor-styled": e.css } : [
"min-h-32 p-4 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent prose prose-sm max-w-none",
{ "editor-styled": e.css }
]),
style: Tt(e.noEditorClasses ? void 0 : "white-space: pre-wrap;")
}, null, 38),
(oe(), _e(Lt, { to: "body" }, [
Bt(Pe("div", {
ref_key: "toolbarRef",
ref: i,
onMouseenter: p[0] || (p[0] = (x) => s.value = !0),
onMouseleave: p[1] || (p[1] = (x) => {
s.value = !1, O();
}),
class: "fixed z-[10000] bg-gray-800 text-white rounded-lg shadow-lg p-2 flex items-center space-x-1"
}, [
(oe(!0), Ee(Mt, null, St(jt(m).getPlugins(), (x) => (oe(), Ee("button", {
key: x.command,
onClick: (P) => T(x.command),
class: Ge([
"px-2 py-1 rounded text-sm font-medium transition-colors duration-150 flex items-center justify-center",
R(x.command) ? "bg-blue-500 text-white" : "hover:bg-gray-700 text-gray-200"
]),
title: x.title
}, [
Pe("span", {
innerHTML: x.icon,
class: "w-4 h-4"
}, null, 8, an)
], 10, on))), 128))
], 544), [
[Dt, a.value]
])
])),
o.value ? (oe(), _e($t("style"), { key: 0 }, {
default: Ht(() => [
Vt(Wt(o.value), 1)
]),
_: 1
})) : Rt("", !0)
]));
}
}), ln = (t, e) => {
const r = t.__vccOpts || t;
for (const [o, n] of e)
r[o] = n;
return r;
}, fn = /* @__PURE__ */ ln(sn, [["__scopeId", "data-v-e039b53a"]]);
export {
vt as EditorPluginRegistry,
fn as VHtmlEditor,
Yr as boldPlugin,
rn as defaultPlugins,
tn as imagePlugin,
_r as italicPlugin,
en as linkPlugin,
Zr as orderedListPlugin,
un as pluginRegistry,
Jr as removeFormatPlugin,
Kr as strikeThroughPlugin,
Gr as underlinePlugin,
Qr as unorderedListPlugin
};