diff --git a/client.d.ts b/client.d.ts index 440251f7..32fcebe2 100644 --- a/client.d.ts +++ b/client.d.ts @@ -3,3 +3,12 @@ /// export * from './dist/client/index.js' + +declare global { + interface WindowEventMap { + 'vitepress:codeGroupTabActivate': Event & { + /** code block element that was activated */ + detail: Element + } + } +} diff --git a/src/client/app/composables/codeGroups.ts b/src/client/app/composables/codeGroups.ts index d8a38ba7..ba56bc05 100644 --- a/src/client/app/composables/codeGroups.ts +++ b/src/client/app/composables/codeGroups.ts @@ -7,7 +7,7 @@ export function useCodeGroups() { Array.from(el.children).forEach((child) => { child.classList.remove('active') }) - el.children[0].classList.add('active') + activate(el.children[0]) }) }) } @@ -36,7 +36,7 @@ export function useCodeGroups() { if (!next || current === next) return current.classList.remove('active') - next.classList.add('active') + activate(next) const label = group?.querySelector(`label[for="${el.id}"]`) label?.scrollIntoView({ block: 'nearest' }) @@ -44,3 +44,10 @@ export function useCodeGroups() { }) } } + +function activate(el: Element): void { + el.classList.add('active') + window.dispatchEvent( + new CustomEvent('vitepress:codeGroupTabActivate', { detail: el }) + ) +} diff --git a/src/client/tsconfig.json b/src/client/tsconfig.json index ca0d2efd..7dca07bf 100644 --- a/src/client/tsconfig.json +++ b/src/client/tsconfig.json @@ -5,7 +5,7 @@ "outDir": "../../dist/client", "declaration": true, "declarationDir": "../../dist/client-types", - "types": ["vite/client", "@types/node"], + "types": ["../../client.d.ts", "@types/node"], "paths": { "vitepress": ["index.ts"], "vitepress/theme": ["../../theme.d.ts"]