@dcodegroup-au/page-builder 0.6.0 → 0.6.1

package/dist/page-builder.es.js

@@ -48902,8 +48902,11 @@ const _sfc_main$f = {
   }
 };
 const _hoisted_1$r = { class: "overflow-hidden mt-4" };
-const _hoisted_2$d = { class: "text-[36px] text-gray-900 font-semibold" };
-const _hoisted_3$d = { class: "all-unset" };
+const _hoisted_2$d = {
+  key: 0,
+  class: "text-[36px] text-gray-900 font-semibold"
+};
+const _hoisted_3$d = { class: "all-unset ql-editor" };
 const _hoisted_4$d = ["innerHTML"];
 const _hoisted_5$d = { key: 0 };
 const _hoisted_6$d = ["href"];
@@ -48954,23 +48957,23 @@ const _sfc_main$e = {
       }
     };
     return (_ctx, _cache) => {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
+      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
       return openBlock(), createElementBlock("div", _hoisted_1$r, [
         createElementVNode("div", {
-          class: normalizeClass(["max-w-[1640px] md:px-[120px] mx-auto w-full pt-4 mb-4 flex gap-16 items-center", { "flex-row-reverse mt-6 !mb-10": (_a = section.value) == null ? void 0 : _a.revert }])
+          class: normalizeClass(["max-w-[1640px] md:px-[120px] mx-auto w-full pt-4 mb-4 flex gap-16 items-center", { "flex-row-reverse mt-6 !mb-10": (_a = section.value) == null ? void 0 : _a.revert, "justify-center": (_b = section.value) == null ? void 0 : _b.center }])
         }, [
-          ((_b = component.value) == null ? void 0 : _b.title) ? (openBlock(), createElementBlock("div", {
+          ((_c = component.value) == null ? void 0 : _c.title) || ((_d = component.value) == null ? void 0 : _d.paragraph) ? (openBlock(), createElementBlock("div", {
             key: 0,
-            class: normalizeClass(["max-w-[800px] py-4", { "!max-w-full w-full": (_c = section.value) == null ? void 0 : _c.is_full_width }]),
+            class: normalizeClass(["max-w-[800px] py-4", { "!max-w-full w-full": (_e = section.value) == null ? void 0 : _e.is_full_width }]),
             ref_key: "leftColumn",
             ref: leftColumn
           }, [
-            createElementVNode("h3", _hoisted_2$d, toDisplayString(component.value.title), 1),
+            ((_f = component.value) == null ? void 0 : _f.title) ? (openBlock(), createElementBlock("h3", _hoisted_2$d, toDisplayString(component.value.title), 1)) : createCommentVNode("", true),
             createElementVNode("div", _hoisted_3$d, [
               createElementVNode("div", {
                 innerHTML: component.value.paragraph
               }, null, 8, _hoisted_4$d),
-              ((_d = component.value) == null ? void 0 : _d.hasOwnProperty("button")) && button.value.show ? (openBlock(), createElementBlock("div", _hoisted_5$d, [
+              ((_g = component.value) == null ? void 0 : _g.hasOwnProperty("button")) && button.value.show ? (openBlock(), createElementBlock("div", _hoisted_5$d, [
                 createElementVNode("a", {
                   href: button.value.url,
                   class: "inline-flex items-center gap-2 !no-underline px-3 py-2.5 rounded-full shadow-xs text-md font-semibold !text-white bg-brand-600 hover:bg-brand-700 border border-brand-600 text-center cursor-pointer"
@@ -48981,13 +48984,13 @@ const _sfc_main$e = {
               ])) : createCommentVNode("", true)
             ])
           ], 2)) : createCommentVNode("", true),
-          ((_e = component.value) == null ? void 0 : _e.featured_image) ? (openBlock(), createElementBlock("div", {
+          ((_h = component.value) == null ? void 0 : _h.featured_image) ? (openBlock(), createElementBlock("div", {
             key: 1,
             class: "w-full max-w-[536px] rounded-[24px] overflow-hidden",
             ref_key: "rightColumn",
             ref: rightColumn
           }, [
-            ((_f = component.value) == null ? void 0 : _f.source_type) === "video" ? (openBlock(), createElementBlock("div", _hoisted_7$d, [
+            ((_i = component.value) == null ? void 0 : _i.source_type) === "video" ? (openBlock(), createElementBlock("div", _hoisted_7$d, [
               createElementVNode("video", {
                 onClick: togglePlayPause,
                 preload: "metadata",
@@ -48996,7 +48999,7 @@ const _sfc_main$e = {
                 class: "h-full w-full object-cover"
               }, [
                 createElementVNode("source", {
-                  src: `${(_g = component.value) == null ? void 0 : _g.featured_image}#t=2`
+                  src: `${(_j = component.value) == null ? void 0 : _j.featured_image}#t=2`
                 }, null, 8, _hoisted_8$c)
               ], 512),
               !isPlaying.value ? (openBlock(), createBlock(unref(PlayButton), {
@@ -49006,7 +49009,7 @@ const _sfc_main$e = {
               })) : createCommentVNode("", true)
             ])) : (openBlock(), createElementBlock("img", {
               key: 1,
-              src: (_h = component.value) == null ? void 0 : _h.featured_image,
+              src: (_k = component.value) == null ? void 0 : _k.featured_image,
               alt: "Feature Image",
               class: "w-full h-full object-cover rounded-[24px]"
             }, null, 8, _hoisted_9$c))

package/dist/page-builder.umd.js

@@ -48905,8 +48905,11 @@ ${escapeText(this.code(index, length))}
     }
   };
   const _hoisted_1$r = { class: "overflow-hidden mt-4" };
-  const _hoisted_2$d = { class: "text-[36px] text-gray-900 font-semibold" };
-  const _hoisted_3$d = { class: "all-unset" };
+  const _hoisted_2$d = {
+    key: 0,
+    class: "text-[36px] text-gray-900 font-semibold"
+  };
+  const _hoisted_3$d = { class: "all-unset ql-editor" };
   const _hoisted_4$d = ["innerHTML"];
   const _hoisted_5$d = { key: 0 };
   const _hoisted_6$d = ["href"];
@@ -48957,23 +48960,23 @@ ${escapeText(this.code(index, length))}
         }
       };
       return (_ctx, _cache) => {
-        var _a, _b, _c, _d, _e, _f, _g, _h;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
         return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$r, [
           vue.createElementVNode("div", {
-            class: vue.normalizeClass(["max-w-[1640px] md:px-[120px] mx-auto w-full pt-4 mb-4 flex gap-16 items-center", { "flex-row-reverse mt-6 !mb-10": (_a = section.value) == null ? void 0 : _a.revert }])
+            class: vue.normalizeClass(["max-w-[1640px] md:px-[120px] mx-auto w-full pt-4 mb-4 flex gap-16 items-center", { "flex-row-reverse mt-6 !mb-10": (_a = section.value) == null ? void 0 : _a.revert, "justify-center": (_b = section.value) == null ? void 0 : _b.center }])
           }, [
-            ((_b = component.value) == null ? void 0 : _b.title) ? (vue.openBlock(), vue.createElementBlock("div", {
+            ((_c = component.value) == null ? void 0 : _c.title) || ((_d = component.value) == null ? void 0 : _d.paragraph) ? (vue.openBlock(), vue.createElementBlock("div", {
               key: 0,
-              class: vue.normalizeClass(["max-w-[800px] py-4", { "!max-w-full w-full": (_c = section.value) == null ? void 0 : _c.is_full_width }]),
+              class: vue.normalizeClass(["max-w-[800px] py-4", { "!max-w-full w-full": (_e = section.value) == null ? void 0 : _e.is_full_width }]),
               ref_key: "leftColumn",
               ref: leftColumn
             }, [
-              vue.createElementVNode("h3", _hoisted_2$d, vue.toDisplayString(component.value.title), 1),
+              ((_f = component.value) == null ? void 0 : _f.title) ? (vue.openBlock(), vue.createElementBlock("h3", _hoisted_2$d, vue.toDisplayString(component.value.title), 1)) : vue.createCommentVNode("", true),
               vue.createElementVNode("div", _hoisted_3$d, [
                 vue.createElementVNode("div", {
                   innerHTML: component.value.paragraph
                 }, null, 8, _hoisted_4$d),
-                ((_d = component.value) == null ? void 0 : _d.hasOwnProperty("button")) && button.value.show ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$d, [
+                ((_g = component.value) == null ? void 0 : _g.hasOwnProperty("button")) && button.value.show ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$d, [
                   vue.createElementVNode("a", {
                     href: button.value.url,
                     class: "inline-flex items-center gap-2 !no-underline px-3 py-2.5 rounded-full shadow-xs text-md font-semibold !text-white bg-brand-600 hover:bg-brand-700 border border-brand-600 text-center cursor-pointer"
@@ -48984,13 +48987,13 @@ ${escapeText(this.code(index, length))}
                 ])) : vue.createCommentVNode("", true)
               ])
             ], 2)) : vue.createCommentVNode("", true),
-            ((_e = component.value) == null ? void 0 : _e.featured_image) ? (vue.openBlock(), vue.createElementBlock("div", {
+            ((_h = component.value) == null ? void 0 : _h.featured_image) ? (vue.openBlock(), vue.createElementBlock("div", {
               key: 1,
               class: "w-full max-w-[536px] rounded-[24px] overflow-hidden",
               ref_key: "rightColumn",
               ref: rightColumn
             }, [
-              ((_f = component.value) == null ? void 0 : _f.source_type) === "video" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$d, [
+              ((_i = component.value) == null ? void 0 : _i.source_type) === "video" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$d, [
                 vue.createElementVNode("video", {
                   onClick: togglePlayPause,
                   preload: "metadata",
@@ -48999,7 +49002,7 @@ ${escapeText(this.code(index, length))}
                   class: "h-full w-full object-cover"
                 }, [
                   vue.createElementVNode("source", {
-                    src: `${(_g = component.value) == null ? void 0 : _g.featured_image}#t=2`
+                    src: `${(_j = component.value) == null ? void 0 : _j.featured_image}#t=2`
                   }, null, 8, _hoisted_8$c)
                 ], 512),
                 !isPlaying.value ? (vue.openBlock(), vue.createBlock(vue.unref(PlayButton), {
@@ -49009,7 +49012,7 @@ ${escapeText(this.code(index, length))}
                 })) : vue.createCommentVNode("", true)
               ])) : (vue.openBlock(), vue.createElementBlock("img", {
                 key: 1,
-                src: (_h = component.value) == null ? void 0 : _h.featured_image,
+                src: (_k = component.value) == null ? void 0 : _k.featured_image,
                 alt: "Feature Image",
                 class: "w-full h-full object-cover rounded-[24px]"
               }, null, 8, _hoisted_9$c))

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcodegroup-au/page-builder",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "exports": {
     ".": {
       "import": "./dist/page-builder.es.js"

package/src/components/presenters/modules/Paragraph.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="overflow-hidden mt-4">
-    <div class="max-w-[1640px] md:px-[120px] mx-auto w-full pt-4 mb-4 flex gap-16 items-center" :class="{'flex-row-reverse mt-6 !mb-10': section?.revert}">
-      <div class="max-w-[800px] py-4" :class="{'!max-w-full w-full': section?.is_full_width }" v-if="component?.title" ref="leftColumn">
-        <h3 class="text-[36px] text-gray-900 font-semibold">
+    <div class="max-w-[1640px] md:px-[120px] mx-auto w-full pt-4 mb-4 flex gap-16 items-center" :class="{'flex-row-reverse mt-6 !mb-10': section?.revert, 'justify-center': section?.center }">
+      <div class="max-w-[800px] py-4" :class="{'!max-w-full w-full': section?.is_full_width }" v-if="component?.title || component?.paragraph" ref="leftColumn">
+        <h3 class="text-[36px] text-gray-900 font-semibold" v-if="component?.title">
           {{ component.title }}
         </h3>
-        <div class="all-unset">
+        <div class="all-unset ql-editor">
           <div v-html="component.paragraph"></div>
           <div v-if="component?.hasOwnProperty('button') && button.show">
             <a :href="button.url"
@@ -40,6 +40,7 @@
 import {ref, onMounted, computed} from "vue";
 import PlayButton from "@/assets/svg/play.svg";
 import ArrowUpRight from "@/assets/img/icons/arrow-up-right.svg";
+import "quill/dist/quill.snow.css";
 
 const props = defineProps({
   section: {