@vuepress/client 2.0.0-beta.49 → 2.0.0-beta.50-pre.1

package/dist/app.js

@@ -15,7 +15,7 @@ import {
   usePageHead,
   usePageLang,
   withBase
-} from "./chunk-OOQFWU6B.js";
+} from "./chunk-V3MKNX2O.js";
 
 // src/app.ts
 import { clientConfigs } from "@internal/clientConfigs";
@@ -34,24 +34,30 @@ import {
 
 // src/routes.ts
 import { pagesRoutes } from "@internal/pagesRoutes";
-var createRoutes = () => pagesRoutes.reduce((result, [name, path, meta, redirects]) => {
-  result.push({
-    name,
-    path,
-    component: Vuepress,
-    meta
-  }, ...redirects.map((item) => ({
-    path: item,
-    redirect: path
-  })));
-  return result;
-}, [
-  {
-    name: "404",
-    path: "/:catchAll(.*)",
-    component: Vuepress
-  }
-]);
+var createRoutes = () => pagesRoutes.reduce(
+  (result, [name, path, meta, redirects]) => {
+    result.push(
+      {
+        name,
+        path,
+        component: Vuepress,
+        meta
+      },
+      ...redirects.map((item) => ({
+        path: item,
+        redirect: path
+      }))
+    );
+    return result;
+  },
+  [
+    {
+      name: "404",
+      path: "/:catchAll(.*)",
+      component: Vuepress
+    }
+  ]
+);
 
 // src/router.ts
 var historyCreator = __VUEPRESS_SSR__ ? createMemoryHistory : createWebHistory;
@@ -79,30 +85,6 @@ var createVueRouter = () => {
   return router;
 };
 
-// src/setupDevtools.ts
-import { setupDevtoolsPlugin } from "@vue/devtools-api";
-var COMPONENT_STATE_TYPE = "VuePress";
-var setupDevtools = (app, globalComputed) => {
-  setupDevtoolsPlugin({
-    app,
-    id: "org.vuejs.vuepress",
-    label: "VuePress",
-    packageName: "@vuepress/client",
-    homepage: "https://v2.vuepress.vuejs.org",
-    logo: "https://v2.vuepress.vuejs.org/images/hero.png",
-    componentStateTypes: [COMPONENT_STATE_TYPE]
-  }, (api) => {
-    api.on.inspectComponent((payload) => {
-      payload.instanceData.state.push(...Object.entries(globalComputed).map(([name, item]) => ({
-        type: COMPONENT_STATE_TYPE,
-        key: name,
-        editable: false,
-        value: item.value
-      })));
-    });
-  });
-};
-
 // src/setupGlobalComponents.ts
 var setupGlobalComponents = (app) => {
   app.component("ClientOnly", ClientOnly);
@@ -112,11 +94,28 @@ var setupGlobalComponents = (app) => {
 // src/setupGlobalComputed.ts
 import { computed } from "vue";
 var setupGlobalComputed = (app, router) => {
-  const routeLocale = computed(() => resolvers.resolveRouteLocale(siteData.value.locales, router.currentRoute.value.path));
-  const siteLocaleData = computed(() => resolvers.resolveSiteLocaleData(siteData.value, routeLocale.value));
-  const pageFrontmatter = computed(() => resolvers.resolvePageFrontmatter(pageData.value));
-  const pageHeadTitle = computed(() => resolvers.resolvePageHeadTitle(pageData.value, siteLocaleData.value));
-  const pageHead = computed(() => resolvers.resolvePageHead(pageHeadTitle.value, pageFrontmatter.value, siteLocaleData.value));
+  const routeLocale = computed(
+    () => resolvers.resolveRouteLocale(
+      siteData.value.locales,
+      router.currentRoute.value.path
+    )
+  );
+  const siteLocaleData = computed(
+    () => resolvers.resolveSiteLocaleData(siteData.value, routeLocale.value)
+  );
+  const pageFrontmatter = computed(
+    () => resolvers.resolvePageFrontmatter(pageData.value)
+  );
+  const pageHeadTitle = computed(
+    () => resolvers.resolvePageHeadTitle(pageData.value, siteLocaleData.value)
+  );
+  const pageHead = computed(
+    () => resolvers.resolvePageHead(
+      pageHeadTitle.value,
+      pageFrontmatter.value,
+      siteLocaleData.value
+    )
+  );
   const pageLang = computed(() => resolvers.resolvePageLang(pageData.value));
   app.provide(routeLocaleSymbol, routeLocale);
   app.provide(siteLocaleDataSymbol, siteLocaleData);
@@ -192,7 +191,10 @@ var setupUpdateHead = () => {
   onMounted(() => {
     loadHead();
     updateHead();
-    watch(() => __VUEPRESS_DEV__ ? head.value : route.path, () => updateHead());
+    watch(
+      () => __VUEPRESS_DEV__ ? head.value : route.path,
+      () => updateHead()
+    );
   });
 };
 var queryHeadTag = ([
@@ -250,7 +252,9 @@ var createVueApp = async () => {
       }
       return () => [
         h(RouterView),
-        ...clientConfigs.flatMap(({ rootComponents = [] }) => rootComponents.map((component) => h(component)))
+        ...clientConfigs.flatMap(
+          ({ rootComponents = [] }) => rootComponents.map((component) => h(component))
+        )
       ];
     }
   });
@@ -258,6 +262,7 @@ var createVueApp = async () => {
   setupGlobalComponents(app);
   const globalComputed = setupGlobalComputed(app, router);
   if (__VUEPRESS_DEV__ || __VUE_PROD_DEVTOOLS__) {
+    const { setupDevtools } = await import("./setupDevtools-EXVHPMXB.js");
     setupDevtools(app, globalComputed);
   }
   for (const clientConfig of clientConfigs) {

package/dist/{chunk-OOQFWU6B.js → chunk-V3MKNX2O.js}

@@ -28,7 +28,9 @@ if (import.meta.webpackHot || import.meta.hot) {
 
 // src/composables/pageFrontmatter.ts
 import { inject } from "vue";
-var pageFrontmatterSymbol = Symbol(__VUEPRESS_DEV__ ? "pageFrontmatter" : "");
+var pageFrontmatterSymbol = Symbol(
+  __VUEPRESS_DEV__ ? "pageFrontmatter" : ""
+);
 var usePageFrontmatter = () => {
   const pageFrontmatter = inject(pageFrontmatterSymbol);
   if (!pageFrontmatter) {
@@ -39,7 +41,9 @@ var usePageFrontmatter = () => {
 
 // src/composables/pageHead.ts
 import { inject as inject2 } from "vue";
-var pageHeadSymbol = Symbol(__VUEPRESS_DEV__ ? "pageHead" : "");
+var pageHeadSymbol = Symbol(
+  __VUEPRESS_DEV__ ? "pageHead" : ""
+);
 var usePageHead = () => {
   const pageHead = inject2(pageHeadSymbol);
   if (!pageHead) {
@@ -50,7 +54,9 @@ var usePageHead = () => {
 
 // src/composables/pageHeadTitle.ts
 import { inject as inject3 } from "vue";
-var pageHeadTitleSymbol = Symbol(__VUEPRESS_DEV__ ? "pageHeadTitle" : "");
+var pageHeadTitleSymbol = Symbol(
+  __VUEPRESS_DEV__ ? "pageHeadTitle" : ""
+);
 var usePageHeadTitle = () => {
   const pageHeadTitle = inject3(pageHeadTitleSymbol);
   if (!pageHeadTitle) {
@@ -61,7 +67,9 @@ var usePageHeadTitle = () => {
 
 // src/composables/pageLang.ts
 import { inject as inject4 } from "vue";
-var pageLangSymbol = Symbol(__VUEPRESS_DEV__ ? "pageLang" : "");
+var pageLangSymbol = Symbol(
+  __VUEPRESS_DEV__ ? "pageLang" : ""
+);
 var usePageLang = () => {
   const pageLang = inject4(pageLangSymbol);
   if (!pageLang) {
@@ -72,7 +80,9 @@ var usePageLang = () => {
 
 // src/composables/routeLocale.ts
 import { inject as inject5 } from "vue";
-var routeLocaleSymbol = Symbol(__VUEPRESS_DEV__ ? "routeLocale" : "");
+var routeLocaleSymbol = Symbol(
+  __VUEPRESS_DEV__ ? "routeLocale" : ""
+);
 var useRouteLocale = () => {
   const routeLocale = inject5(routeLocaleSymbol);
   if (!routeLocale) {
@@ -94,7 +104,9 @@ if (import.meta.webpackHot || import.meta.hot) {
 
 // src/composables/siteLocaleData.ts
 import { inject as inject6 } from "vue";
-var siteLocaleDataSymbol = Symbol(__VUEPRESS_DEV__ ? "siteLocaleData" : "");
+var siteLocaleDataSymbol = Symbol(
+  __VUEPRESS_DEV__ ? "siteLocaleData" : ""
+);
 var useSiteLocaleData = () => {
   const siteLocaleData = inject6(siteLocaleDataSymbol);
   if (!siteLocaleData) {
@@ -105,7 +117,9 @@ var useSiteLocaleData = () => {
 
 // src/composables/updateHead.ts
 import { inject as inject7 } from "vue";
-var updateHeadSymbol = Symbol(__VUEPRESS_DEV__ ? "updateHead" : "");
+var updateHeadSymbol = Symbol(
+  __VUEPRESS_DEV__ ? "updateHead" : ""
+);
 var useUpdateHead = () => {
   const updateHead = inject7(updateHeadSymbol);
   if (!updateHead) {
@@ -175,8 +189,13 @@ var Content = defineComponent2({
   },
   setup(props) {
     const page = usePageData();
-    const pageComponent = computed(() => pagesComponents[props.pageKey || page.value.key]);
-    return () => pageComponent.value ? h(pageComponent.value) : h("div", __VUEPRESS_DEV__ ? "Page does not exist. This is a fallback content." : "404 Not Found");
+    const pageComponent = computed(
+      () => pagesComponents[props.pageKey || page.value.key]
+    );
+    return () => pageComponent.value ? h(pageComponent.value) : h(
+      "div",
+      __VUEPRESS_DEV__ ? "Page does not exist. This is a fallback content." : "404 Not Found"
+    );
   }
 });
 

package/dist/index.d.ts

@@ -3,7 +3,38 @@ export { PageData, PageFrontmatter, PageHeader, SiteData } from '@vuepress/share
 import * as vue from 'vue';
 import { Ref, ComputedRef, InjectionKey, App, Component } from 'vue';
 import { Router, RouteMeta } from 'vue-router';
-export { C as CreateVueAppFunction } from './createVueAppFunction-c8e67ca1.js';
+
+declare const ClientOnly: vue.DefineComponent<{}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>[] | null | undefined, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
+
+/**
+ * Markdown rendered content
+ */
+declare const Content: vue.DefineComponent<{
+    pageKey: {
+        type: StringConstructor;
+        required: false;
+        default: string;
+    };
+}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    pageKey: {
+        type: StringConstructor;
+        required: false;
+        default: string;
+    };
+}>>, {
+    pageKey: string;
+}>;
+
+/**
+ * Global Layout
+ */
+declare const Vuepress: vue.DefineComponent<{}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
 
 /**
  * Ref wrapper of `PageData`
@@ -189,6 +220,11 @@ interface ClientConfig {
     rootComponents?: Component[];
 }
 
+declare type CreateVueAppFunction = () => Promise<{
+    app: App;
+    router: Router;
+}>;
+
 declare type PageRouteItem = [
     name: string,
     path: string,
@@ -196,38 +232,6 @@ declare type PageRouteItem = [
     redirects: string[]
 ];
 
-declare const ClientOnly: vue.DefineComponent<{}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
-    [key: string]: any;
-}>[] | null | undefined, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
-
-/**
- * Markdown rendered content
- */
-declare const Content: vue.DefineComponent<{
-    pageKey: {
-        type: StringConstructor;
-        required: false;
-        default: string;
-    };
-}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
-    pageKey: {
-        type: StringConstructor;
-        required: false;
-        default: string;
-    };
-}>>, {
-    pageKey: string;
-}>;
-
-/**
- * Global Layout
- */
-declare const Vuepress: vue.DefineComponent<{}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
-    [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, vue.EmitsOptions, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{}>>, {}>;
-
 /**
  * A helper function to help you define vuepress client config file
  */
@@ -253,4 +257,4 @@ declare const resolvers: {
  */
 declare const withBase: (url: string) => string;
 
-export { ClientConfig, ClientOnly, Content, PageDataRef, PageFrontmatterRef, PageHead, PageHeadRef, PageHeadTitle, PageHeadTitleRef, PageLang, PageLangRef, PageRouteItem, PagesData, PagesDataRef, RouteLocale, RouteLocaleRef, SiteDataRef, SiteLocaleData, SiteLocaleDataRef, UpdateHead, Vuepress, defineClientConfig, pageData, pageDataEmpty, pageFrontmatterSymbol, pageHeadSymbol, pageHeadTitleSymbol, pageLangSymbol, pagesData, resolvers, routeLocaleSymbol, siteData, siteLocaleDataSymbol, updateHeadSymbol, usePageData, usePageFrontmatter, usePageHead, usePageHeadTitle, usePageLang, usePagesData, useRouteLocale, useSiteData, useSiteLocaleData, useUpdateHead, withBase };
+export { ClientConfig, ClientOnly, Content, CreateVueAppFunction, PageDataRef, PageFrontmatterRef, PageHead, PageHeadRef, PageHeadTitle, PageHeadTitleRef, PageLang, PageLangRef, PageRouteItem, PagesData, PagesDataRef, RouteLocale, RouteLocaleRef, SiteDataRef, SiteLocaleData, SiteLocaleDataRef, UpdateHead, Vuepress, defineClientConfig, pageData, pageDataEmpty, pageFrontmatterSymbol, pageHeadSymbol, pageHeadTitleSymbol, pageLangSymbol, pagesData, resolvers, routeLocaleSymbol, siteData, siteLocaleDataSymbol, updateHeadSymbol, usePageData, usePageFrontmatter, usePageHead, usePageHeadTitle, usePageLang, usePagesData, useRouteLocale, useSiteData, useSiteLocaleData, useUpdateHead, withBase };

package/dist/index.js

@@ -25,7 +25,7 @@ import {
   useSiteLocaleData,
   useUpdateHead,
   withBase
-} from "./chunk-OOQFWU6B.js";
+} from "./chunk-V3MKNX2O.js";
 
 // src/helpers/defineClientConfig.ts
 var defineClientConfig = (clientConfig) => clientConfig;

package/dist/setupDevtools-EXVHPMXB.js

@@ -0,0 +1,88 @@
+// src/setupDevtools.ts
+import { setupDevtoolsPlugin } from "@vue/devtools-api";
+import { watch } from "vue";
+var PLUGIN_ID = "org.vuejs.vuepress";
+var PLUGIN_LABEL = "VuePress";
+var PLUGIN_COMPONENT_STATE_TYPE = PLUGIN_LABEL;
+var INSPECTOR_ID = PLUGIN_ID;
+var INSPECTOR_LABEL = PLUGIN_LABEL;
+var INSPECTOR_GLOBAL_COMPUTED_ID = "global-computed";
+var INSPECTOR_GLOBAL_COMPUTED_LABEL = "Global Computed";
+var setupDevtools = (app, globalComputed) => {
+  setupDevtoolsPlugin(
+    {
+      app,
+      id: PLUGIN_ID,
+      label: PLUGIN_LABEL,
+      packageName: "@vuepress/client",
+      homepage: "https://v2.vuepress.vuejs.org",
+      logo: "https://v2.vuepress.vuejs.org/images/hero.png",
+      componentStateTypes: [PLUGIN_COMPONENT_STATE_TYPE]
+    },
+    (api) => {
+      const globalComputedEntries = Object.entries(globalComputed);
+      const globalComputedKeys = Object.keys(globalComputed);
+      const globalComputedValues = Object.values(globalComputed);
+      api.on.inspectComponent((payload) => {
+        payload.instanceData.state.push(
+          ...globalComputedEntries.map(([name, item]) => ({
+            type: PLUGIN_COMPONENT_STATE_TYPE,
+            editable: false,
+            key: name,
+            value: item.value
+          }))
+        );
+      });
+      api.addInspector({
+        id: INSPECTOR_ID,
+        label: INSPECTOR_LABEL,
+        icon: "article"
+      });
+      api.on.getInspectorTree((payload) => {
+        if (payload.inspectorId !== INSPECTOR_ID)
+          return;
+        payload.rootNodes = [
+          {
+            id: INSPECTOR_GLOBAL_COMPUTED_ID,
+            label: INSPECTOR_GLOBAL_COMPUTED_LABEL,
+            children: globalComputedKeys.map((name) => ({
+              id: name,
+              label: name
+            }))
+          }
+        ];
+      });
+      api.on.getInspectorState((payload) => {
+        if (payload.inspectorId !== INSPECTOR_ID)
+          return;
+        if (payload.nodeId === INSPECTOR_GLOBAL_COMPUTED_ID) {
+          payload.state = {
+            [INSPECTOR_GLOBAL_COMPUTED_LABEL]: globalComputedEntries.map(
+              ([name, item]) => ({
+                key: name,
+                value: item.value
+              })
+            )
+          };
+        }
+        if (globalComputedKeys.includes(payload.nodeId)) {
+          payload.state = {
+            [INSPECTOR_GLOBAL_COMPUTED_LABEL]: [
+              {
+                key: payload.nodeId,
+                value: globalComputed[payload.nodeId].value
+              }
+            ]
+          };
+        }
+      });
+      watch(globalComputedValues, () => {
+        api.notifyComponentUpdate();
+        api.sendInspectorState(INSPECTOR_ID);
+      });
+    }
+  );
+};
+export {
+  setupDevtools
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vuepress/client",
-  "version": "2.0.0-beta.49",
+  "version": "2.0.0-beta.50-pre.1",
   "description": "Client package of VuePress",
   "keywords": [
     "vuepress",
@@ -33,22 +33,20 @@
     "types.d.ts"
   ],
   "dependencies": {
-    "@vue/devtools-api": "^6.2.0",
-    "@vuepress/shared": "2.0.0-beta.49",
+    "@vue/devtools-api": "^6.2.1",
+    "@vuepress/shared": "2.0.0-beta.50-pre.1",
     "vue": "^3.2.37",
-    "vue-router": "^4.1.2"
+    "vue-router": "^4.1.3"
   },
   "publishConfig": {
     "access": "public"
   },
   "tsup": {
     "clean": true,
-    "dts": [
-      "src/index.ts"
-    ],
+    "dts": "./src/index.ts",
     "entry": [
-      "src/app.ts",
-      "src/index.ts"
+      "./src/app.ts",
+      "./src/index.ts"
     ],
     "external": [
       "@internal/clientConfigs",
@@ -61,10 +59,10 @@
     "format": [
       "esm"
     ],
-    "outDir": "dist",
+    "outDir": "./dist",
     "sourcemap": false,
     "target": "es2020",
-    "tsconfig": "tsconfig.dts.json"
+    "tsconfig": "./tsconfig.dts.json"
   },
   "scripts": {
     "build": "tsup",

package/dist/app.d.ts

@@ -1,7 +0,0 @@
-import { C as CreateVueAppFunction } from './createVueAppFunction-c8e67ca1.js';
-import 'vue';
-import 'vue-router';
-
-declare const createVueApp: CreateVueAppFunction;
-
-export { createVueApp };

package/dist/createVueAppFunction-c8e67ca1.d.ts

@@ -1,9 +0,0 @@
-import { App } from 'vue';
-import { Router } from 'vue-router';
-
-declare type CreateVueAppFunction = () => Promise<{
-    app: App;
-    router: Router;
-}>;
-
-export { CreateVueAppFunction as C };