From 3ebee1be7b355b8b928e60771e9cca9181dd85be Mon Sep 17 00:00:00 2001
From: Augustine Kim <augustinekim@google.com>
Date: Mon, 23 Oct 2023 09:52:45 -0700
Subject: [PATCH] [doc] Update context docs to reflect preferred options syntax
 for controllers (#1235)

---
 .../site/docs/v3/data/context.md              | 33 +++++++++++--------
 1 file changed, 19 insertions(+), 14 deletions(-)

diff --git a/packages/lit-dev-content/site/docs/v3/data/context.md b/packages/lit-dev-content/site/docs/v3/data/context.md
index 69bb19a40..0edc3c101 100644
--- a/packages/lit-dev-content/site/docs/v3/data/context.md
+++ b/packages/lit-dev-content/site/docs/v3/data/context.md
@@ -202,17 +202,17 @@ Making a context property public lets an element provide a public field to its c
 ```ts
 import {LitElement, html} from 'lit';
 import {ContextProvider} from '@lit/context';
-import {myContext, MyData} from './my-context.js';
+import {myContext} from './my-context.js';
 
 export class MyApp extends LitElement {
-  private _provider = new ContextProvider(this, myContext);
+  private _provider = new ContextProvider(this, {context: myContext});
 }
 ```
 
-ContextProvider can take an initial value in its constructor:
+ContextProvider can take an initial value as an option in the constructor:
 
 ```ts
-  private _provider = new ContextProvider(this, myContext, initialData);
+  private _provider = new ContextProvider(this, {context: myContext, initialValue: myData});
 ```
 
 Or you can call `setValue()`:
@@ -247,10 +247,10 @@ ContextConsumer is a reactive controller that manages dispatching the `context-r
 ```ts
 import {LitElement, property} from 'lit';
 import {ContextConsumer} from '@lit/context';
-import {Logger, loggerContext} from './logger.js';
+import {myContext} from './my-context.js';
 
 export class MyElement extends LitElement {
-  private _myData = new ContextConsumer(this, myContext);
+  private _myData = new ContextConsumer(this, {context: myContext});
 
   render() {
     const myData = this._myData.value;
@@ -274,9 +274,10 @@ and the ContextConsumer controller:
 
 ```ts
   private _myData = new ContextConsumer(this,
-    myContext,
-    undefined, /* callback */
-    true /* subscribe */
+    {
+      context: myContext,
+      subscribe: true,
+    }
   );
 ```
 
@@ -413,8 +414,10 @@ import {ContextProvider} from '@lit/context';
 ```ts
 ContextProvider(
   host: ReactiveElement,
-  context: T,
-  initialValue?: ContextType<T>
+  options: {
+    context: T,
+    initialValue?: ContextType<T>
+  }
 )
 ```
 
@@ -439,9 +442,11 @@ import {ContextConsumer} from '@lit/context';
 ```ts
 ContextConsumer(
   host: HostElement,
-  context: C,
-  callback?: (value: ContextType<C>, dispose?: () => void) => void,
-  subscribe: boolean = false
+  options: {
+    context: C,
+    callback?: (value: ContextType<C>, dispose?: () => void) => void,
+    subscribe?: boolean = false
+  }
 )
 ```