{
  "$schema": "https://pi-tui.ratstack.sh/schema/pattern.schema.json",
  "aka": [
    "Semantic key controls"
  ],
  "animated": false,
  "apis": [
    {
      "name": "KeybindingsManager.matches",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#handle-keyboard-input-and-focus"
    },
    {
      "name": "matchesKey",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#handle-keyboard-input-and-focus"
    },
    {
      "name": "pi.registerShortcut",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/extensions.md#choose-an-integration-point"
    },
    {
      "name": "KeybindingsManager.getKeys",
      "url": null
    },
    {
      "name": "SelectList",
      "url": null
    }
  ],
  "applicability": [
    "Use this when picker controls should follow the user's bindings."
  ],
  "category": "keys",
  "categoryLabel": "Keys and focus",
  "consequences": [
    "Configurable actions follow the user's keybindings.",
    "Dedicated extension shortcuts still need conflict checks."
  ],
  "family": "behavioral",
  "familyLabel": "Behavioral",
  "id": "action-compass",
  "implementation": [
    "Check registered shortcut conflicts.",
    "Keep explicit extension shortcuts distinct from configurable selection actions."
  ],
  "intent": "Resolve configurable actions through injected keybindings.",
  "jsonUrl": "https://pi-tui.ratstack.sh/patterns/action-compass.json",
  "kind": "component",
  "knownUses": [
    {
      "example": "reverse-thinking-shortcut",
      "moreRefs": 0,
      "refs": [
        {
          "file": "extensions/reverse-thinking.ts",
          "lines": "1-19",
          "sha": "17cce138",
          "url": "https://github.com/nicobailon/dot314/blob/17cce138f3f687211d0485d204408a9650953c61/extensions/reverse-thinking.ts#L1-L19"
        }
      ],
      "repo": "dot314",
      "repoUrl": "https://github.com/nicobailon/dot314",
      "title": "Bind a mode action to a dedicated shortcut"
    },
    {
      "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"
    },
    {
      "example": "intercom-compose-buffer",
      "moreRefs": 0,
      "refs": [
        {
          "file": "ui/compose.ts",
          "lines": "18-91",
          "sha": "a5fad4df",
          "url": "https://github.com/nicobailon/pi-intercom/blob/a5fad4df2a9fe4909bf4d9b06263c8316976b57d/ui/compose.ts#L18-L91"
        }
      ],
      "repo": "pi-intercom",
      "repoUrl": "https://github.com/nicobailon/pi-intercom",
      "title": "Compose with explicit send state and inline failure recovery"
    }
  ],
  "linkedFrom": [
    {
      "how": "resolves navigation actions",
      "id": "tab-deck",
      "jsonUrl": "https://pi-tui.ratstack.sh/patterns/tab-deck.json",
      "mdUrl": "https://pi-tui.ratstack.sh/patterns/tab-deck.md",
      "name": "Tab Deck",
      "url": "https://pi-tui.ratstack.sh/patterns/tab-deck/"
    },
    {
      "how": "keeps base application controls",
      "id": "editor-steward",
      "jsonUrl": "https://pi-tui.ratstack.sh/patterns/editor-steward.json",
      "mdUrl": "https://pi-tui.ratstack.sh/patterns/editor-steward.md",
      "name": "Editor Steward",
      "url": "https://pi-tui.ratstack.sh/patterns/editor-steward/"
    },
    {
      "how": "resolves configurable component actions",
      "id": "input-lease",
      "jsonUrl": "https://pi-tui.ratstack.sh/patterns/input-lease.json",
      "mdUrl": "https://pi-tui.ratstack.sh/patterns/input-lease.md",
      "name": "Input Lease",
      "url": "https://pi-tui.ratstack.sh/patterns/input-lease/"
    }
  ],
  "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/action-compass.md",
  "motivation": "The Subagents fleet view receives keybindings so selection actions need not rely on literal arrow keys.",
  "name": "Action Compass",
  "participants": [
    {
      "name": "KeybindingsManager.matches",
      "role": "Resolves input against configurable action bindings.",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#handle-keyboard-input-and-focus"
    },
    {
      "name": "matchesKey",
      "role": "Recognizes explicit terminal key combinations.",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/tui.md#handle-keyboard-input-and-focus"
    },
    {
      "name": "pi.registerShortcut",
      "role": "Registers a dedicated extension shortcut.",
      "url": "https://github.com/earendil-works/pi/blob/v1.0.3/packages/coding-agent/docs/extensions.md#choose-an-integration-point"
    },
    {
      "name": "Action hints",
      "role": "Describe configured controls rather than stale literal keys.",
      "url": null
    }
  ],
  "pi": "1.0.3",
  "related": [
    {
      "how": "intercepts raw input instead",
      "id": "input-lease",
      "jsonUrl": "https://pi-tui.ratstack.sh/patterns/input-lease.json",
      "mdUrl": "https://pi-tui.ratstack.sh/patterns/input-lease.md",
      "name": "Input Lease",
      "url": "https://pi-tui.ratstack.sh/patterns/input-lease/"
    }
  ],
  "sampleCode": {
    "code": "// Action Compass: resolve navigation through injected bindings and keep hints in sync.\nimport { SelectList, matchesKey, truncateToWidth, type Component } from \"@earendil-works/pi-tui\";\nimport type { PatternStory } from \"../../../src/pattern.ts\";\n\nexport const story: PatternStory = {\n  id: \"action-compass\",\n  title: \"Action Compass\",\n  kind: \"component\",\n  apis: [\"KeybindingsManager.matches\", \"KeybindingsManager.getKeys\", \"SelectList\", \"matchesKey\"],\n  rows: 9,\n  states: [\n    { id: \"default\", label: \"Default bindings\" },\n    { id: \"remapped\", label: \"Remapped action\", steps: [\n      { type: \"action\", name: \"remap\" }, { type: \"keys\", data: \"j\" },\n    ] },\n    { id: \"shortcut\", label: \"Dedicated action\", steps: [{ type: \"keys\", data: \"\\x18\" }] },\n  ],\n  setup({ theme, keybindings, tui, action }) {\n    const targets = new SelectList([\n      { value: \"map\", label: \"Map the parser\" },\n      { value: \"test\", label: \"Test the token boundary\" },\n      { value: \"review\", label: \"Review the patch\" },\n    ], 3, {\n      selectedPrefix: text => theme.fg(\"accent\", text),\n      selectedText: text => theme.fg(\"accent\", text),\n      description: text => theme.fg(\"muted\", text),\n      scrollInfo: text => theme.fg(\"dim\", text),\n      noMatch: text => theme.fg(\"warning\", text),\n    });\n    let selected = 0;\n    let detail = false;\n    action(\"remap\", () => {\n      keybindings.setUserBindings({ \"tui.select.up\": \"k\", \"tui.select.down\": \"j\" });\n      tui.requestRender();\n    });\n    const compass: Component = {\n      invalidate() { targets.invalidate(); },\n      handleInput(data) {\n        if (keybindings.matches(data, \"tui.select.down\")) selected = Math.min(2, selected + 1);\n        if (keybindings.matches(data, \"tui.select.up\")) selected = Math.max(0, selected - 1);\n        // Explicit extension control, separate from remappable list actions.\n        // This component owns a local key. Pi registerShortcut runs through\n        // the host editor, where ctrl+x is reserved for app.message.copy.\n        if (matchesKey(data, \"ctrl+x\")) detail = !detail;\n        targets.setSelectedIndex(selected);\n        tui.requestRender();\n      },\n      render(width) {\n        const up = keybindings.getKeys(\"tui.select.up\").join(\"/\");\n        const down = keybindings.getKeys(\"tui.select.down\").join(\"/\");\n        return [\n          theme.fg(\"accent\", \"Action Compass · task picker\"),\n          ...targets.render(width),\n          theme.fg(\"muted\", truncateToWidth(up + \"/\" + down + \" navigate · ctrl+x detail\", width)),\n          theme.fg(detail ? \"success\" : \"dim\", truncateToWidth(\n            detail ? \"Detail ON · inspect tests before review\" : \"Detail OFF · compact task labels\", width)),\n        ];\n      },\n    };\n    return compass;\n  },\n};\n",
    "lang": "ts",
    "path": "stories/patterns/behavioral/action-compass.ts"
  },
  "states": [
    {
      "dont": false,
      "expectFail": [],
      "frames": [
        {
          "alt": "Action Compass, Default bindings state, 40 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/default-40-dark.90065f6be2a3.webp",
          "theme": "dark",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Action Compass, Default bindings state, 40 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/default-40-light.72a66763c3da.webp",
          "theme": "light",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Action Compass, Default bindings state, 60 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/default-60-dark.a940ba2f9031.webp",
          "theme": "dark",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Action Compass, Default bindings state, 60 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/default-60-light.88b5e7b854b5.webp",
          "theme": "light",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Action Compass, Default bindings state, 80 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/default-80-dark.6ed35dd7c3ef.webp",
          "theme": "dark",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Action Compass, Default bindings state, 80 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/default-80-light.ea30941f8340.webp",
          "theme": "light",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Action Compass, Default bindings state, 120 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/default-120-dark.976426519cab.webp",
          "theme": "dark",
          "w": 2400,
          "width": 120
        },
        {
          "alt": "Action Compass, Default bindings state, 120 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/default-120-light.6c59caad3fb5.webp",
          "theme": "light",
          "w": 2400,
          "width": 120
        }
      ],
      "how": "Show navigation and action hints using ordinary bindings.",
      "id": "default",
      "label": "Default bindings",
      "problems": []
    },
    {
      "dont": false,
      "expectFail": [],
      "frames": [
        {
          "alt": "Action Compass, Remapped action state, 40 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/remapped-40-dark.4aabef03ad67.webp",
          "theme": "dark",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Action Compass, Remapped action state, 40 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/remapped-40-light.f72a18ac8910.webp",
          "theme": "light",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Action Compass, Remapped action state, 60 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/remapped-60-dark.e968cd849a56.webp",
          "theme": "dark",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Action Compass, Remapped action state, 60 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/remapped-60-light.684e6d7a66ca.webp",
          "theme": "light",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Action Compass, Remapped action state, 80 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/remapped-80-dark.583f330a7ae7.webp",
          "theme": "dark",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Action Compass, Remapped action state, 80 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/remapped-80-light.9184ba1b3e7d.webp",
          "theme": "light",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Action Compass, Remapped action state, 120 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/remapped-120-dark.a30af79c8090.webp",
          "theme": "dark",
          "w": 2400,
          "width": 120
        },
        {
          "alt": "Action Compass, Remapped action state, 120 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/remapped-120-light.a744f7f05d07.webp",
          "theme": "light",
          "w": 2400,
          "width": 120
        }
      ],
      "how": "Use a synthetic remapping for selection and show matching hints.",
      "id": "remapped",
      "label": "Remapped action",
      "problems": []
    },
    {
      "dont": false,
      "expectFail": [],
      "frames": [
        {
          "alt": "Action Compass, Dedicated action state, 40 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/shortcut-40-dark.7f1f7efe9805.webp",
          "theme": "dark",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Action Compass, Dedicated action state, 40 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/shortcut-40-light.817f65ba1da4.webp",
          "theme": "light",
          "w": 800,
          "width": 40
        },
        {
          "alt": "Action Compass, Dedicated action state, 60 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/shortcut-60-dark.dd5f9f69114e.webp",
          "theme": "dark",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Action Compass, Dedicated action state, 60 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/shortcut-60-light.8e5acbb5db74.webp",
          "theme": "light",
          "w": 1200,
          "width": 60
        },
        {
          "alt": "Action Compass, Dedicated action state, 80 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/shortcut-80-dark.6278032d450e.webp",
          "theme": "dark",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Action Compass, Dedicated action state, 80 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/shortcut-80-light.296a0bdeafce.webp",
          "theme": "light",
          "w": 1600,
          "width": 80
        },
        {
          "alt": "Action Compass, Dedicated action state, 120 columns, dark theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/shortcut-120-dark.5504e378b5cf.webp",
          "theme": "dark",
          "w": 2400,
          "width": 120
        },
        {
          "alt": "Action Compass, Dedicated action state, 120 columns, light theme, 6 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": 264,
          "rows": 6,
          "still": "https://pi-tui.ratstack.sh/frames/action-compass/shortcut-120-light.a3c0f66ec174.webp",
          "theme": "light",
          "w": 2400,
          "width": 120
        }
      ],
      "how": "Toggle a small mode with an explicitly registered shortcut.",
      "id": "shortcut",
      "label": "Dedicated action",
      "problems": []
    }
  ],
  "structure": "input -> keybinding action\naction -> state + matching hints",
  "thumbnails": {
    "dark": {
      "animation": null,
      "src": "https://pi-tui.ratstack.sh/thumbs/action-compass/dark.f83b93535598.webp"
    },
    "light": {
      "animation": null,
      "src": "https://pi-tui.ratstack.sh/thumbs/action-compass/light.4b85c199d70a.webp"
    }
  },
  "url": "https://pi-tui.ratstack.sh/patterns/action-compass/",
  "widths": [
    40,
    60,
    80,
    120
  ]
}