Skip to content

Commit

Permalink
[doc] Update context docs to reflect preferred options syntax for con…
Browse files Browse the repository at this point in the history
…trollers (#1235)
  • Loading branch information
augustjk authored Oct 23, 2023
1 parent ff053e8 commit 3ebee1b
Showing 1 changed file with 19 additions and 14 deletions.
33 changes: 19 additions & 14 deletions packages/lit-dev-content/site/docs/v3/data/context.md
Original file line number Diff line number Diff line change
Expand Up @@ -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()`:
Expand Down Expand Up @@ -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;
Expand All @@ -274,9 +274,10 @@ and the ContextConsumer controller:

```ts
private _myData = new ContextConsumer(this,
myContext,
undefined, /* callback */
true /* subscribe */
{
context: myContext,
subscribe: true,
}
);
```

Expand Down Expand Up @@ -413,8 +414,10 @@ import {ContextProvider} from '@lit/context';
```ts
ContextProvider(
host: ReactiveElement,
context: T,
initialValue?: ContextType<T>
options: {
context: T,
initialValue?: ContextType<T>
}
)
```

Expand All @@ -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
}
)
```

Expand Down

0 comments on commit 3ebee1b

Please sign in to comment.