@myissue/vue-website-page-builder 3.3.1 → 3.3.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@myissue/vue-website-page-builder",
-  "version": "v3.3.1",
+  "version": "v3.3.11",
   "description": "Vue 3 page builder component with drag & drop functionality.",
   "type": "module",
   "main": "./dist/vue-website-page-builder.umd.cjs",

package/src/Components/PageBuilder/EditorMenu/EditorAccordion.vue

@@ -17,7 +17,7 @@
     </div>
     <div
       :class="[expanded ? 'pbx-block' : 'pbx-hidden']"
-      class="pbx-px-4 pbx-ease-linear pbx-duration-75"
+      class="pbx-px-4 pbx-ease-linear pbx-duration-75 pbx-pb-8"
     >
       <slot name="content" />
     </div>

package/src/PageBuilder/PageBuilder.vue

@@ -260,10 +260,7 @@ const ensureBuilderInitialized = function () {
 }
 
 onMounted(async () => {
-  // Try to mount any pending data if #pagebuilder is now present
-  if (pageBuilderService.statuspendingMountData()) {
-    await pageBuilderService.tryMountPendingData()
-  }
+  await pageBuilderService.tryMountPendingData()
 
   // Check if Builder started
   await delay(10000)

package/src/composables/PageBuilderService.ts

@@ -224,6 +224,11 @@ export class PageBuilderService {
     this.#updateLocalStorageItemName()
 
     this.completeBuilderInitialization()
+
+    const formType = config.updateOrCreate && config.updateOrCreate.formType
+    if (formType === 'create') {
+      await this.mountComponentsToDOM('')
+    }
   }
 
   async completeBuilderInitialization() {
@@ -1836,7 +1841,14 @@ export class PageBuilderService {
 
     // If #pagebuilder is not present, cache the data and exit
     if (!pagebuilder) {
-      this.pendingMountData = passedData
+      // For 'create', set pendingMountData to '' (empty string)
+      const config = this.pageBuilderStateStore.getPageBuilderConfig
+      const formType = config && config.updateOrCreate && config.updateOrCreate.formType
+      if (formType === 'create') {
+        this.pendingMountData = ''
+      } else {
+        this.pendingMountData = passedData
+      }
       return
     }
 
@@ -1892,16 +1904,34 @@ export class PageBuilderService {
     }
   }
 
-  statuspendingMountData(): string | null {
-    return this.pendingMountData
-  }
-
-  // Try re-mounting
   async tryMountPendingData() {
-    if (this.pendingMountData && document.querySelector('#pagebuilder')) {
+    const pagebuilder = document.querySelector('#pagebuilder')
+
+    // Only run if #pagebuilder exists
+    if (!pagebuilder) return
+
+    // If pendingMountData is a non-empty string (update or demo), always mount
+    if (this.pendingMountData && typeof this.pendingMountData === 'string') {
       await this.mountComponentsToDOM(this.pendingMountData)
       this.pendingMountData = null
       this.completeBuilderInitialization()
+      return
+    }
+
+    // If pendingMountData is exactly '', and formType is 'create', and no components are mounted, mount for create
+    const config = this.pageBuilderStateStore.getPageBuilderConfig
+    const formType = config && config.updateOrCreate && config.updateOrCreate.formType
+    const components = this.pageBuilderStateStore.getComponents
+
+    if (
+      this.pendingMountData === '' &&
+      formType === 'create' &&
+      (!components || (Array.isArray(components) && components.length === 0))
+    ) {
+      await this.mountComponentsToDOM('')
+      this.pendingMountData = null
+      this.completeBuilderInitialization()
+      return
     }
   }