@g1cloud/page-builder-editor 1.0.0-alpha.32 → 1.0.0-alpha.34

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.
Files changed (19) hide show
  1. package/css/page-page.scss +3 -7
  2. package/css/page-section.scss +1 -0
  3. package/dist/PbPropertyEditorBoolean-C7-iSAtn.js +38 -0
  4. package/dist/{PbPropertyEditorColor-CQqLwB4B.js → PbPropertyEditorColor-D7_bQLN4.js} +1 -1
  5. package/dist/{PbPropertyEditorHtml-CeCp8qgN.js → PbPropertyEditorHtml-BSfmWiwq.js} +1 -1
  6. package/dist/{PbPropertyEditorImage-BIxdt8XI.js → PbPropertyEditorImage-CeAWWLQE.js} +1 -1
  7. package/dist/{PbPropertyEditorMultilineText-4sF6PJTE.js → PbPropertyEditorMultilineText-yHnhkc9I.js} +1 -1
  8. package/dist/{PbPropertyEditorNumber-DrxTz2s1.js → PbPropertyEditorNumber-TTgo0zbQ.js} +9 -2
  9. package/dist/{PbPropertyEditorText-9hf9BTum.js → PbPropertyEditorText-BcsUyRxP.js} +1 -1
  10. package/dist/{PbPropertyEditorYoutube-B-pIw-m5.js → PbPropertyEditorYoutube-Bn0DdIOD.js} +1 -1
  11. package/dist/{PbWidgetAddModal-CFwyR_Bq.js → PbWidgetAddModal-BzG-lkZp.js} +1 -1
  12. package/dist/components/sidebar/property/PbPropertyEditorBoolean.vue.d.ts +23 -0
  13. package/dist/{index-iOtzsn-m.js → index-BaB2TtF-.js} +133 -95
  14. package/dist/index.d.ts +3 -0
  15. package/dist/model/default-part-property-group.d.ts +2 -0
  16. package/dist/model/part-property.d.ts +1 -1
  17. package/dist/page-builder-editor.js +1 -1
  18. package/dist/page-builder-editor.umd.cjs +302 -220
  19. package/package.json +2 -2
package/dist/page-builder-editor.umd.cjs CHANGED
@@ -6684,80 +6684,87 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
6684
6684
  return ((_a = this.properties) == null ? void 0 : _a.classNames) || "";
6685
6685
  }
6686
6686
  getAlignStyleValue(align) {
6687
- if (align === "left") return "flex-start";
6688
- if (align === "right") return "flex-end";
6689
- return "center";
6687
+ switch (align) {
6688
+ case "start":
6689
+ return "flex-start";
6690
+ case "end":
6691
+ return "flex-end";
6692
+ case "center":
6693
+ return "center";
6694
+ case "between":
6695
+ return "space-between";
6696
+ default:
6697
+ return;
6698
+ }
6690
6699
  }
6691
6700
  getStyles(isMobilePage) {
6692
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P;
6701
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q;
6693
6702
  const style = {};
6694
- const align = ((_a = this.properties) == null ? void 0 : _a.align) || "center";
6695
- if (this.isWidget()) {
6696
- style.alignSelf = this.getAlignStyleValue(align);
6697
- } else if (this.isPage()) {
6698
- style.display = "flex";
6699
- style.flexDirection = "column";
6700
- style.alignItems = this.getAlignStyleValue(align);
6703
+ if (((_a = this.properties) == null ? void 0 : _a.direction) === "horizontal") {
6704
+ style.flexDirection = "row";
6701
6705
  } else {
6702
- const direction = isMobilePage ? (_b = this.properties) == null ? void 0 : _b.directionSm : (_c = this.properties) == null ? void 0 : _c.directionLg;
6703
- if (direction === "horizontal") {
6704
- style.display = "flex";
6705
- style.flexDirection = "row";
6706
- style.justifyContent = this.getAlignStyleValue(align);
6707
- } else if (direction === "vertical") {
6708
- style.display = "flex";
6709
- style.flexDirection = "column";
6710
- style.alignItems = this.getAlignStyleValue(align);
6711
- }
6712
- }
6713
- if (((_d = this.properties) == null ? void 0 : _d.wrap) === "wrap") {
6706
+ style.flexDirection = "column";
6707
+ }
6708
+ if (((_b = this.properties) == null ? void 0 : _b.wrap) === "wrap") {
6714
6709
  style.flexWrap = "wrap";
6715
6710
  }
6716
- if ((_e = this.properties) == null ? void 0 : _e.margin) style.margin = this.properties.margin;
6717
- if ((_f = this.properties) == null ? void 0 : _f.marginLeft) style.marginLeft = this.properties.marginLeft;
6718
- if ((_g = this.properties) == null ? void 0 : _g.marginRight) style.marginRight = this.properties.marginRight;
6719
- if ((_h = this.properties) == null ? void 0 : _h.marginTop) style.marginTop = this.properties.marginTop;
6720
- if ((_i = this.properties) == null ? void 0 : _i.marginBottom) style.marginBottom = this.properties.marginBottom;
6721
- if ((_j = this.properties) == null ? void 0 : _j.padding) style.padding = this.properties.padding;
6722
- if ((_k = this.properties) == null ? void 0 : _k.paddingLeft) style.paddingLeft = this.properties.paddingLeft;
6723
- if ((_l = this.properties) == null ? void 0 : _l.paddingRight) style.paddingRight = this.properties.paddingRight;
6724
- if ((_m = this.properties) == null ? void 0 : _m.paddingTop) style.paddingTop = this.properties.paddingTop;
6725
- if ((_n = this.properties) == null ? void 0 : _n.paddingBottom) style.paddingBottom = this.properties.paddingBottom;
6726
- if ((_o = this.properties) == null ? void 0 : _o.left) style.left = this.properties.left;
6727
- if ((_p = this.properties) == null ? void 0 : _p.right) style.right = this.properties.right;
6728
- if ((_q = this.properties) == null ? void 0 : _q.top) style.top = this.properties.top;
6729
- if ((_r = this.properties) == null ? void 0 : _r.bottom) style.bottom = this.properties.bottom;
6730
- if ((_s = this.properties) == null ? void 0 : _s.width) style.width = this.properties.width;
6731
- if ((_t = this.properties) == null ? void 0 : _t.height) style.height = this.properties.height;
6732
- if ((_u = this.properties) == null ? void 0 : _u.maxWidth) style.maxWidth = this.properties.maxWidth;
6733
- if ((_v = this.properties) == null ? void 0 : _v.maxHeight) style.maxHeight = this.properties.maxHeight;
6734
- if ((_w = this.properties) == null ? void 0 : _w.minWidth) style.minWidth = this.properties.minWidth;
6735
- if ((_x = this.properties) == null ? void 0 : _x.minHeight) style.minHeight = this.properties.minHeight;
6736
- if ((_y = this.properties) == null ? void 0 : _y.textAlign) style.textAlign = this.properties.textAlign;
6737
- if ((_z = this.properties) == null ? void 0 : _z.backgroundColor) style.backgroundColor = this.properties.backgroundColor;
6738
- if ((_A = this.properties) == null ? void 0 : _A.borderLeftWidth) style.borderLeftWidth = this.properties.borderLeftWidth;
6739
- if ((_B = this.properties) == null ? void 0 : _B.borderRightWidth) style.borderRightWidth = this.properties.borderRightWidth;
6740
- if ((_C = this.properties) == null ? void 0 : _C.borderTopWidth) style.borderTopWidth = this.properties.borderTopWidth;
6741
- if ((_D = this.properties) == null ? void 0 : _D.borderBottomWidth) style.borderBottomWidth = this.properties.borderBottomWidth;
6742
- if ((_E = this.properties) == null ? void 0 : _E.borderTopLeftRadius) style.borderTopLeftRadius = this.properties.borderTopLeftRadius;
6743
- if ((_F = this.properties) == null ? void 0 : _F.borderTopRightRadius) style.borderTopRightRadius = this.properties.borderTopRightRadius;
6744
- if ((_G = this.properties) == null ? void 0 : _G.borderBottomLeftRadius) style.borderBottomLeftRadius = this.properties.borderBottomLeftRadius;
6745
- if ((_H = this.properties) == null ? void 0 : _H.borderBottomRightRadius) style.borderBottomRightRadius = this.properties.borderBottomRightRadius;
6746
- if (((_I = this.properties) == null ? void 0 : _I.borderColor) && style.borderLeftWidth) {
6711
+ const alignItems = this.getAlignStyleValue((_c = this.properties) == null ? void 0 : _c.alignItems);
6712
+ const justifyContent = this.getAlignStyleValue((_d = this.properties) == null ? void 0 : _d.justifyContent);
6713
+ const alignSelf = this.getAlignStyleValue((_e = this.properties) == null ? void 0 : _e.alignSelf);
6714
+ if (this.isWidget()) {
6715
+ if (alignSelf) style.alignSelf = alignSelf;
6716
+ } else if (this.isPage()) {
6717
+ if (alignItems) style.alignItems = alignItems;
6718
+ } else {
6719
+ if (alignItems) style.alignItems = alignItems;
6720
+ if (justifyContent) style.justifyContent = justifyContent;
6721
+ if (alignSelf) style.alignSelf = alignSelf;
6722
+ }
6723
+ if ((_f = this.properties) == null ? void 0 : _f.margin) style.margin = this.properties.margin;
6724
+ if ((_g = this.properties) == null ? void 0 : _g.marginLeft) style.marginLeft = this.properties.marginLeft;
6725
+ if ((_h = this.properties) == null ? void 0 : _h.marginRight) style.marginRight = this.properties.marginRight;
6726
+ if ((_i = this.properties) == null ? void 0 : _i.marginTop) style.marginTop = this.properties.marginTop;
6727
+ if ((_j = this.properties) == null ? void 0 : _j.marginBottom) style.marginBottom = this.properties.marginBottom;
6728
+ if ((_k = this.properties) == null ? void 0 : _k.padding) style.padding = this.properties.padding;
6729
+ if ((_l = this.properties) == null ? void 0 : _l.paddingLeft) style.paddingLeft = this.properties.paddingLeft;
6730
+ if ((_m = this.properties) == null ? void 0 : _m.paddingRight) style.paddingRight = this.properties.paddingRight;
6731
+ if ((_n = this.properties) == null ? void 0 : _n.paddingTop) style.paddingTop = this.properties.paddingTop;
6732
+ if ((_o = this.properties) == null ? void 0 : _o.paddingBottom) style.paddingBottom = this.properties.paddingBottom;
6733
+ if ((_p = this.properties) == null ? void 0 : _p.left) style.left = this.properties.left;
6734
+ if ((_q = this.properties) == null ? void 0 : _q.right) style.right = this.properties.right;
6735
+ if ((_r = this.properties) == null ? void 0 : _r.top) style.top = this.properties.top;
6736
+ if ((_s = this.properties) == null ? void 0 : _s.bottom) style.bottom = this.properties.bottom;
6737
+ if ((_t = this.properties) == null ? void 0 : _t.width) style.width = this.properties.width;
6738
+ if ((_u = this.properties) == null ? void 0 : _u.height) style.height = this.properties.height;
6739
+ if ((_v = this.properties) == null ? void 0 : _v.maxWidth) style.maxWidth = this.properties.maxWidth;
6740
+ if ((_w = this.properties) == null ? void 0 : _w.maxHeight) style.maxHeight = this.properties.maxHeight;
6741
+ if ((_x = this.properties) == null ? void 0 : _x.minWidth) style.minWidth = this.properties.minWidth;
6742
+ if ((_y = this.properties) == null ? void 0 : _y.minHeight) style.minHeight = this.properties.minHeight;
6743
+ if ((_z = this.properties) == null ? void 0 : _z.textAlign) style.textAlign = this.properties.textAlign;
6744
+ if ((_A = this.properties) == null ? void 0 : _A.backgroundColor) style.backgroundColor = this.properties.backgroundColor;
6745
+ if ((_B = this.properties) == null ? void 0 : _B.borderLeftWidth) style.borderLeftWidth = this.properties.borderLeftWidth;
6746
+ if ((_C = this.properties) == null ? void 0 : _C.borderRightWidth) style.borderRightWidth = this.properties.borderRightWidth;
6747
+ if ((_D = this.properties) == null ? void 0 : _D.borderTopWidth) style.borderTopWidth = this.properties.borderTopWidth;
6748
+ if ((_E = this.properties) == null ? void 0 : _E.borderBottomWidth) style.borderBottomWidth = this.properties.borderBottomWidth;
6749
+ if ((_F = this.properties) == null ? void 0 : _F.borderTopLeftRadius) style.borderTopLeftRadius = this.properties.borderTopLeftRadius;
6750
+ if ((_G = this.properties) == null ? void 0 : _G.borderTopRightRadius) style.borderTopRightRadius = this.properties.borderTopRightRadius;
6751
+ if ((_H = this.properties) == null ? void 0 : _H.borderBottomLeftRadius) style.borderBottomLeftRadius = this.properties.borderBottomLeftRadius;
6752
+ if ((_I = this.properties) == null ? void 0 : _I.borderBottomRightRadius) style.borderBottomRightRadius = this.properties.borderBottomRightRadius;
6753
+ if (((_J = this.properties) == null ? void 0 : _J.borderColor) && style.borderLeftWidth) {
6747
6754
  style.borderLeftStyle = "solid";
6748
- style.borderLeftColor = (_J = this.properties) == null ? void 0 : _J.borderColor;
6755
+ style.borderLeftColor = (_K = this.properties) == null ? void 0 : _K.borderColor;
6749
6756
  }
6750
- if (((_K = this.properties) == null ? void 0 : _K.borderColor) && style.borderRightWidth) {
6757
+ if (((_L = this.properties) == null ? void 0 : _L.borderColor) && style.borderRightWidth) {
6751
6758
  style.borderRightStyle = "solid";
6752
- style.borderRightColor = (_L = this.properties) == null ? void 0 : _L.borderColor;
6759
+ style.borderRightColor = (_M = this.properties) == null ? void 0 : _M.borderColor;
6753
6760
  }
6754
- if (((_M = this.properties) == null ? void 0 : _M.borderColor) && style.borderTopWidth) {
6761
+ if (((_N = this.properties) == null ? void 0 : _N.borderColor) && style.borderTopWidth) {
6755
6762
  style.borderTopStyle = "solid";
6756
- style.borderTopColor = (_N = this.properties) == null ? void 0 : _N.borderColor;
6763
+ style.borderTopColor = (_O = this.properties) == null ? void 0 : _O.borderColor;
6757
6764
  }
6758
- if (((_O = this.properties) == null ? void 0 : _O.borderColor) && style.borderBottomWidth) {
6765
+ if (((_P = this.properties) == null ? void 0 : _P.borderColor) && style.borderBottomWidth) {
6759
6766
  style.borderBottomStyle = "solid";
6760
- style.borderBottomColor = (_P = this.properties) == null ? void 0 : _P.borderColor;
6767
+ style.borderBottomColor = (_Q = this.properties) == null ? void 0 : _Q.borderColor;
6761
6768
  }
6762
6769
  return style;
6763
6770
  }
@@ -7289,7 +7296,7 @@ ${_html.style}
7289
7296
  plugin.widgets.forEach((v) => {
7290
7297
  const w = { ...v };
7291
7298
  w.partType = "Widget";
7292
- w.creator = () => _sfc_main$D;
7299
+ w.creator = () => _sfc_main$E;
7293
7300
  partDefinitions$1[v.partName] = w;
7294
7301
  });
7295
7302
  }
@@ -7499,7 +7506,7 @@ ${_html.style}
7499
7506
  };
7500
7507
  }
7501
7508
  });
7502
- const _hoisted_1$G = {
7509
+ const _hoisted_1$H = {
7503
7510
  key: 1,
7504
7511
  class: "placeholder",
7505
7512
  textContent: "Empty Widget"
@@ -7520,11 +7527,11 @@ ${_html.style}
7520
7527
  key: child.part.partId,
7521
7528
  part: child.part
7522
7529
  }, null, 8, ["part"]);
7523
- }), 128)) : _ctx.placeholder ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$G)) : vue.createCommentVNode("", true);
7530
+ }), 128)) : _ctx.placeholder ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$H)) : vue.createCommentVNode("", true);
7524
7531
  };
7525
7532
  }
7526
7533
  });
7527
- const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
7534
+ const _sfc_main$E = /* @__PURE__ */ vue.defineComponent({
7528
7535
  __name: "PbCustomWidget",
7529
7536
  props: {
7530
7537
  part: {},
@@ -8124,6 +8131,7 @@ ${_html.style}
8124
8131
  "readonly-text": () => vue.defineAsyncComponent(() => Promise.resolve().then(() => PbPropertyEditorReadonlyText)),
8125
8132
  "text": () => vue.defineAsyncComponent(() => Promise.resolve().then(() => PbPropertyEditorText)),
8126
8133
  "number": () => vue.defineAsyncComponent(() => Promise.resolve().then(() => PbPropertyEditorNumber)),
8134
+ "boolean": () => vue.defineAsyncComponent(() => Promise.resolve().then(() => PbPropertyEditorBoolean)),
8127
8135
  "multiline-text": () => vue.defineAsyncComponent(() => Promise.resolve().then(() => PbPropertyEditorMultilineText)),
8128
8136
  "select": () => vue.defineAsyncComponent(() => Promise.resolve().then(() => PbPropertyEditorSelect)),
8129
8137
  "color": () => vue.defineAsyncComponent(() => Promise.resolve().then(() => PbPropertyEditorColor)),
@@ -8369,11 +8377,7 @@ ${_html.style}
8369
8377
  style.height = height || "";
8370
8378
  };
8371
8379
  const getLayoutDirection = (isMobilePage, properties) => {
8372
- if (isMobilePage) {
8373
- return properties && properties.directionSm || "vertical";
8374
- } else {
8375
- return properties && properties.directionLg || "horizontal";
8376
- }
8380
+ return properties && properties.direction || (isMobilePage ? "vertical" : "horizontal");
8377
8381
  };
8378
8382
  const _export_sfc = (sfc, props) => {
8379
8383
  const target = sfc.__vccOpts || sfc;
@@ -8382,10 +8386,10 @@ ${_html.style}
8382
8386
  }
8383
8387
  return target;
8384
8388
  };
8385
- const _sfc_main$C = {};
8386
- const _hoisted_1$F = { class: "pb-add-widget-button" };
8389
+ const _sfc_main$D = {};
8390
+ const _hoisted_1$G = { class: "pb-add-widget-button" };
8387
8391
  function _sfc_render$1(_ctx, _cache) {
8388
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$F, [
8392
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$G, [
8389
8393
  vue.createElementVNode("button", {
8390
8394
  onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("add-widget", $event))
8391
8395
  }, _cache[1] || (_cache[1] = [
@@ -8394,7 +8398,7 @@ ${_html.style}
8394
8398
  ]))
8395
8399
  ]);
8396
8400
  }
8397
- const PbAddWidgetButton = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["render", _sfc_render$1]]);
8401
+ const PbAddWidgetButton = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["render", _sfc_render$1]]);
8398
8402
  const MOUSE_TRACKER_KEY = "mouseTracker";
8399
8403
  const MOUSE_TRACKER_NOT_FOUND = "MouseTracker not found";
8400
8404
  class MouseTracker {
@@ -8422,8 +8426,8 @@ ${_html.style}
8422
8426
  if (!mouseTracker) throw Error(MOUSE_TRACKER_NOT_FOUND);
8423
8427
  return mouseTracker;
8424
8428
  };
8425
- const _hoisted_1$E = ["data-part-id", "draggable"];
8426
- const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
8429
+ const _hoisted_1$F = ["data-part-id", "draggable"];
8430
+ const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
8427
8431
  __name: "PbWidget",
8428
8432
  props: {
8429
8433
  part: {},
@@ -8859,15 +8863,15 @@ ${_html.style}
8859
8863
  class: "resize-handle",
8860
8864
  onMousedown: resizeChild
8861
8865
  }, null, 32)) : vue.createCommentVNode("", true)
8862
- ], 14, _hoisted_1$E)), [
8866
+ ], 14, _hoisted_1$F)), [
8863
8867
  [vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
8864
8868
  ])
8865
8869
  ], 64);
8866
8870
  };
8867
8871
  }
8868
8872
  });
8869
- const _hoisted_1$D = ["data-part-id"];
8870
- const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
8873
+ const _hoisted_1$E = ["data-part-id"];
8874
+ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
8871
8875
  __name: "PbBlock",
8872
8876
  props: {
8873
8877
  part: {},
@@ -9057,27 +9061,27 @@ ${_html.style}
9057
9061
  onAddWidget: addWidget
9058
9062
  })) : vue.createCommentVNode("", true),
9059
9063
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.part.children, (child) => {
9060
- return vue.openBlock(), vue.createBlock(_sfc_main$B, {
9064
+ return vue.openBlock(), vue.createBlock(_sfc_main$C, {
9061
9065
  key: child.partId,
9062
9066
  part: child
9063
9067
  }, null, 8, ["part"]);
9064
9068
  }), 128))
9065
- ], 16, _hoisted_1$D)), [
9069
+ ], 16, _hoisted_1$E)), [
9066
9070
  [vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
9067
9071
  ])
9068
9072
  ], 64);
9069
9073
  };
9070
9074
  }
9071
9075
  });
9072
- const _hoisted_1$C = { class: "pb-block" };
9073
- const _sfc_main$z = /* @__PURE__ */ vue.defineComponent({
9076
+ const _hoisted_1$D = { class: "pb-block" };
9077
+ const _sfc_main$A = /* @__PURE__ */ vue.defineComponent({
9074
9078
  __name: "PbLoginDepart",
9075
9079
  props: {
9076
9080
  part: {}
9077
9081
  },
9078
9082
  setup(__props) {
9079
9083
  return (_ctx, _cache) => {
9080
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$C, _cache[0] || (_cache[0] = [
9084
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$D, _cache[0] || (_cache[0] = [
9081
9085
  vue.createElementVNode("div", {
9082
9086
  class: "pb-widget",
9083
9087
  style: { "margin": "0 auto" }
@@ -9090,8 +9094,8 @@ ${_html.style}
9090
9094
  };
9091
9095
  }
9092
9096
  });
9093
- const _hoisted_1$B = ["data-part-id"];
9094
- const _sfc_main$y = /* @__PURE__ */ vue.defineComponent({
9097
+ const _hoisted_1$C = ["data-part-id"];
9098
+ const _sfc_main$z = /* @__PURE__ */ vue.defineComponent({
9095
9099
  __name: "PbSection",
9096
9100
  props: {
9097
9101
  part: {},
@@ -9201,13 +9205,13 @@ ${_html.style}
9201
9205
  style: (_a = _ctx.part.properties) == null ? void 0 : _a.css
9202
9206
  }, properties.value), [
9203
9207
  ((_b = _ctx.part.properties) == null ? void 0 : _b.sectionType) === "static" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
9204
- ((_c = _ctx.part.properties) == null ? void 0 : _c.name) === "Login Design Part" ? (vue.openBlock(), vue.createBlock(_sfc_main$z, {
9208
+ ((_c = _ctx.part.properties) == null ? void 0 : _c.name) === "Login Design Part" ? (vue.openBlock(), vue.createBlock(_sfc_main$A, {
9205
9209
  key: 0,
9206
9210
  part: _ctx.part
9207
9211
  }, null, 8, ["part"])) : vue.createCommentVNode("", true)
9208
9212
  ], 64)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
9209
9213
  _ctx.part.children && _ctx.part.children.length > 0 ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.part.children, (block) => {
9210
- return vue.openBlock(), vue.createBlock(_sfc_main$A, {
9214
+ return vue.openBlock(), vue.createBlock(_sfc_main$B, {
9211
9215
  key: block.partId,
9212
9216
  "is-mobile-page": _ctx.isMobilePage,
9213
9217
  part: block
@@ -9217,21 +9221,21 @@ ${_html.style}
9217
9221
  onAddWidget: addWidget
9218
9222
  }))
9219
9223
  ], 64))
9220
- ], 16, _hoisted_1$B)), [
9224
+ ], 16, _hoisted_1$C)), [
9221
9225
  [vue.unref(vPartHandler), { pageBuilder: vue.unref(pageBuilder), part: _ctx.part, droppable: true, locatePositionMark, calculateDropIndex, acceptChildPart }]
9222
9226
  ])
9223
9227
  ], 64);
9224
9228
  };
9225
9229
  }
9226
9230
  });
9227
- const _hoisted_1$A = { class: "group-editor group-editor-position" };
9231
+ const _hoisted_1$B = { class: "group-editor group-editor-position" };
9228
9232
  const _hoisted_2$s = { class: "flex-align-center" };
9229
9233
  const _hoisted_3$n = { class: "flex-grow-1" };
9230
9234
  const _hoisted_4$d = { class: "bg-gray-100 py-5 rounded-8" };
9231
9235
  const _hoisted_5$7 = { class: "text-center" };
9232
9236
  const _hoisted_6$7 = { class: "bs-layout-horizontal justify-content-center align-items-center" };
9233
9237
  const _hoisted_7$6 = { class: "text-center" };
9234
- const _sfc_main$x = /* @__PURE__ */ vue.defineComponent({
9238
+ const _sfc_main$y = /* @__PURE__ */ vue.defineComponent({
9235
9239
  __name: "PbPropertyGroupEditorPosition",
9236
9240
  props: {
9237
9241
  group: {},
@@ -9255,7 +9259,7 @@ ${_html.style}
9255
9259
  const updateTop = (value) => updatePropertyValue({ top: value });
9256
9260
  const updateBottom = (value) => updatePropertyValue({ bottom: value });
9257
9261
  return (_ctx, _cache) => {
9258
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$A, [
9262
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$B, [
9259
9263
  vue.createElementVNode("div", _hoisted_2$s, [
9260
9264
  _cache[1] || (_cache[1] = vue.createElementVNode("div", { class: "title" }, [
9261
9265
  vue.createElementVNode("label", { textContent: "Position" })
@@ -9309,14 +9313,14 @@ ${_html.style}
9309
9313
  };
9310
9314
  }
9311
9315
  });
9312
- const _hoisted_1$z = { class: "group-editor group-editor-size" };
9316
+ const _hoisted_1$A = { class: "group-editor group-editor-size" };
9313
9317
  const _hoisted_2$r = { class: "flex-align-center" };
9314
9318
  const _hoisted_3$m = { class: "flex-grow-1 bs-layout-horizontal" };
9315
9319
  const _hoisted_4$c = { class: "flex-align-center mt-12" };
9316
9320
  const _hoisted_5$6 = { class: "flex-grow-1 bs-layout-horizontal" };
9317
9321
  const _hoisted_6$6 = { class: "flex-align-center mt-12" };
9318
9322
  const _hoisted_7$5 = { class: "flex-grow-1 bs-layout-horizontal" };
9319
- const _sfc_main$w = /* @__PURE__ */ vue.defineComponent({
9323
+ const _sfc_main$x = /* @__PURE__ */ vue.defineComponent({
9320
9324
  __name: "PbPropertyGroupEditorSize",
9321
9325
  props: {
9322
9326
  group: {},
@@ -9344,7 +9348,7 @@ ${_html.style}
9344
9348
  const updateMinWidth = (value) => updatePropertyValue({ minWidth: value });
9345
9349
  const updateMinHeight = (value) => updatePropertyValue({ minHeight: value });
9346
9350
  return (_ctx, _cache) => {
9347
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$z, [
9351
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$A, [
9348
9352
  vue.createElementVNode("div", _hoisted_2$r, [
9349
9353
  _cache[0] || (_cache[0] = vue.createElementVNode("div", { class: "title" }, [
9350
9354
  vue.createElementVNode("label", { textContent: "Size" })
@@ -9562,7 +9566,7 @@ ${_html.style}
9562
9566
  }
9563
9567
  }
9564
9568
  };
9565
- const _hoisted_1$y = { class: "vc-alpha" };
9569
+ const _hoisted_1$z = { class: "vc-alpha" };
9566
9570
  const _hoisted_2$q = { class: "vc-alpha-checkboard-wrap" };
9567
9571
  const _hoisted_3$l = /* @__PURE__ */ vue.createElementVNode(
9568
9572
  "div",
@@ -9576,7 +9580,7 @@ ${_html.style}
9576
9580
  ];
9577
9581
  function render$4(_ctx, _cache, $props, $setup, $data, $options) {
9578
9582
  const _component_Checkboard = vue.resolveComponent("Checkboard");
9579
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$y, [
9583
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$z, [
9580
9584
  vue.createElementVNode("div", _hoisted_2$q, [
9581
9585
  vue.createVNode(_component_Checkboard)
9582
9586
  ]),
@@ -10680,12 +10684,12 @@ ${_html.style}
10680
10684
  // }
10681
10685
  }
10682
10686
  };
10683
- const _hoisted_1$x = { class: "vc-editable-input" };
10687
+ const _hoisted_1$y = { class: "vc-editable-input" };
10684
10688
  const _hoisted_2$p = ["aria-labelledby"];
10685
10689
  const _hoisted_3$k = ["id", "for"];
10686
10690
  const _hoisted_4$a = { class: "vc-input__desc" };
10687
10691
  function render$3(_ctx, _cache, $props, $setup, $data, $options) {
10688
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$x, [
10692
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$y, [
10689
10693
  vue.withDirectives(vue.createElementVNode("input", {
10690
10694
  ref: "input",
10691
10695
  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => $options.val = $event),
@@ -10780,7 +10784,7 @@ ${_html.style}
10780
10784
  }
10781
10785
  }
10782
10786
  };
10783
- const _hoisted_1$w = /* @__PURE__ */ vue.createElementVNode(
10787
+ const _hoisted_1$x = /* @__PURE__ */ vue.createElementVNode(
10784
10788
  "div",
10785
10789
  { class: "vc-saturation--white" },
10786
10790
  null,
@@ -10816,7 +10820,7 @@ ${_html.style}
10816
10820
  onTouchstart: _cache[2] || (_cache[2] = (...args) => $options.handleChange && $options.handleChange(...args))
10817
10821
  },
10818
10822
  [
10819
- _hoisted_1$w,
10823
+ _hoisted_1$x,
10820
10824
  _hoisted_2$o,
10821
10825
  vue.createElementVNode(
10822
10826
  "div",
@@ -10965,7 +10969,7 @@ ${_html.style}
10965
10969
  }
10966
10970
  }
10967
10971
  };
10968
- const _hoisted_1$v = ["aria-valuenow"];
10972
+ const _hoisted_1$w = ["aria-valuenow"];
10969
10973
  const _hoisted_2$n = /* @__PURE__ */ vue.createElementVNode(
10970
10974
  "div",
10971
10975
  { class: "vc-hue-picker" },
@@ -11005,7 +11009,7 @@ ${_html.style}
11005
11009
  4
11006
11010
  /* STYLE */
11007
11011
  )
11008
- ], 40, _hoisted_1$v)
11012
+ ], 40, _hoisted_1$w)
11009
11013
  ],
11010
11014
  2
11011
11015
  /* CLASS */
@@ -11101,7 +11105,7 @@ ${_html.style}
11101
11105
  }
11102
11106
  }
11103
11107
  };
11104
- const _hoisted_1$u = { class: "vc-sketch-saturation-wrap" };
11108
+ const _hoisted_1$v = { class: "vc-sketch-saturation-wrap" };
11105
11109
  const _hoisted_2$m = { class: "vc-sketch-controls" };
11106
11110
  const _hoisted_3$h = { class: "vc-sketch-sliders" };
11107
11111
  const _hoisted_4$8 = { class: "vc-sketch-hue-wrap" };
@@ -11144,7 +11148,7 @@ ${_html.style}
11144
11148
  class: vue.normalizeClass(["vc-sketch", [$props.disableAlpha ? "vc-sketch__disable-alpha" : ""]])
11145
11149
  },
11146
11150
  [
11147
- vue.createElementVNode("div", _hoisted_1$u, [
11151
+ vue.createElementVNode("div", _hoisted_1$v, [
11148
11152
  vue.createVNode(_component_Saturation, {
11149
11153
  value: _ctx.colors,
11150
11154
  onChange: $options.childChange
@@ -11256,7 +11260,7 @@ ${_html.style}
11256
11260
  script.render = render;
11257
11261
  script.__file = "src/components/sketch/sketch.vue";
11258
11262
  script.install = install;
11259
- const _sfc_main$v = vue.defineComponent({
11263
+ const _sfc_main$w = vue.defineComponent({
11260
11264
  name: "PbColorPicker",
11261
11265
  components: {
11262
11266
  Sketch: script
@@ -11316,7 +11320,7 @@ ${_html.style}
11316
11320
  };
11317
11321
  }
11318
11322
  });
11319
- const _hoisted_1$t = { class: "buttons" };
11323
+ const _hoisted_1$u = { class: "buttons" };
11320
11324
  const _hoisted_2$l = { class: "sketch-wrap" };
11321
11325
  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
11322
11326
  const _component_Sketch = vue.resolveComponent("Sketch");
@@ -11326,7 +11330,7 @@ ${_html.style}
11326
11330
  onKeydown: _cache[3] || (_cache[3] = vue.withModifiers(() => {
11327
11331
  }, ["stop"]))
11328
11332
  }, [
11329
- vue.createElementVNode("div", _hoisted_1$t, [
11333
+ vue.createElementVNode("div", _hoisted_1$u, [
11330
11334
  vue.renderSlot(_ctx.$slots, "button", vue.normalizeProps(vue.guardReactiveProps({ toggle: _ctx.toggle, color: _ctx.color })), () => [
11331
11335
  vue.createElementVNode("button", {
11332
11336
  class: vue.normalizeClass([{ none: !_ctx.color }, "picker-button"]),
@@ -11353,12 +11357,12 @@ ${_html.style}
11353
11357
  [_directive_click_outside, () => _ctx.toggle(false)]
11354
11358
  ]);
11355
11359
  }
11356
- const PbColorPicker = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["render", _sfc_render]]);
11357
- const _hoisted_1$s = { class: "group-editor group-editor-background" };
11360
+ const PbColorPicker = /* @__PURE__ */ _export_sfc(_sfc_main$w, [["render", _sfc_render]]);
11361
+ const _hoisted_1$t = { class: "group-editor group-editor-background" };
11358
11362
  const _hoisted_2$k = { class: "flex-align-center" };
11359
11363
  const _hoisted_3$g = { class: "bs-layout-horizontal" };
11360
11364
  const _hoisted_4$7 = { class: "color" };
11361
- const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
11365
+ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
11362
11366
  __name: "PbPropertyGroupEditorBackground",
11363
11367
  props: {
11364
11368
  group: {},
@@ -11391,7 +11395,7 @@ ${_html.style}
11391
11395
  }
11392
11396
  };
11393
11397
  return (_ctx, _cache) => {
11394
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$s, [
11398
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$t, [
11395
11399
  vue.createElementVNode("div", _hoisted_2$k, [
11396
11400
  _cache[3] || (_cache[3] = vue.createElementVNode("div", { class: "title" }, [
11397
11401
  vue.createElementVNode("label", { textContent: "Background" })
@@ -11426,7 +11430,7 @@ ${_html.style}
11426
11430
  const TopRightCornerIcon = "data:image/svg+xml,%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Transformed%20by:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20fill='%23000000'%3e%3cg%20id='SVGRepo_bgCarrier'%20stroke-width='0'/%3e%3cg%20id='SVGRepo_tracerCarrier'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cg%20id='SVGRepo_iconCarrier'%3e%3cg%3e%3cpath%20fill='none'%20d='M0%200H24V24H0z'/%3e%3cpath%20d='M21%2019v2h-2v-2h2zm-4%200v2h-2v-2h2zm-4%200v2h-2v-2h2zm-4%200v2H7v-2h2zm-4%200v2H3v-2h2zm16-4v2h-2v-2h2zM5%2015v2H3v-2h2zm0-4v2H3v-2h2zm11-8c2.687%200%204.882%202.124%204.995%204.783L21%208v5h-2V8c0-1.591-1.255-2.903-2.824-2.995L16%205h-5V3h5zM5%207v2H3V7h2zm0-4v2H3V3h2zm4%200v2H7V3h2z'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e";
11427
11431
  const BottomLeftCornerIcon = "data:image/svg+xml,%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Transformed%20by:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20fill='%23000000'%20transform='rotate(180)'%3e%3cg%20id='SVGRepo_bgCarrier'%20stroke-width='0'/%3e%3cg%20id='SVGRepo_tracerCarrier'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cg%20id='SVGRepo_iconCarrier'%3e%3cg%3e%3cpath%20fill='none'%20d='M0%200H24V24H0z'/%3e%3cpath%20d='M21%2019v2h-2v-2h2zm-4%200v2h-2v-2h2zm-4%200v2h-2v-2h2zm-4%200v2H7v-2h2zm-4%200v2H3v-2h2zm16-4v2h-2v-2h2zM5%2015v2H3v-2h2zm0-4v2H3v-2h2zm11-8c2.687%200%204.882%202.124%204.995%204.783L21%208v5h-2V8c0-1.591-1.255-2.903-2.824-2.995L16%205h-5V3h5zM5%207v2H3V7h2zm0-4v2H3V3h2zm4%200v2H7V3h2z'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e";
11428
11432
  const BottomRightCornerIcon = "data:image/svg+xml,%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Transformed%20by:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%2024%2024'%20xmlns='http://www.w3.org/2000/svg'%20fill='%23000000'%20transform='rotate(90)'%3e%3cg%20id='SVGRepo_bgCarrier'%20stroke-width='0'/%3e%3cg%20id='SVGRepo_tracerCarrier'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cg%20id='SVGRepo_iconCarrier'%3e%3cg%3e%3cpath%20fill='none'%20d='M0%200H24V24H0z'/%3e%3cpath%20d='M21%2019v2h-2v-2h2zm-4%200v2h-2v-2h2zm-4%200v2h-2v-2h2zm-4%200v2H7v-2h2zm-4%200v2H3v-2h2zm16-4v2h-2v-2h2zM5%2015v2H3v-2h2zm0-4v2H3v-2h2zm11-8c2.687%200%204.882%202.124%204.995%204.783L21%208v5h-2V8c0-1.591-1.255-2.903-2.824-2.995L16%205h-5V3h5zM5%207v2H3V7h2zm0-4v2H3V3h2zm4%200v2H7V3h2z'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e";
11429
- const _hoisted_1$r = { class: "group-editor group-editor-border" };
11433
+ const _hoisted_1$s = { class: "group-editor group-editor-border" };
11430
11434
  const _hoisted_2$j = { class: "flex-align-center" };
11431
11435
  const _hoisted_3$f = { class: "" };
11432
11436
  const _hoisted_4$6 = { class: "color" };
@@ -11441,7 +11445,7 @@ ${_html.style}
11441
11445
  const _hoisted_13 = { class: "bg-gray-100 py-5 rounded-8" };
11442
11446
  const _hoisted_14 = { class: "" };
11443
11447
  const _hoisted_15 = { class: "mt-2" };
11444
- const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
11448
+ const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
11445
11449
  __name: "PbPropertyGroupEditorBorder",
11446
11450
  props: {
11447
11451
  group: {},
@@ -11479,7 +11483,7 @@ ${_html.style}
11479
11483
  const updateBorderBottomLeftRadius = (value) => updatePropertyValue({ borderBottomLeftRadius: value });
11480
11484
  const updateBorderBottomRightRadius = (value) => updatePropertyValue({ borderBottomRightRadius: value });
11481
11485
  return (_ctx, _cache) => {
11482
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$r, [
11486
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$s, [
11483
11487
  vue.createElementVNode("div", _hoisted_2$j, [
11484
11488
  _cache[7] || (_cache[7] = vue.createElementVNode("div", { class: "title" }, [
11485
11489
  vue.createElementVNode("label", { textContent: "Border" })
@@ -11601,14 +11605,14 @@ ${_html.style}
11601
11605
  };
11602
11606
  }
11603
11607
  });
11604
- const _hoisted_1$q = { class: "group-editor group-editor-margin" };
11608
+ const _hoisted_1$r = { class: "group-editor group-editor-margin" };
11605
11609
  const _hoisted_2$i = { class: "flex-align-center" };
11606
11610
  const _hoisted_3$e = { class: "flex-grow-1" };
11607
11611
  const _hoisted_4$5 = { class: "bg-gray-100 py-5 rounded-8" };
11608
11612
  const _hoisted_5$3 = { class: "text-center" };
11609
11613
  const _hoisted_6$3 = { class: "bs-layout-horizontal justify-content-center align-items-center" };
11610
11614
  const _hoisted_7$2 = { class: "text-center" };
11611
- const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
11615
+ const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
11612
11616
  __name: "PbPropertyGroupEditorMargin",
11613
11617
  props: {
11614
11618
  group: {},
@@ -11632,7 +11636,7 @@ ${_html.style}
11632
11636
  const updateTop = (value) => updatePropertyValue({ marginTop: value });
11633
11637
  const updateBottom = (value) => updatePropertyValue({ marginBottom: value });
11634
11638
  return (_ctx, _cache) => {
11635
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [
11639
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$r, [
11636
11640
  vue.createElementVNode("div", _hoisted_2$i, [
11637
11641
  _cache[1] || (_cache[1] = vue.createElementVNode("div", { class: "title" }, [
11638
11642
  vue.createElementVNode("label", { textContent: "Margin" })
@@ -11686,14 +11690,14 @@ ${_html.style}
11686
11690
  };
11687
11691
  }
11688
11692
  });
11689
- const _hoisted_1$p = { class: "group-editor group-editor-padding" };
11693
+ const _hoisted_1$q = { class: "group-editor group-editor-padding" };
11690
11694
  const _hoisted_2$h = { class: "flex-align-center" };
11691
11695
  const _hoisted_3$d = { class: "flex-grow-1" };
11692
11696
  const _hoisted_4$4 = { class: "bg-gray-100 py-5 rounded-8" };
11693
11697
  const _hoisted_5$2 = { class: "text-center" };
11694
11698
  const _hoisted_6$2 = { class: "bs-layout-horizontal justify-content-center align-items-center" };
11695
11699
  const _hoisted_7$1 = { class: "text-center" };
11696
- const _sfc_main$r = /* @__PURE__ */ vue.defineComponent({
11700
+ const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
11697
11701
  __name: "PbPropertyGroupEditorPadding",
11698
11702
  props: {
11699
11703
  group: {},
@@ -11717,7 +11721,7 @@ ${_html.style}
11717
11721
  const updateTop = (value) => updatePropertyValue({ paddingTop: value });
11718
11722
  const updateBottom = (value) => updatePropertyValue({ paddingBottom: value });
11719
11723
  return (_ctx, _cache) => {
11720
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$p, [
11724
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [
11721
11725
  vue.createElementVNode("div", _hoisted_2$h, [
11722
11726
  _cache[1] || (_cache[1] = vue.createElementVNode("div", { class: "title" }, [
11723
11727
  vue.createElementVNode("label", { textContent: "Padding" })
@@ -11797,7 +11801,7 @@ ${_html.style}
11797
11801
  propertyType: "text"
11798
11802
  }
11799
11803
  ],
11800
- propertyGroupEditor: () => _sfc_main$x
11804
+ propertyGroupEditor: () => _sfc_main$y
11801
11805
  };
11802
11806
  };
11803
11807
  const sizeGroup = () => {
@@ -11836,7 +11840,7 @@ ${_html.style}
11836
11840
  propertyType: "text"
11837
11841
  }
11838
11842
  ],
11839
- propertyGroupEditor: () => _sfc_main$w
11843
+ propertyGroupEditor: () => _sfc_main$x
11840
11844
  };
11841
11845
  };
11842
11846
  const marginGroup = () => {
@@ -11865,7 +11869,7 @@ ${_html.style}
11865
11869
  propertyType: "text"
11866
11870
  }
11867
11871
  ],
11868
- propertyGroupEditor: () => _sfc_main$s
11872
+ propertyGroupEditor: () => _sfc_main$t
11869
11873
  };
11870
11874
  };
11871
11875
  const paddingGroup = () => {
@@ -11894,7 +11898,7 @@ ${_html.style}
11894
11898
  propertyType: "text"
11895
11899
  }
11896
11900
  ],
11897
- propertyGroupEditor: () => _sfc_main$r
11901
+ propertyGroupEditor: () => _sfc_main$s
11898
11902
  };
11899
11903
  };
11900
11904
  const commonGroup = () => {
@@ -11941,14 +11945,8 @@ ${_html.style}
11941
11945
  caption: "Layout",
11942
11946
  properties: [
11943
11947
  {
11944
- propertyName: "directionSm",
11945
- caption: "Direction for Mobile (<= 768px)",
11946
- propertyType: "select",
11947
- params: "vertical,horizontal"
11948
- },
11949
- {
11950
- propertyName: "directionLg",
11951
- caption: "Direction for PC (> 768px)",
11948
+ propertyName: "direction",
11949
+ caption: "Layout",
11952
11950
  propertyType: "select",
11953
11951
  params: "vertical,horizontal"
11954
11952
  },
@@ -11967,10 +11965,50 @@ ${_html.style}
11967
11965
  caption: "Align",
11968
11966
  properties: [
11969
11967
  {
11970
- propertyName: "align",
11971
- caption: "Align",
11968
+ propertyName: "alignItems",
11969
+ caption: "Align Items",
11970
+ propertyType: "select",
11971
+ params: "start,center,end"
11972
+ },
11973
+ {
11974
+ propertyName: "justifyContent",
11975
+ caption: "Justify Content",
11976
+ propertyType: "select",
11977
+ params: "start,center,end,between"
11978
+ },
11979
+ {
11980
+ propertyName: "alignSelf",
11981
+ caption: "Align Self",
11982
+ propertyType: "select",
11983
+ params: "start,center,end"
11984
+ }
11985
+ ]
11986
+ };
11987
+ };
11988
+ const alignItemsGroup = () => {
11989
+ return {
11990
+ groupName: "align",
11991
+ caption: "Align",
11992
+ properties: [
11993
+ {
11994
+ propertyName: "alignItems",
11995
+ caption: "Align Items",
11972
11996
  propertyType: "select",
11973
- params: "left,center,right"
11997
+ params: "start,center,end"
11998
+ }
11999
+ ]
12000
+ };
12001
+ };
12002
+ const alignSelfGroup = () => {
12003
+ return {
12004
+ groupName: "align",
12005
+ caption: "Align",
12006
+ properties: [
12007
+ {
12008
+ propertyName: "alignSelf",
12009
+ caption: "Align Self",
12010
+ propertyType: "select",
12011
+ params: ",start,center,end"
11974
12012
  }
11975
12013
  ]
11976
12014
  };
@@ -11991,7 +12029,7 @@ ${_html.style}
11991
12029
  propertyType: "image"
11992
12030
  }
11993
12031
  ],
11994
- propertyGroupEditor: () => _sfc_main$u
12032
+ propertyGroupEditor: () => _sfc_main$v
11995
12033
  };
11996
12034
  };
11997
12035
  const borderGroup = () => {
@@ -12045,16 +12083,16 @@ ${_html.style}
12045
12083
  propertyType: "text"
12046
12084
  }
12047
12085
  ],
12048
- propertyGroupEditor: () => _sfc_main$t
12086
+ propertyGroupEditor: () => _sfc_main$u
12049
12087
  };
12050
12088
  };
12051
12089
  const defaultPropertyGroups = () => {
12052
12090
  return [layoutGroup(), alignGroup(), sizeGroup(), marginGroup(), paddingGroup(), backgroundGroup(), commonGroup()];
12053
12091
  };
12054
12092
  const defaultWidgetPropertyGroups = () => {
12055
- return [alignGroup(), positionGroup(), sizeGroup(), marginGroup(), paddingGroup(), borderGroup(), backgroundGroup(), commonGroup()];
12093
+ return [alignSelfGroup(), positionGroup(), sizeGroup(), marginGroup(), paddingGroup(), borderGroup(), backgroundGroup(), commonGroup()];
12056
12094
  };
12057
- const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
12095
+ const _sfc_main$r = /* @__PURE__ */ vue.defineComponent({
12058
12096
  __name: "PbContainerWidget",
12059
12097
  props: {
12060
12098
  part: {},
@@ -12069,7 +12107,7 @@ ${_html.style}
12069
12107
  var _a;
12070
12108
  return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
12071
12109
  _ctx.part.children ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(_ctx.part.children, (child) => {
12072
- return vue.openBlock(), vue.createBlock(_sfc_main$B, {
12110
+ return vue.openBlock(), vue.createBlock(_sfc_main$C, {
12073
12111
  key: child.partId,
12074
12112
  "is-mobile-page": false,
12075
12113
  part: child
@@ -12103,16 +12141,16 @@ ${_html.style}
12103
12141
  }
12104
12142
  ]
12105
12143
  },
12106
- alignGroup(),
12144
+ alignItemsGroup(),
12107
12145
  paddingGroup(),
12108
12146
  backgroundGroup(),
12109
12147
  commonGroup()
12110
12148
  ],
12111
12149
  initialProperties: {
12112
- align: "center"
12150
+ alignItems: "center"
12113
12151
  },
12114
12152
  allowsChild: () => true,
12115
- creator: () => _sfc_main$y
12153
+ creator: () => _sfc_main$z
12116
12154
  }
12117
12155
  ];
12118
12156
  const sectionParts = [
@@ -12126,12 +12164,12 @@ ${_html.style}
12126
12164
  ...defaultPropertyGroups()
12127
12165
  ],
12128
12166
  initialProperties: {
12129
- directionSm: "horizontal",
12130
- directionLg: "horizontal",
12131
- align: "center"
12167
+ direction: "horizontal",
12168
+ alignItems: "start",
12169
+ justifyContent: "start"
12132
12170
  },
12133
12171
  allowsChild: () => true,
12134
- creator: () => _sfc_main$y
12172
+ creator: () => _sfc_main$z
12135
12173
  }
12136
12174
  ];
12137
12175
  const blockParts = [
@@ -12145,12 +12183,12 @@ ${_html.style}
12145
12183
  ...defaultPropertyGroups()
12146
12184
  ],
12147
12185
  initialProperties: {
12148
- directionSm: "vertical",
12149
- directionLg: "vertical",
12150
- align: "center"
12186
+ direction: "vertical",
12187
+ alignItems: "start",
12188
+ justifyContent: "start"
12151
12189
  },
12152
12190
  allowsChild: () => true,
12153
- creator: () => _sfc_main$A
12191
+ creator: () => _sfc_main$B
12154
12192
  }
12155
12193
  ];
12156
12194
  const widgets = [
@@ -12344,7 +12382,7 @@ ${_html.style}
12344
12382
  height: "300px"
12345
12383
  },
12346
12384
  allowsChild: () => true,
12347
- creator: () => _sfc_main$q
12385
+ creator: () => _sfc_main$r
12348
12386
  }
12349
12387
  ];
12350
12388
  const partDefinitions = {};
@@ -13581,7 +13619,7 @@ ${_html.style}
13581
13619
  plugin.widgets.forEach((v) => {
13582
13620
  const w = { ...v };
13583
13621
  w.partType = "Widget";
13584
- w.creator = () => _sfc_main$D;
13622
+ w.creator = () => _sfc_main$E;
13585
13623
  w.propertyGroups = [...w.propertyGroups, ...defaultWidgetPropertyGroups()];
13586
13624
  partDefinitions2[v.partName] = w;
13587
13625
  const found = this.customWidgets.find((x) => x.partName === v.partName);
@@ -13813,8 +13851,8 @@ ${_html.style}
13813
13851
  });
13814
13852
  }
13815
13853
  }
13816
- const _hoisted_1$o = { class: "pb-tool-button bs-layout-horizontal flex-align-center" };
13817
- const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
13854
+ const _hoisted_1$p = { class: "pb-tool-button bs-layout-horizontal flex-align-center" };
13855
+ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
13818
13856
  __name: "PbToolbarButton",
13819
13857
  props: {
13820
13858
  button: {}
@@ -13827,7 +13865,7 @@ ${_html.style}
13827
13865
  (_b = (_a = props.button).handler) == null ? void 0 : _b.call(_a, pageBuilder);
13828
13866
  };
13829
13867
  return (_ctx, _cache) => {
13830
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$o, [
13868
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$p, [
13831
13869
  vue.createElementVNode("div", {
13832
13870
  class: "tool-button bs-clickable",
13833
13871
  onClick: handleClick
@@ -13842,17 +13880,17 @@ ${_html.style}
13842
13880
  };
13843
13881
  }
13844
13882
  });
13845
- const _hoisted_1$n = { class: "pb-tool-button-group bs-layout-horizontal flex-align-center" };
13846
- const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
13883
+ const _hoisted_1$o = { class: "pb-tool-button-group bs-layout-horizontal flex-align-center" };
13884
+ const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
13847
13885
  __name: "PbToolbarButtonGroup",
13848
13886
  props: {
13849
13887
  group: {}
13850
13888
  },
13851
13889
  setup(__props) {
13852
13890
  return (_ctx, _cache) => {
13853
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$n, [
13891
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$o, [
13854
13892
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.group.buttons, (button) => {
13855
- return vue.openBlock(), vue.createBlock(_sfc_main$p, {
13893
+ return vue.openBlock(), vue.createBlock(_sfc_main$q, {
13856
13894
  key: button.buttonId,
13857
13895
  button
13858
13896
  }, null, 8, ["button"]);
@@ -13861,10 +13899,10 @@ ${_html.style}
13861
13899
  };
13862
13900
  }
13863
13901
  });
13864
- const _hoisted_1$m = { class: "pb-toolbar bs-layout-horizontal align-items-center" };
13902
+ const _hoisted_1$n = { class: "pb-toolbar bs-layout-horizontal align-items-center" };
13865
13903
  const _hoisted_2$g = { class: "bs-layout-horizontal align-items-center" };
13866
13904
  const _hoisted_3$c = { class: "mr-8" };
13867
- const _sfc_main$n = /* @__PURE__ */ vue.defineComponent({
13905
+ const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
13868
13906
  __name: "PbToolbar",
13869
13907
  props: {
13870
13908
  plugin: {}
@@ -13913,10 +13951,10 @@ ${_html.style}
13913
13951
  });
13914
13952
  return (_ctx, _cache) => {
13915
13953
  var _a, _b, _c;
13916
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$m, [
13954
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$n, [
13917
13955
  vue.createElementVNode("div", _hoisted_2$g, [
13918
13956
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(buttonGroups), (group) => {
13919
- return vue.openBlock(), vue.createBlock(_sfc_main$o, {
13957
+ return vue.openBlock(), vue.createBlock(_sfc_main$p, {
13920
13958
  key: group.groupId,
13921
13959
  group
13922
13960
  }, null, 8, ["group"]);
@@ -13946,22 +13984,22 @@ ${_html.style}
13946
13984
  };
13947
13985
  }
13948
13986
  });
13949
- const _hoisted_1$l = { class: "pb-menu bs-layout-vertical" };
13950
- const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
13987
+ const _hoisted_1$m = { class: "pb-menu bs-layout-vertical" };
13988
+ const _sfc_main$n = /* @__PURE__ */ vue.defineComponent({
13951
13989
  __name: "PbMenu",
13952
13990
  props: {
13953
13991
  toolbarPlugin: {}
13954
13992
  },
13955
13993
  setup(__props) {
13956
13994
  return (_ctx, _cache) => {
13957
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$l, [
13958
- vue.createVNode(_sfc_main$n, { plugin: _ctx.toolbarPlugin }, null, 8, ["plugin"])
13995
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$m, [
13996
+ vue.createVNode(_sfc_main$o, { plugin: _ctx.toolbarPlugin }, null, 8, ["plugin"])
13959
13997
  ]);
13960
13998
  };
13961
13999
  }
13962
14000
  });
13963
- const _hoisted_1$k = { class: "bs-layout-vertical border" };
13964
- const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
14001
+ const _hoisted_1$l = { class: "bs-layout-vertical border" };
14002
+ const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
13965
14003
  __name: "PbNavigator",
13966
14004
  setup(__props) {
13967
14005
  const pageBuilder = usePageBuilderEditor();
@@ -14083,7 +14121,7 @@ ${_html.style}
14083
14121
  PageBuilderEditorEvent.off.modelUpdatedByUI(modelUpdateHandler);
14084
14122
  });
14085
14123
  return (_ctx, _cache) => {
14086
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$k, [
14124
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$l, [
14087
14125
  vue.createElementVNode("div", {
14088
14126
  ref_key: "tree",
14089
14127
  ref: tree,
@@ -14116,7 +14154,7 @@ ${_html.style}
14116
14154
  };
14117
14155
  }
14118
14156
  });
14119
- const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
14157
+ const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
14120
14158
  __name: "PbSidebarPropertyEditor",
14121
14159
  props: {
14122
14160
  property: {},
@@ -14151,13 +14189,13 @@ ${_html.style}
14151
14189
  };
14152
14190
  }
14153
14191
  });
14154
- const _hoisted_1$j = { class: "pb-sidebar-property-group" };
14192
+ const _hoisted_1$k = { class: "pb-sidebar-property-group" };
14155
14193
  const _hoisted_2$f = {
14156
14194
  key: 0,
14157
14195
  class: "group-title"
14158
14196
  };
14159
14197
  const _hoisted_3$b = ["textContent"];
14160
- const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
14198
+ const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
14161
14199
  __name: "PbSidebarPropertyGroupEditor",
14162
14200
  props: {
14163
14201
  group: {},
@@ -14171,7 +14209,7 @@ ${_html.style}
14171
14209
  return (_b = (_a = props.group).propertyGroupEditor) == null ? void 0 : _b.call(_a, props.group, props.selectedParts);
14172
14210
  });
14173
14211
  return (_ctx, _cache) => {
14174
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$j, [
14212
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$k, [
14175
14213
  _ctx.group.showGroupName ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$f, [
14176
14214
  vue.createElementVNode("label", {
14177
14215
  textContent: vue.toDisplayString(_ctx.group.caption)
@@ -14183,7 +14221,7 @@ ${_html.style}
14183
14221
  group: _ctx.group,
14184
14222
  "selected-parts": _ctx.selectedParts
14185
14223
  }, null, 8, ["group", "selected-parts"])) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(_ctx.group.properties, (property) => {
14186
- return vue.openBlock(), vue.createBlock(_sfc_main$k, {
14224
+ return vue.openBlock(), vue.createBlock(_sfc_main$l, {
14187
14225
  key: `${_ctx.partsKey}_${property.propertyName}`,
14188
14226
  property,
14189
14227
  "selected-parts": _ctx.selectedParts
@@ -14194,8 +14232,8 @@ ${_html.style}
14194
14232
  };
14195
14233
  }
14196
14234
  });
14197
- const _hoisted_1$i = { class: "pb-sidebar-properties" };
14198
- const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
14235
+ const _hoisted_1$j = { class: "pb-sidebar-properties" };
14236
+ const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
14199
14237
  __name: "PbSidebarProperties",
14200
14238
  setup(__props) {
14201
14239
  const pageBuilder = usePageBuilderEditor();
@@ -14213,12 +14251,12 @@ ${_html.style}
14213
14251
  }
14214
14252
  });
14215
14253
  return (_ctx, _cache) => {
14216
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$i, [
14254
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$j, [
14217
14255
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(properties.value, (group) => {
14218
14256
  return vue.openBlock(), vue.createElementBlock("div", {
14219
14257
  key: `${partsKey.value}_${group.groupName}`
14220
14258
  }, [
14221
- vue.createVNode(_sfc_main$j, {
14259
+ vue.createVNode(_sfc_main$k, {
14222
14260
  group,
14223
14261
  partsKey: partsKey.value,
14224
14262
  "selected-parts": vue.unref(selectedParts)
@@ -14229,19 +14267,19 @@ ${_html.style}
14229
14267
  };
14230
14268
  }
14231
14269
  });
14232
- const _hoisted_1$h = { class: "pb-sidebar" };
14233
- const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
14270
+ const _hoisted_1$i = { class: "pb-sidebar" };
14271
+ const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
14234
14272
  __name: "PbSidebar",
14235
14273
  setup(__props) {
14236
14274
  return (_ctx, _cache) => {
14237
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$h, [
14238
- vue.createVNode(_sfc_main$i)
14275
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$i, [
14276
+ vue.createVNode(_sfc_main$j)
14239
14277
  ]);
14240
14278
  };
14241
14279
  }
14242
14280
  });
14243
- const _hoisted_1$g = ["data-part-id"];
14244
- const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
14281
+ const _hoisted_1$h = ["data-part-id"];
14282
+ const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
14245
14283
  __name: "PbPage",
14246
14284
  props: {
14247
14285
  part: {},
@@ -14315,7 +14353,7 @@ ${_html.style}
14315
14353
  class: [selected.value && "selected", _ctx.isMobilePage ? "mobile" : "pc", "pb-page-content"]
14316
14354
  }, properties.value), [
14317
14355
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList((_b = _ctx.part) == null ? void 0 : _b.children, (section, index) => {
14318
- return vue.openBlock(), vue.createBlock(_sfc_main$y, {
14356
+ return vue.openBlock(), vue.createBlock(_sfc_main$z, {
14319
14357
  key: section.partId,
14320
14358
  "is-mobile-page": _ctx.isMobilePage,
14321
14359
  part: section
@@ -14328,15 +14366,15 @@ ${_html.style}
14328
14366
  }, _cache[0] || (_cache[0] = [
14329
14367
  vue.createElementVNode("i", { class: "material-icons-outlined" }, "add_circle_outline", -1)
14330
14368
  ]))
14331
- ], 46, _hoisted_1$g),
14369
+ ], 46, _hoisted_1$h),
14332
14370
  _cache[1] || (_cache[1] = vue.createElementVNode("div", { style: { "height": "100px" } }, null, -1))
14333
14371
  ], 64);
14334
14372
  };
14335
14373
  }
14336
14374
  });
14337
- const canvasStyle = '.pb-page-wrapper {\n margin: 0 auto;\n padding: 0;\n}\n\n.pb-page {\n width: 100%;\n margin: 0 auto;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n}\n\n.pb-page .pb-page-content.selected::before {\n content: "";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid #4998f8;\n z-index: 999;\n pointer-events: none;\n}\n\n.pb-page * {\n box-sizing: border-box;\n}\n\n.pb-add-widget-button {\n width: 100%;\n height: 100%;\n min-height: 200px;\n position: relative;\n}\n\n.pb-add-widget-button button {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n padding: 8px;\n background: none;\n border: none;\n cursor: pointer;\n}\n\n.pb-add-widget-button button:hover {\n background-color: #eeeeee;\n}\n\n.pb-add-widget-button .icon {\n font-size: 1rem;\n vertical-align: middle;\n}\n\n.pb-add-widget-button .text {\n font-size: 1rem;\n vertical-align: middle;\n margin-left: 0.4rem;\n}\n\n.pb-section {\n position: relative;\n width: 100%;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n outline: 1px dashed #ccc;\n background-color: #fff;\n}\n\n.pb-section:hover:not(:has(.pb-block:hover)) {\n background-color: #f0f0f0;\n}\n\n.pb-section.selected::before {\n content: "";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid #4998f8;\n z-index: 999;\n pointer-events: none;\n}\n\n.pb-section.pb-section-static {\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n pointer-events: none;\n}\n\n.pb-section.pb-section-static:after {\n content: "";\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.2);\n}\n\n.pb-section-static .pb-widget {\n outline: none;\n}\n\n.pb-block {\n display: flex;\n min-width: 1px;\n position: relative;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n width: 100%;\n outline: 1px dashed #ccc;\n}\n\n.pb-block:hover:not(:has(.pb-widget:hover)) {\n background-color: #f0f0f0;\n}\n\n.pb-block.selected::before {\n content: "";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid #4998f8;\n z-index: 999;\n pointer-events: none;\n}\n\n.pb-widget {\n position: relative;\n outline: 1px dashed #ccc;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n pointer-events: auto !important;\n}\n\n.pb-widget * {\n pointer-events: none;\n}\n\n.pb-widget.selected::before {\n content: "";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid #4998f8;\n z-index: 999;\n pointer-events: none;\n}\n\n.pb-widget .children {\n position: absolute;\n width: 100%;\n height: 100%;\n}\n\n.pb-widget .pan-handle {\n position: absolute;\n left: -6px;\n top: -6px;\n width: 12px;\n height: 12px;\n background-color: #27ae60;\n cursor: move;\n pointer-events: auto !important;\n}\n\n.pb-widget .resize-handle {\n position: absolute;\n right: -6px;\n bottom: -6px;\n width: 12px;\n height: 12px;\n background-color: #27ae60;\n cursor: nwse-resize;\n pointer-events: auto !important;\n}\n\n.pb-widget {\n position: relative;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n width: 100%;\n}\n\n.pb-widget .children {\n position: absolute;\n width: 100%;\n height: 100%;\n}\n\n.pb-text-widget {\n width: 100%;\n height: fit-content;\n}\n\n.pb-text-widget .text {\n color: #333;\n}\n\n.pb-text-widget .placeholder {\n padding: 4px 0;\n font-size: 18px;\n text-align: center;\n color: #999;\n}\n\n.pb-image-widget {\n width: 100%;\n}\n\n.pb-image-widget .image {\n width: 100%;\n}\n\n.pb-image-widget .placeholder {\n height: 100px;\n background-color: #eee;\n text-align: center;\n}\n\n.pb-image-widget .placeholder span {\n font-size: 40px;\n color: #999;\n line-height: 100px;\n vertical-align: middle;\n}\n\n.pb-html-widget {\n width: 100%;\n height: fit-content;\n}\n\n.pb-html-widget .placeholder {\n padding: 4px 0;\n font-size: 18px;\n text-align: center;\n color: #999;\n}\n\n.pb-iframe-widget {\n width: 100%;\n height: fit-content;\n}\n\n.pb-iframe-widget .placeholder {\n padding: 4px 0;\n font-size: 18px;\n text-align: center;\n color: #999;\n}\n\n.pb-youtube-widget {\n width: 100%;\n}\n\n.pb-youtube-widget .youtube {\n width: 100%;\n height: 100%;\n}\n\n.pb-youtube-widget .placeholder {\n height: 100px;\n background-color: #eee;\n text-align: center;\n}\n\n.pb-youtube-widget .placeholder span {\n font-size: 40px;\n color: #999;\n line-height: 100px;\n vertical-align: middle;\n}\n\n.pb-container-widget {\n width: 100%;\n}\n\n.pb-container-widget .placeholder {\n height: 100px;\n background-color: #eee;\n text-align: center;\n}\n\n.pb-container-widget .placeholder span {\n font-size: 40px;\n color: #999;\n line-height: 100px;\n vertical-align: middle;\n}\n\n.pb-product-list-widget {\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n justify-content: flex-start;\n align-items: center;\n}\n\n.pb-product-list-widget .product-wrapper {\n width: 25%;\n}\n\n.pb-product-list-widget .product-wrapper .product {\n width: 95%;\n margin: 0 auto;\n padding-top: 8px;\n padding-bottom: 8px;\n}\n\n.pb-product-list-widget .product-wrapper img {\n width: 100%;\n}\n\n.pb-product-list-widget .product-wrapper .name {\n margin-top: 8px;\n font-size: 14px;\n}\n\n.pb-product-list-widget .product-wrapper .price {\n margin-top: 8px;\n font-size: 14px;\n font-weight: bold;\n}\n\n.pb-product-list-widget .product-wrapper .empty {\n height: 200px;\n background-color: #eee;\n text-align: center;\n}\n\n.pb-product-list-widget .product-wrapper .empty span {\n font-size: 40px;\n color: #999;\n line-height: 200px;\n vertical-align: middle;\n}\n\n@media (max-width: 768px) {\n .pb-product-list-widget .product-wrapper {\n width: 50%;\n }\n}\n\n.mobile .pb-product-list-widget .product-wrapper {\n width: 50%;\n}\n\n.pb-login-widget {\n height: 200px;\n text-align: center;\n}\n\n.pb-login-widget h3 {\n padding: 0;\n margin: 0;\n font-size: 32px;\n font-weight: bold;\n color: #ccc;\n line-height: 200px;\n vertical-align: middle;\n}\n\n.font-icon {\n font-family: Material Symbols Outlined, monospace;\n font-size: 1rem;\n max-width: 1em;\n}\n\nhtml, body {\n font-family: Noto Sans, Noto Sans KR, Noto Sans JP, Arial, sans-serif;\n font-size: 12px;\n}\n\nbody {\n margin: 0;\n padding: 0;\n background-color: #aaa;\n overflow: hidden;\n}\n\n.pb-position-mark {\n background-color: #ff3333;\n opacity: 0.5;\n border-radius: 2px;\n}\n\n.pb-add-section-handle {\n position: relative;\n text-align: center;\n cursor: pointer;\n z-index: 5;\n height: 0;\n}\n\n.pb-add-section-handle.top::before, .pb-add-section-handle.bottom::before, .pb-add-section-handle.middle::before {\n content: "";\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n opacity: 0;\n pointer-events: none;\n}\n\n.pb-add-section-handle.bottom {\n left: 50%;\n bottom: -32px;\n}\n\n.pb-add-section-handle:hover.top::before, .pb-add-section-handle:hover.bottom::before, .pb-add-section-handle:hover.middle::before,\n.pb-add-section-handle:hover > i {\n opacity: 1;\n}\n\n.pb-add-section-handle > i {\n vertical-align: middle;\n position: absolute;\n top: 50%;\n left: 0;\n font-size: 2rem;\n transform: translate(-50%, -50%);\n opacity: 0.2;\n}';
14338
- const _hoisted_1$f = ["height", "width"];
14339
- const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
14375
+ const canvasStyle = '.pb-page-wrapper {\n margin: 0 auto;\n padding: 0;\n}\n\n.pb-page {\n display: flex;\n flex-direction: column;\n margin: 0 auto;\n width: 100%;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n}\n\n.pb-page .pb-page-content.selected::before {\n content: "";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid #4998f8;\n z-index: 999;\n pointer-events: none;\n}\n\n.pb-page * {\n box-sizing: border-box;\n}\n\n.pb-add-widget-button {\n width: 100%;\n height: 100%;\n min-height: 200px;\n position: relative;\n}\n\n.pb-add-widget-button button {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n padding: 8px;\n background: none;\n border: none;\n cursor: pointer;\n}\n\n.pb-add-widget-button button:hover {\n background-color: #eeeeee;\n}\n\n.pb-add-widget-button .icon {\n font-size: 1rem;\n vertical-align: middle;\n}\n\n.pb-add-widget-button .text {\n font-size: 1rem;\n vertical-align: middle;\n margin-left: 0.4rem;\n}\n\n.pb-section {\n display: flex;\n position: relative;\n width: 100%;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n outline: 1px dashed #ccc;\n background-color: #fff;\n}\n\n.pb-section:hover:not(:has(.pb-block:hover)) {\n background-color: #f0f0f0;\n}\n\n.pb-section.selected::before {\n content: "";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid #4998f8;\n z-index: 999;\n pointer-events: none;\n}\n\n.pb-section.pb-section-static {\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n pointer-events: none;\n}\n\n.pb-section.pb-section-static:after {\n content: "";\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.2);\n}\n\n.pb-section-static .pb-widget {\n outline: none;\n}\n\n.pb-block {\n display: flex;\n min-width: 1px;\n position: relative;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n width: 100%;\n outline: 1px dashed #ccc;\n}\n\n.pb-block:hover:not(:has(.pb-widget:hover)) {\n background-color: #f0f0f0;\n}\n\n.pb-block.selected::before {\n content: "";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid #4998f8;\n z-index: 999;\n pointer-events: none;\n}\n\n.pb-widget {\n position: relative;\n outline: 1px dashed #ccc;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n pointer-events: auto !important;\n}\n\n.pb-widget * {\n pointer-events: none;\n}\n\n.pb-widget.selected::before {\n content: "";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 2px solid #4998f8;\n z-index: 999;\n pointer-events: none;\n}\n\n.pb-widget .children {\n position: absolute;\n width: 100%;\n height: 100%;\n}\n\n.pb-widget .pan-handle {\n position: absolute;\n left: -6px;\n top: -6px;\n width: 12px;\n height: 12px;\n background-color: #27ae60;\n cursor: move;\n pointer-events: auto !important;\n}\n\n.pb-widget .resize-handle {\n position: absolute;\n right: -6px;\n bottom: -6px;\n width: 12px;\n height: 12px;\n background-color: #27ae60;\n cursor: nwse-resize;\n pointer-events: auto !important;\n}\n\n.pb-widget {\n position: relative;\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n width: 100%;\n}\n\n.pb-widget .children {\n position: absolute;\n width: 100%;\n height: 100%;\n}\n\n.pb-text-widget {\n width: 100%;\n height: fit-content;\n}\n\n.pb-text-widget .text {\n color: #333;\n}\n\n.pb-text-widget .placeholder {\n padding: 4px 0;\n font-size: 18px;\n text-align: center;\n color: #999;\n}\n\n.pb-image-widget {\n width: 100%;\n}\n\n.pb-image-widget .image {\n width: 100%;\n}\n\n.pb-image-widget .placeholder {\n height: 100px;\n background-color: #eee;\n text-align: center;\n}\n\n.pb-image-widget .placeholder span {\n font-size: 40px;\n color: #999;\n line-height: 100px;\n vertical-align: middle;\n}\n\n.pb-html-widget {\n width: 100%;\n height: fit-content;\n}\n\n.pb-html-widget .placeholder {\n padding: 4px 0;\n font-size: 18px;\n text-align: center;\n color: #999;\n}\n\n.pb-iframe-widget {\n width: 100%;\n height: fit-content;\n}\n\n.pb-iframe-widget .placeholder {\n padding: 4px 0;\n font-size: 18px;\n text-align: center;\n color: #999;\n}\n\n.pb-youtube-widget {\n width: 100%;\n}\n\n.pb-youtube-widget .youtube {\n width: 100%;\n height: 100%;\n}\n\n.pb-youtube-widget .placeholder {\n height: 100px;\n background-color: #eee;\n text-align: center;\n}\n\n.pb-youtube-widget .placeholder span {\n font-size: 40px;\n color: #999;\n line-height: 100px;\n vertical-align: middle;\n}\n\n.pb-container-widget {\n width: 100%;\n}\n\n.pb-container-widget .placeholder {\n height: 100px;\n background-color: #eee;\n text-align: center;\n}\n\n.pb-container-widget .placeholder span {\n font-size: 40px;\n color: #999;\n line-height: 100px;\n vertical-align: middle;\n}\n\n.pb-product-list-widget {\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n justify-content: flex-start;\n align-items: center;\n}\n\n.pb-product-list-widget .product-wrapper {\n width: 25%;\n}\n\n.pb-product-list-widget .product-wrapper .product {\n width: 95%;\n margin: 0 auto;\n padding-top: 8px;\n padding-bottom: 8px;\n}\n\n.pb-product-list-widget .product-wrapper img {\n width: 100%;\n}\n\n.pb-product-list-widget .product-wrapper .name {\n margin-top: 8px;\n font-size: 14px;\n}\n\n.pb-product-list-widget .product-wrapper .price {\n margin-top: 8px;\n font-size: 14px;\n font-weight: bold;\n}\n\n.pb-product-list-widget .product-wrapper .empty {\n height: 200px;\n background-color: #eee;\n text-align: center;\n}\n\n.pb-product-list-widget .product-wrapper .empty span {\n font-size: 40px;\n color: #999;\n line-height: 200px;\n vertical-align: middle;\n}\n\n@media (max-width: 768px) {\n .pb-product-list-widget .product-wrapper {\n width: 50%;\n }\n}\n\n.mobile .pb-product-list-widget .product-wrapper {\n width: 50%;\n}\n\n.pb-login-widget {\n height: 200px;\n text-align: center;\n}\n\n.pb-login-widget h3 {\n padding: 0;\n margin: 0;\n font-size: 32px;\n font-weight: bold;\n color: #ccc;\n line-height: 200px;\n vertical-align: middle;\n}\n\n.font-icon {\n font-family: Material Symbols Outlined, monospace;\n font-size: 1rem;\n max-width: 1em;\n}\n\nhtml, body {\n font-family: Noto Sans, Noto Sans KR, Noto Sans JP, Arial, sans-serif;\n font-size: 12px;\n}\n\nbody {\n margin: 0;\n padding: 0;\n background-color: #aaa;\n overflow: hidden;\n}\n\n.pb-position-mark {\n background-color: #ff3333;\n opacity: 0.5;\n border-radius: 2px;\n}\n\n.pb-add-section-handle {\n position: relative;\n text-align: center;\n cursor: pointer;\n z-index: 5;\n height: 0;\n}\n\n.pb-add-section-handle.top::before, .pb-add-section-handle.bottom::before, .pb-add-section-handle.middle::before {\n content: "";\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n opacity: 0;\n pointer-events: none;\n}\n\n.pb-add-section-handle.bottom {\n left: 50%;\n bottom: -32px;\n}\n\n.pb-add-section-handle:hover.top::before, .pb-add-section-handle:hover.bottom::before, .pb-add-section-handle:hover.middle::before,\n.pb-add-section-handle:hover > i {\n opacity: 1;\n}\n\n.pb-add-section-handle > i {\n vertical-align: middle;\n position: absolute;\n top: 50%;\n left: 0;\n font-size: 2rem;\n transform: translate(-50%, -50%);\n opacity: 0.2;\n}';
14376
+ const _hoisted_1$g = ["height", "width"];
14377
+ const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
14340
14378
  __name: "PbPageFrame",
14341
14379
  props: {
14342
14380
  part: {},
@@ -14450,12 +14488,12 @@ ${_html.style}
14450
14488
  style: vue.normalizeStyle(style.value),
14451
14489
  width: `${width.value}px`,
14452
14490
  class: "page-frame mt-12"
14453
- }, null, 12, _hoisted_1$f),
14491
+ }, null, 12, _hoisted_1$g),
14454
14492
  ((_b = (_a = iframeRef.value) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.document.body) ? (vue.openBlock(), vue.createBlock(vue.Teleport, {
14455
14493
  key: 0,
14456
14494
  to: (_d = (_c = iframeRef.value) == null ? void 0 : _c.contentWindow) == null ? void 0 : _d.document.body
14457
14495
  }, [
14458
- vue.createVNode(_sfc_main$g, {
14496
+ vue.createVNode(_sfc_main$h, {
14459
14497
  "is-mobile-page": isMobilePage.value,
14460
14498
  part: _ctx.part,
14461
14499
  width: width.value
@@ -14465,12 +14503,12 @@ ${_html.style}
14465
14503
  };
14466
14504
  }
14467
14505
  });
14468
- const _hoisted_1$e = { class: "pb-canvas-wrapper" };
14506
+ const _hoisted_1$f = { class: "pb-canvas-wrapper" };
14469
14507
  const _hoisted_2$e = {
14470
14508
  key: 1,
14471
14509
  style: { "width": "20px" }
14472
14510
  };
14473
- const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
14511
+ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
14474
14512
  __name: "PbCanvas",
14475
14513
  setup(__props) {
14476
14514
  const pageBuilder = usePageBuilderEditor();
@@ -14492,15 +14530,15 @@ ${_html.style}
14492
14530
  };
14493
14531
  });
14494
14532
  return (_ctx, _cache) => {
14495
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$e, [
14533
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$f, [
14496
14534
  vue.createElementVNode("div", vue.mergeProps({ class: "pb-canvas" }, style.value), [
14497
- partS.value ? (vue.openBlock(), vue.createBlock(_sfc_main$f, {
14535
+ partS.value ? (vue.openBlock(), vue.createBlock(_sfc_main$g, {
14498
14536
  key: 0,
14499
14537
  part: partS.value,
14500
14538
  width: 480
14501
14539
  }, null, 8, ["part"])) : vue.createCommentVNode("", true),
14502
14540
  partL.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$e)) : vue.createCommentVNode("", true),
14503
- partL.value ? (vue.openBlock(), vue.createBlock(_sfc_main$f, {
14541
+ partL.value ? (vue.openBlock(), vue.createBlock(_sfc_main$g, {
14504
14542
  key: 2,
14505
14543
  part: partL.value,
14506
14544
  width: 1024
@@ -14510,9 +14548,9 @@ ${_html.style}
14510
14548
  };
14511
14549
  }
14512
14550
  });
14513
- const _hoisted_1$d = { class: "pb-editor bs-layout-vertical flex-grow-1" };
14551
+ const _hoisted_1$e = { class: "pb-editor bs-layout-vertical flex-grow-1" };
14514
14552
  const _hoisted_2$d = { class: "pb-editor-body bs-layout-horizontal flex-grow-1" };
14515
- const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
14553
+ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
14516
14554
  __name: "PageBuilderEditor",
14517
14555
  props: {
14518
14556
  instanceId: {},
@@ -14555,22 +14593,22 @@ ${_html.style}
14555
14593
  getPageContent
14556
14594
  });
14557
14595
  return (_ctx, _cache) => {
14558
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
14559
- vue.createVNode(_sfc_main$m, { "toolbar-plugin": _ctx.toolbarPlugin }, null, 8, ["toolbar-plugin"]),
14596
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$e, [
14597
+ vue.createVNode(_sfc_main$n, { "toolbar-plugin": _ctx.toolbarPlugin }, null, 8, ["toolbar-plugin"]),
14560
14598
  vue.createElementVNode("div", _hoisted_2$d, [
14561
- vue.createVNode(_sfc_main$l),
14562
- vue.createVNode(_sfc_main$e),
14563
- vue.createVNode(_sfc_main$h)
14599
+ vue.createVNode(_sfc_main$m),
14600
+ vue.createVNode(_sfc_main$f),
14601
+ vue.createVNode(_sfc_main$i)
14564
14602
  ])
14565
14603
  ]);
14566
14604
  };
14567
14605
  }
14568
14606
  });
14569
- const _hoisted_1$c = { class: "property-editor property-editor-readonly-text" };
14607
+ const _hoisted_1$d = { class: "property-editor property-editor-readonly-text" };
14570
14608
  const _hoisted_2$c = { class: "title" };
14571
14609
  const _hoisted_3$a = ["textContent"];
14572
14610
  const _hoisted_4$3 = ["textContent"];
14573
- const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
14611
+ const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
14574
14612
  __name: "PbPropertyEditorReadonlyText",
14575
14613
  props: {
14576
14614
  property: {},
@@ -14578,7 +14616,7 @@ ${_html.style}
14578
14616
  },
14579
14617
  setup(__props) {
14580
14618
  return (_ctx, _cache) => {
14581
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, [
14619
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
14582
14620
  vue.createElementVNode("div", _hoisted_2$c, [
14583
14621
  vue.createElementVNode("label", {
14584
14622
  textContent: vue.toDisplayString(_ctx.property.caption)
@@ -14595,12 +14633,12 @@ ${_html.style}
14595
14633
  });
14596
14634
  const PbPropertyEditorReadonlyText = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
14597
14635
  __proto__: null,
14598
- default: _sfc_main$c
14636
+ default: _sfc_main$d
14599
14637
  }, Symbol.toStringTag, { value: "Module" }));
14600
- const _hoisted_1$b = { class: "property-editor property-editor-text flex-align-center" };
14638
+ const _hoisted_1$c = { class: "property-editor property-editor-text flex-align-center" };
14601
14639
  const _hoisted_2$b = { class: "title" };
14602
14640
  const _hoisted_3$9 = ["textContent"];
14603
- const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
14641
+ const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
14604
14642
  __name: "PbPropertyEditorText",
14605
14643
  props: {
14606
14644
  property: {},
@@ -14618,7 +14656,7 @@ ${_html.style}
14618
14656
  emit("update-property-value", properties);
14619
14657
  };
14620
14658
  return (_ctx, _cache) => {
14621
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
14659
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, [
14622
14660
  vue.createElementVNode("div", _hoisted_2$b, [
14623
14661
  vue.createElementVNode("label", {
14624
14662
  textContent: vue.toDisplayString(_ctx.property.caption)
@@ -14644,12 +14682,12 @@ ${_html.style}
14644
14682
  });
14645
14683
  const PbPropertyEditorText = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
14646
14684
  __proto__: null,
14647
- default: _sfc_main$b
14685
+ default: _sfc_main$c
14648
14686
  }, Symbol.toStringTag, { value: "Module" }));
14649
- const _hoisted_1$a = { class: "property-editor property-editor-number flex-align-center" };
14687
+ const _hoisted_1$b = { class: "property-editor property-editor-number flex-align-center" };
14650
14688
  const _hoisted_2$a = { class: "title" };
14651
14689
  const _hoisted_3$8 = ["textContent"];
14652
- const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
14690
+ const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
14653
14691
  __name: "PbPropertyEditorNumber",
14654
14692
  props: {
14655
14693
  property: {},
@@ -14659,13 +14697,20 @@ ${_html.style}
14659
14697
  setup(__props, { emit: __emit }) {
14660
14698
  const props = __props;
14661
14699
  const emit = __emit;
14700
+ const modelValue = vue.computed(() => {
14701
+ if (props.value && !isNaN(Number(props.value))) {
14702
+ return Number(props.value);
14703
+ } else {
14704
+ return void 0;
14705
+ }
14706
+ });
14662
14707
  const emitUpdatePropertyValue = (value) => {
14663
14708
  const properties = {};
14664
14709
  properties[props.property.propertyName] = `${value}`;
14665
14710
  emit("update-property-value", properties);
14666
14711
  };
14667
14712
  return (_ctx, _cache) => {
14668
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
14713
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
14669
14714
  vue.createElementVNode("div", _hoisted_2$a, [
14670
14715
  vue.createElementVNode("label", {
14671
14716
  textContent: vue.toDisplayString(_ctx.property.caption)
@@ -14673,7 +14718,7 @@ ${_html.style}
14673
14718
  ]),
14674
14719
  vue.createElementVNode("div", null, [
14675
14720
  vue.createVNode(vue.unref(bluesea.BSNumberInput), {
14676
- "model-value": Number(_ctx.value),
14721
+ "model-value": modelValue.value,
14677
14722
  width: "100%",
14678
14723
  "onUpdate:modelValue": emitUpdatePropertyValue
14679
14724
  }, null, 8, ["model-value"])
@@ -14683,6 +14728,43 @@ ${_html.style}
14683
14728
  }
14684
14729
  });
14685
14730
  const PbPropertyEditorNumber = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
14731
+ __proto__: null,
14732
+ default: _sfc_main$b
14733
+ }, Symbol.toStringTag, { value: "Module" }));
14734
+ const _hoisted_1$a = { class: "property-editor property-editor-boolean flex-align-center my-12" };
14735
+ const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
14736
+ __name: "PbPropertyEditorBoolean",
14737
+ props: {
14738
+ property: {},
14739
+ value: {}
14740
+ },
14741
+ emits: ["update-property-value"],
14742
+ setup(__props, { emit: __emit }) {
14743
+ const props = __props;
14744
+ const booleanValue = vue.ref((props == null ? void 0 : props.value) === "true");
14745
+ const emit = __emit;
14746
+ const emitUpdatePropertyValue = (value) => {
14747
+ const properties = {};
14748
+ properties[props.property.propertyName] = value ? "true" : "false";
14749
+ emit("update-property-value", properties);
14750
+ };
14751
+ return (_ctx, _cache) => {
14752
+ return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [
14753
+ vue.createElementVNode("div", null, [
14754
+ vue.createVNode(vue.unref(bluesea.BSCheckbox), {
14755
+ modelValue: booleanValue.value,
14756
+ "onUpdate:modelValue": [
14757
+ _cache[0] || (_cache[0] = ($event) => booleanValue.value = $event),
14758
+ emitUpdatePropertyValue
14759
+ ],
14760
+ label: _ctx.property.caption
14761
+ }, null, 8, ["modelValue", "label"])
14762
+ ])
14763
+ ]);
14764
+ };
14765
+ }
14766
+ });
14767
+ const PbPropertyEditorBoolean = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
14686
14768
  __proto__: null,
14687
14769
  default: _sfc_main$a
14688
14770
  }, Symbol.toStringTag, { value: "Module" }));
@@ -15381,12 +15463,12 @@ ${_html.tags}` : "";
15381
15463
  exports2.PAGE_BUILDER_KEY = PAGE_BUILDER_KEY;
15382
15464
  exports2.PAGE_TYPE = PAGE_TYPE$1;
15383
15465
  exports2.Page = Page;
15384
- exports2.PageBuilderEditor = _sfc_main$d;
15466
+ exports2.PageBuilderEditor = _sfc_main$e;
15385
15467
  exports2.PageBuilderEditorEvent = PageBuilderEditorEvent;
15386
15468
  exports2.PageBuilderViewer = _sfc_main$2$1;
15387
15469
  exports2.Part = Part;
15388
15470
  exports2.PbContainerWidget = _sfc_main$1$1;
15389
- exports2.PbCustomWidget = _sfc_main$D;
15471
+ exports2.PbCustomWidget = _sfc_main$E;
15390
15472
  exports2.PbHtmlWidget = _sfc_main$6$1;
15391
15473
  exports2.PbIframeWidget = _sfc_main$5$1;
15392
15474
  exports2.PbImageWidget = _sfc_main$8$1;