@g1cloud/page-builder-editor 1.0.0-alpha.81 → 1.0.0-alpha.83
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/page-builder-editor.css +14 -9
- package/dist/{PbPropertyEditorColor-D1Et94Ef.js → PbPropertyEditorColor-B2whCX1d.js} +1 -1
- package/dist/{PbPropertyEditorCssLength-vEqAkXLy.js → PbPropertyEditorCssLength-Cq5y3hp5.js} +1 -1
- package/dist/{PbPropertyEditorHtml-BD1ir-xW.js → PbPropertyEditorHtml-DunmjOZP.js} +1 -1
- package/dist/{PbPropertyEditorImage-CrtSHsie.js → PbPropertyEditorImage-CAULnDMs.js} +1 -1
- package/dist/{PbPropertyEditorMultilineText-v01RFbU-.js → PbPropertyEditorMultilineText-CP-gnrl0.js} +1 -1
- package/dist/{PbPropertyEditorText-CDohV0Yq.js → PbPropertyEditorText-BqXqhBvc.js} +1 -1
- package/dist/{PbPropertyEditorYoutube-gZIWmCbS.js → PbPropertyEditorYoutube-BM-3CS85.js} +1 -1
- package/dist/{PbWidgetAddModal-CetSlzPe.js → PbWidgetAddModal-B0EJiVqs.js} +1 -1
- package/dist/{index-tTR7GhuX.js → index-CzWzYmyG.js} +453 -253
- package/dist/page-builder-editor.js +1 -1
- package/dist/page-builder-editor.umd.cjs +445 -245
- package/dist/style.css +14 -9
- package/package.json +3 -3
- package/scss/canvas.scss +1 -0
- package/scss/page-builder-editor.scss +7 -7
- package/scss/property-editor-youtube.scss +2 -2
- package/scss/property-group-editor-media.scss +5 -0
- package/scss/property-localpart.scss +2 -2
|
@@ -6817,7 +6817,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
6817
6817
|
return match;
|
|
6818
6818
|
}
|
|
6819
6819
|
const selectors = match.split(",").map((selector) => selector.trim());
|
|
6820
|
-
const modifiedSelectors = selectors.map((selector) => `[data-part-id
|
|
6820
|
+
const modifiedSelectors = selectors.map((selector) => `[data-part-id="${this.partId}"] ${selector}`).join(", ");
|
|
6821
6821
|
return `${modifiedSelectors} `;
|
|
6822
6822
|
});
|
|
6823
6823
|
}
|
|
@@ -6898,32 +6898,52 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
6898
6898
|
emit("update:visible", value, !!((_a = props.part.properties) == null ? void 0 : _a.hideParentWhenInvisible));
|
|
6899
6899
|
};
|
|
6900
6900
|
const classNames = vue.computed(() => [getPartClassName(props.part), props.part.getClassNames()]);
|
|
6901
|
-
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
6902
6901
|
const style = vue.computed(() => ({
|
|
6903
6902
|
...props.part.getStyles(),
|
|
6904
6903
|
...props.part.getInlineStyles()
|
|
6905
6904
|
}));
|
|
6906
6905
|
const thisComponent = vue.computed(() => createPartComponent(props.part));
|
|
6906
|
+
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
6907
|
+
function ensureStyleTag() {
|
|
6908
|
+
removeStyleTag();
|
|
6909
|
+
if (!styleTag.value) return;
|
|
6910
|
+
let styleEl = document.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
6911
|
+
if (!styleEl) {
|
|
6912
|
+
styleEl = document.createElement("style");
|
|
6913
|
+
styleEl.setAttribute("data-part-style-id", props.part.partId);
|
|
6914
|
+
document.head.appendChild(styleEl);
|
|
6915
|
+
}
|
|
6916
|
+
styleEl.textContent = styleTag.value;
|
|
6917
|
+
}
|
|
6918
|
+
function removeStyleTag() {
|
|
6919
|
+
const styleEl = document.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
6920
|
+
if (styleEl) {
|
|
6921
|
+
document.head.removeChild(styleEl);
|
|
6922
|
+
}
|
|
6923
|
+
}
|
|
6924
|
+
vue.watch(styleTag, () => {
|
|
6925
|
+
ensureStyleTag();
|
|
6926
|
+
});
|
|
6927
|
+
vue.onMounted(() => {
|
|
6928
|
+
ensureStyleTag();
|
|
6929
|
+
});
|
|
6930
|
+
vue.onBeforeUnmount(() => {
|
|
6931
|
+
removeStyleTag();
|
|
6932
|
+
});
|
|
6907
6933
|
return (_ctx, _cache) => {
|
|
6908
|
-
return vue.openBlock(), vue.createElementBlock(
|
|
6909
|
-
|
|
6934
|
+
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
|
|
6935
|
+
class: vue.normalizeClass([classNames.value, "pb-widget"]),
|
|
6936
|
+
"data-part-id": _ctx.part.partId,
|
|
6937
|
+
style: vue.normalizeStyle(style.value)
|
|
6938
|
+
}, [
|
|
6939
|
+
thisComponent.value ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(thisComponent.value), {
|
|
6910
6940
|
key: 0,
|
|
6911
|
-
|
|
6912
|
-
|
|
6913
|
-
vue.
|
|
6914
|
-
|
|
6915
|
-
|
|
6916
|
-
|
|
6917
|
-
}, [
|
|
6918
|
-
thisComponent.value ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(thisComponent.value), {
|
|
6919
|
-
key: 0,
|
|
6920
|
-
part: _ctx.part,
|
|
6921
|
-
"onUpdate:visible": updateVisible
|
|
6922
|
-
}, null, 40, ["part"])) : vue.createCommentVNode("", true)
|
|
6923
|
-
], 14, _hoisted_1$a$1), [
|
|
6924
|
-
[vue.vShow, visible.value]
|
|
6925
|
-
])
|
|
6926
|
-
], 64);
|
|
6941
|
+
part: _ctx.part,
|
|
6942
|
+
"onUpdate:visible": updateVisible
|
|
6943
|
+
}, null, 40, ["part"])) : vue.createCommentVNode("", true)
|
|
6944
|
+
], 14, _hoisted_1$a$1)), [
|
|
6945
|
+
[vue.vShow, visible.value]
|
|
6946
|
+
]);
|
|
6927
6947
|
};
|
|
6928
6948
|
}
|
|
6929
6949
|
});
|
|
@@ -6946,33 +6966,53 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
6946
6966
|
emit("update:visible", visible.value, hideParentWhenInvisible);
|
|
6947
6967
|
};
|
|
6948
6968
|
const classNames = vue.computed(() => [getPartClassName(props.part), props.part.getClassNames()]);
|
|
6949
|
-
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
6950
6969
|
const style = vue.computed(() => ({
|
|
6951
6970
|
...props.part.getStyles(props.isMobilePage),
|
|
6952
6971
|
...props.part.getInlineStyles()
|
|
6953
6972
|
}));
|
|
6973
|
+
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
6974
|
+
function ensureStyleTag() {
|
|
6975
|
+
removeStyleTag();
|
|
6976
|
+
if (!styleTag.value) return;
|
|
6977
|
+
let styleEl = document.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
6978
|
+
if (!styleEl) {
|
|
6979
|
+
styleEl = document.createElement("style");
|
|
6980
|
+
styleEl.setAttribute("data-part-style-id", props.part.partId);
|
|
6981
|
+
document.head.appendChild(styleEl);
|
|
6982
|
+
}
|
|
6983
|
+
styleEl.textContent = styleTag.value;
|
|
6984
|
+
}
|
|
6985
|
+
function removeStyleTag() {
|
|
6986
|
+
const styleEl = document.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
6987
|
+
if (styleEl) {
|
|
6988
|
+
document.head.removeChild(styleEl);
|
|
6989
|
+
}
|
|
6990
|
+
}
|
|
6991
|
+
vue.watch(styleTag, () => {
|
|
6992
|
+
ensureStyleTag();
|
|
6993
|
+
});
|
|
6994
|
+
vue.onMounted(() => {
|
|
6995
|
+
ensureStyleTag();
|
|
6996
|
+
});
|
|
6997
|
+
vue.onBeforeUnmount(() => {
|
|
6998
|
+
removeStyleTag();
|
|
6999
|
+
});
|
|
6954
7000
|
return (_ctx, _cache) => {
|
|
6955
|
-
return vue.openBlock(), vue.createElementBlock(
|
|
6956
|
-
|
|
6957
|
-
|
|
6958
|
-
|
|
6959
|
-
|
|
6960
|
-
vue.
|
|
6961
|
-
|
|
6962
|
-
|
|
6963
|
-
|
|
6964
|
-
|
|
6965
|
-
|
|
6966
|
-
|
|
6967
|
-
|
|
6968
|
-
|
|
6969
|
-
|
|
6970
|
-
}, null, 8, ["part"]);
|
|
6971
|
-
}), 128)) : vue.createCommentVNode("", true)
|
|
6972
|
-
], 14, _hoisted_1$9$1), [
|
|
6973
|
-
[vue.vShow, visible.value]
|
|
6974
|
-
])
|
|
6975
|
-
], 64);
|
|
7001
|
+
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
|
|
7002
|
+
class: vue.normalizeClass(classNames.value),
|
|
7003
|
+
"data-part-id": _ctx.part.partId,
|
|
7004
|
+
style: vue.normalizeStyle(style.value)
|
|
7005
|
+
}, [
|
|
7006
|
+
_ctx.part.children && _ctx.part.children.length > 0 ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.part.children, (child) => {
|
|
7007
|
+
return vue.openBlock(), vue.createBlock(_sfc_main$b$1, {
|
|
7008
|
+
key: child.partId,
|
|
7009
|
+
part: child,
|
|
7010
|
+
"onUpdate:visible": _cache[0] || (_cache[0] = (value, hideParentWhenInvisible) => updateVisible(value, hideParentWhenInvisible))
|
|
7011
|
+
}, null, 8, ["part"]);
|
|
7012
|
+
}), 128)) : vue.createCommentVNode("", true)
|
|
7013
|
+
], 14, _hoisted_1$9$1)), [
|
|
7014
|
+
[vue.vShow, visible.value]
|
|
7015
|
+
]);
|
|
6976
7016
|
};
|
|
6977
7017
|
}
|
|
6978
7018
|
});
|
|
@@ -6992,34 +7032,54 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
6992
7032
|
}
|
|
6993
7033
|
};
|
|
6994
7034
|
const classNames = vue.computed(() => [getPartClassName(props.part), props.part.getClassNames()]);
|
|
6995
|
-
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
6996
7035
|
const style = vue.computed(() => ({
|
|
6997
7036
|
...props.part.getStyles(props.isMobilePage),
|
|
6998
7037
|
...props.part.getInlineStyles()
|
|
6999
7038
|
}));
|
|
7039
|
+
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
7040
|
+
function ensureStyleTag() {
|
|
7041
|
+
removeStyleTag();
|
|
7042
|
+
if (!styleTag.value) return;
|
|
7043
|
+
let styleEl = document.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
7044
|
+
if (!styleEl) {
|
|
7045
|
+
styleEl = document.createElement("style");
|
|
7046
|
+
styleEl.setAttribute("data-part-style-id", props.part.partId);
|
|
7047
|
+
document.head.appendChild(styleEl);
|
|
7048
|
+
}
|
|
7049
|
+
styleEl.textContent = styleTag.value;
|
|
7050
|
+
}
|
|
7051
|
+
function removeStyleTag() {
|
|
7052
|
+
const styleEl = document.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
7053
|
+
if (styleEl) {
|
|
7054
|
+
document.head.removeChild(styleEl);
|
|
7055
|
+
}
|
|
7056
|
+
}
|
|
7057
|
+
vue.watch(styleTag, () => {
|
|
7058
|
+
ensureStyleTag();
|
|
7059
|
+
});
|
|
7060
|
+
vue.onMounted(() => {
|
|
7061
|
+
ensureStyleTag();
|
|
7062
|
+
});
|
|
7063
|
+
vue.onBeforeUnmount(() => {
|
|
7064
|
+
removeStyleTag();
|
|
7065
|
+
});
|
|
7000
7066
|
return (_ctx, _cache) => {
|
|
7001
|
-
return vue.openBlock(), vue.createElementBlock(
|
|
7002
|
-
|
|
7003
|
-
|
|
7004
|
-
|
|
7005
|
-
|
|
7006
|
-
vue.
|
|
7007
|
-
|
|
7008
|
-
|
|
7009
|
-
|
|
7010
|
-
|
|
7011
|
-
|
|
7012
|
-
|
|
7013
|
-
|
|
7014
|
-
|
|
7015
|
-
|
|
7016
|
-
|
|
7017
|
-
}, null, 8, ["is-mobile-page", "part"]);
|
|
7018
|
-
}), 128)) : vue.createCommentVNode("", true)
|
|
7019
|
-
], 14, _hoisted_1$8$1), [
|
|
7020
|
-
[vue.vShow, visible.value]
|
|
7021
|
-
])
|
|
7022
|
-
], 64);
|
|
7067
|
+
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
|
|
7068
|
+
class: vue.normalizeClass(classNames.value),
|
|
7069
|
+
"data-part-id": _ctx.part.partId,
|
|
7070
|
+
style: vue.normalizeStyle(style.value)
|
|
7071
|
+
}, [
|
|
7072
|
+
_ctx.part.children && _ctx.part.children.length > 0 ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.part.children, (child) => {
|
|
7073
|
+
return vue.openBlock(), vue.createBlock(_sfc_main$a$1, {
|
|
7074
|
+
key: child.partId,
|
|
7075
|
+
"is-mobile-page": _ctx.isMobilePage,
|
|
7076
|
+
part: child,
|
|
7077
|
+
"onUpdate:visible": _cache[0] || (_cache[0] = (value, hideParentWhenInvisible) => updateVisible(value, hideParentWhenInvisible))
|
|
7078
|
+
}, null, 8, ["is-mobile-page", "part"]);
|
|
7079
|
+
}), 128)) : vue.createCommentVNode("", true)
|
|
7080
|
+
], 14, _hoisted_1$8$1)), [
|
|
7081
|
+
[vue.vShow, visible.value]
|
|
7082
|
+
]);
|
|
7023
7083
|
};
|
|
7024
7084
|
}
|
|
7025
7085
|
});
|
|
@@ -7047,9 +7107,11 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
7047
7107
|
return (_a = props.part.properties) == null ? void 0 : _a.media;
|
|
7048
7108
|
});
|
|
7049
7109
|
const altText = vue.computed(() => {
|
|
7050
|
-
|
|
7110
|
+
var _a, _b;
|
|
7111
|
+
const _altText = (_b = (_a = props.part.properties) == null ? void 0 : _a.media) == null ? void 0 : _b.altText;
|
|
7112
|
+
if (media.value && _altText) {
|
|
7051
7113
|
const locale = pageBuilder.getLocale();
|
|
7052
|
-
return
|
|
7114
|
+
return _altText[locale] || "";
|
|
7053
7115
|
}
|
|
7054
7116
|
return "";
|
|
7055
7117
|
});
|
|
@@ -7608,32 +7670,56 @@ ${_html.style}
|
|
|
7608
7670
|
},
|
|
7609
7671
|
setup(__props) {
|
|
7610
7672
|
const props = __props;
|
|
7611
|
-
const classNames = vue.computed(() => [
|
|
7612
|
-
|
|
7673
|
+
const classNames = vue.computed(() => [
|
|
7674
|
+
getPartClassName(props.part),
|
|
7675
|
+
props.part.getClassNames(),
|
|
7676
|
+
props.isMobilePage ? "mobile" : "pc"
|
|
7677
|
+
]);
|
|
7613
7678
|
const style = vue.computed(() => ({
|
|
7614
7679
|
...props.part.getStyles(props.isMobilePage),
|
|
7615
7680
|
...props.part.getInlineStyles()
|
|
7616
7681
|
}));
|
|
7682
|
+
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
7683
|
+
function ensureStyleTag() {
|
|
7684
|
+
removeStyleTag();
|
|
7685
|
+
if (!styleTag.value) return;
|
|
7686
|
+
let styleEl = document.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
7687
|
+
if (!styleEl) {
|
|
7688
|
+
styleEl = document.createElement("style");
|
|
7689
|
+
styleEl.setAttribute("data-part-style-id", props.part.partId);
|
|
7690
|
+
document.head.appendChild(styleEl);
|
|
7691
|
+
}
|
|
7692
|
+
styleEl.textContent = styleTag.value;
|
|
7693
|
+
}
|
|
7694
|
+
function removeStyleTag() {
|
|
7695
|
+
const styleEl = document.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
7696
|
+
if (styleEl) {
|
|
7697
|
+
document.head.removeChild(styleEl);
|
|
7698
|
+
}
|
|
7699
|
+
}
|
|
7700
|
+
vue.watch(styleTag, () => {
|
|
7701
|
+
ensureStyleTag();
|
|
7702
|
+
});
|
|
7703
|
+
vue.onMounted(() => {
|
|
7704
|
+
ensureStyleTag();
|
|
7705
|
+
});
|
|
7706
|
+
vue.onBeforeUnmount(() => {
|
|
7707
|
+
removeStyleTag();
|
|
7708
|
+
});
|
|
7617
7709
|
return (_ctx, _cache) => {
|
|
7618
|
-
return vue.openBlock(), vue.createElementBlock(
|
|
7619
|
-
|
|
7620
|
-
|
|
7621
|
-
|
|
7622
|
-
|
|
7623
|
-
vue.
|
|
7624
|
-
|
|
7625
|
-
|
|
7626
|
-
|
|
7627
|
-
|
|
7628
|
-
|
|
7629
|
-
|
|
7630
|
-
|
|
7631
|
-
"is-mobile-page": _ctx.isMobilePage,
|
|
7632
|
-
part: section
|
|
7633
|
-
}, null, 8, ["is-mobile-page", "part"]);
|
|
7634
|
-
}), 128))
|
|
7635
|
-
], 14, _hoisted_1$2$1)
|
|
7636
|
-
], 64);
|
|
7710
|
+
return vue.openBlock(), vue.createElementBlock("div", {
|
|
7711
|
+
class: vue.normalizeClass([classNames.value, "pb-page"]),
|
|
7712
|
+
"data-part-id": _ctx.part.partId,
|
|
7713
|
+
style: vue.normalizeStyle(style.value)
|
|
7714
|
+
}, [
|
|
7715
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.part.children, (section) => {
|
|
7716
|
+
return vue.openBlock(), vue.createBlock(_sfc_main$9$1, {
|
|
7717
|
+
key: section.partId,
|
|
7718
|
+
"is-mobile-page": _ctx.isMobilePage,
|
|
7719
|
+
part: section
|
|
7720
|
+
}, null, 8, ["is-mobile-page", "part"]);
|
|
7721
|
+
}), 128))
|
|
7722
|
+
], 14, _hoisted_1$2$1);
|
|
7637
7723
|
};
|
|
7638
7724
|
}
|
|
7639
7725
|
});
|
|
@@ -8631,18 +8717,17 @@ ${_html.style}
|
|
|
8631
8717
|
},
|
|
8632
8718
|
setup(__props) {
|
|
8633
8719
|
const mouseTracker = useMouseTracker();
|
|
8634
|
-
const widget = vue.ref(null);
|
|
8635
8720
|
const draggable = vue.ref(true);
|
|
8636
8721
|
let dragStartX, dragStartY, initX, initY, initWidth, initHeight;
|
|
8637
8722
|
const panChild = (event) => {
|
|
8638
8723
|
draggable.value = false;
|
|
8639
8724
|
event.stopPropagation();
|
|
8640
8725
|
event.preventDefault();
|
|
8641
|
-
if (!
|
|
8726
|
+
if (!partRef.value) return;
|
|
8642
8727
|
dragStartX = event.clientX;
|
|
8643
8728
|
dragStartY = event.clientY;
|
|
8644
|
-
initX =
|
|
8645
|
-
initY =
|
|
8729
|
+
initX = partRef.value.offsetLeft;
|
|
8730
|
+
initY = partRef.value.offsetTop;
|
|
8646
8731
|
const _mousemove = (event2) => {
|
|
8647
8732
|
const dx = event2.clientX - dragStartX;
|
|
8648
8733
|
const dy = event2.clientY - dragStartY;
|
|
@@ -8658,8 +8743,8 @@ ${_html.style}
|
|
|
8658
8743
|
draggable.value = false;
|
|
8659
8744
|
event.stopPropagation();
|
|
8660
8745
|
event.preventDefault();
|
|
8661
|
-
if (!
|
|
8662
|
-
const rect =
|
|
8746
|
+
if (!partRef.value) return;
|
|
8747
|
+
const rect = partRef.value.getBoundingClientRect();
|
|
8663
8748
|
dragStartX = event.clientX;
|
|
8664
8749
|
dragStartY = event.clientY;
|
|
8665
8750
|
initWidth = rect.width;
|
|
@@ -8686,7 +8771,6 @@ ${_html.style}
|
|
|
8686
8771
|
selected.value ? "selected" : "",
|
|
8687
8772
|
props.part.getClassNames()
|
|
8688
8773
|
]);
|
|
8689
|
-
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
8690
8774
|
const style = vue.computed(() => {
|
|
8691
8775
|
var _a, _b, _c, _d;
|
|
8692
8776
|
let style2 = {
|
|
@@ -8712,6 +8796,41 @@ ${_html.style}
|
|
|
8712
8796
|
};
|
|
8713
8797
|
});
|
|
8714
8798
|
const component = vue.computed(() => pageBuilder.partManager.createPartComponent(props.part));
|
|
8799
|
+
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
8800
|
+
const partRef = vue.ref(null);
|
|
8801
|
+
function ensureStyleTag() {
|
|
8802
|
+
removeStyleTag();
|
|
8803
|
+
if (!partRef.value) return;
|
|
8804
|
+
const doc = partRef.value.ownerDocument;
|
|
8805
|
+
if (!doc || !styleTag.value) return;
|
|
8806
|
+
let styleEl = doc.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
8807
|
+
if (!styleEl) {
|
|
8808
|
+
styleEl = document.createElement("style");
|
|
8809
|
+
styleEl.setAttribute("data-part-style-id", props.part.partId);
|
|
8810
|
+
doc.head.appendChild(styleEl);
|
|
8811
|
+
}
|
|
8812
|
+
styleEl.textContent = styleTag.value;
|
|
8813
|
+
}
|
|
8814
|
+
function removeStyleTag() {
|
|
8815
|
+
if (!partRef.value) return;
|
|
8816
|
+
const doc = partRef.value.ownerDocument;
|
|
8817
|
+
if (!doc) return;
|
|
8818
|
+
const styleEl = doc.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
8819
|
+
if (styleEl) {
|
|
8820
|
+
doc.head.removeChild(styleEl);
|
|
8821
|
+
}
|
|
8822
|
+
}
|
|
8823
|
+
vue.watch(styleTag, () => {
|
|
8824
|
+
ensureStyleTag();
|
|
8825
|
+
});
|
|
8826
|
+
vue.onMounted(() => {
|
|
8827
|
+
if (partRef.value) {
|
|
8828
|
+
ensureStyleTag();
|
|
8829
|
+
}
|
|
8830
|
+
});
|
|
8831
|
+
vue.onBeforeUnmount(() => {
|
|
8832
|
+
removeStyleTag();
|
|
8833
|
+
});
|
|
8715
8834
|
const locatePositionMark = (mark, target, mouseOffsetX, mouseOffsetY, draggingPart2, event) => {
|
|
8716
8835
|
if (props.part.isNestedWidget()) {
|
|
8717
8836
|
if (draggingPart2.isWidget())
|
|
@@ -8727,11 +8846,11 @@ ${_html.style}
|
|
|
8727
8846
|
};
|
|
8728
8847
|
const locateSection = (mark, target, mouseOffsetX, mouseOffsetY, draggingPart2, event) => {
|
|
8729
8848
|
mark.style.background = "#e67e22";
|
|
8730
|
-
const
|
|
8849
|
+
const widget = props.part;
|
|
8731
8850
|
const widgetElement = target;
|
|
8732
|
-
const block =
|
|
8851
|
+
const block = widget.parent;
|
|
8733
8852
|
const blockElement = widgetElement.parentElement;
|
|
8734
|
-
const widgetIndex = block.children.indexOf(
|
|
8853
|
+
const widgetIndex = block.children.indexOf(widget);
|
|
8735
8854
|
const isFirstWidget = widgetIndex === 0;
|
|
8736
8855
|
const isLastWidget = widgetIndex === block.children.length - 1;
|
|
8737
8856
|
const section = block.parent;
|
|
@@ -8826,9 +8945,9 @@ ${_html.style}
|
|
|
8826
8945
|
}
|
|
8827
8946
|
mark.style.background = "#27ae60";
|
|
8828
8947
|
const isNestedWidget = props.part.isNestedWidget();
|
|
8829
|
-
const
|
|
8948
|
+
const widget = isNestedWidget ? props.part.parent : props.part;
|
|
8830
8949
|
const widgetElement = isNestedWidget ? target.parentElement.parentElement : target;
|
|
8831
|
-
const block =
|
|
8950
|
+
const block = widget.parent;
|
|
8832
8951
|
const centerX = widgetElement.offsetWidth / 2;
|
|
8833
8952
|
const centerY = widgetElement.offsetHeight / 2;
|
|
8834
8953
|
const quaterX = centerX / 2;
|
|
@@ -8881,10 +9000,10 @@ ${_html.style}
|
|
|
8881
9000
|
};
|
|
8882
9001
|
const acceptSection = (pageBuilder2, target, droppedPart, mouseOffsetX, mouseOffsetY) => {
|
|
8883
9002
|
var _a;
|
|
8884
|
-
const
|
|
9003
|
+
const widget = props.part;
|
|
8885
9004
|
const widgetElement = target;
|
|
8886
|
-
const block =
|
|
8887
|
-
const widgetIndex = block.children.indexOf(
|
|
9005
|
+
const block = widget.parent;
|
|
9006
|
+
const widgetIndex = block.children.indexOf(widget);
|
|
8888
9007
|
const isFirstWidget = widgetIndex === 0;
|
|
8889
9008
|
const isLastWidget = widgetIndex === block.children.length - 1;
|
|
8890
9009
|
const section = block.parent;
|
|
@@ -8921,10 +9040,10 @@ ${_html.style}
|
|
|
8921
9040
|
};
|
|
8922
9041
|
const acceptBlock = (pageBuilder2, target, droppedPart, mouseOffsetX, mouseOffsetY) => {
|
|
8923
9042
|
var _a;
|
|
8924
|
-
const
|
|
9043
|
+
const widget = props.part;
|
|
8925
9044
|
const widgetElement = target;
|
|
8926
|
-
const block =
|
|
8927
|
-
const widgetIndex = block.children.indexOf(
|
|
9045
|
+
const block = widget.parent;
|
|
9046
|
+
const widgetIndex = block.children.indexOf(widget);
|
|
8928
9047
|
const isFirstWidget = widgetIndex === 0;
|
|
8929
9048
|
const isLastWidget = widgetIndex === block.children.length - 1;
|
|
8930
9049
|
const section = block.parent;
|
|
@@ -8958,9 +9077,9 @@ ${_html.style}
|
|
|
8958
9077
|
};
|
|
8959
9078
|
const acceptWidget = (pageBuilder2, target, droppedPart, mouseOffsetX, mouseOffsetY) => {
|
|
8960
9079
|
const isNestedWidget = props.part.isNestedWidget();
|
|
8961
|
-
const
|
|
8962
|
-
const block =
|
|
8963
|
-
const widgetIndex = block.children.indexOf(
|
|
9080
|
+
const widget = isNestedWidget ? props.part.parent : props.part;
|
|
9081
|
+
const block = widget.parent;
|
|
9082
|
+
const widgetIndex = block.children.indexOf(widget) || 0;
|
|
8964
9083
|
const centerY = target.offsetHeight / 2;
|
|
8965
9084
|
const centerX = target.offsetWidth / 2;
|
|
8966
9085
|
const quaterX = centerX / 2;
|
|
@@ -8974,7 +9093,7 @@ ${_html.style}
|
|
|
8974
9093
|
index = widgetIndex + 1;
|
|
8975
9094
|
} else {
|
|
8976
9095
|
if (pageBuilder2.partManager.isChildAllowed(props.part)) {
|
|
8977
|
-
acceptWidgetInside(
|
|
9096
|
+
acceptWidgetInside(widget, droppedPart, pageBuilder2);
|
|
8978
9097
|
}
|
|
8979
9098
|
return;
|
|
8980
9099
|
}
|
|
@@ -8985,7 +9104,7 @@ ${_html.style}
|
|
|
8985
9104
|
index = widgetIndex + 1;
|
|
8986
9105
|
} else {
|
|
8987
9106
|
if (pageBuilder2.partManager.isChildAllowed(props.part)) {
|
|
8988
|
-
acceptWidgetInside(
|
|
9107
|
+
acceptWidgetInside(widget, droppedPart, pageBuilder2);
|
|
8989
9108
|
}
|
|
8990
9109
|
return;
|
|
8991
9110
|
}
|
|
@@ -9002,10 +9121,10 @@ ${_html.style}
|
|
|
9002
9121
|
}];
|
|
9003
9122
|
pageBuilder2.model.moveElements(droppedPart.partId, block.partId, index, update);
|
|
9004
9123
|
};
|
|
9005
|
-
const acceptWidgetInside = (
|
|
9124
|
+
const acceptWidgetInside = (widget, droppedPart, pageBuilder2) => {
|
|
9006
9125
|
var _a, _b;
|
|
9007
|
-
const index = ((_a =
|
|
9008
|
-
if (((_b =
|
|
9126
|
+
const index = ((_a = widget.children) == null ? void 0 : _a.length) || 0;
|
|
9127
|
+
if (((_b = widget.children) == null ? void 0 : _b.indexOf(droppedPart)) !== index) {
|
|
9009
9128
|
const update = [{
|
|
9010
9129
|
partId: droppedPart.partId,
|
|
9011
9130
|
properties: {
|
|
@@ -9014,7 +9133,7 @@ ${_html.style}
|
|
|
9014
9133
|
width: "50%"
|
|
9015
9134
|
}
|
|
9016
9135
|
}];
|
|
9017
|
-
pageBuilder2.model.moveElements(droppedPart.partId,
|
|
9136
|
+
pageBuilder2.model.moveElements(droppedPart.partId, widget.partId, index, update);
|
|
9018
9137
|
}
|
|
9019
9138
|
};
|
|
9020
9139
|
const calculateDropIndex = (part, target, mouseOffsetX, mouseOffsetY, _event) => {
|
|
@@ -9035,34 +9154,28 @@ ${_html.style}
|
|
|
9035
9154
|
return index;
|
|
9036
9155
|
};
|
|
9037
9156
|
return (_ctx, _cache) => {
|
|
9038
|
-
return vue.openBlock(), vue.createElementBlock(
|
|
9039
|
-
|
|
9040
|
-
|
|
9041
|
-
|
|
9042
|
-
|
|
9043
|
-
|
|
9044
|
-
|
|
9045
|
-
|
|
9046
|
-
|
|
9047
|
-
|
|
9048
|
-
|
|
9049
|
-
|
|
9050
|
-
|
|
9051
|
-
|
|
9052
|
-
|
|
9053
|
-
|
|
9054
|
-
|
|
9055
|
-
|
|
9056
|
-
|
|
9057
|
-
|
|
9058
|
-
|
|
9059
|
-
|
|
9060
|
-
onMousedown: resizeChild
|
|
9061
|
-
}, null, 32)) : vue.createCommentVNode("", true)
|
|
9062
|
-
], 14, _hoisted_1$H)), [
|
|
9063
|
-
[vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
|
|
9064
|
-
])
|
|
9065
|
-
], 64);
|
|
9157
|
+
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
|
|
9158
|
+
ref_key: "partRef",
|
|
9159
|
+
ref: partRef,
|
|
9160
|
+
class: vue.normalizeClass([classNames.value, "pb-widget"]),
|
|
9161
|
+
"data-part-id": _ctx.part.partId,
|
|
9162
|
+
draggable: draggable.value,
|
|
9163
|
+
style: vue.normalizeStyle(style.value)
|
|
9164
|
+
}, [
|
|
9165
|
+
component.value ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(component.value), vue.normalizeProps(vue.mergeProps({ key: 0 }, bind.value)), null, 16)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$v)),
|
|
9166
|
+
selected.value && _ctx.part.isNestedWidget() ? (vue.openBlock(), vue.createElementBlock("div", {
|
|
9167
|
+
key: 2,
|
|
9168
|
+
class: "pan-handle",
|
|
9169
|
+
onMousedown: panChild
|
|
9170
|
+
}, null, 32)) : vue.createCommentVNode("", true),
|
|
9171
|
+
selected.value && _ctx.part.isNestedWidget() ? (vue.openBlock(), vue.createElementBlock("div", {
|
|
9172
|
+
key: 3,
|
|
9173
|
+
class: "resize-handle",
|
|
9174
|
+
onMousedown: resizeChild
|
|
9175
|
+
}, null, 32)) : vue.createCommentVNode("", true)
|
|
9176
|
+
], 14, _hoisted_1$H)), [
|
|
9177
|
+
[vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
|
|
9178
|
+
]);
|
|
9066
9179
|
};
|
|
9067
9180
|
}
|
|
9068
9181
|
});
|
|
@@ -9083,6 +9196,40 @@ ${_html.style}
|
|
|
9083
9196
|
props.part.getClassNames()
|
|
9084
9197
|
]);
|
|
9085
9198
|
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
9199
|
+
const partRef = vue.ref(null);
|
|
9200
|
+
function ensureStyleTag() {
|
|
9201
|
+
removeStyleTag();
|
|
9202
|
+
if (!partRef.value) return;
|
|
9203
|
+
const doc = partRef.value.ownerDocument;
|
|
9204
|
+
if (!doc || !styleTag.value) return;
|
|
9205
|
+
let styleEl = doc.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
9206
|
+
if (!styleEl) {
|
|
9207
|
+
styleEl = document.createElement("style");
|
|
9208
|
+
styleEl.setAttribute("data-part-style-id", props.part.partId);
|
|
9209
|
+
doc.head.appendChild(styleEl);
|
|
9210
|
+
}
|
|
9211
|
+
styleEl.textContent = styleTag.value;
|
|
9212
|
+
}
|
|
9213
|
+
function removeStyleTag() {
|
|
9214
|
+
if (!partRef.value) return;
|
|
9215
|
+
const doc = partRef.value.ownerDocument;
|
|
9216
|
+
if (!doc) return;
|
|
9217
|
+
const styleEl = doc.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
9218
|
+
if (styleEl) {
|
|
9219
|
+
doc.head.removeChild(styleEl);
|
|
9220
|
+
}
|
|
9221
|
+
}
|
|
9222
|
+
vue.watch(styleTag, () => {
|
|
9223
|
+
ensureStyleTag();
|
|
9224
|
+
});
|
|
9225
|
+
vue.onMounted(() => {
|
|
9226
|
+
if (partRef.value) {
|
|
9227
|
+
ensureStyleTag();
|
|
9228
|
+
}
|
|
9229
|
+
});
|
|
9230
|
+
vue.onBeforeUnmount(() => {
|
|
9231
|
+
removeStyleTag();
|
|
9232
|
+
});
|
|
9086
9233
|
const properties = vue.computed(() => ({
|
|
9087
9234
|
style: {
|
|
9088
9235
|
...props.part.getStyles(props.isMobilePage),
|
|
@@ -9243,30 +9390,26 @@ ${_html.style}
|
|
|
9243
9390
|
};
|
|
9244
9391
|
return (_ctx, _cache) => {
|
|
9245
9392
|
var _a, _b;
|
|
9246
|
-
return vue.openBlock(), vue.createElementBlock(vue.
|
|
9247
|
-
|
|
9393
|
+
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
|
|
9394
|
+
ref_key: "partRef",
|
|
9395
|
+
ref: partRef,
|
|
9396
|
+
class: [classNames.value, "pb-block"],
|
|
9397
|
+
"data-part-id": _ctx.part.partId,
|
|
9398
|
+
style: (_a = _ctx.part.properties) == null ? void 0 : _a.css
|
|
9399
|
+
}, properties.value), [
|
|
9400
|
+
!_ctx.part.children || ((_b = _ctx.part.children) == null ? void 0 : _b.length) === 0 ? (vue.openBlock(), vue.createBlock(PbAddWidgetButton, {
|
|
9248
9401
|
key: 0,
|
|
9249
|
-
|
|
9250
|
-
}
|
|
9251
|
-
|
|
9252
|
-
|
|
9253
|
-
|
|
9254
|
-
|
|
9255
|
-
|
|
9256
|
-
|
|
9257
|
-
|
|
9258
|
-
|
|
9259
|
-
|
|
9260
|
-
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.part.children, (child) => {
|
|
9261
|
-
return vue.openBlock(), vue.createBlock(_sfc_main$D, {
|
|
9262
|
-
key: child.partId,
|
|
9263
|
-
part: child
|
|
9264
|
-
}, null, 8, ["part"]);
|
|
9265
|
-
}), 128))
|
|
9266
|
-
], 16, _hoisted_1$G)), [
|
|
9267
|
-
[vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
|
|
9268
|
-
])
|
|
9269
|
-
], 64);
|
|
9402
|
+
onAddWidget: addWidget
|
|
9403
|
+
})) : vue.createCommentVNode("", true),
|
|
9404
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.part.children, (child) => {
|
|
9405
|
+
return vue.openBlock(), vue.createBlock(_sfc_main$D, {
|
|
9406
|
+
key: child.partId,
|
|
9407
|
+
part: child
|
|
9408
|
+
}, null, 8, ["part"]);
|
|
9409
|
+
}), 128))
|
|
9410
|
+
], 16, _hoisted_1$G)), [
|
|
9411
|
+
[vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
|
|
9412
|
+
]);
|
|
9270
9413
|
};
|
|
9271
9414
|
}
|
|
9272
9415
|
});
|
|
@@ -9311,6 +9454,40 @@ ${_html.style}
|
|
|
9311
9454
|
];
|
|
9312
9455
|
});
|
|
9313
9456
|
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
9457
|
+
const partRef = vue.ref(null);
|
|
9458
|
+
function ensureStyleTag() {
|
|
9459
|
+
removeStyleTag();
|
|
9460
|
+
if (!partRef.value) return;
|
|
9461
|
+
const doc = partRef.value.ownerDocument;
|
|
9462
|
+
if (!doc || !styleTag.value) return;
|
|
9463
|
+
let styleEl = doc.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
9464
|
+
if (!styleEl) {
|
|
9465
|
+
styleEl = document.createElement("style");
|
|
9466
|
+
styleEl.setAttribute("data-part-style-id", props.part.partId);
|
|
9467
|
+
doc.head.appendChild(styleEl);
|
|
9468
|
+
}
|
|
9469
|
+
styleEl.textContent = styleTag.value;
|
|
9470
|
+
}
|
|
9471
|
+
function removeStyleTag() {
|
|
9472
|
+
if (!partRef.value) return;
|
|
9473
|
+
const doc = partRef.value.ownerDocument;
|
|
9474
|
+
if (!doc) return;
|
|
9475
|
+
const styleEl = doc.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
9476
|
+
if (styleEl) {
|
|
9477
|
+
doc.head.removeChild(styleEl);
|
|
9478
|
+
}
|
|
9479
|
+
}
|
|
9480
|
+
vue.watch(styleTag, () => {
|
|
9481
|
+
ensureStyleTag();
|
|
9482
|
+
});
|
|
9483
|
+
vue.onMounted(() => {
|
|
9484
|
+
if (partRef.value) {
|
|
9485
|
+
ensureStyleTag();
|
|
9486
|
+
}
|
|
9487
|
+
});
|
|
9488
|
+
vue.onBeforeUnmount(() => {
|
|
9489
|
+
removeStyleTag();
|
|
9490
|
+
});
|
|
9314
9491
|
const properties = vue.computed(() => ({
|
|
9315
9492
|
style: {
|
|
9316
9493
|
...props.part.getStyles(props.isMobilePage),
|
|
@@ -9392,37 +9569,33 @@ ${_html.style}
|
|
|
9392
9569
|
};
|
|
9393
9570
|
return (_ctx, _cache) => {
|
|
9394
9571
|
var _a, _b, _c;
|
|
9395
|
-
return vue.openBlock(), vue.createElementBlock(vue.
|
|
9396
|
-
|
|
9397
|
-
|
|
9398
|
-
|
|
9399
|
-
|
|
9400
|
-
|
|
9401
|
-
|
|
9402
|
-
|
|
9403
|
-
|
|
9404
|
-
|
|
9405
|
-
|
|
9406
|
-
|
|
9407
|
-
|
|
9408
|
-
|
|
9409
|
-
|
|
9410
|
-
|
|
9411
|
-
|
|
9412
|
-
|
|
9413
|
-
|
|
9414
|
-
|
|
9415
|
-
|
|
9416
|
-
|
|
9417
|
-
|
|
9418
|
-
|
|
9419
|
-
|
|
9420
|
-
|
|
9421
|
-
|
|
9422
|
-
], 16, _hoisted_1$E)), [
|
|
9423
|
-
[vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
|
|
9424
|
-
])
|
|
9425
|
-
], 64);
|
|
9572
|
+
return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
|
|
9573
|
+
ref_key: "partRef",
|
|
9574
|
+
ref: partRef,
|
|
9575
|
+
class: [classNames.value, "pb-section"],
|
|
9576
|
+
"data-part-id": _ctx.part.partId,
|
|
9577
|
+
style: (_a = _ctx.part.properties) == null ? void 0 : _a.css
|
|
9578
|
+
}, properties.value), [
|
|
9579
|
+
((_b = _ctx.part.properties) == null ? void 0 : _b.sectionType) === "static" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
|
|
9580
|
+
((_c = _ctx.part.properties) == null ? void 0 : _c.name) === "Login Design Part" ? (vue.openBlock(), vue.createBlock(_sfc_main$B, {
|
|
9581
|
+
key: 0,
|
|
9582
|
+
part: _ctx.part
|
|
9583
|
+
}, null, 8, ["part"])) : vue.createCommentVNode("", true)
|
|
9584
|
+
], 64)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
|
|
9585
|
+
_ctx.part.children && _ctx.part.children.length > 0 ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.part.children, (block) => {
|
|
9586
|
+
return vue.openBlock(), vue.createBlock(_sfc_main$C, {
|
|
9587
|
+
key: block.partId,
|
|
9588
|
+
"is-mobile-page": _ctx.isMobilePage,
|
|
9589
|
+
part: block
|
|
9590
|
+
}, null, 8, ["is-mobile-page", "part"]);
|
|
9591
|
+
}), 128)) : (vue.openBlock(), vue.createBlock(PbAddWidgetButton, {
|
|
9592
|
+
key: 1,
|
|
9593
|
+
onAddWidget: addWidget
|
|
9594
|
+
}))
|
|
9595
|
+
], 64))
|
|
9596
|
+
], 16, _hoisted_1$E)), [
|
|
9597
|
+
[vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
|
|
9598
|
+
]);
|
|
9426
9599
|
};
|
|
9427
9600
|
}
|
|
9428
9601
|
});
|
|
@@ -12367,7 +12540,7 @@ ${_html.style}
|
|
|
12367
12540
|
key: 0,
|
|
12368
12541
|
class: "title mt-12"
|
|
12369
12542
|
};
|
|
12370
|
-
const _hoisted_4$4 = { class: "mt-8" };
|
|
12543
|
+
const _hoisted_4$4 = { class: "url mt-8" };
|
|
12371
12544
|
const _hoisted_5$3 = { class: "title mt-12" };
|
|
12372
12545
|
const _hoisted_6$2 = { class: "title mt-12" };
|
|
12373
12546
|
const _hoisted_7$2 = { class: "title mt-12" };
|
|
@@ -12387,13 +12560,16 @@ ${_html.style}
|
|
|
12387
12560
|
if (imageProvider) {
|
|
12388
12561
|
imageProvider({ modal }, (media2) => {
|
|
12389
12562
|
if (media2.mediaType === "Image") {
|
|
12390
|
-
updateProperty({ media: media2,
|
|
12563
|
+
updateProperty({ media: media2, thumbnail: "" });
|
|
12391
12564
|
} else if (media2.mediaType === "Video") {
|
|
12392
|
-
updateProperty({ media: media2,
|
|
12565
|
+
updateProperty({ media: media2, link: "", linkTarget: "" });
|
|
12393
12566
|
}
|
|
12394
12567
|
});
|
|
12395
12568
|
}
|
|
12396
12569
|
};
|
|
12570
|
+
const updateAltText = (value) => {
|
|
12571
|
+
updateProperty({ media: { ...media.value, altText: value } });
|
|
12572
|
+
};
|
|
12397
12573
|
const updateProperty = (properties) => {
|
|
12398
12574
|
pageBuilder.commandRegistry.executeCommand(ChangePropertyCommand.COMMAND_ID, { properties, targetParts: part });
|
|
12399
12575
|
};
|
|
@@ -12403,8 +12579,8 @@ ${_html.style}
|
|
|
12403
12579
|
return (_b = (_a = part == null ? void 0 : part[0]) == null ? void 0 : _a.properties) == null ? void 0 : _b.media;
|
|
12404
12580
|
});
|
|
12405
12581
|
const altText = vue.computed(() => {
|
|
12406
|
-
var _a, _b;
|
|
12407
|
-
return (_b = (_a = part == null ? void 0 : part[0]) == null ? void 0 : _a.properties) == null ? void 0 : _b.altText;
|
|
12582
|
+
var _a, _b, _c;
|
|
12583
|
+
return (_c = (_b = (_a = part == null ? void 0 : part[0]) == null ? void 0 : _a.properties) == null ? void 0 : _b.media) == null ? void 0 : _c.altText;
|
|
12408
12584
|
});
|
|
12409
12585
|
const link = vue.computed(() => {
|
|
12410
12586
|
var _a, _b;
|
|
@@ -12440,7 +12616,7 @@ ${_html.style}
|
|
|
12440
12616
|
])
|
|
12441
12617
|
]),
|
|
12442
12618
|
((_a = media.value) == null ? void 0 : _a.fileUrl) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$8, [
|
|
12443
|
-
_cache[
|
|
12619
|
+
_cache[3] || (_cache[3] = vue.createElementVNode("label", null, "URL", -1)),
|
|
12444
12620
|
vue.createElementVNode("div", _hoisted_4$4, [
|
|
12445
12621
|
vue.createTextVNode(vue.toDisplayString((_b = media.value) == null ? void 0 : _b.fileUrl) + " ", 1),
|
|
12446
12622
|
vue.withDirectives(vue.createVNode(vue.unref(bluesea.BSButton), {
|
|
@@ -12468,7 +12644,7 @@ ${_html.style}
|
|
|
12468
12644
|
locales: locales.value,
|
|
12469
12645
|
"model-value": altText.value,
|
|
12470
12646
|
width: "100%",
|
|
12471
|
-
"onUpdate:modelValue":
|
|
12647
|
+
"onUpdate:modelValue": updateAltText
|
|
12472
12648
|
}, null, 8, ["locales", "model-value"])
|
|
12473
12649
|
]),
|
|
12474
12650
|
vue.createElementVNode("div", _hoisted_6$2, [
|
|
@@ -12480,7 +12656,7 @@ ${_html.style}
|
|
|
12480
12656
|
vue.createVNode(vue.unref(bluesea.BSTextInput), {
|
|
12481
12657
|
"model-value": link.value,
|
|
12482
12658
|
width: "100%",
|
|
12483
|
-
"onUpdate:modelValue": _cache[
|
|
12659
|
+
"onUpdate:modelValue": _cache[0] || (_cache[0] = (value) => updateProperty({ link: value }))
|
|
12484
12660
|
}, null, 8, ["model-value"])
|
|
12485
12661
|
]),
|
|
12486
12662
|
vue.createElementVNode("div", _hoisted_7$2, [
|
|
@@ -12492,7 +12668,7 @@ ${_html.style}
|
|
|
12492
12668
|
vue.createVNode(vue.unref(bluesea.BSTextInput), {
|
|
12493
12669
|
"model-value": linkTarget.value,
|
|
12494
12670
|
width: "100%",
|
|
12495
|
-
"onUpdate:modelValue": _cache[
|
|
12671
|
+
"onUpdate:modelValue": _cache[1] || (_cache[1] = (value) => updateProperty({ linkTarget: value }))
|
|
12496
12672
|
}, null, 8, ["model-value"])
|
|
12497
12673
|
])
|
|
12498
12674
|
], 64)) : vue.createCommentVNode("", true),
|
|
@@ -12506,7 +12682,7 @@ ${_html.style}
|
|
|
12506
12682
|
vue.createVNode(vue.unref(bluesea.BSTextInput), {
|
|
12507
12683
|
"model-value": thumbnail.value,
|
|
12508
12684
|
width: "100%",
|
|
12509
|
-
"onUpdate:modelValue": _cache[
|
|
12685
|
+
"onUpdate:modelValue": _cache[2] || (_cache[2] = (value) => updateProperty({ thumbnail: value }))
|
|
12510
12686
|
}, null, 8, ["model-value"])
|
|
12511
12687
|
])
|
|
12512
12688
|
], 64)) : vue.createCommentVNode("", true)
|
|
@@ -12659,12 +12835,6 @@ ${_html.style}
|
|
|
12659
12835
|
caption: "Media",
|
|
12660
12836
|
propertyType: "media"
|
|
12661
12837
|
},
|
|
12662
|
-
{
|
|
12663
|
-
propertyName: "altText",
|
|
12664
|
-
caption: "Alt Text",
|
|
12665
|
-
propertyType: "text",
|
|
12666
|
-
multiLang: true
|
|
12667
|
-
},
|
|
12668
12838
|
{
|
|
12669
12839
|
propertyName: "link",
|
|
12670
12840
|
caption: "Link",
|
|
@@ -14947,7 +15117,6 @@ ${_html.style}
|
|
|
14947
15117
|
props.part.getClassNames()
|
|
14948
15118
|
];
|
|
14949
15119
|
});
|
|
14950
|
-
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
14951
15120
|
const style = vue.computed(() => {
|
|
14952
15121
|
var _a, _b;
|
|
14953
15122
|
return {
|
|
@@ -14961,6 +15130,41 @@ ${_html.style}
|
|
|
14961
15130
|
...(_b = props.part) == null ? void 0 : _b.getInlineStyles()
|
|
14962
15131
|
};
|
|
14963
15132
|
});
|
|
15133
|
+
const styleTag = vue.computed(() => props.part.getStyleTag());
|
|
15134
|
+
const partRef = vue.ref(null);
|
|
15135
|
+
function ensureStyleTag() {
|
|
15136
|
+
removeStyleTag();
|
|
15137
|
+
if (!partRef.value) return;
|
|
15138
|
+
const doc = partRef.value.ownerDocument;
|
|
15139
|
+
if (!doc || !styleTag.value) return;
|
|
15140
|
+
let styleEl = doc.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
15141
|
+
if (!styleEl) {
|
|
15142
|
+
styleEl = document.createElement("style");
|
|
15143
|
+
styleEl.setAttribute("data-part-style-id", props.part.partId);
|
|
15144
|
+
doc.head.appendChild(styleEl);
|
|
15145
|
+
}
|
|
15146
|
+
styleEl.textContent = styleTag.value;
|
|
15147
|
+
}
|
|
15148
|
+
function removeStyleTag() {
|
|
15149
|
+
if (!partRef.value) return;
|
|
15150
|
+
const doc = partRef.value.ownerDocument;
|
|
15151
|
+
if (!doc) return;
|
|
15152
|
+
const styleEl = doc.head.querySelector(`style[data-part-style-id="${props.part.partId}"]`);
|
|
15153
|
+
if (styleEl) {
|
|
15154
|
+
doc.head.removeChild(styleEl);
|
|
15155
|
+
}
|
|
15156
|
+
}
|
|
15157
|
+
vue.watch(styleTag, () => {
|
|
15158
|
+
ensureStyleTag();
|
|
15159
|
+
});
|
|
15160
|
+
vue.onMounted(() => {
|
|
15161
|
+
if (partRef.value) {
|
|
15162
|
+
ensureStyleTag();
|
|
15163
|
+
}
|
|
15164
|
+
});
|
|
15165
|
+
vue.onBeforeUnmount(() => {
|
|
15166
|
+
removeStyleTag();
|
|
15167
|
+
});
|
|
14964
15168
|
const selected = vue.computed(() => !!props.part && editor.context.isSelected(props.part));
|
|
14965
15169
|
const addSection = () => {
|
|
14966
15170
|
editor.commandRegistry.executeCommand(AddSectionCommand.COMMAND_ID, { page: props.part });
|
|
@@ -14990,39 +15194,35 @@ ${_html.style}
|
|
|
14990
15194
|
};
|
|
14991
15195
|
return (_ctx, _cache) => {
|
|
14992
15196
|
var _a, _b;
|
|
14993
|
-
return vue.openBlock(), vue.createElementBlock(
|
|
14994
|
-
|
|
14995
|
-
|
|
14996
|
-
|
|
14997
|
-
|
|
15197
|
+
return vue.openBlock(), vue.createElementBlock("div", {
|
|
15198
|
+
ref_key: "partRef",
|
|
15199
|
+
ref: partRef,
|
|
15200
|
+
class: vue.normalizeClass([classNames.value, "pb-page"]),
|
|
15201
|
+
"data-part-id": (_a = _ctx.part) == null ? void 0 : _a.partId,
|
|
15202
|
+
style: vue.normalizeStyle(style.value),
|
|
15203
|
+
onContextmenu: showContextMenu,
|
|
15204
|
+
onMousedown: vue.withModifiers(handleClick, ["stop"])
|
|
15205
|
+
}, [
|
|
14998
15206
|
vue.createElementVNode("div", {
|
|
14999
|
-
class: vue.normalizeClass([
|
|
15000
|
-
|
|
15001
|
-
style: vue.normalizeStyle(style.value),
|
|
15002
|
-
onContextmenu: showContextMenu,
|
|
15003
|
-
onMousedown: vue.withModifiers(handleClick, ["stop"])
|
|
15207
|
+
class: vue.normalizeClass([selected.value && "selected", _ctx.isMobilePage ? "mobile" : "pc", "pb-page-content"]),
|
|
15208
|
+
style: vue.normalizeStyle(contentStyle.value)
|
|
15004
15209
|
}, [
|
|
15005
|
-
vue.
|
|
15006
|
-
|
|
15007
|
-
|
|
15008
|
-
|
|
15009
|
-
|
|
15010
|
-
|
|
15011
|
-
|
|
15012
|
-
|
|
15013
|
-
|
|
15014
|
-
|
|
15015
|
-
|
|
15016
|
-
|
|
15017
|
-
|
|
15018
|
-
|
|
15019
|
-
|
|
15020
|
-
|
|
15021
|
-
}, _cache[0] || (_cache[0] = [
|
|
15022
|
-
vue.createElementVNode("i", { class: "material-icons-outlined" }, "add_circle_outline", -1)
|
|
15023
|
-
]))
|
|
15024
|
-
], 46, _hoisted_1$i)
|
|
15025
|
-
], 64);
|
|
15210
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList((_b = _ctx.part) == null ? void 0 : _b.children, (section, index) => {
|
|
15211
|
+
return vue.openBlock(), vue.createBlock(_sfc_main$A, {
|
|
15212
|
+
key: section.partId,
|
|
15213
|
+
"is-mobile-page": _ctx.isMobilePage,
|
|
15214
|
+
part: section
|
|
15215
|
+
}, null, 8, ["is-mobile-page", "part"]);
|
|
15216
|
+
}), 128))
|
|
15217
|
+
], 6),
|
|
15218
|
+
vue.createElementVNode("div", {
|
|
15219
|
+
title: "Add Section",
|
|
15220
|
+
class: "pb-add-section-handle bottom",
|
|
15221
|
+
onClick: addSection
|
|
15222
|
+
}, _cache[0] || (_cache[0] = [
|
|
15223
|
+
vue.createElementVNode("i", { class: "material-icons-outlined" }, "add_circle_outline", -1)
|
|
15224
|
+
]))
|
|
15225
|
+
], 46, _hoisted_1$i);
|
|
15026
15226
|
};
|
|
15027
15227
|
}
|
|
15028
15228
|
});
|