From 5e470876c1a4f2e9643cc2d88e19e6d86e9a4180 Mon Sep 17 00:00:00 2001
From: Niclas Snellman <niclas.snellman@gmail.com>
Date: Fri, 16 Nov 2018 16:58:49 +0100
Subject: [PATCH] feat($theme-default): implement support for external links in
 sidebar

We introduce a new type of sidebar item called 'external' which are
treated differently in Sidebar/SidebarLink. These items are rendered
as <a> elements with an added icon indicating that the element points
to an external location.
---
 .../theme-default/components/Sidebar.vue        |  2 +-
 .../theme-default/components/SidebarLink.vue    | 17 ++++++++++++++++-
 packages/@vuepress/theme-default/util/index.js  |  7 +++++++
 3 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/packages/@vuepress/theme-default/components/Sidebar.vue b/packages/@vuepress/theme-default/components/Sidebar.vue
index 9ed10ed9b8..8ae8e840fa 100644
--- a/packages/@vuepress/theme-default/components/Sidebar.vue
+++ b/packages/@vuepress/theme-default/components/Sidebar.vue
@@ -70,7 +70,7 @@ export default {
 function resolveOpenGroupIndex (route, items) {
   for (let i = 0; i < items.length; i++) {
     const item = items[i]
-    if (item.type === 'group' && item.children.some(c => isActive(route, c.path))) {
+    if (item.type === 'group' && item.children.some(c => c.type !== 'external' && isActive(route, c.path))) {
       return i
     }
   }
diff --git a/packages/@vuepress/theme-default/components/SidebarLink.vue b/packages/@vuepress/theme-default/components/SidebarLink.vue
index 4b08380ed3..ca6e21ab11 100644
--- a/packages/@vuepress/theme-default/components/SidebarLink.vue
+++ b/packages/@vuepress/theme-default/components/SidebarLink.vue
@@ -15,7 +15,9 @@ export default {
     const active = item.type === 'auto'
       ? selfActive || item.children.some(c => isActive($route, item.basePath + '#' + c.slug))
       : selfActive
-    const link = renderLink(h, item.path, item.title || item.path, active)
+    const link = item.type === 'external'
+      ? renderExternal(h, item.path, item.title || item.path)
+      : renderLink(h, item.path, item.title || item.path, active)
     const configDepth = $page.frontmatter.sidebarDepth != null
       ? $page.frontmatter.sidebarDepth
       : $site.themeConfig.sidebarDepth
@@ -56,6 +58,19 @@ function renderChildren (h, children, path, route, maxDepth, depth = 1) {
     ])
   }))
 }
+
+function renderExternal(h, to, text) {
+  return h('a', {
+    attrs: {
+      href: to,
+      target: '_blank'
+    },
+    class: {
+      'sidebar-link': true
+    }
+  }, [text, h('OutboundLink')])
+}
+
 </script>
 
 <style lang="stylus">
diff --git a/packages/@vuepress/theme-default/util/index.js b/packages/@vuepress/theme-default/util/index.js
index 01937e9888..fb0f9521e7 100644
--- a/packages/@vuepress/theme-default/util/index.js
+++ b/packages/@vuepress/theme-default/util/index.js
@@ -54,6 +54,13 @@ export function isActive (route, path) {
 }
 
 export function resolvePage (pages, rawPath, base) {
+  if (isExternal(rawPath)) {
+    return {
+      type: 'external',
+      title: rawPath,
+      path: rawPath,
+    }
+  }
   if (base) {
     rawPath = resolvePath(rawPath, base)
   }