From 5e0ad1982fe7a1f3b57caa39d460a3b36e2be454 Mon Sep 17 00:00:00 2001
From: Jeff Sagal <sagalbot@gmail.com>
Date: Sun, 14 Apr 2019 19:29:28 -0700
Subject: [PATCH] bump upgrade guide (#833)

---
 docs/guide/install.md   |  8 ++++----
 docs/guide/upgrading.md | 26 ++++++++++++++++++++++++--
 2 files changed, 28 insertions(+), 6 deletions(-)

diff --git a/docs/guide/install.md b/docs/guide/install.md
index a50090f..fd650b4 100644
--- a/docs/guide/install.md
+++ b/docs/guide/install.md
@@ -43,8 +43,8 @@ global variable. You'll need to load Vue.js, vue-select JS & vue-select CSS.
 <link rel="stylesheet" href="https://unpkg.com/vue-select@latest/dist/vue-select.css">
 
 <!-- or point to a specific vue-select release -->
-<script src="https://unpkg.com/vue-select@2.6.0"></script>
-<link rel="stylesheet" href="https://unpkg.com/vue-select@2.6.0/dist/vue-select.css">
+<script src="https://unpkg.com/vue-select@3.0.0"></script>
+<link rel="stylesheet" href="https://unpkg.com/vue-select@3.0.0/dist/vue-select.css">
 ```
 Then register the component in your javascript:
 
@@ -56,5 +56,5 @@ Vue.component('v-select', VueSelect.VueSelect);
 
 ## Vue Compatibility
 
-If you're on Vue `1.x`, use vue-select `1.x`. The `1.x` branch has not received updates
-since the 2.0 release.  
+- If you're on Vue `1.x`, use vue-select `1.x`. 
+- The `1.x` branch has not received updates since the 2.0 release.  
diff --git a/docs/guide/upgrading.md b/docs/guide/upgrading.md
index 9ba8d1f..0336a3b 100644
--- a/docs/guide/upgrading.md
+++ b/docs/guide/upgrading.md
@@ -1,6 +1,28 @@
-## Removed Function Callbacks
+## `index` prop replaced with `reduce`
 
-Three function callbacks have been removed in favor of using events. 
+- v2.x provided the `index` `{String}` prop to return a single key from a selected object
+- v3.x removes the `index` prop, replacing it with the `reduce` `{Function}` prop. 
+
+Using a function instead of a string provides a whole lot more flexibility, allowing for things like
+ deeply nested values, and really cleaned up the code internally.
+ 
+```js
+const options = [{country: 'Canada', code: 'CA'},];
+```
+ 
+```html
+<!-- v2: using index --->
+<v-select :options="options" label="country" index="code"  />
+
+<!-- v3: using reduce --->
+<v-select :options="options" label="country" :reduce="country => country.code" />
+```
+
+View the full [documentation for `reduce`](values.md#returning-a-single-key-with-reduce).
+
+## Events instead of Callbacks
+
+Three function callbacks have been removed in favor of using events.
 
 - `onChange`
 - `onInput`