refactor(core): remove theme data from site data

BREAKING CHANGE: `themeConfig` is not available in site data any more

Author: meteorlxy

packages/@vuepress/client/src/app.ts

@@ -22,10 +22,6 @@ import {
   resolvePageLang,
   routeLocaleSymbol,
   resolveRouteLocale,
-  themeDataSymbol,
-  resolveThemeData,
-  themeLocaleDataSymbol,
-  resolveThemeLocaleData,
   siteLocaleDataSymbol,
   resolveSiteLocaleData,
   useUpdateHead,
@@ -108,10 +104,6 @@ export const createVueApp = async ({
   const siteLocaleData = computed(() =>
     resolveSiteLocaleData(siteData.value, routeLocale.value)
   )
-  const themeData = computed(() => resolveThemeData(siteData.value))
-  const themeLocaleData = computed(() =>
-    resolveThemeLocaleData(siteLocaleData.value)
-  )
   const pageFrontmatter = computed(() => resolvePageFrontmatter(pageData.value))
   const pageHeadTitle = computed(() =>
     resolvePageHeadTitle(pageData.value, siteLocaleData.value)
@@ -128,8 +120,6 @@ export const createVueApp = async ({
   // provide global computed
   app.provide(routeLocaleSymbol, routeLocale)
   app.provide(siteLocaleDataSymbol, siteLocaleData)
-  app.provide(themeDataSymbol, themeData)
-  app.provide(themeLocaleDataSymbol, themeLocaleData)
   app.provide(pageFrontmatterSymbol, pageFrontmatter)
   app.provide(pageHeadTitleSymbol, pageHeadTitle)
   app.provide(pageHeadSymbol, pageHead)
@@ -152,16 +142,6 @@ export const createVueApp = async ({
         return siteLocaleData.value
       },
     },
-    $theme: {
-      get() {
-        return themeData.value
-      },
-    },
-    $themeLocale: {
-      get() {
-        return themeLocaleData.value
-      },
-    },
     $page: {
       get() {
         return pageData.value

packages/@vuepress/client/src/injections/index.ts

@@ -5,7 +5,6 @@ export * from './pageHeadTitle'
 export * from './pageLang'
 export * from './pagesData'
 export * from './routeLocale'
-export * from './themeData'
 export * from './siteData'
 export * from './siteLocaleData'
 export * from './updateHead'

packages/@vuepress/client/src/injections/siteData.ts

@@ -1,20 +1,14 @@
 import { readonly, ref } from 'vue'
 import type { Ref } from 'vue'
-import type { SiteData, SiteThemeConfig } from '@vuepress/shared'
+import type { SiteData } from '@vuepress/shared'
 import { siteData as siteDataRaw } from '@internal/siteData'
 
 export type { SiteData }
-export type SiteDataRef<T extends SiteThemeConfig = SiteThemeConfig> = Ref<
-  SiteData<T>
->
+export type SiteDataRef = Ref<SiteData>
 
 export const siteData: SiteDataRef = ref(readonly(siteDataRaw) as SiteData)
 
-export const useSiteData = <
-  T extends SiteThemeConfig = SiteThemeConfig
->(): SiteDataRef<T> => {
-  return siteData as SiteDataRef<T>
-}
+export const useSiteData = (): SiteDataRef => siteData
 
 if (import.meta.webpackHot) {
   import.meta.webpackHot!.accept('@internal/siteData', () => {

packages/@vuepress/client/src/injections/siteLocaleData.ts

@@ -1,47 +1,32 @@
 import { inject } from 'vue'
 import type { ComputedRef, InjectionKey } from 'vue'
-import type { SiteData, SiteThemeConfig } from '@vuepress/shared'
+import type { SiteData } from '@vuepress/shared'
 import type { RouteLocale } from './routeLocale'
 
-export type SiteLocaleData<
-  T extends SiteThemeConfig = SiteThemeConfig
-> = SiteData<T>
+export type SiteLocaleData = SiteData
 
-export type SiteLocaleDataRef<
-  T extends SiteThemeConfig = SiteThemeConfig
-> = ComputedRef<SiteLocaleData<T>>
+export type SiteLocaleDataRef = ComputedRef<SiteLocaleData>
 
 export const siteLocaleDataSymbol: InjectionKey<SiteLocaleDataRef> = Symbol(
   __DEV__ ? 'siteLocaleData' : ''
 )
 
-export const useSiteLocaleData = <
-  T extends SiteThemeConfig = SiteThemeConfig
->(): SiteLocaleDataRef<T> => {
+export const useSiteLocaleData = (): SiteLocaleDataRef => {
   const siteLocaleData = inject(siteLocaleDataSymbol)
   if (!siteLocaleData) {
     throw new Error('useSiteLocaleData() is called without provider.')
   }
-  return siteLocaleData as SiteLocaleDataRef<T>
+  return siteLocaleData
 }
 
 /**
  * Merge the locales fields to the root fields
  * according to the route path
  */
-export const resolveSiteLocaleData = <T extends SiteThemeConfig>(
-  { base, lang, title, description, head, locales, themeConfig }: SiteData<T>,
+export const resolveSiteLocaleData = (
+  site: SiteData,
   routeLocale: RouteLocale
-): SiteLocaleData<T> => ({
-  base,
-  lang,
-  title,
-  description,
-  head,
-  locales,
-  ...(locales[routeLocale] ?? {}),
-  themeConfig: {
-    ...themeConfig,
-    ...(themeConfig.locales?.[routeLocale] ?? {}),
-  },
+): SiteLocaleData => ({
+  ...site,
+  ...site.locales[routeLocale],
 })

packages/@vuepress/client/src/injections/themeData.ts

@@ -13,6 +13,5 @@ export const createAppSiteData = (options: AppOptions): SiteData => {
     description: options.description,
     head: options.head,
     locales: options.locales,
-    themeConfig: options.themeConfig,
   }
 }

packages/@vuepress/core/src/app/createAppSiteData.ts

@@ -11,7 +11,6 @@ import type {
   PageHeader,
   SiteData,
   SiteLocaleConfig,
-  SiteThemeConfig,
 } from '@vuepress/shared'
 
 export type {
@@ -27,7 +26,6 @@ export type {
   PageHeader,
   SiteData,
   SiteLocaleConfig,
-  SiteThemeConfig,
 }
 
 export * from './app'

packages/@vuepress/core/src/types/index.ts

@@ -1,4 +1,3 @@
-import type { LocaleData, SiteThemeConfig } from '@vuepress/shared'
 import type { Plugin, PluginFunction, PluginObject } from './plugin'
 
 /**
@@ -10,16 +9,15 @@ import type { Plugin, PluginFunction, PluginObject } from './plugin'
  *
  * A theme package should have a `Theme` as the default export
  */
-export type Theme<
-  T extends Record<string, unknown> = Record<never, never>
-> = Plugin<T, ThemeObject>
+export type Theme<T extends ThemeConfig = ThemeConfig> = Plugin<T, ThemeObject>
 
 /**
  * Vuepress theme function
  */
-export type ThemeFunction<
-  T extends Record<string, unknown> = Record<never, never>
-> = PluginFunction<T, ThemeObject>
+export type ThemeFunction<T extends ThemeConfig = ThemeConfig> = PluginFunction<
+  T,
+  ThemeObject
+>
 
 /**
  * Vuepress theme object
@@ -44,6 +42,4 @@ export interface ThemeObject extends PluginObject {
  *
  * @remark suffix `Config` means this is for user config
  */
-export type ThemeConfig<
-  ThemeLocaleData extends LocaleData = LocaleData
-> = SiteThemeConfig<ThemeLocaleData>
+export type ThemeConfig = Record<string, any>

packages/@vuepress/core/src/types/theme.ts

@@ -1,19 +1,15 @@
 import type { HeadConfig } from './head'
-import type { LocaleConfig, LocaleData } from './locale'
+import type { LocaleConfig } from './locale'
 
 /**
  * Vuepress site data
  */
-export interface SiteData<T extends SiteThemeConfig = SiteThemeConfig>
-  extends SiteLocaleData {
+export interface SiteData extends SiteLocaleData {
   // site base
   base: string
 
   // locale config
   locales: SiteLocaleConfig
-
-  // theme config
-  themeConfig: Partial<T>
 }
 
 /**
@@ -57,15 +53,3 @@ export interface SiteLocaleData {
  * @remark suffix `Config` means this is for user config
  */
 export type SiteLocaleConfig = LocaleConfig<SiteLocaleData>
-
-/**
- * Site theme config
- *
- * @remark suffix `Config` means this is for user config
- */
-export type SiteThemeConfig<
-  ThemeLocaleData extends LocaleData = LocaleData
-> = ThemeLocaleData & {
-  locales?: LocaleConfig<ThemeLocaleData>
-  [key: string]: any
-}

packages/@vuepress/shared/src/types/site.ts

@@ -38,6 +38,7 @@
     "@vuepress/plugin-medium-zoom": "2.0.0-alpha.24",
     "@vuepress/plugin-nprogress": "2.0.0-alpha.24",
     "@vuepress/plugin-palette-stylus": "2.0.0-alpha.24",
+    "@vuepress/plugin-theme-data": "2.0.0-alpha.24",
     "@vuepress/shared": "2.0.0-alpha.24",
     "@vuepress/utils": "2.0.0-alpha.24",
     "prismjs": "^1.23.0",