Update ko (#79)

* chore: defining default values for Props using withDefaults (vuejs#1880)

* docs: reorder

* docs: fix index.md to avoid horizontal scrolling in code (vuejs#2129)

* docs: api updates

* chore: up packages

docs/.vitepress/theme/components/HomeSponsorsGroup.vue

@@ -1,3 +1,28 @@
+<script setup lang="ts">
+import sponsors from './sponsors.json'
+import { computed } from 'vue'
+import { useData } from 'vitepress'
+
+const props = withDefaults(
+  defineProps<{
+    name: 'Gold' | 'Platinum' | 'Silver' | 'Bronze'
+    size?: number | string
+  }>(),
+  {
+    size: 140,
+  }
+)
+
+const { isDark } = useData()
+
+const list = computed(() =>
+  sponsors[props.name.toLowerCase()].map(sponsor => ({
+    ...sponsor,
+    imgSrc: isDark.value ? sponsor.imgSrcDark : sponsor.imgSrcLight,
+  }))
+)
+</script>
+
 <template>
   <h3>{{ name }} Sponsors</h3>
 
@@ -28,33 +53,6 @@
   </p>
 </template>
 
-<script setup lang="ts">
-import sponsors from './sponsors.json'
-import { computed } from 'vue'
-import type { PropType } from 'vue'
-import { useData } from 'vitepress'
-
-const { isDark } = useData()
-
-const props = defineProps({
-  name: {
-    type: String as PropType<'Gold' | 'Platinum' | 'Silver' | 'Bronze'>,
-    required: true,
-  },
-  size: {
-    type: [Number, String],
-    default: 140,
-  },
-})
-
-const list = computed(() =>
-  sponsors[props.name.toLowerCase()].map((sponsor) => ({
-    ...sponsor,
-    imgSrc: isDark.value ? sponsor.imgSrcDark : sponsor.imgSrcLight,
-  }))
-)
-</script>
-
 <style scoped>
 .sponsor_wrapper {
   padding: 5px;

docs/api/index.md

@@ -132,6 +132,8 @@ ___
 
 • `Const` **RouterView**: () => \{ `$props`: `AllowedComponentProps` & `ComponentCustomProps` & `VNodeProps` & [`RouterViewProps`](interfaces/RouterViewProps.md) ; `$slots`: \{ `default?`: (`__namedParameters`: \{ `Component`: `VNode`\<`RendererNode`, `RendererElement`, \{ `[key: string]`: `any`;  }\> ; `route`: [`RouteLocationNormalizedLoaded`](interfaces/RouteLocationNormalizedLoaded.md)  }) => `VNode`\<`RendererNode`, `RendererElement`, \{ `[key: string]`: `any`;  }\>[]  }  }
 
+Component to display the current route the user is at.
+
 #### Type declaration
 
 • **new RouterView**(): `Object`

docs/api/interfaces/Router.md

@@ -53,8 +53,6 @@ Add a new [route record](../index.md#RouteRecordRaw) as the child of an existing
 
 ▸ (): `void`
 
-Add a new [route record](../index.md#RouteRecordRaw) as the child of an existing route.
-
 ##### Returns
 
 `void`
@@ -75,8 +73,6 @@ Add a new [route record](../index.md#RouteRecordRaw) to the router.
 
 ▸ (): `void`
 
-Add a new [route record](../index.md#RouteRecordRaw) to the router.
-
 ##### Returns
 
 `void`
@@ -104,25 +100,10 @@ a function that removes the registered hook
 
 ▸ (): `void`
 
-Add a navigation hook that is executed after every navigation. Returns a
-function that removes the registered hook.
-
 ##### Returns
 
 `void`
 
-a function that removes the registered hook
-
-**`Example`**
-
-```js
-router.afterEach((to, from, failure) => {
-  if (isNavigationFailure(failure)) {
-    console.log('failed navigation', failure)
-  }
-})
-```
-
 **`Example`**
 
 ```js
@@ -167,9 +148,6 @@ function that removes the registered guard.
 
 ▸ (): `void`
 
-Add a navigation guard that executes before any navigation. Returns a
-function that removes the registered guard.
-
 ##### Returns
 
 `void`
@@ -199,25 +177,10 @@ a function that removes the registered guard
 
 ▸ (): `void`
 
-Add a navigation guard that executes before navigation is about to be
-resolved. At this state all component have been fetched and other
-navigation guards have been successful. Returns a function that removes the
-registered guard.
-
 ##### Returns
 
 `void`
 
-a function that removes the registered guard
-
-**`Example`**
-
-```js
-router.beforeResolve(to => {
-  if (to.meta.requiresAuth && !isAuthenticated) return false
-})
-```
-
 **`Example`**
 
 ```js
@@ -332,12 +295,6 @@ is required to render a route.
 
 ▸ (): `void`
 
-Adds an error handler that is called every time a non caught error happens
-during navigation. This includes errors thrown synchronously and
-asynchronously, errors returned or passed to `next` in any navigation
-guard, and errors occurred when trying to resolve an async component that
-is required to render a route.
-
 ##### Returns
 
 `void`

docs/api/interfaces/RouterHistory.md

@@ -116,17 +116,10 @@ a callback to remove the listener
 
 ▸ (): `void`
 
-Attach a listener to the History implementation that is triggered when the
-navigation is triggered from outside (like the Browser back and forward
-buttons) or when passing `true` to RouterHistory.back and
-RouterHistory.forward
-
 ##### Returns
 
 `void`
 
-a callback to remove the listener
-
 ___
 
 ### push

docs/api/interfaces/RouterOptions.md

@@ -75,6 +75,23 @@ ___
 
 • `Optional` **parseQuery**: (`search`: `string`) => [`LocationQuery`](../index.md#LocationQuery)
 
+Custom implementation to parse a query. See its counterpart,
+[RouterOptions.stringifyQuery](RouterOptions.md#stringifyQuery).
+
+**`Example`**
+
+Let's say you want to use the [qs package](https://github.com/ljharb/qs)
+to parse queries, you can provide both `parseQuery` and `stringifyQuery`:
+```js
+import qs from 'qs'
+
+createRouter({
+  // other options...
+  parseQuery: qs.parse,
+  stringifyQuery: qs.stringify,
+})
+```
+
 #### Type declaration
 
 ▸ (`search`): [`LocationQuery`](../index.md#LocationQuery)
@@ -170,6 +187,9 @@ ___
 
 • `Optional` **stringifyQuery**: (`query`: [`LocationQueryRaw`](../index.md#LocationQueryRaw)) => `string`
 
+Custom implementation to stringify a query object. Should not prepend a leading `?`.
+[parseQuery](RouterOptions.md#parseQuery) counterpart to handle query parsing.
+
 #### Type declaration
 
 ▸ (`query`): `string`

docs/guide/index.md

@@ -17,7 +17,8 @@ Vue + Vue Router로 사용해 싱글 페이지 앱을 만드는 것은 매우 
   <p>
     <!-- 탐색을 위해 router-link 컴포넌트를 사용. -->
     <!-- `to`라는 prop으로 링크를 지정. -->
-    <!-- `<router-link>`는 `href` 속성이 있는 `<a>` 태그로 렌더링됨. -->
+    <!-- `<router-link>` 태그는 올바른 `href` 속성을 가진 -->
+    <!-- `<a>` 태그로 렌더링 될 것. -->
     <router-link to="/">Home</router-link>
     <router-link to="/about">About</router-link>
   </p>
@@ -57,7 +58,8 @@ const routes = [
 // 3. `routes`를 옵션으로 전달해 라우터 인스턴스를 생성.
 // 여기에 추가 옵션을 전달할 수 있지만, 지금은 간단하게 나타냄.
 const router = createRouter({
-  // 4. 사용할 히스토리 모드 정의. 여기서는 간단하게 해시 모드를 사용.
+  // 4. 사용할 히스토리 모드 정의.
+  // 여기서는 간단하게 해시 모드를 사용.
   history: createWebHashHistory(),
   routes, // `routes: routes`와 같음
 })

package.json

@@ -8,6 +8,6 @@
     "build": "vitepress build docs"
   },
   "dependencies": {
-    "vitepress": "1.0.0-rc.35"
+    "vitepress": "1.0.0-rc.44"
   }
 }