fix tab field instructions

dist/build/assets/statamic-tabs-77515875.css

@@ -0,0 +1 @@
+.super-invisible{visibility:hidden;position:absolute;top:0;left:0;width:0;height:0}.tabpanel>.help-block{margin-top:0!important}

dist/build/manifest.json

@@ -1,11 +1,11 @@
 {
   "resources/css/statamic-tabs.css": {
-    "file": "assets/statamic-tabs-1bd0fef2.css",
+    "file": "assets/statamic-tabs-77515875.css",
     "isEntry": true,
     "src": "resources/css/statamic-tabs.css"
   },
   "resources/js/statamic-tabs.js": {
-    "file": "assets/statamic-tabs-a795db86.js",
+    "file": "assets/statamic-tabs-dbf54b3e.js",
     "isEntry": true,
     "src": "resources/js/statamic-tabs.js"
   }

resources/css/statamic-tabs.css

@@ -8,4 +8,8 @@
     left: 0;
     width: 0;
     height: 0;
+}
+
+.tabpanel > .help-block {
+    margin-top: 0 !important;
 }

resources/js/compontents/TabFieldtype.vue

@@ -10,10 +10,11 @@
             </div>
         </div>
 
-        <div role="tabpanel" v-for="tab, index in tabs" class="tabpanel" :class="{ block: tab.active, hidden: !tab.active }" :id="'tab-content-' + tab.id" :style="tabPanelStyle">
-            <div class="publish-fields @container w-full"></div>
+        <div role="tabpanel" v-for="tab, index in tabs" class="tabpanel" :class="{ block: tab.active, hidden: !tab.active }" :id="'tab-content-' + tab.id">
+            <div :style="tabPanelStyle">
+                <div class="publish-fields @container w-full"></div>
+            </div>
         </div>
-
     </div>
 </template>
 
@@ -121,6 +122,21 @@ export default {
             this.$events.$emit('tabs.push-' + this.mainTab.dataset.uniqid, this.tab)
         }
 
+        /** Move the tab field instructions to the right place */
+        this.$nextTick(() => {
+            const instructions = this.$el.closest('.publish-field').querySelector('.help-block')
+            if (instructions) {
+                if (this.isMainTab) {
+                    document.getElementById('tab-content-' + this.tabs[0].id).prepend(instructions)
+                    this.$events.$on('tabs.prepend-instructions-' + this.tab.id, (element, id) => {
+                        document.getElementById('tab-content-' + id).prepend(element)
+                    })
+                } else {
+                    this.$events.$emit('tabs.prepend-instructions-' + this.mainTab.dataset.uniqid, instructions, this.tab.id)
+                }
+            }
+        })
+
         /** Find all next siblings that are fields, but stop if you encounter an other tab */
         let element = this.$el.closest('.publish-field')
         let nextSiblings = [];