diff --git a/playground/index.html b/playground/index.html index 8719d99..8c6779e 100644 --- a/playground/index.html +++ b/playground/index.html @@ -3,9 +3,8 @@ - - Vitesse Lite - + TextMate Playground +
diff --git a/playground/src/App.vue b/playground/src/App.vue index 0b0731d..269676d 100644 --- a/playground/src/App.vue +++ b/playground/src/App.vue @@ -3,7 +3,7 @@ import { getHighlighterCore } from 'shiki/core' import { themes } from '../../packages/tm-themes/index' import { grammars } from '../../packages/tm-grammars/index' -useDark() +const isDark = useDark() const theme = useStorage('tm-theme', 'vitesse-dark') const grammar = useStorage('tm-grammar', 'javascript') @@ -13,6 +13,9 @@ const error = ref(null) const input = ref('console.log("Hello World")') const output = ref('') +const grammarObject = computed(() => grammars.find(g => g.name === grammar.value)) +const themeObject = computed(() => themes.find(t => t.name === theme.value)) + async function run() { error.value = null try { @@ -76,6 +79,8 @@ function random() { watch([theme, grammar], run, { immediate: true }) +useTitle(() => `${grammarObject.value?.displayName || grammar.value} - ${themeObject.value?.displayName || theme.value} - TextMate Playground`) + if (import.meta.hot) { import.meta.hot.accept(() => { run() @@ -84,8 +89,8 @@ if (import.meta.hot) {