The when directive docs are out of date with the actual v3 API. Since lit#4310, when() passes the (type-narrowed) condition value to both case functions, but the docs don't reflect this.
1. The Signature box is wrong
It currently shows:
when<T, F>(
condition: boolean,
trueCase: () => T,
falseCase?: () => F
)
The actual v3 signature uses a generic condition and passes it to the callbacks:
when<C, T, F = undefined>(
condition: C,
trueCase: (c: Exclude<C, Falsy>) => T,
falseCase?: (c: Extract<C, Falsy>) => F
): C extends Falsy ? F : T
(We may want to simplify it for the docs? I'm not so sure)
2. The example doesn't use the parameter
It currently is:
${when(this.user, () => html`User: ${this.user.username}`, () => html`Sign In...`)}
It should show the value being passed in (and narrowed), which is the whole point of the feature:
${when(this.user, (user) => html`User: ${user.username}`, () => html`Sign In...`)}
Additional note
The same incomplete example is also in the upstream JSDoc at lit/packages/lit-html/src/directives/when.ts, so that may be worth updating too for consistency.
The
whendirective docs are out of date with the actual v3 API. Since lit#4310,when()passes the (type-narrowed) condition value to both case functions, but the docs don't reflect this.1. The Signature box is wrong
It currently shows:
The actual v3 signature uses a generic condition and passes it to the callbacks:
(We may want to simplify it for the docs? I'm not so sure)
2. The example doesn't use the parameter
It currently is:
It should show the value being passed in (and narrowed), which is the whole point of the feature:
Additional note
The same incomplete example is also in the upstream JSDoc at
lit/packages/lit-html/src/directives/when.ts, so that may be worth updating too for consistency.