@myissue/vue-website-page-builder 3.3.99 → 3.4.2

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 (15) hide show
  1. package/dist/style.css +1 -1
  2. package/dist/vue-website-page-builder.js +31 -31
  3. package/dist/vue-website-page-builder.umd.cjs +17 -17
  4. package/package.json +1 -1
  5. package/src/Components/PageBuilder/EditorMenu/Editables/BackgroundColorEditor.vue +4 -4
  6. package/src/Components/PageBuilder/EditorMenu/Editables/EditGetElement.vue +5 -5
  7. package/src/Components/PageBuilder/EditorMenu/Editables/TextColorEditor.vue +4 -4
  8. package/src/Components/PageBuilder/ToolbarOption/ToolbarOption.vue +1 -1
  9. package/src/Components/TipTap/TipTapInput.vue +1 -1
  10. package/src/PageBuilder/PageBuilder.vue +2 -2
  11. package/src/PageBuilder/Preview.vue +2 -2
  12. package/src/css/style.css +24 -16
  13. package/src/tests/DefaultComponents/DefaultBuilderComponents.vue +1 -1
  14. package/src/tests/componentsArray.test.json +4 -4
  15. package/src/utils/html-elements/component.ts +10 -10
package/dist/vue-website-page-builder.js CHANGED
@@ -104,7 +104,7 @@ const Wh = { class: "pbx-font-sans" }, Uh = {
104
104
  ])
105
105
  ]));
106
106
  }
107
- }), Kh = { key: 0 }, Gh = { class: "pbx-text-black pbx-w-full pbx-inset-x-0 pbx-h-[90vh] pbx-bg-white pbx-overflow-x-scroll lg:pbx-pt-2 pbx-pt-2" }, Jh = { id: "page-builder-editor" }, Yh = ["innerHTML"], Xh = { key: 1 }, vp = {
107
+ }), Kh = { key: 0 }, Gh = { class: "pbx-text-black pbx-w-full pbx-inset-x-0 pbx-h-[90vh] pbx-bg-white pbx-overflow-x-scroll lg:pbx-pt-2 pbx-pt-2" }, Jh = { id: "page-builder-wrapper" }, Yh = ["innerHTML"], Xh = { key: 1 }, vp = {
108
108
  __name: "Preview",
109
109
  props: {
110
110
  mobile: {
@@ -124,7 +124,7 @@ const Wh = { class: "pbx-font-sans" }, Uh = {
124
124
  if (e.mobile && r.value && t.value) {
125
125
  const s = r.value.contentWindow.document;
126
126
  s.open(), s.write(
127
- `<!DOCTYPE html><html><head><meta name="viewport" content="width=device-width, initial-scale=1.0"></head><body><div class="pbx-font-sans pbx-text-black">${t.value}</div></body></html>`
127
+ `<!DOCTYPE html><html><head><meta name="viewport" content="width=device-width, initial-scale=1.0"></head><body><div id="page-builder-wrapper" class="pbx-font-sans pbx-text-black">${t.value}</div></body></html>`
128
128
  ), s.close(), document.querySelectorAll('link[rel="stylesheet"], style').forEach((l) => {
129
129
  s.head.appendChild(l.cloneNode(!0));
130
130
  });
@@ -21274,7 +21274,7 @@ const Xw = /* @__PURE__ */ Yw("pageBuilderState", {
21274
21274
  }, eS = {
21275
21275
  key: 0,
21276
21276
  class: "pbx-min-h-[2.5rem] pbx-flex pbx-items-center pbx-justify-start"
21277
- }, tS = { class: "pbx-myPrimaryInputError pbx-mt-2 pbx-mb-0 pbx-py-0 pbx-self-start" }, nS = { class: "pbx-blockease-linear pbx-duration-200 pbx-block pbx-ease-linear" }, rS = { key: 0 }, oS = { class: "pbx-relative pbx-rounded-lg" }, iS = { class: "pbx-flex pbx-justify-between pbx-myPrimaryGap pbx-items-center pbx-py-4 pbx-px-4 pbx-overflow-x-auto pbx-border-solid pbx-border-b pbx-border-gray-200" }, sS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max pbx-p-1 pbx-rounded-full pbx-border-solid pbx-border pbx-border-gray-200 pbx-shadow-sm" }, lS = { class: "pbx-flex pbx-items-center pbx-p-1 pbx-rounded-full pbx-border-solid pbx-border pbx-border-gray-200 pbx-shadow-sm" }, aS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, pS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, cS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, uS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, dS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, fS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, hS = {
21277
+ }, tS = { class: "pbx-myPrimaryInputError pbx-mt-2 pbx-mb-0 pbx-py-0 pbx-self-start" }, nS = { class: "pbx-blockease-linear pbx-duration-200 pbx-block pbx-ease-linear" }, rS = { key: 0 }, oS = { class: "pbx-relative pbx-rounded-lg" }, iS = { class: "pbx-flex pbx-justify-between pbx-myPrimaryGap pbx-items-center pbx-pb-2 pbx-mb-2 pbx-px-4 pbx-overflow-x-auto pbx-border-0 pbx-border-b pbx-border-solid pbx-border-gray-200" }, sS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max pbx-p-1 pbx-rounded-full pbx-border-solid pbx-border pbx-border-gray-200 pbx-shadow-sm" }, lS = { class: "pbx-flex pbx-items-center pbx-p-1 pbx-rounded-full pbx-border-solid pbx-border pbx-border-gray-200 pbx-shadow-sm" }, aS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, pS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, cS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, uS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, dS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, fS = { class: "pbx-px-2 pbx-flex pbx-items-center pbx-justify-start pbx-gap-2 pbx-w-max" }, hS = {
21278
21278
  __name: "TipTapInput",
21279
21279
  setup(n) {
21280
21280
  const e = Ce(), { translate: t } = Me(), r = Se, o = M(!1), i = M(""), s = M(1), l = M(""), a = M(""), p = M(""), c = M(null), u = M(null), f = M(null), h = M(null), b = M(null), m = I(() => r.getElement), x = M(""), v = I(() => S.value ? S.value.getHTML() : null), C = M(0);
@@ -22151,14 +22151,14 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22151
22151
  }, [
22152
22152
  n.globalPageLayout ? (w(), ce(y(Tr), {
22153
22153
  key: 0,
22154
- class: "pbx-flex pbx-flex-row pbx-justify-between pbx-items-center pbx-pl-3 pbx-pr-3 pbx-py-5 pbx-cursor-pointer pbx-duration-200 hover:pbx-bg-myPrimaryLightGrayColor"
22154
+ class: "pbx-flex pbx-flex-row pbx-justify-between pbx-items-center pbx-pl-3 pbx-pr-3 pbx-py-5 pbx-cursor-pointer pbx-duration-200 hover:pbx-bg-myPrimaryLightGrayColor pbx-bg-white hover:pbx-text-black pbx-text-black pbx-font-sans pbx-font-medium"
22155
22155
  }, {
22156
22156
  default: V(() => {
22157
22157
  var a;
22158
22158
  return [
22159
22159
  d("div", nk, [
22160
22160
  d("div", {
22161
- class: X(["pbx-aspect-square pbx-w-6 pbx-h-6 pbx-border pbx-border-gray-800 pbx-rounded-sm", `pbx-bg-${(a = o.value) == null ? void 0 : a.replace("pbx-text-", "")}`])
22161
+ class: X(["pbx-aspect-square pbx-w-6 pbx-h-6 pbx-border pbx-border-gray-600 pbx-rounded-sm pbx-bg-none pbx-border-solid", `pbx-bg-${(a = o.value) == null ? void 0 : a.replace("pbx-text-", "")}`])
22162
22162
  }, null, 2),
22163
22163
  d("div", null, [
22164
22164
  d("div", null, k(y(e)("Text Color")), 1)
@@ -22171,7 +22171,7 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22171
22171
  })) : A("", !0),
22172
22172
  n.globalPageLayout ? A("", !0) : (w(), ce(y(Tr), {
22173
22173
  key: 1,
22174
- class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0"
22174
+ class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0 pbx-text-myPrimaryDarkGrayColor"
22175
22175
  }, {
22176
22176
  default: V(() => {
22177
22177
  var a;
@@ -22195,7 +22195,7 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22195
22195
  "leave-to-class": "pbx-opacity-0"
22196
22196
  }, {
22197
22197
  default: V(() => [
22198
- j(y(si), { class: "pbx-absolute pbx-min-w-[12rem] pbx-z-40 pbx-mt-1 pbx-max-h-56 pbx-w-full pbx-overflow-auto pbx-rounded-md pbx-bg-gray-50 pbx-py-1 pbx-text-base pbx-shadow-lg pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 focus:pbx-outline-none sm:pbx-text-sm" }, {
22198
+ j(y(si), { class: "pbx-headless-dropdown pbx-absolute pbx-min-w-[12rem] pbx-z-40 pbx-mt-1 pbx-max-h-56 pbx-w-full pbx-overflow-auto pbx-rounded-md pbx-bg-gray-50 pbx-py-1 pbx-text-base pbx-shadow-lg pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 focus:pbx-outline-none sm:pbx-text-sm" }, {
22199
22199
  default: V(() => [
22200
22200
  (w(!0), E(Z, null, fe(y(Fi).textColorVariables, (a) => (w(), ce(y(li), {
22201
22201
  as: "template",
@@ -22273,14 +22273,14 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22273
22273
  }, [
22274
22274
  n.globalPageLayout ? (w(), ce(y(Tr), {
22275
22275
  key: 0,
22276
- class: "pbx-flex pbx-flex-row pbx-justify-between pbx-items-center pbx-pl-3 pbx-pr-3 pbx-py-5 pbx-cursor-pointer pbx-duration-200 hover:pbx-bg-myPrimaryLightGrayColor"
22276
+ class: "pbx-flex pbx-flex-row pbx-justify-between pbx-items-center pbx-pl-3 pbx-pr-3 pbx-py-5 pbx-cursor-pointer pbx-duration-200 hover:pbx-bg-myPrimaryLightGrayColor pbx-bg-white hover:pbx-text-black pbx-text-black pbx-font-sans pbx-font-medium"
22277
22277
  }, {
22278
22278
  default: V(() => {
22279
22279
  var a;
22280
22280
  return [
22281
22281
  d("div", ck, [
22282
22282
  d("div", {
22283
- class: X(["pbx-aspect-square pbx-w-6 pbx-h-6 pbx-border pbx-border-gray-800 pbx-rounded-sm", `pbx-bg-${(a = o.value) == null ? void 0 : a.replace("pbx-bg-", "")}`])
22283
+ class: X(["pbx-aspect-square pbx-w-6 pbx-h-6 pbx-border pbx-border-gray-600 pbx-rounded-sm pbx-bg-none pbx-border-solid", `pbx-bg-${(a = o.value) == null ? void 0 : a.replace("pbx-bg-", "")}`])
22284
22284
  }, null, 2),
22285
22285
  d("div", null, k(y(e)("Background Color")), 1)
22286
22286
  ]),
@@ -22291,7 +22291,7 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22291
22291
  })) : A("", !0),
22292
22292
  n.globalPageLayout ? A("", !0) : (w(), ce(y(Tr), {
22293
22293
  key: 1,
22294
- class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0"
22294
+ class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0 pbx-text-myPrimaryDarkGrayColor"
22295
22295
  }, {
22296
22296
  default: V(() => {
22297
22297
  var a;
@@ -22315,7 +22315,7 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22315
22315
  "leave-to-class": "pbx-opacity-0"
22316
22316
  }, {
22317
22317
  default: V(() => [
22318
- j(y(si), { class: "pbx-absolute pbx-min-w-[12rem] pbx-z-40 pbx-mt-1 pbx-max-h-56 pbx-w-full pbx-overflow-auto pbx-rounded-md pbx-bg-gray-50 pbx-py-1 pbx-text-base pbx-shadow-lg pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 focus:pbx-outline-none sm:pbx-text-sm" }, {
22318
+ j(y(si), { class: "pbx-headless-dropdown pbx-absolute pbx-min-w-[12rem] pbx-z-40 pbx-mt-1 pbx-max-h-56 pbx-w-full pbx-overflow-auto pbx-rounded-md pbx-bg-gray-50 pbx-py-1 pbx-text-base pbx-shadow-lg pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 focus:pbx-outline-none sm:pbx-text-sm" }, {
22319
22319
  default: V(() => [
22320
22320
  (w(!0), E(Z, null, fe(y(Fi).backgroundColorVariables, (a) => (w(), ce(y(li), {
22321
22321
  as: "template",
@@ -22485,7 +22485,7 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22485
22485
  d("button", {
22486
22486
  onClick: ue,
22487
22487
  type: "button",
22488
- class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0"
22488
+ class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0 pbx-text-myPrimaryDarkGrayColor"
22489
22489
  }, G[7] || (G[7] = [
22490
22490
  d("span", { class: "material-symbols-outlined" }, " play_circle ", -1)
22491
22491
  ]))
@@ -22495,7 +22495,7 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22495
22495
  d("button", {
22496
22496
  onClick: C,
22497
22497
  type: "button",
22498
- class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0"
22498
+ class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0 pbx-text-myPrimaryDarkGrayColor"
22499
22499
  }, G[8] || (G[8] = [
22500
22500
  d("span", { class: "material-symbols-outlined" }, " edit ", -1)
22501
22501
  ]))
@@ -22506,7 +22506,7 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22506
22506
  d("button", {
22507
22507
  onClick: N,
22508
22508
  type: "button",
22509
- class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0"
22509
+ class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0 pbx-text-myPrimaryDarkGrayColor"
22510
22510
  }, G[9] || (G[9] = [
22511
22511
  d("span", { class: "material-symbols-outlined" }, " add_photo_alternate ", -1)
22512
22512
  ]))
@@ -22516,13 +22516,13 @@ const tk = { class: "pbx-relative" }, nk = { class: "pbx-flex pbx-justify-start
22516
22516
  key: 4,
22517
22517
  onClick: G[1] || (G[1] = (...re) => y(t).deleteElementFromDOM && y(t).deleteElementFromDOM(...re)),
22518
22518
  type: "button",
22519
- class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0"
22519
+ class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0 pbx-text-myPrimaryDarkGrayColor"
22520
22520
  }, G[10] || (G[10] = [
22521
22521
  d("span", { class: "material-symbols-outlined" }, " delete ", -1)
22522
22522
  ]))) : A("", !0),
22523
22523
  i.value && l.value ? (w(), E("div", {
22524
22524
  key: 5,
22525
- class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0",
22525
+ class: "pbx-h-10 pbx-w-10 pbx-flex-end pbx-cursor-pointer pbx-rounded-full pbx-flex pbx-items-center pbx-border-none pbx-justify-center pbx-bg-gray-200 pbx-aspect-square hover:pbx-bg-gray-100 hover:pbx-fill-white focus-visible:pbx-ring-0 pbx-text-myPrimaryDarkGrayColor",
22526
22526
  onClick: G[2] || (G[2] = (re) => y(t).clearHtmlSelection())
22527
22527
  }, G[11] || (G[11] = [
22528
22528
  d("span", { class: "material-symbols-outlined" }, " close", -1)
@@ -22964,7 +22964,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
22964
22964
  {
22965
22965
  title: "Single Image",
22966
22966
  html_code: `<section>
22967
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-1 lg:grid-cols-1"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div></div></div></div>
22967
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-1 lg:grid-cols-1"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div></div></div></div>
22968
22968
  </section>`,
22969
22969
  cover_image: null,
22970
22970
  category: "Image"
@@ -22972,7 +22972,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
22972
22972
  {
22973
22973
  title: "Two Vertical Images",
22974
22974
  html_code: `<section>
22975
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-2"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"> </div> </div> </div> </div>
22975
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-2"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"> </div> </div> </div> </div>
22976
22976
  </section>`,
22977
22977
  cover_image: null,
22978
22978
  category: "Image"
@@ -22980,7 +22980,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
22980
22980
  {
22981
22981
  title: "Two Square Images",
22982
22982
  html_code: `<section>
22983
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div></div> </div></div>
22983
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div></div> </div></div>
22984
22984
  </section>`,
22985
22985
  cover_image: null,
22986
22986
  category: "Image"
@@ -22988,7 +22988,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
22988
22988
  {
22989
22989
  title: "Three Square Images",
22990
22990
  html_code: `<section>
22991
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-3"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div></div> </div></div>
22991
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-3"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div></div> </div></div>
22992
22992
  </section>`,
22993
22993
  cover_image: null,
22994
22994
  category: "Image"
@@ -22996,7 +22996,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
22996
22996
  {
22997
22997
  title: "Four Square Images",
22998
22998
  html_code: `<section>
22999
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"> <div class="mx-auto max-w-7xl"> <div class="myPrimaryGap grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-4"> <div><img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div> <div><img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div> <div><img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div> <div><img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div> </div> </div> </div>
22999
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"> <div class="mx-auto max-w-7xl"> <div class="myPrimaryGap grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-4"> <div><img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div> <div><img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div> <div><img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div> <div><img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"></div> </div> </div> </div>
23000
23000
  </section>`,
23001
23001
  cover_image: null,
23002
23002
  category: "Image"
@@ -23004,7 +23004,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
23004
23004
  {
23005
23005
  title: "Six Square Images Grid",
23006
23006
  html_code: `<section>
23007
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2">
23007
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2">
23008
23008
  <div class="mx-auto max-w-7xl">
23009
23009
  <div class="grid grid-cols-2 md:grid-cols-3 myPrimaryGap">
23010
23010
 
@@ -23042,7 +23042,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
23042
23042
  {
23043
23043
  title: "Two Square Images With Text",
23044
23044
  html_code: `<section>
23045
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl">
23045
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl">
23046
23046
  <div class="myPrimaryGap lg:flex lg:justify-center"><div class="flex-1 py-2">
23047
23047
  <div class="grid myPrimaryGap grid-cols-1 lg:grid-cols-2"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> </div> </div> </div>
23048
23048
 
@@ -23055,7 +23055,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
23055
23055
  {
23056
23056
  title: "Three Vertical Images",
23057
23057
  html_code: `<section>
23058
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-3"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"></div></div> </div></div>
23058
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-3"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-[9/16] " src="${de}" alt="provider"></div></div> </div></div>
23059
23059
  </section>`,
23060
23060
  cover_image: null,
23061
23061
  category: "Image"
@@ -23063,7 +23063,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
23063
23063
  {
23064
23064
  title: "Four Square Images With Text",
23065
23065
  html_code: `<section>
23066
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-4"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"><div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> </div> </div> </div>
23066
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-4"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"><div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> </div> </div> </div>
23067
23067
  </section>`,
23068
23068
  cover_image: null,
23069
23069
  category: "Image & Text"
@@ -23071,7 +23071,7 @@ class="flex items-centre justify-start font-medium text-black bg-gray-200">
23071
23071
  {
23072
23072
  title: "Three Square Images With Text",
23073
23073
  html_code: `<section>
23074
- <div class="w-full md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-3"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> </div> </div> </div>
23074
+ <div class="md:pt-12 md:pb-12 pt-4 pb-4 lg:px-4 px-2"><div class="mx-auto max-w-7xl"><div class="myPrimaryGap grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-3"> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> <div class="flex-1 py-2"> <img class="object-cover w-full object-top aspect-square " src="${de}" alt="provider"> <div class="break-words py-2"><p>Layouts and visual.</p><p>Start customizing by editing this default text directly in the editor.</p></div> </div> </div> </div> </div>
23075
23075
  </section>`,
23076
23076
  cover_image: null,
23077
23077
  category: "Image & Text"
@@ -23101,7 +23101,7 @@ const Ak = {
23101
23101
  }, _k = { class: "pbx-flex pbx-items-center pbx-justify-center" }, Lk = { class: "pbx-inline-block pbx-h-8 pbx-w-8 pbx-animate-spin pbx-rounded-full pbx-border-4 pbx-border-solid pbx-border-current pbx-border-r-transparent pbx-align-[-0.125em] motion-reduce:pbx-animate-[spin_1.5s_linear_infinite]" }, Nk = { class: "!pbx-absolute !pbx-m-px !pbx-h-px !pbx-w-px !pbx-overflow-hidden !pbx-whitespace-nowrap !pbx-border-0 !pbx-p-0 !pbx-[clip:rect(0,0,0,0)]" }, Dk = { key: 1 }, Ik = { class: "pbx-mb-8" }, $k = { class: "pbx-myQuaternaryHeader pbx-mb-4" }, Rk = { class: "pbx-px-2 pbx-grid pbx-grid-cols-1 sm:pbx-grid-cols-2 md:pbx-grid-cols-3 lg:pbx-grid-cols-4 pbx-gap-4" }, Fk = ["onClick"], Hk = { class: "pbx-max-h-72 pbx-cursor-pointer pbx-object-contain pbx-bg-white pbx-mx-auto" }, jk = { class: "pbx-myPrimaryParagraph pbx-text-base pbx-font-medium" }, zk = { class: "pbx-myPrimaryParagraph pbx-text-xs pbx-font-normal pbx-pt-2" }, Vk = {
23102
23102
  key: 0,
23103
23103
  class: "pbx-px-2"
23104
- }, Wk = { class: "pbx-myQuaternaryHeader pbx-mb-4" }, Uk = { class: "pbx-mb-4 pbx-flex pbx-jusitify-left pbx-items-center pbx-gap-2" }, qk = ["onClick"], Kk = { class: "pbx-grid pbx-grid-cols-1 sm:pbx-grid-cols-2 md:pbx-grid-cols-3 pbx-gap-4 pbx-pb-4" }, Gk = ["onClick"], Jk = { class: "pbx-overflow-hidden pbx-whitespace-pre-line pbx-flex-1 pbx-h-auto pbx-border-solid pbx-border-b pbx-border-gray-200 lg:pbx-py-10 pbx-py-8 pbx-px-2" }, Yk = ["innerHTML"], Xk = { class: "pbx-p-3" }, Qk = { class: "pbx-myPrimaryParagraph pbx-text-sm pbx-font-normal" }, Zk = { class: "pbx-myPrimaryParagraph pbx-text-xs pbx-font-normal pbx-pt-2" }, eC = /* @__PURE__ */ Qe({
23104
+ }, Wk = { class: "pbx-myQuaternaryHeader pbx-mb-4" }, Uk = { class: "pbx-mb-4 pbx-flex pbx-jusitify-left pbx-items-center pbx-gap-2" }, qk = ["onClick"], Kk = { class: "pbx-grid pbx-grid-cols-1 sm:pbx-grid-cols-2 md:pbx-grid-cols-3 pbx-gap-4 pbx-pb-4" }, Gk = ["onClick"], Jk = { class: "pbx-overflow-hidden pbx-whitespace-pre-line pbx-flex-1 pbx-h-auto pbx-border-0 pbx-border-solid pbx-border-b pbx-border-gray-200 lg:pbx-py-10 pbx-py-8 pbx-px-2" }, Yk = ["innerHTML"], Xk = { class: "pbx-p-3" }, Qk = { class: "pbx-myPrimaryParagraph pbx-text-sm pbx-font-normal" }, Zk = { class: "pbx-myPrimaryParagraph pbx-text-xs pbx-font-normal pbx-pt-2" }, eC = /* @__PURE__ */ Qe({
23105
23105
  __name: "DefaultBuilderComponents",
23106
23106
  props: {
23107
23107
  customMediaComponent: {
@@ -23191,7 +23191,7 @@ const Ak = {
23191
23191
  ]))
23192
23192
  ]));
23193
23193
  }
23194
- }), tC = /* @__PURE__ */ Gs(eC, [["__scopeId", "data-v-aa1a3ef1"]]), nC = { class: "pbx-w-full pbx-inset-x-0 pbx-bg-white pbx-overflow-x-auto lg:pbx-pt-2 pbx-pt-2" }, rC = { key: 0 }, oC = { key: 1 }, iC = {
23194
+ }), tC = /* @__PURE__ */ Gs(eC, [["__scopeId", "data-v-2147a377"]]), nC = { class: "pbx-w-full pbx-inset-x-0 pbx-bg-white pbx-overflow-x-auto lg:pbx-pt-2 pbx-pt-2" }, rC = { key: 0 }, oC = { key: 1 }, iC = {
23195
23195
  __name: "BuilderComponents",
23196
23196
  props: {
23197
23197
  firstButtonText: {
@@ -24781,7 +24781,7 @@ const LC = ["src"], NC = {
24781
24781
  }, MT = { class: "pbx-overflow-hidden pbx-shadow pbx-ring-1 pbx-ring-black pbx-ring-opacity-5 md:pbx-rounded-lg" }, ET = { class: "pbx-overflow-x-auto" }, TT = { class: "pbx-w-max" }, OT = { class: "pbx-bg-white pbx-divide-y pbx-divide-gray-200" }, BT = { class: "pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500" }, PT = { class: "pbx-min-w-[30rem] pbx-w-max" }, AT = { key: 0 }, _T = { key: 1 }, LT = { key: 0 }, NT = { class: "pbx-px-6 pbx-py-4 pbx-whitespace-nowrap pbx-text-sm pbx-text-gray-500" }, DT = { class: "pbx-min-w-[30rem] pbx-w-max" }, IT = { class: "pbx-inline-flex pbx-items-center pbx-px-2.5 pbx-py-0.5 pbx-rounded-full pbx-text-xs pbx-font-medium" }, $T = { class: "pbx-mt-4 pbx-mb-4 pbx-py-8 pbx-px-2 pbx-border pbx-border-solid pbx-border-gray-600 pbx-rounded-xl" }, RT = { class: "pbx-mt-4 pbx-whitespace-pre-wrap pbx-text-white pbx-overflow-hidden pbx-bg-gray-900" }, FT = { class: "pbx-px-4 pbx-pb-8 pbx-pt-4 pbx-text-white pbx-text-xs pbx-break-all" }, HT = { class: "pbx-myPrimaryParagraph pbx-text-xs pbx-text-white" }, jT = {
24782
24782
  __name: "PageBuilderSettings",
24783
24783
  setup(n) {
24784
- const e = "3.3.99", t = Se, r = I(() => t.getPageBuilderConfig);
24784
+ const e = "3.4.2", t = Se, r = I(() => t.getPageBuilderConfig);
24785
24785
  return (o, i) => {
24786
24786
  var s, l, a, p, c, u, f, h, b, m, x, v, C, S, g, O;
24787
24787
  return w(), E("div", uE, [
@@ -25407,7 +25407,7 @@ const LC = ["src"], NC = {
25407
25407
  }
25408
25408
  }, MB = { class: "pbx-flex pbx-items-center pbx-justify-center" }, EB = { class: "pbx-mr-2" }, TB = {
25409
25409
  key: 0,
25410
- class: "pbx-flex pbx-items-center pbx-myPrimaryTag pbx-whitespace-nowrap pbx-py-0"
25410
+ class: "pbx-flex pbx-items-center pbx-myPrimaryTag pbx-whitespace-nowrap pbx-py-0 pbx-gap-2"
25411
25411
  }, OB = { class: "pbx-text-white pbx-rounded-full pbx-bg-myPrimaryBrandColor pbx-flex pbx-justify-center pbx-items-center pbx-text-xs pbx-d pbx-min-d pbx-max-d lg:pbx-w-8 lg:pbx-h-8 lg:pbx-min-w-8 lg:pbx-max-w-8 pbx-w-8 pbx-h-8 pbx-min-w-8 pbx-max-w-8 pbx-font-normal" }, BB = { class: "pbx-hidden pbx-text-xs pbx-d lg:pbx-flex pbx-items-center pbx-font-normal pbx-w-max pbx-break-keep" }, PB = {
25412
25412
  key: 1,
25413
25413
  class: "pbx-flex pbx-items-center lg:pbx-myPrimaryTag pbx-whitespace-nowrap pbx-py-0 pbx-gap-4 pbx-w-max pbx-h-12 pbx-ml-2"
@@ -25998,7 +25998,7 @@ const Bh = /* @__PURE__ */ Gs(HB, [["render", zB]]), VB = { class: "pbx-text-xs
25998
25998
  x.value && x.value.userSettings && x.value.userSettings.language ? (w(), E("div", cP, [
25999
25999
  xe(d("select", {
26000
26000
  id: "pbx-lang",
26001
- class: "pbx-myPrimarySelect pbx-min-w-20 pbx-max-w-2pbx-min-w-20 pbx-w-max",
26001
+ class: "pbx-myPrimarySelect pbx-min-w-20",
26002
26002
  "onUpdate:modelValue": _[11] || (_[11] = (le) => f.value = le)
26003
26003
  }, [
26004
26004
  Array.isArray(x.value.userSettings.language.enable) && x.value.userSettings.language.enable.length >= 1 ? (w(!0), E(Z, { key: 0 }, fe(y(t).availableLanguage().filter((le) => x.value.userSettings.language.enable.includes(le)), (le) => (w(), E("option", {