{
  "$schema": "https://pi-tui.ratstack.sh/schema/pattern.schema.json",
  "aka": [
    "Stable async selection"
  ],
  "animated": false,
  "apis": [
    {
      "name": "ctx.ui.custom",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#use-custom-screens-and-overlays"
    },
    {
      "name": "TUI.requestRender",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#understand-the-component-model"
    },
    {
      "name": "Component",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#understand-the-component-model"
    },
    {
      "name": "SelectList",
      "url": null
    }
  ],
  "applicability": [
    "Use this when a picker combines immediately available and remote options."
  ],
  "category": "lists",
  "categoryLabel": "Lists and pickers",
  "consequences": [
    "New arrivals do not move the highlight to a different item.",
    "Pending, failed and late responses need explicit handling."
  ],
  "family": "behavioral",
  "familyLabel": "Behavioral",
  "id": "identity-anchor",
  "implementation": [
    "Ignore responses after the view closes.",
    "Do not present pending requests as completed entries."
  ],
  "intent": "Retain the highlighted item's identity as asynchronous results arrive.",
  "jsonUrl": "https://pi-tui.ratstack.sh/patterns/identity-anchor.json",
  "kind": "component",
  "knownUses": [
    {
      "example": "handover-multifocus-async-list",
      "moreRefs": 0,
      "refs": [
        {
          "file": "ui/handover-picker.ts",
          "lines": "61-180",
          "sha": "a5fad4df",
          "url": "https://github.com/nicobailon/pi-intercom/blob/a5fad4df2a9fe4909bf4d9b06263c8316976b57d/ui/handover-picker.ts#L61-L180"
        }
      ],
      "repo": "pi-intercom",
      "repoUrl": "https://github.com/nicobailon/pi-intercom",
      "title": "Separate task-field focus and retain remote selection through async refresh"
    },
    {
      "example": "fleet-detail-projection",
      "moreRefs": 0,
      "refs": [
        {
          "file": "src/tui/fleet.ts",
          "lines": "1-120",
          "sha": "6826b054",
          "url": "https://github.com/nicobailon/pi-subagents/blob/6826b0545216077195ae8ffe468a6434715814b7/src/tui/fleet.ts#L1-L120"
        },
        {
          "file": "src/tui/fleet.ts",
          "lines": "1360-1463",
          "sha": "6826b054",
          "url": "https://github.com/nicobailon/pi-subagents/blob/6826b0545216077195ae8ffe468a6434715814b7/src/tui/fleet.ts#L1360-L1463"
        }
      ],
      "repo": "pi-subagents",
      "repoUrl": "https://github.com/nicobailon/pi-subagents",
      "title": "Keep fleet selection stable while details are derived"
    }
  ],
  "linkedFrom": [
    {
      "how": "preserves identity when items change",
      "id": "row-window",
      "jsonUrl": "https://pi-tui.ratstack.sh/patterns/row-window.json",
      "mdUrl": "https://pi-tui.ratstack.sh/patterns/row-window.md",
      "name": "Row Window",
      "url": "https://pi-tui.ratstack.sh/patterns/row-window/"
    },
    {
      "how": "keeps the selected identity stable",
      "id": "detail-lens",
      "jsonUrl": "https://pi-tui.ratstack.sh/patterns/detail-lens.json",
      "mdUrl": "https://pi-tui.ratstack.sh/patterns/detail-lens.md",
      "name": "Detail Lens",
      "url": "https://pi-tui.ratstack.sh/patterns/detail-lens/"
    },
    {
      "how": "keeps target identity through refresh",
      "id": "field-baton",
      "jsonUrl": "https://pi-tui.ratstack.sh/patterns/field-baton.json",
      "mdUrl": "https://pi-tui.ratstack.sh/patterns/field-baton.md",
      "name": "Field Baton",
      "url": "https://pi-tui.ratstack.sh/patterns/field-baton/"
    }
  ],
  "links": {
    "agentGuide": "https://pi-tui.ratstack.sh/llms.txt",
    "index": "https://pi-tui.ratstack.sh/patterns.md",
    "skill": "https://pi-tui.ratstack.sh/skills/build-pi-tui-component.md"
  },
  "mdUrl": "https://pi-tui.ratstack.sh/patterns/identity-anchor.md",
  "motivation": "Intercom's handover picker receives remote listings after local choices are already visible.",
  "name": "Identity Anchor",
  "participants": [
    {
      "name": "ctx.ui.custom",
      "role": "Mounts one interaction and resolves through done.",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#use-custom-screens-and-overlays"
    },
    {
      "name": "TUI.requestRender",
      "role": "Requests a coalesced redraw after state changes.",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#understand-the-component-model"
    },
    {
      "name": "Component",
      "role": "Renders width-bounded lines and invalidates cached output.",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#understand-the-component-model"
    },
    {
      "name": "Item identity",
      "role": "Anchors the highlight through asynchronous insertions.",
      "url": null
    }
  ],
  "pi": "1.0.3",
  "related": [
    {
      "how": "separates target and task input",
      "id": "field-baton",
      "jsonUrl": "https://pi-tui.ratstack.sh/patterns/field-baton.json",
      "mdUrl": "https://pi-tui.ratstack.sh/patterns/field-baton.md",
      "name": "Field Baton",
      "url": "https://pi-tui.ratstack.sh/patterns/field-baton/"
    }
  ],
  "sampleCode": {
    "code": "// Identity Anchor: preserve an item's identity when asynchronous rows arrive.\nimport { getSelectListTheme } from \"@earendil-works/pi-coding-agent\";\nimport { SelectList, Text, type SelectItem } from \"@earendil-works/pi-tui\";\nimport type { PatternStory } from \"../../../src/pattern.ts\";\n\nconst local = [\n  { value: \"local-build\", label: \"Build\", description: \"Local task\" },\n  { value: \"local-review\", label: \"Review\", description: \"Local task\" },\n];\ntype RemoteSection = { status: \"pending\" } | { status: \"arrived\"; items: SelectItem[] } | { status: \"error\"; message: string };\n\nexport const story: PatternStory = {\n  id: \"identity-anchor\", title: \"Identity Anchor\", kind: \"component\",\n  apis: [\"Component\", \"SelectList\", \"TUI.requestRender\"], rows: 12,\n  states: [\n    { id: \"loading\", label: \"Loading options\" },\n    { id: \"arrived\", label: \"Selection retained\", steps: [{ type: \"action\", name: \"arrive\" }] },\n    { id: \"error\", label: \"Remote error\", steps: [{ type: \"action\", name: \"error\" }] },\n  ],\n  setup({ tui, theme, action }) {\n    let remote: RemoteSection = { status: \"pending\" };\n    let lifecycle: \"open\" | \"closed\" = \"open\";\n    let choices = new SelectList(local, 5, getSelectListTheme());\n    choices.setSelectedIndex(1);\n    function accept(response: RemoteSection) {\n      if (lifecycle === \"closed\") return; // Late responses cannot revive the view.\n      const identity = choices.getSelectedItem()?.value;\n      remote = response;\n      const merged = remote.status === \"arrived\" ? [...remote.items, ...local] : local;\n      choices = new SelectList(merged, 5, getSelectListTheme());\n      choices.setSelectedIndex(Math.max(0, merged.findIndex(item => item.value === identity)));\n      tui.requestRender();\n    }\n    action(\"arrive\", () => accept({ status: \"arrived\", items: [\n      { value: \"remote-plan\", label: \"Plan\", description: \"Remote task\" },\n      { value: \"remote-test\", label: \"Test\", description: \"Remote task\" },\n    ] }));\n    action(\"error\", () => accept({ status: \"error\", message: \"Remote failed · local tasks still usable\" }));\n    return {\n      invalidate() { choices.invalidate(); },\n      dispose() { lifecycle = \"closed\"; },\n      handleInput(data) { choices.handleInput(data); tui.requestRender(); },\n      render(width) {\n        const section = remote.status === \"pending\" ? \"Remote · listing…\"\n          : remote.status === \"arrived\" ? \"Remote · 2 tasks arrived above locals\" : remote.message;\n        return [\n          ...new Text(theme.fg(\"accent\", \"Handover target\"), 0, 0).render(width),\n          ...new Text(theme.fg(remote.status === \"error\" ? \"warning\" : \"muted\", section), 0, 0).render(width),\n          \"\", ...choices.render(width), \"\",\n          ...new Text(theme.fg(\"success\", \"Anchored id: \" + choices.getSelectedItem()?.value), 0, 0).render(width),\n          ...new Text(theme.fg(\"dim\", \"New rows do not steal the highlight\"), 0, 0).render(width),\n        ];\n      },\n    };\n  },\n};\n",
    "lang": "ts",
    "path": "stories/patterns/behavioral/identity-anchor.ts"
  },
  "states": [
    {
      "dont": false,
      "expectFail": [],
      "frames": [
        {
          "alt": "Identity Anchor, Loading options state, 40 columns, dark theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/loading-40-dark.9a7fc2c20d4e.webp",
          "theme": "dark",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Identity Anchor, Loading options state, 40 columns, light theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/loading-40-light.92e432399b5a.webp",
          "theme": "light",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Identity Anchor, Loading options state, 60 columns, dark theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/loading-60-dark.8f20c837dcac.webp",
          "theme": "dark",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Identity Anchor, Loading options state, 60 columns, light theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/loading-60-light.245f041fb0b3.webp",
          "theme": "light",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Identity Anchor, Loading options state, 80 columns, dark theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/loading-80-dark.abcd48047154.webp",
          "theme": "dark",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Identity Anchor, Loading options state, 80 columns, light theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/loading-80-light.8f3d90dffbab.webp",
          "theme": "light",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Identity Anchor, Loading options state, 120 columns, dark theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/loading-120-dark.f781e401eb38.webp",
          "theme": "dark",
          "w": 2400,
          "width": 120
        },
        {
          "alt": "Identity Anchor, Loading options state, 120 columns, light theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/loading-120-light.c256e2bd95e2.webp",
          "theme": "light",
          "w": 2400,
          "width": 120
        }
      ],
      "how": "Show local items and a visibly pending remote section.",
      "id": "loading",
      "label": "Loading options",
      "problems": []
    },
    {
      "dont": false,
      "expectFail": [],
      "frames": [
        {
          "alt": "Identity Anchor, Selection retained state, 40 columns, dark theme, 10 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 440,
          "rows": 10,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/arrived-40-dark.f5d8b9c16556.webp",
          "theme": "dark",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Identity Anchor, Selection retained state, 40 columns, light theme, 10 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 440,
          "rows": 10,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/arrived-40-light.76f7521b0c03.webp",
          "theme": "light",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Identity Anchor, Selection retained state, 60 columns, dark theme, 10 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 440,
          "rows": 10,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/arrived-60-dark.1cd299209bde.webp",
          "theme": "dark",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Identity Anchor, Selection retained state, 60 columns, light theme, 10 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 440,
          "rows": 10,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/arrived-60-light.c28bda4916f0.webp",
          "theme": "light",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Identity Anchor, Selection retained state, 80 columns, dark theme, 10 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 440,
          "rows": 10,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/arrived-80-dark.38b4922b6c91.webp",
          "theme": "dark",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Identity Anchor, Selection retained state, 80 columns, light theme, 10 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 440,
          "rows": 10,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/arrived-80-light.8fb51b048807.webp",
          "theme": "light",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Identity Anchor, Selection retained state, 120 columns, dark theme, 10 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 440,
          "rows": 10,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/arrived-120-dark.88f1add69c22.webp",
          "theme": "dark",
          "w": 2400,
          "width": 120
        },
        {
          "alt": "Identity Anchor, Selection retained state, 120 columns, light theme, 10 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 440,
          "rows": 10,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/arrived-120-light.26432e017a84.webp",
          "theme": "light",
          "w": 2400,
          "width": 120
        }
      ],
      "how": "Insert remote results while preserving the highlighted item.",
      "id": "arrived",
      "label": "Selection retained",
      "problems": []
    },
    {
      "dont": false,
      "expectFail": [],
      "frames": [
        {
          "alt": "Identity Anchor, Remote error state, 40 columns, dark theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/error-40-dark.a8075661443d.webp",
          "theme": "dark",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Identity Anchor, Remote error state, 40 columns, light theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/error-40-light.8ae5c0539ac1.webp",
          "theme": "light",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Identity Anchor, Remote error state, 60 columns, dark theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/error-60-dark.e4419ec8e1ef.webp",
          "theme": "dark",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Identity Anchor, Remote error state, 60 columns, light theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/error-60-light.dadafc86e98a.webp",
          "theme": "light",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Identity Anchor, Remote error state, 80 columns, dark theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/error-80-dark.50602199f324.webp",
          "theme": "dark",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Identity Anchor, Remote error state, 80 columns, light theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/error-80-light.228265cf6d1a.webp",
          "theme": "light",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Identity Anchor, Remote error state, 120 columns, dark theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/error-120-dark.847102719bc9.webp",
          "theme": "dark",
          "w": 2400,
          "width": 120
        },
        {
          "alt": "Identity Anchor, Remote error state, 120 columns, light theme, 8 rows",
          "animated": false,
          "animation": null,
          "checks": [
            {
              "evidence": [],
              "name": "width",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "style-leak",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "hard-coded-colour",
              "status": "pass",
              "verdict": "pass"
            },
            {
              "evidence": [],
              "name": "height",
              "status": "pass",
              "verdict": "pass"
            }
          ],
          "h": 352,
          "rows": 8,
          "still": "https://pi-tui.ratstack.sh/frames/identity-anchor/error-120-light.b00ef9d17565.webp",
          "theme": "light",
          "w": 2400,
          "width": 120
        }
      ],
      "how": "Show a settled error section while keeping local choices usable.",
      "id": "error",
      "label": "Remote error",
      "problems": []
    }
  ],
  "structure": "local + remote results\n        -> merge by identity\n        -> keep highlight",
  "thumbnails": {
    "dark": {
      "animation": null,
      "src": "https://pi-tui.ratstack.sh/thumbs/identity-anchor/dark.c4c144304e34.webp"
    },
    "light": {
      "animation": null,
      "src": "https://pi-tui.ratstack.sh/thumbs/identity-anchor/light.e53835806f7d.webp"
    }
  },
  "url": "https://pi-tui.ratstack.sh/patterns/identity-anchor/",
  "widths": [
    40,
    60,
    80,
    120
  ]
}
