From 6521a654cbb7e39fe23863579be86ef36dc8283f Mon Sep 17 00:00:00 2001
From: tjallingt <tjallingt@gmail.com>
Date: Mon, 9 Apr 2018 20:12:02 +0200
Subject: [PATCH] Added updating nested context default value example (#780)

* added context default value example

* Implement suggested change

* noop function as default value to createContext
---
 content/docs/context.md                             | 3 +++
 examples/context/updating-nested-context-context.js | 8 ++++++++
 2 files changed, 11 insertions(+)
 create mode 100644 examples/context/updating-nested-context-context.js

diff --git a/content/docs/context.md b/content/docs/context.md
index 0aafd027b..45698765c 100644
--- a/content/docs/context.md
+++ b/content/docs/context.md
@@ -97,6 +97,9 @@ A more complex example with dynamic values for the theme:
 
 It is often necessary to update the context from a component that is nested somewhere deeply in the component tree. In this case you can pass a function down through the context to allow consumers to update the context:
 
+**theme-context.js**
+`embed:context/updating-nested-context-context.js`
+
 **theme-toggler-button.js**
 `embed:context/updating-nested-context-theme-toggler-button.js`
 
diff --git a/examples/context/updating-nested-context-context.js b/examples/context/updating-nested-context-context.js
new file mode 100644
index 000000000..472c4dda6
--- /dev/null
+++ b/examples/context/updating-nested-context-context.js
@@ -0,0 +1,8 @@
+// highlight-range{1-2}
+// Make sure the shape of the default value passed to
+// createContext matches the shape that the consumers expect!
+// highlight-range{2-3}
+export const ThemeContext = React.createContext({
+  theme: themes.dark,
+  toggleTheme: () => {},
+});