feat(client): add support for SFC in tabs view

[FliPPeDround]

Hello

I'm currently working on implementing a plugin for Devtools, and I've noticed that the tab currently only supports static VNode. While this works fine for many use cases, I was wondering if it might be possible to provide more

To this end, I've created this PR as an initial attempt to introduce support for SFC. I would love to hear your thoughts on whether this feature aligns with the project's goals and if there are any considerations or improvements we should take into account. If you have any concerns or suggestions, please let me know – I'm more than happy to make adjustments based on your feedback.

Thank you very much for your time and consideration!

import { addCustomTab } from '@vue/devtools-kit'

addCustomTab({
  name: 'plugin_count',
  title: 'Plugin Count',
  icon: 'baseline-exposure-plus-1',
  view: {
    type: 'sfc',
    sfc: `
		<script setup lang="ts">
		import { ref } from 'vue'
		
		const count = ref(0)
		</script>
		
		<template>
		  <div class="h-full w-full flex flex-col items-center justify-center">
		    <div>
		      count is {{ count }}
		    </div>
		    <button class="btn" @click="count++">
		      increment
		    </button>
		  </div>
		</template>
		
		<style scoped>
		.btn {
		  background-color: #4c51bf;
		  color: #fff;
		  padding: 0.5rem 1rem;
		  border-radius: 0.25rem;
		  border: none;
		  cursor: pointer;
		}
		</style>
		`,
  },
  category: 'app',
})

[netlify]

✅ Deploy Preview for vue-devtools-docs canceled.

Name	Link
🔨 Latest commit	66522a0
🔍 Latest deploy log	https://app.netlify.com/sites/vue-devtools-docs/deploys/678b29a3b5ae460008613b65