From e778f92dfdbde3f4f0b5e0f3ddc0cd0641359f3e Mon Sep 17 00:00:00 2001
From: Kia Ishii <kia.king.08@gmail.com>
Date: Mon, 6 Jun 2022 16:37:26 +0900
Subject: [PATCH] docs: format and add docs

---
 docs/config/theme-configs.md                  | 24 +++++++++++++++++
 docs/guide/theme-edit-link.md                 | 27 ++++++++++++++++++-
 .../theme-default/composables/edit-link.ts    |  1 +
 types/default-theme.d.ts                      | 12 ++++-----
 4 files changed, 57 insertions(+), 7 deletions(-)

diff --git a/docs/config/theme-configs.md b/docs/config/theme-configs.md
index 17c24708..37564b78 100644
--- a/docs/config/theme-configs.md
+++ b/docs/config/theme-configs.md
@@ -188,6 +188,30 @@ export interface Footer {
 }
 ```
 
+## editLink
+
+- Type: `EditLink`
+
+Edit Link lets you display a link to edit the page on Git management services such as GitHub, or GitLab. See [Theme: Edit Link](../guide/theme-edit-link) for more details.
+
+```js
+export default {
+  themeConfig: {
+    editLink: {
+      pattern: 'https://github.com/vuejs/vitepress/edit/main/docs/:path',
+      text: 'Edit this page on GitHub'
+    }
+  }
+}
+```
+
+```ts
+export interface EditLink {
+  pattern: string
+  text?: string
+}
+```
+
 ## lastUpdatedText
 
 - Type: `string`
diff --git a/docs/guide/theme-edit-link.md b/docs/guide/theme-edit-link.md
index 39eba214..64e74b31 100644
--- a/docs/guide/theme-edit-link.md
+++ b/docs/guide/theme-edit-link.md
@@ -1,3 +1,28 @@
 # Edit Link
 
-Documentation coming soon...
+Edit Link lets you display a link to edit the page on Git management services such as GitHub, or GitLab. To enable it, add `themeConfig.editLink` options to your config.
+
+```js
+export default {
+  themeConfig: {
+    editLink: {
+      pattern: 'https://github.com/vuejs/vitepress/edit/main/docs/:path'
+    }
+  }
+}
+```
+
+The `pattern` option defines the URL structure for the link, and `:path` is going to be replaced with the page path.
+
+By default, this will add the link text "Edit this page" at the bottom of the doc page. You may customize this text by defining the `text` option.
+
+```js
+export default {
+  themeConfig: {
+    editLink: {
+      pattern: 'https://github.com/vuejs/vitepress/edit/main/docs/:path',
+      text: 'Edit this page on GitHub'
+    }
+  }
+}
+```
diff --git a/src/client/theme-default/composables/edit-link.ts b/src/client/theme-default/composables/edit-link.ts
index 34dffc9a..9766d3ec 100644
--- a/src/client/theme-default/composables/edit-link.ts
+++ b/src/client/theme-default/composables/edit-link.ts
@@ -8,6 +8,7 @@ export function useEditLink() {
     const { text = 'Edit this page', pattern } = theme.value.editLink || {}
     const { relativePath } = page.value
     const url = pattern.replace(/:path/g, relativePath)
+    
     return { url, text }
   })
 }
diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts
index 29d4b191..aec914be 100644
--- a/types/default-theme.d.ts
+++ b/types/default-theme.d.ts
@@ -127,18 +127,18 @@ export namespace DefaultTheme {
 
   export interface EditLink {
     /**
-     * Custom text for edit link.
+     * Pattern for edit link.
      *
-     * @default 'Edit this page'
+     * @example 'https://github.com/vuejs/vitepress/edit/main/docs/:path'
      */
-    text?: string
+    pattern: string
 
     /**
-     * Pattern for edit link.
+     * Custom text for edit link.
      *
-     * @example 'https://github.com/vuejs/vitepress/edit/main/docs/:path'
+     * @default 'Edit this page'
      */
-    pattern: string
+    text?: string
   }
 
   // social link ---------------------------------------------------------------