@abide/abide 0.105.0 → 0.106.0

package/src/compiler/parseAbide.ts

@@ -3,6 +3,9 @@ import { URL_ATTRIBUTES } from '#shared/URL_ATTRIBUTES.ts'
 import { isComponentTag, isSlot, propKeyOf } from './classifyTemplate.ts'
 import { decodeCharacterReferences } from './decodeCharacterReferences.ts'
 import { isNamedAlone } from './isNamedAlone.ts'
+import { lineOf } from './lineOf.ts'
+import { PositionedRefusal } from './PositionedRefusal.ts'
+import { TEMPLATE_BLOCKS } from './TEMPLATE_BLOCKS.ts'
 import { importedNames } from './splitImports.ts'
 import {
     type Attribute,
@@ -30,6 +33,11 @@ import { VOID_ELEMENTS } from './VOID_ELEMENTS.ts'
 // source text and handed to the emitter verbatim, which is what keeps 19.11 a property of
 // the file rather than a promise this parser has to keep.
 
+/** 32.64 — a close tag, naming the block it closes. */
+const CLOSER = new RegExp(
+    `^\\/\\s*(${Object.keys(TEMPLATE_BLOCKS).join('|')})$`,
+)
+
 /** A `.abide` file split into its script, module, style and head blocks and its parsed template. */
 export type AbideFile = {
     /** `<script>` bodies in source order — per-instance setup, 34.1. */
@@ -94,6 +102,10 @@ type Origins = {
     keys: Map<object, number>
     /** 38.39 — per `{#for}` block, where its item and its index start (`-1` where it has none). */
     bindings: Map<object, { item: number; index: number }>
+    /** 38.116 — per attribute but a spread, where its name starts. */
+    names: Map<object, number>
+    /** 38.116 — per element closed by a tag of its own, where that close tag's name starts. */
+    closes: Map<object, number>
 }
 
 /**
@@ -109,6 +121,66 @@ function armLevel(open: (string | null)[]): number {
     return level
 }
 
+/** The name a block's own tags spell — `if` for `{#if}` and `{/if}`. */
+function blockName(block: TemplateNode | InlineComponent): string {
+    return block.kind === 'block' ? block.block : 'component'
+}
+
+/** Which block IS open where a tag closes or continues another, and where it opened — or none. */
+function innermostOpen(
+    source: string,
+    blocks: (TemplateNode | InlineComponent)[],
+    openedAt: number[],
+): string {
+    const block = blocks[blocks.length - 1]
+    if (block === undefined) return ' No block is open here.'
+    const { line, column } = lineOf(
+        source,
+        openedAt[openedAt.length - 1] as number,
+    )
+    return ` The block open here is the {#${blockName(block)}} at ${line}:${column}.`
+}
+
+/** What to write instead of a block abide has none of, where there is one thing to write. */
+function unknownHint(inner: string): string {
+    if (/^#each(?![\w$])/.test(inner)) return ' — a list is {#for item of list}'
+    if (/^#await(?![\w$])/.test(inner))
+        return ' — there is no {#await}, and a loading arm is {#if value.ready()}'
+    if (/^@html(?![\w$])/.test(inner)) return ' — markup is {raw(value)}'
+    if (/^:else/.test(inner))
+        return ' — an else arm is {:else} or {:else if condition}'
+    return ''
+}
+
+/**
+ * 32.63 — a close tag that names an element opened OUTSIDE a block still open: the block was never
+ * closed inside it. Ignored, the close tag was dropped and the block took the rest of the element
+ * and everything after it as its body — `<p>{#component Card()}x</p>` lost the `<p>` entirely. A
+ * close tag that names no open element at all is still dropped (`parseAbide`).
+ */
+function refuseCrossing(
+    closing: string,
+    open: (string | null)[],
+    blocks: (TemplateNode | InlineComponent)[],
+    openedAt: number[],
+): void {
+    let arms = 0
+    for (let level = open.length - 1; level > 0; level -= 1) {
+        const name = open[level]
+        if (name === ARM) arms += 1
+        else if (typeof name === 'string' && sameTag(name, closing)) {
+            if (arms === 0) return
+            // The first block opened inside the element, which every block above it sits in.
+            const index = blocks.length - arms
+            const block = blocks[index] as TemplateNode | InlineComponent
+            throw new PositionedRefusal(
+                `abide: {#${blockName(block)}} is never closed before </${closing}>, and the element it was opened in ends there. Write {/${blockName(block)}} before </${closing}>. RULEBOOK 32.63.`,
+                openedAt[index] as number,
+            )
+        }
+    }
+}
+
 /** Pops `open` and `stack` together down to `level`, closing whatever the arm still holds open. */
 function unwindTo(
     level: number,
@@ -142,6 +214,8 @@ export function parseAbide(source: string): AbideFile {
         holders: new Map(),
         keys: new Map(),
         bindings: new Map(),
+        names: new Map(),
+        closes: new Map(),
     }
     const root: TemplateNode[] = []
     // The open elements, innermost last. `root` is the floor and is never popped.
@@ -155,6 +229,9 @@ export function parseAbide(source: string): AbideFile {
     // The open control blocks, so a `{:else}` knows which block it belongs to, and the open
     // `{#component}` blocks, whose body a `<script>` or a `<style>` written in it belongs to.
     const blocks: (TemplateNode | InlineComponent)[] = []
+    // Where each open block's own tag starts, beside `blocks`, so a block left open is refused at
+    // the tag that opened it.
+    const openedAt: number[] = []
     // 32.43 — each `{#component}` under the list it was written in, which says whose scope it is in
     // once the tree is whole (`fileComponents`).
     const declared = new Map<TemplateNode[], InlineComponent[]>()
@@ -186,9 +263,20 @@ export function parseAbide(source: string): AbideFile {
                 )
             const innermost = open[open.length - 1]
             if (typeof innermost === 'string' && sameTag(innermost, closing)) {
+                // The element closed is the last node of the level around it, written before
+                // every node now inside it — and placed only where the close spells its name.
+                const around = stack[stack.length - 2] as TemplateNode[]
+                if (closing === innermost) {
+                    let named = at + 2
+                    while (isSpace(source[named] as string)) named += 1
+                    origins.closes.set(
+                        around[around.length - 1] as TemplateNode,
+                        named,
+                    )
+                }
                 stack.pop()
                 open.pop()
-            }
+            } else refuseCrossing(closing, open, blocks, openedAt)
             at = close + 1
             continue
         }
@@ -213,7 +301,7 @@ export function parseAbide(source: string): AbideFile {
                 continue
             }
 
-            const tag = readTag(source, at, origins.holders)
+            const tag = readTag(source, at, origins)
             if (tag === undefined) {
                 // A `<` THAT OPENS NO TAG IS TEXT. `<p>a < b</p>` lost its `<` to a parser that
                 // stepped over what it could not read.
@@ -369,26 +457,15 @@ export function parseAbide(source: string): AbideFile {
                 if (here === undefined) declared.set(children, [component])
                 else here.push(component)
                 blocks.push(component)
+                openedAt.push(at)
                 stack.push(component.children)
                 open.push(ARM)
                 at = end + 1
                 continue
             }
-            if (inner === '/component') {
-                const level = armLevel(open)
-                if (
-                    blocks[blocks.length - 1]?.kind === 'component' &&
-                    level > 0
-                ) {
-                    blocks.pop()
-                    unwindTo(level, open, stack)
-                }
-                at = end + 1
-                continue
-            }
             // `{#if}`, `{:else}`, `{:else if}`, `{/if}` — a control block opens a new ARM rather
             // than a new element, so it keeps its own stack beside the element one.
-            if (inner.startsWith('#if')) {
+            if (/^#if(?![\w$])/.test(inner)) {
                 const subject = trimmed(source, slot.at + 3, end)
                 const branch = newBranch(subject.text)
                 origins.holders.set(branch, subject.at)
@@ -399,37 +476,43 @@ export function parseAbide(source: string): AbideFile {
                 }
                 children.push(block)
                 blocks.push(block)
+                openedAt.push(at)
                 stack.push(branch.children)
                 open.push(ARM)
                 at = end + 1
                 continue
             }
-            if (inner.startsWith(':else')) {
+            if (/^:else(?![\w$])/.test(inner)) {
                 const block = blocks[blocks.length - 1]
+                // 32.64 — AN ELSE ARM OUTSIDE A `{#if}` IS REFUSED, for the reason 32.56 refuses a
+                // stray catch: dropped, the text after it read as the body it stood in.
                 if (
-                    block !== undefined &&
-                    block.kind === 'block' &&
-                    block.block === 'if'
-                ) {
-                    // `{:else}` carries no condition, which is what makes it always take.
-                    const subject = trimmed(
-                        source,
-                        slot.at + elseSubjectAt(inner),
-                        end,
+                    block === undefined ||
+                    block.kind !== 'block' ||
+                    block.block !== 'if'
+                )
+                    throw new PositionedRefusal(
+                        `abide: {${inner}} stands outside a {#if}, and only a {#if} has an else arm.${innermostOpen(source, blocks, openedAt)} RULEBOOK 32.64.`,
+                        at,
                     )
-                    const branch = newBranch(subject.text)
-                    if (branch.subject !== '')
-                        origins.holders.set(branch, subject.at)
-                    // UNWOUND TO THE ARM'S OWN LEVEL, for the reason `{/if}` below is: an
-                    // element the author left open in the PREVIOUS arm sits above it, and
-                    // popping one level left `open` naming that element while `stack` held the
-                    // new arm — so its close tag popped the arm and every node after it landed
-                    // in the first arm, which renders on the opposite condition.
-                    unwindTo(armLevel(open), open, stack)
-                    block.branches.push(branch)
-                    stack.push(branch.children)
-                    open.push(ARM)
-                }
+                // `{:else}` carries no condition, which is what makes it always take.
+                const subject = trimmed(
+                    source,
+                    slot.at + elseSubjectAt(inner),
+                    end,
+                )
+                const branch = newBranch(subject.text)
+                if (branch.subject !== '')
+                    origins.holders.set(branch, subject.at)
+                // UNWOUND TO THE ARM'S OWN LEVEL, for the reason `{/if}` below is: an
+                // element the author left open in the PREVIOUS arm sits above it, and
+                // popping one level left `open` naming that element while `stack` held the
+                // new arm — so its close tag popped the arm and every node after it landed
+                // in the first arm, which renders on the opposite condition.
+                unwindTo(armLevel(open), open, stack)
+                block.branches.push(branch)
+                stack.push(branch.children)
+                open.push(ARM)
                 at = end + 1
                 continue
             }
@@ -444,12 +527,13 @@ export function parseAbide(source: string): AbideFile {
                 }
                 children.push(block)
                 blocks.push(block)
+                openedAt.push(at)
                 stack.push(body.children)
                 open.push(ARM)
                 at = end + 1
                 continue
             }
-            if (inner.startsWith(':catch') || inner === ':finally') {
+            if (/^:catch(?![\w$])/.test(inner) || inner === ':finally') {
                 const block = blocks[blocks.length - 1]
                 // 32.56 — ONLY A `{#try}` HAS THESE ARMS. Anywhere else the tag was dropped and what
                 // followed it read as the body it stood in: a `{#for}`'s catch rendered in every row.
@@ -458,8 +542,9 @@ export function parseAbide(source: string): AbideFile {
                     block.kind !== 'block' ||
                     block.block !== 'try'
                 )
-                    throw new Error(
+                    throw new PositionedRefusal(
                         `abide: {${inner}} stands outside a {#try}, and only a {#try} has a catch or a finally arm. RULEBOOK 32.56.`,
+                        at,
                     )
                 unwindTo(armLevel(open), open, stack)
                 // The finally arm is a third branch until `{/try}` folds it into the other two.
@@ -472,33 +557,7 @@ export function parseAbide(source: string): AbideFile {
                 at = end + 1
                 continue
             }
-            if (inner === '/try') {
-                const level = armLevel(open)
-                const block = blocks[blocks.length - 1]
-                if (
-                    block !== undefined &&
-                    block.kind === 'block' &&
-                    block.block === 'try' &&
-                    level > 0
-                ) {
-                    blocks.pop()
-                    unwindTo(level, open, stack)
-                    const after = closeTry(block)
-                    const around = stack[stack.length - 1] as TemplateNode[]
-                    around.push(...after)
-                    // The `{:finally}` markup stands in the list around the block now, and so
-                    // does what it declares.
-                    const moved = declared.get(after)
-                    if (moved !== undefined) {
-                        const here = declared.get(around)
-                        if (here === undefined) declared.set(around, moved)
-                        else here.push(...moved)
-                    }
-                }
-                at = end + 1
-                continue
-            }
-            if (inner.startsWith('#for')) {
+            if (/^#for(?![\w$])/.test(inner)) {
                 const block = forBlock(
                     source,
                     trimmed(source, slot.at + 4, end),
@@ -506,28 +565,60 @@ export function parseAbide(source: string): AbideFile {
                 )
                 children.push(block)
                 blocks.push(block)
+                openedAt.push(at)
                 stack.push(block.children)
                 open.push(ARM)
                 at = end + 1
                 continue
             }
-            // A `{/if}` with no block open closes NOTHING — left to pop, it ends the element
-            // around it and every node after it hangs outside.
-            if (inner === '/for' || inner === '/if') {
+            // 32.64 — A CLOSE TAG CLOSES THE BLOCK IT NAMES, AND ONLY THAT ONE. Ignored, a stray
+            // `{/if}` let the text after it stand where the author never put it; and closing
+            // whatever was innermost let `{/if}` end a `{#try}` without folding its arms.
+            const closer = CLOSER.exec(inner)
+            if (closer !== null) {
+                const name = closer[1] as string
+                const block = blocks[blocks.length - 1]
+                if (block === undefined || blockName(block) !== name)
+                    throw new PositionedRefusal(
+                        `abide: {/${name}} closes no {#${name}}.${innermostOpen(source, blocks, openedAt)} RULEBOOK 32.64.`,
+                        at,
+                    )
+                blocks.pop()
+                openedAt.pop()
                 // UNWOUND TO THE ARM'S OWN LEVEL, because an element the author left open inside
                 // the block sits above it. Requiring the arm to be innermost, `<div>{#if a}<b>x
                 // {/if}</div><p>after</p>` closed NOTHING — the `</div>` then matched nothing
                 // either, and the `<p>` landed inside the if-arm and vanished whenever the
                 // condition was false. Closing whatever the block still holds open is what the
                 // close tag of the element AROUND it would have to do anyway.
-                const level = armLevel(open)
-                if (blocks[blocks.length - 1]?.kind === 'block' && level > 0) {
-                    blocks.pop()
-                    unwindTo(level, open, stack)
+                unwindTo(armLevel(open), open, stack)
+                if (block.kind === 'block' && block.block === 'try') {
+                    const after = closeTry(block)
+                    const around = stack[stack.length - 1] as TemplateNode[]
+                    around.push(...after)
+                    // The `{:finally}` markup stands in the list around the block now, and so
+                    // does what it declares.
+                    const moved = declared.get(after)
+                    if (moved !== undefined) {
+                        const here = declared.get(around)
+                        if (here === undefined) declared.set(around, moved)
+                        else here.push(...moved)
+                    }
                 }
                 at = end + 1
                 continue
             }
+            // 32.65 — `{#each}`, `{#await}`, `{@html}` and every other tag abide has no block for.
+            // Read as an expression, each surfaced as a TypeScript syntax error about a `#` or an
+            // `@`, which names nothing the author wrote.
+            const unknown = /^(?:[#:@][A-Za-z]|\/\s*[A-Za-z][\w$]*$)/.test(
+                inner,
+            )
+            if (unknown)
+                throw new PositionedRefusal(
+                    `abide: {${inner}} is not a block abide has. A template has {#if}, {#for}, {#try} and {#component Name(pattern)}, each closed by its own {/if}, {/for}, {/try} or {/component}${unknownHint(inner)}. RULEBOOK 32.65.`,
+                    at,
+                )
 
             const expression: TemplateNode = {
                 kind: 'expression',
@@ -541,6 +632,14 @@ export function parseAbide(source: string): AbideFile {
 
         at = pushText(children, source, at, at)
     }
+    // 32.63 — a block still open at the end of the file closes nowhere, and what it holds would
+    // render only where its arm takes.
+    const unclosed = blocks[blocks.length - 1]
+    if (unclosed !== undefined)
+        throw new PositionedRefusal(
+            `abide: {#${blockName(unclosed)}} is never closed. Write {/${blockName(unclosed)}} where its body ends. RULEBOOK 32.63.`,
+            openedAt[openedAt.length - 1] as number,
+        )
 
     const components = fileComponents(root, declared)
     refuseImported(components, [...modules, ...servers, ...scripts])
@@ -1148,7 +1247,7 @@ function leadingSpace(text: string): number {
 function readTag(
     source: string,
     open: number,
-    origins: Map<object, number>,
+    origins: Origins,
 ):
     | {
           name: string
@@ -1177,7 +1276,8 @@ function readTag(
     const place = (from: number, position: number, named: number): void => {
         for (let index = from; index < attributes.length; index += 1) {
             const placed = attributes[index] as Attribute
-            origins.set(placed, placed.expression ? position : named)
+            origins.holders.set(placed, placed.expression ? position : named)
+            if (placed.name !== '...') origins.names.set(placed, named)
         }
     }
     while (at < source.length) {

package/src/compiler/projectShadow.ts

@@ -60,6 +60,8 @@ export type Projection = {
      * Per `{#for}` block, the position of its `by` key, which stands inside the loop and sees the row.
      */
     keys: Map<object, Position>
+    /** 32.67 — per `{#for}` block, where its row's item binding starts. */
+    items: Map<object, number>
     /**
      * 32.34 — per invocation, the position of its tag: a read there is a component chosen by a value.
      */
@@ -265,6 +267,7 @@ function project(file: AbideFile): Projection {
     const positions: Position[] = []
     const slots = new Map<object, Position>()
     const keys = new Map<object, Position>()
+    const items = new Map<object, number>()
     const tags = new Map<object, Position>()
     let inlineProps = false
     // Spans are written in ascending order, so the table is sorted as it is pushed.
@@ -355,10 +358,23 @@ function project(file: AbideFile): Projection {
                 if (attribute.expression) refused.push(attribute)
                 continue
             }
-            // The key is scaffolding, and a finding on it — a value of the wrong type, a prop the
-            // child does not declare — is placed at the value it keys, or a literal's name.
-            place(file.origins.holders.get(attribute), 0)
-            text += `${JSON.stringify(key)}: `
+            // 38.116 — A KEY A NAME CAN SPELL IS COPIED FROM THE ATTRIBUTE'S NAME, so the prop's
+            // references reach the tag that passes it. A finding on the key — a value of the wrong
+            // type, a prop the child does not declare — is still placed at the value it keys, or a
+            // literal's name: the empty run at the key's start, after the name's own, is the one a
+            // finding there maps back by.
+            const named = file.origins.names.get(attribute)
+            const holder = file.origins.holders.get(attribute)
+            if (named !== undefined && isNamedAlone(key)) {
+                const keyAt = text.length
+                copied(key, named + attribute.name.length - key.length)
+                if (holder !== undefined)
+                    origins.push({ at: keyAt, source: holder, length: 0 })
+            } else {
+                place(holder, 0)
+                text += JSON.stringify(key)
+            }
+            text += ': '
             if (attribute.expression) prop(attribute)
             else text += `${JSON.stringify(attribute.value)},\n`
         }
@@ -371,6 +387,13 @@ function project(file: AbideFile): Projection {
             text += ',\n'
         }
         text += '}))\n'
+        // 38.116 — a close tag of its own is a second read of the name, so it is renamed with it.
+        const closed = file.origins.closes.get(node)
+        if (closed !== undefined) {
+            text += ';('
+            copied(node.tag, closed)
+            text += ')\n'
+        }
         for (const attribute of refused)
             slots.set(
                 attribute,
@@ -537,7 +560,7 @@ function project(file: AbideFile): Projection {
             // the binding's. The index is a `number`: `= 0` alone types it the literal `0`.
             const bound = file.origins.bindings.get(node)
             text += 'for (const '
-            copied(node.item, bound?.item)
+            items.set(node, copied(node.item, bound?.item).start)
             text += ` of ${ROWS_OF}(${subject})) {\n`
             if (node.index !== '') {
                 text += 'const '
@@ -589,6 +612,7 @@ function project(file: AbideFile): Projection {
         positions: new PositionTable(positions),
         slots,
         keys,
+        items,
         tags,
         origins,
     }
@@ -800,7 +824,7 @@ function refuseTwoFaces(
         (binding.imported === 'default' || binding.imported === '*')
     )
         throw new Error(
-            `abide: <script server> imports ${binding.local} from '${statement.specifier}' as another script block of its file does — a server block's .abide is the function binding its props (34.16), the other block's is its module (32.17), and one name cannot be both. Import it under another name in the <script server>. RULEBOOK 34.22.`,
+            `abide: <script server> imports ${binding.local} from '${statement.specifier}' as another script block of its file does — a server block's .abide is the function binding its props (RULEBOOK 34.16), the other block's is its module (RULEBOOK 32.17), and one name cannot be both. Import it under another name in the <script server>. RULEBOOK 34.22.`,
         )
 }
 

package/src/compiler/readSources.ts

@@ -37,7 +37,7 @@ export function parseSources(
         try {
             file = parseAbide(source.text)
         } catch (thrown) {
-            if (!quiet) refusals.at(source.path, thrown)
+            if (!quiet) refusals.at(source.path, thrown, source.text)
             continue
         }
         parsed.push({

package/src/compiler/readsIn.ts

@@ -9,6 +9,7 @@ import {
     isClassDeclaration,
     isEnumDeclaration,
     isExpressionStatement,
+    isForOfStatement,
     isFunctionDeclaration,
     isFunctionExpression,
     isIdentifier,
@@ -21,6 +22,7 @@ import {
     isPropertyAccessExpression,
     isReturnStatement,
     isVariableDeclaration,
+    isVariableDeclarationList,
     isVariableStatement,
 } from 'typescript/unstable/ast/is'
 import {
@@ -71,6 +73,8 @@ export type ShadowSpans = {
     servers: Span
     scripts: Span
     positions: PositionTable
+    /** 32.67 — where each `{#for}` row's item binding starts. */
+    items: Set<number>
 }
 
 const SETUP: ReadonlySet<PositionKind> = new Set(['setup'])
@@ -186,6 +190,7 @@ export async function readsIn(
     // listening and be reported unhandled; `await props` still throws it.
     props.catch(() => {})
     const params = routeReads(checker, abide, sourceFile, reads)
+    const rows = rowReads(checker, sourceFile, shadowPath, spans, reads)
     const configs = configReads(
         checker,
         abide,
@@ -256,6 +261,7 @@ export async function readsIn(
     await Promise.all(holding)
     await props
     await params
+    await rows
     await configs
     const statics = new Set<number>()
     const expressions = spans.positions.nodesIn(
@@ -493,11 +499,13 @@ async function proveSlots(
     statics: Set<number>,
 ): Promise<void> {
     // Reads are unsorted here; a position holding one is not asked about. A `raw` callee is the
-    // framework's name rather than a read of the page's, and `provePosition` exempts its call.
+    // framework's name rather than a read of the page's, and `provePosition` exempts its call. A
+    // row's item (32.67) is the value on the server, and the client's `Lowering.isLive` binds it.
     const read = (span: Span): boolean => {
         for (const one of reads)
             if (
                 one.shape !== 'raw' &&
+                one.item === -1 &&
                 one.start >= span.start &&
                 one.start < span.end
             )
@@ -733,6 +741,97 @@ async function routeReads(
     }
 }
 
+/**
+ * 32.67 — every read of a `{#for}` row's item, which a client lowering reads off the row's record or
+ * its cell inside the row's mount (`Lowering.readItemsAs`), so the value a kept key is handed is
+ * written into the row rather than the row remade.
+ *
+ * EVERY OCCURRENCE IS A READ OF THE ITEM, as a prop's is (`classifyPropRead`): a member written,
+ * `row.done = true`, is the value's member, and a call is the value called. A pattern's names are
+ * each one, read through the item. The ROW'S OWN KEY is not: the key is asked of the value before
+ * there is a row (`List.key`), so it reads the value itself.
+ */
+async function rowReads(
+    checker: Checker,
+    sourceFile: Node,
+    shadowPath: string,
+    spans: ShadowSpans,
+    reads: Read[],
+): Promise<void> {
+    if (spans.items.size === 0) return
+    const bound: Node[] = []
+    const loops: Node[] = []
+    const bind = (name: Node | undefined, loop: Node): void => {
+        if (name === undefined) return
+        if (isIdentifier(name)) {
+            bound.push(name)
+            loops.push(loop)
+            return
+        }
+        if (isObjectBindingPattern(name) || isArrayBindingPattern(name))
+            for (const element of name.elements)
+                bind((element as { name?: Node }).name, loop)
+    }
+    const visit = (node: Node): void => {
+        const declared = rowItemOf(node, spans.items)
+        if (declared !== undefined) bind(declared, node)
+        node.forEachChild(visit)
+    }
+    sourceFile.forEachChild(visit)
+    if (bound.length === 0) return
+    const symbols = await checker.getSymbolAtLocation(bound)
+    const found = await Promise.all(
+        symbols.map(async (symbol) =>
+            symbol === undefined
+                ? []
+                : await Promise.all(
+                      (
+                          await checker.getReferencesToSymbolInFile(
+                              shadowPath,
+                              symbol,
+                          )
+                      ).map((reference) => reference.resolve()),
+                  ),
+        ),
+    )
+    for (let at = 0; at < found.length; at += 1) {
+        const name = bound[at] as Node
+        const loop = loops[at] as Node
+        const item = (rowItemOf(loop, spans.items) as Node).getStart()
+        for (const node of found[at] as (Node | undefined)[]) {
+            if (node === undefined || node === name) continue
+            if (
+                spans.positions.holding(node.getStart())?.kind === 'key' &&
+                rowLoopOf(node, spans.items) === loop
+            )
+                continue
+            const read = classifyPropRead(node)
+            if (read === undefined) continue
+            read.item = item
+            reads.push(read)
+        }
+    }
+}
+
+/** The item binding `node` declares, where it is a `{#for}` row loop. */
+function rowItemOf(node: Node, items: Set<number>): Node | undefined {
+    if (!isForOfStatement(node)) return undefined
+    const list = node.initializer
+    const declared = isVariableDeclarationList(list)
+        ? list.declarations[0]?.name
+        : undefined
+    return declared !== undefined && items.has(declared.getStart())
+        ? declared
+        : undefined
+}
+
+/** The nearest `{#for}` row loop around `node`. */
+function rowLoopOf(node: Node, items: Set<number>): Node | undefined {
+    for (let at = node.parent; at !== undefined; at = at.parent)
+        if (rowItemOf(at, items) !== undefined) return at
+    return undefined
+}
+
 /**
  * Throws where an inline component the template's own body declares shares a name with one the
  * file's `<script>` or `<script module>` declares.