before vue-hljs-with-line-number

assets/js/components/pages/edit.vue

@@ -3,7 +3,7 @@
 		v-if="!isLoading"
 		class="box p-3"
 	>
-		<tab-wrapper @tabActivated="tabActivated">
+		<tabs-group @tabActivated="tabActivated">
 			<tab-content title="Visual Editor">
 				<div class="editor mt-2">
 					<VueEditor
@@ -21,7 +21,7 @@
 					/>
 				</div>
 			</tab-content>
-		</tab-wrapper>
+		</tabs-group>
 		<button
 			class="btn btn-primary mt-3 mb-2"
 			@click="saveContent"
@@ -46,14 +46,14 @@ import { VueEditor } from 'vue3-editor'
 import hljs from 'highlightjs'
 import 'highlightjs/styles/dracula.css'
 
-import TabWrapper from '@/components/tabs/TabWrapper'
+import TabsGroup from '@/components/tabs/TabsGroup'
 import TabContent from '@/components/tabs/TabContent'
 
 export default {
 	name: 'PagesEdit',
 	components: {
 		VueEditor,
-		TabWrapper,
+		TabsGroup,
 		TabContent
 	},
 	data: () => ({

assets/js/components/pages/index.vue

@@ -23,6 +23,11 @@
 
 <script>
 import axios from 'axios'
+//import h from 'highlightjs'
+//import hi from 'highlightjs-line-numbers.js'
+
+//hi.highlightAll()
+//hi.initLineNumbersOnLoad()
 
 export default {
 	name: 'PagesDisplay',

assets/js/components/tabs/TabsGroup.vue

@@ -18,7 +18,7 @@
 import { ref, provide } from 'vue'
 
 export default {
-	name: 'TabWrapper',
+	name: 'TabsGroup',
 	setup(props, { slots }) {
 		const tabTitles = ref(slots.default()
 			.map((tab) => tab.props.title))