[6.x] Stack fixes

resources/js/components/blueprints/Fields.vue

@@ -134,7 +134,7 @@ export default {
                 },
             };
 
-            setTimeout(() => (this.pendingCreatedField = pending), 500); // wait for stack to close
+            this.pendingCreatedField = pending;
         },
 
         createField() {

resources/js/components/blueprints/Section.vue

@@ -228,7 +228,7 @@ export default {
             this.$toast.success(__('Field added'));
 
             if (field.type === 'reference') {
-                this.$nextTick(() => (this.editingField = field._id));
+                this.editingField = field._id;
             }
         },
 

resources/js/components/portals/PortalTargets.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="portal-targets" :class="{ 'stacks-on-stacks': hasStacks, 'solo-narrow-stack': isSoloNarrowStack }">
-        <div v-for="(portal, i) in portals" :id="`portal-target-${portal.id}`" />
+        <div v-for="(portal, i) in portals" :key="portal.id" :id="`portal-target-${portal.id}`" />
     </div>
 </template>
 

resources/js/components/ui/Stack/Stack.vue

@@ -55,7 +55,7 @@ const hasStackHeaderComponent = hasComponent('StackHeader', slotProps);
 const hasStackContentComponent = hasComponent('StackContent', slotProps);
 const isUsingOpenProp = computed(() => instance?.vnode.props?.hasOwnProperty('open'));
 const portal = computed(() => stack.value ? `#portal-target-${stack.value.id}` : null);
-const depth = computed(() => stack.value?.data.depth);
+const depth = computed(() => stacks.stacks().findIndex(s => s.id === stack.value.id) + 1);
 const isTopStack = computed(() => stacks.count() === depth.value);
 
 const shouldAddHeader = computed(() => !!(props.title || props.icon) && !hasStackHeaderComponent.value);

resources/js/components/ui/Stack/Stacks.js

@@ -10,7 +10,6 @@ export default class Stacks {
     add(vm) {
         return this.$portals.create('stack', {
             type: 'stack',
-            depth: this.count() + 1,
             vm,
         });
     }