diff --git a/docs/.vuepress/components/OpenWhenSearchTextPresent.vue b/docs/.vuepress/components/OpenWhenSearchTextPresent.vue
new file mode 100644
index 0000000..4e799b5
--- /dev/null
+++ b/docs/.vuepress/components/OpenWhenSearchTextPresent.vue
@@ -0,0 +1,29 @@
+
+
+
+
+
diff --git a/docs/.vuepress/config/themeConfig.js b/docs/.vuepress/config/themeConfig.js
index 456abcf..de97e72 100644
--- a/docs/.vuepress/config/themeConfig.js
+++ b/docs/.vuepress/config/themeConfig.js
@@ -59,6 +59,7 @@ module.exports = {
children: [
['guide/keydown', 'Keydown Events'],
['guide/positioning', 'Dropdown Position'],
+ ['guide/opening', 'Dropdown Opening'],
['guide/filtering', 'Option Filtering'],
],
},
diff --git a/docs/guide/opening.md b/docs/guide/opening.md
new file mode 100644
index 0000000..40613ab
--- /dev/null
+++ b/docs/guide/opening.md
@@ -0,0 +1,22 @@
+## Default Dropdown Behaviour
+
+By default, the dropdown will open anytime the underlying search input has focus. The dropdown will
+open when clicked, or when it has received focus when tabbing through inputs.
+
+## Customizing Dropdown Behaviour
+
+The `dropdownShouldOpen` prop allows for full customization of the open/close behaviour. The prop
+accepts a `function` that should return a `boolean` value. The returned boolean value will be used
+to determine if the dropdown should be `open`/`true` or `false`/`closed`. The function receives the
+instance of the component as the only argument.
+
+#### Example: Open the dropdown when search text is present
+---
+
+In this example, we will wait to show the dropdown until the user has started typing. However, if a
+country has already been selected, we will display the dropdown right away.
+
+
+
+<<< @/.vuepress/components/OpenWhenSearchTextPresent.vue
+