console-status（SaM-runtime）: Claude Code Mod のコードと画面

何をするか

プロンプトの上の帯・欄・トーストを描く
prompt.compose・prompt.submit・session.start・turn.complete ほか 2 個にフックする
ターンをまたいで自分の状態を持つ
プロセスを起こす

良いところ

ネットワークに出ない
TypeScript で書かれている
デスクトップ専用の分岐がある
エラーを扱う

作り始めるためのコード

2 種類あります。上のデザインから modscode が書いた雛形と、その Mod 自身のコードのうち描いている部分です。

雛形（register.tsx）

import type { Register } from 'claude-code'

// Drawn like console-status by SaM-runtime (pane, band, toast), as modscode read it from the mod's code:
// https://modscode.com/gallery/sam-runtime-console-status/
// Written by modscode from that reading, not copied from the mod: use it as you like.
// Each value below stands for one the mod works out at run time; put in your own.
export const register: Register = on => {
  // the band above the prompt; what else goes there is drawn under it
  on('ui.render', { component: 'AbovePrompt' }, async ($, e, next) => {
    const { Box, Text, Button } = $.ui.resolve(e)
    const name = '…'
    const t = '…'
    const t2 = '…'
    const t3 = '…'
    const pipelineText = '…'
    const others = '…'
    const button = '…'
    return (
      <Box flexDirection="column">
        <Box flexDirection="row" flexWrap="nowrap" height={1} overflow="hidden">
          <Box flexShrink={0} height={1}>
            <Text bold color="#E5EAF0">
              {name}
              {" "}
            </Text>
          </Box>
          <Box flexGrow={1} flexShrink={1} height={1} overflow="hidden">
            <Text wrap="truncate-end">
              <Text>
                {t}
              </Text>
              <Text>
                {t2}
              </Text>
              <Text>
                {t3}
              </Text>
              <Text color="#CAD3E0">
                {" "}
                {pipelineText}
              </Text>
              <Text color="#F0C674">
                {`　其他 ${others} 個專案待處理`}
              </Text>
            </Text>
          </Box>
          <Box flexShrink={0} height={1} overflow="hidden">
            <Button plain dimColor label={`${button}`} />
          </Box>
        </Box>
        {await next(e)}
      </Box>
    )
  })

  // the pane: open it with $.ui.open({ id: 'my-pane', title: "主控台" })
  on('ui.render', { component: 'Pane', requestId: 'my-pane' }, async ($, e) => {
    const { Box, Text, Button, Client } = $.ui.resolve(e)
    const length = '…'
    const time = '…'
    const executor = '…'
    const name = '…'
    const STAGE_GLYPH = '…'
    const label = '…'
    const STAGE_GLYPH2 = '…'
    const label2 = '…'
    const STAGE_GLYPH3 = '…'
    const label3 = '…'
    const note = '…'
    const value = '…'
    const blockedReason = '…'
    const actionLabel = '…'
    const pendingConfirm = '…'
    const reason = '…'
    const verify = '…'
    const value2 = '…'
    const line = '…'
    const line2 = '…'
    const line3 = '…'
    const LABEL = '…'
    const c = '…'
    const LABEL2 = '…'
    const c2 = '…'
    const LABEL3 = '…'
    const c3 = '…'
    const project = '…'
    const item = '…'
    const t = '…'
    const t2 = '…'
    const t3 = '…'
    const age = '…'
    const item2 = '…'
    const t4 = '…'
    const t5 = '…'
    const t6 = '…'
    const age2 = '…'
    const item3 = '…'
    const t7 = '…'
    const t8 = '…'
    const t9 = '…'
    const age3 = '…'
    const name2 = '…'
    const STAGE_GLYPH4 = '…'
    const label4 = '…'
    const STAGE_GLYPH5 = '…'
    const label5 = '…'
    const STAGE_GLYPH6 = '…'
    const label6 = '…'
    const note2 = '…'
    const id = '…'
    const meta = '…'
    const last = '…'
    const id2 = '…'
    const meta2 = '…'
    const last2 = '…'
    const id3 = '…'
    const meta3 = '…'
    const last3 = '…'
    const state = '…'
    const title = '…'
    const key = '…'
    const text = '…'
    const key2 = '…'
    const text2 = '…'
    const key3 = '…'
    const text3 = '…'
    const title2 = '…'
    const key4 = '…'
    const text4 = '…'
    const key5 = '…'
    const text5 = '…'
    const key6 = '…'
    const text6 = '…'
    const title3 = '…'
    const key7 = '…'
    const text7 = '…'
    const key8 = '…'
    const text8 = '…'
    const key9 = '…'
    const text9 = '…'
    const gate = '…'
    const value3 = '…'
    const gitLine = '…'
    const prLine = '…'
    const blockedReason2 = '…'
    const pendingConfirm2 = '…'
    const reason2 = '…'
    const verify2 = '…'
    const value4 = '…'
    const line4 = '…'
    const line5 = '…'
    const line6 = '…'
    const sel = '…'
    const name3 = '…'
    const STAGE_GLYPH7 = '…'
    const label7 = '…'
    const STAGE_GLYPH8 = '…'
    const label8 = '…'
    const STAGE_GLYPH9 = '…'
    const label9 = '…'
    const note3 = '…'
    const id4 = '…'
    const meta4 = '…'
    const last4 = '…'
    return (
      <Box flexDirection="column" gap={1}>
        <Box justifyContent="space-between">
          <Text bold color="#E5EAF0">
            主控台
            <Text color="#6E7787" backgroundColor="#1C222B">
              {" 示範資料 "}
            </Text>
            <Text color="#6E7787">
              {" "}
              {length}
              {" 個專案"}
            </Text>
          </Text>
          <Text color="#6E7787">
            {time}
            {" 更新"}
          </Text>
        </Box>
        <Box gap={1} flexWrap="wrap">
          <Text color="#6E7787">
            執行者
          </Text>
          <Box>
            <Button plain label={`${executor}`} />
          </Box>
          <Text color="#6E7787">
            ·
          </Text>
          <Box>
            <Button plain label="預設" />
          </Box>
          <Text color="#6E7787">
            ·
          </Text>
          <Box>
            <Button plain label="預設" />
          </Box>
        </Box>
        <Box flexDirection="column" borderStyle="round" borderColor="#8BD5CA" paddingX={1}>
          <Box justifyContent="space-between" gap={1}>
            <Text bold color="#8BD5CA" wrap="truncate-end">
              {"專案模式 "}
              <Text color="#E5EAF0">
                {name}
              </Text>
            </Text>
            <Text color="#6E7787">
              /console mode console 切回主控台
            </Text>
          </Box>
          <Box flexDirection="column">
            <Box flexWrap="wrap">
              <Text wrap="truncate-end">
                <Text>
                  {" ─ "}
                </Text>
                <Text>
                  {STAGE_GLYPH}
                  {" "}
                  {label}
                </Text>
              </Text>
              <Text wrap="truncate-end">
                <Text>
                  {" ─ "}
                </Text>
                <Text>
                  {STAGE_GLYPH2}
                  {" "}
                  {label2}
                </Text>
              </Text>
              <Text wrap="truncate-end">
                <Text>
                  {" ─ "}
                </Text>
                <Text>
                  {STAGE_GLYPH3}
                  {" "}
                  {label3}
                </Text>
              </Text>
            </Box>
            <Text wrap="wrap">
              {note}
            </Text>
          </Box>
          <Text color="#CAD3E0" wrap="wrap">
            <Text color="#6E7787">
              {"下一步 "}
            </Text>
            {value}
          </Text>
          <Box flexDirection="column">
            <Box gap={2} flexWrap="wrap">
              <Box gap={1}>
                <Client module="./spinner.tsx" width={1} height={1} />
                <Button plain label="下一步" />
              </Box>
              <Box gap={1}>
                <Client module="./spinner.tsx" width={1} height={1} />
                <Button plain label="下一步" />
              </Box>
              <Box gap={1}>
                <Client module="./spinner.tsx" width={1} height={1} />
                <Button plain label="下一步" />
              </Box>
              <Text color="#6E7787">
                派工鎖定：
                {blockedReason}
              </Text>
              <Box>
                <Button plain label={`⇢ 改用 Claude 派工（${actionLabel}）`} />
              </Box>
            </Box>
            <Text color="#F0C674" wrap="wrap">
              {pendingConfirm}
            </Text>
            <Box gap={1} flexWrap="wrap">
              <Text color="#6E7787">
                執行者
              </Text>
              <Box gap={1}>
                <Button plain label="[下一步]" />
                <Button plain label="[下一步]" />
                <Button plain label="[下一步]" />
              </Box>
              <Text color="#6E7787">
                手動交接：面板不派工（CARD、驗證、關卡照常）
              </Text>
              <Text color="#F0C674" wrap="truncate-end">
                Codex 未派工：
                {reason}
              </Text>
            </Box>
          </Box>
          <Box flexDirection="column" marginTop={1}>
            <Text color="#6E7787" wrap="wrap">
              驗證指令
              ：
              {verify}
            </Text>
            <Text color="#A6D189">
              ✓
              {" 最後驗證 "}
              {value2}
              （
              未正常結束
              ）
            </Text>
            <Text color="#F0C674">
              輸出已被執行器截斷，以下是擷取內容
            </Text>
            <Text color="#6E7787" wrap="truncate-end">
              {line}
            </Text>
            <Text color="#6E7787" wrap="truncate-end">
              {line2}
            </Text>
            <Text color="#6E7787" wrap="truncate-end">
              {line3}
            </Text>
          </Box>
        </Box>
        <Box flexDirection="column" backgroundColor="#1C222B" paddingX={1}>
          <Box justifyContent="space-between">
            <Text bold color="#F0C674">
              下一步
            </Text>
            <Box gap={1}>
              <Client module="./spinner.tsx" width={1} height={1} />
              <Button plain label="下一步" />
            </Box>
          </Box>
          <Text color="#E5EAF0" wrap="wrap">
            目前沒有需要處理的項目
          </Text>
        </Box>
        <Box gap={3} flexWrap="wrap">
          <Box>
            <Text color="#4A5260">
              {"● "}
              {LABEL}
              {" "}
              <Text bold>
                {c}
              </Text>
            </Text>
          </Box>
          <Box>
            <Text color="#4A5260">
              {"● "}
              {LABEL2}
              {" "}
              <Text bold>
                {c2}
              </Text>
            </Text>
          </Box>
          <Box>
            <Text color="#4A5260">
              {"● "}
              {LABEL3}
              {" "}
              <Text bold>
                {c3}
              </Text>
            </Text>
          </Box>
        </Box>
        <Box flexDirection="column">
          <Box gap={1} paddingRight={1}>
            <Box width={8}>
              <Text color="#6E7787">
                {" 狀態"}
              </Text>
            </Box>
            <Box>
              <Text color="#6E7787">
                專案
              </Text>
            </Box>
            <Box flexGrow={1}>
              <Text color="#6E7787">
                項目
              </Text>
            </Box>
            <Box flexShrink={0}>
              <Text color="#6E7787">
                流程
              </Text>
            </Box>
            <Box flexShrink={0}>
              <Text color="#6E7787">
                Git
              </Text>
            </Box>
            <Box width={4} justifyContent="flex-end">
              <Text color="#6E7787">
                更新
              </Text>
            </Box>
          </Box>
          <Text color="#4A5260" wrap="truncate-end" />
          <Box flexDirection="column">
            <Box gap={1} backgroundColor="#22304A">
              <Box width={8}>
                <Text bold>
                  {` ${LABEL} `}
                </Text>
              </Box>
              <Box>
                <Button plain label={`${project}`} />
              </Box>
              <Box flexGrow={1} flexShrink={1}>
                <Text color="#CAD3E0" wrap="wrap">
                  {item}
                </Text>
              </Box>
              <Box flexShrink={0}>
                <Text>
                  <Text>
                    {t}
                  </Text>
                  <Text>
                    {t2}
                  </Text>
                  <Text>
                    {t3}
                  </Text>
                </Text>
              </Box>
              <Box flexShrink={0} overflow="hidden">
                <Text wrap="truncate-end" />
              </Box>
              <Box width={4} justifyContent="flex-end">
                <Text color="#6E7787">
                  {age}
                </Text>
              </Box>
            </Box>
            <Box gap={1} backgroundColor="#22304A">
              <Box width={8}>
                <Text bold>
                  {` ${LABEL} `}
                </Text>
              </Box>
              <Box>
                <Button plain label={`${project}`} />
              </Box>
              <Box flexGrow={1} flexShrink={1}>
                <Text color="#CAD3E0" wrap="wrap">
                  {item2}
                </Text>
              </Box>
              <Box flexShrink={0}>
                <Text>
                  <Text>
                    {t4}
                  </Text>
                  <Text>
                    {t5}
                  </Text>
                  <Text>
                    {t6}
                  </Text>
                </Text>
              </Box>
              <Box flexShrink={0} overflow="hidden">
                <Text wrap="truncate-end" />
              </Box>
              <Box width={4} justifyContent="flex-end">
                <Text color="#6E7787">
                  {age2}
                </Text>
              </Box>
            </Box>
            <Box gap={1} backgroundColor="#22304A">
              <Box width={8}>
                <Text bold>
                  {` ${LABEL} `}
                </Text>
              </Box>
              <Box>
                <Button plain label={`${project}`} />
              </Box>
              <Box flexGrow={1} flexShrink={1}>
                <Text color="#CAD3E0" wrap="wrap">
                  {item3}
                </Text>
              </Box>
              <Box flexShrink={0}>
                <Text>
                  <Text>
                    {t7}
                  </Text>
                  <Text>
                    {t8}
                  </Text>
                  <Text>
                    {t9}
                  </Text>
                </Text>
              </Box>
              <Box flexShrink={0} overflow="hidden">
                <Text wrap="truncate-end" />
              </Box>
              <Box width={4} justifyContent="flex-end">
                <Text color="#6E7787">
                  {age3}
                </Text>
              </Box>
            </Box>
          </Box>
          <Text color="#4A5260" wrap="truncate-end" />
          <Box flexDirection="column" borderStyle="round" borderColor="#8AADF4" paddingX={1} marginTop={1}>
            <Box justifyContent="space-between" gap={1}>
              <Box gap={1} flexShrink={1}>
                <Text bold color="#E5EAF0" wrap="truncate-end">
                  {name2}
                </Text>
              </Box>
              <Button plain dimColor label="✕ 關閉" />
            </Box>
            <Box marginTop={1}>
              <Box flexDirection="column">
                <Box flexWrap="wrap">
                  <Text wrap="truncate-end">
                    <Text>
                      {" ─ "}
                    </Text>
                    <Text>
                      {STAGE_GLYPH4}
                      {" "}
                      {label4}
                    </Text>
                  </Text>
                  <Text wrap="truncate-end">
                    <Text>
                      {" ─ "}
                    </Text>
                    <Text>
                      {STAGE_GLYPH5}
                      {" "}
                      {label5}
                    </Text>
                  </Text>
                  <Text wrap="truncate-end">
                    <Text>
                      {" ─ "}
                    </Text>
                    <Text>
                      {STAGE_GLYPH6}
                      {" "}
                      {label6}
                    </Text>
                  </Text>
                </Box>
                <Text wrap="wrap">
                  {note2}
                </Text>
              </Box>
            </Box>
            <Box flexDirection="column" marginTop={1}>
              <Box flexDirection="column">
                <Box gap={1}>
                  <Box width={2} flexShrink={0}>
                    <Text color="#8BD5CA">
                      ◉
                    </Text>
                  </Box>
                  <Box flexGrow={1} flexShrink={1}>
                    <Text color="#E5EAF0" wrap="truncate-end">
                      {id}
                    </Text>
                  </Box>
                  <Box flexShrink={0}>
                    <Text color="#6E7787">
                      {meta}
                    </Text>
                  </Box>
                </Box>
                <Text color="#6E7787" wrap="truncate-end">
                  {"   › "}
                  {last}
                </Text>
              </Box>
              <Box flexDirection="column">
                <Box gap={1}>
                  <Box width={2} flexShrink={0}>
                    <Text color="#8BD5CA">
                      ◉
                    </Text>
                  </Box>
                  <Box flexGrow={1} flexShrink={1}>
                    <Text color="#E5EAF0" wrap="truncate-end">
                      {id2}
                    </Text>
                  </Box>
                  <Box flexShrink={0}>
                    <Text color="#6E7787">
                      {meta2}
                    </Text>
                  </Box>
                </Box>
                <Text color="#6E7787" wrap="truncate-end">
                  {"   › "}
                  {last2}
                </Text>
              </Box>
              <Box flexDirection="column">
                <Box gap={1}>
                  <Box width={2} flexShrink={0}>
                    <Text color="#8BD5CA">
                      ◉
                    </Text>
                  </Box>
                  <Box flexGrow={1} flexShrink={1}>
                    <Text color="#E5EAF0" wrap="truncate-end">
                      {id3}
                    </Text>
                  </Box>
                  <Box flexShrink={0}>
                    <Text color="#6E7787">
                      {meta3}
                    </Text>
                  </Box>
                </Box>
                <Text color="#6E7787" wrap="truncate-end">
                  {"   › "}
                  {last3}
                </Text>
              </Box>
              <Box gap={2}>
                <Box width={6} flexShrink={0}>
                  <Text color="#6E7787">
                    狀態
                  </Text>
                </Box>
                <Box flexGrow={1} flexShrink={1}>
                  <Text color="#CAD3E0" wrap="wrap">
                    {state}
                  </Text>
                </Box>
              </Box>
              <Box gap={2}>
                <Box width={6} flexShrink={0}>
                  <Text color="#6E7787">
                    待決
                  </Text>
                </Box>
                <Box flexGrow={1} flexShrink={1}>
                  <Box flexDirection="column">
                    <Box flexDirection="column" marginTop={1}>
                      <Box gap={1}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#F0C674">
                            11.
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#F0C674" wrap="wrap">
                            {title}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key2}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text2}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key3}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text3}
                          </Text>
                        </Box>
                      </Box>
                    </Box>
                    <Box flexDirection="column" marginTop={1}>
                      <Box gap={1}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#F0C674">
                            11.
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#F0C674" wrap="wrap">
                            {title2}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key4}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text4}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key5}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text5}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key6}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text6}
                          </Text>
                        </Box>
                      </Box>
                    </Box>
                    <Box flexDirection="column" marginTop={1}>
                      <Box gap={1}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#F0C674">
                            11.
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#F0C674" wrap="wrap">
                            {title3}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key7}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text7}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key8}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text8}
                          </Text>
                        </Box>
                      </Box>
                      <Box gap={1} paddingLeft={4}>
                        <Box width={3} flexShrink={0}>
                          <Text bold color="#E5EAF0">
                            {key9}
                          </Text>
                        </Box>
                        <Box flexGrow={1} flexShrink={1}>
                          <Text color="#CAD3E0" wrap="wrap">
                            {text9}
                          </Text>
                        </Box>
                      </Box>
                    </Box>
                  </Box>
                </Box>
              </Box>
              <Box gap={2}>
                <Box width={6} flexShrink={0}>
                  <Text color="#6E7787">
                    關卡
                  </Text>
                </Box>
                <Box flexGrow={1} flexShrink={1}>
                  <Text color="#CA9EE6" wrap="wrap">
                    {gate}
                  </Text>
                </Box>
              </Box>
              <Box gap={2}>
                <Box width={6} flexShrink={0}>
                  <Text color="#6E7787">
                    下一步
                  </Text>
                </Box>
                <Box flexGrow={1} flexShrink={1}>
                  <Text color="#CAD3E0" wrap="wrap">
                    {value3}
                  </Text>
                </Box>
              </Box>
              <Box gap={2}>
                <Box width={6} flexShrink={0}>
                  <Text color="#6E7787">
                    同步
                  </Text>
                </Box>
                <Box flexGrow={1} flexShrink={1}>
                  <Text color="#8AADF4" wrap="wrap">
                    執行者已結束，結果未寫回 STATUS
                  </Text>
                </Box>
              </Box>
              <Box gap={2}>
                <Box width={6} flexShrink={0}>
                  <Text color="#6E7787">
                    Git
                  </Text>
                </Box>
                <Box flexGrow={1} flexShrink={1}>
                  <Text color="#E78284" wrap="wrap">
                    {gitLine}
                  </Text>
                </Box>
              </Box>
              <Box gap={2}>
                <Box width={6} flexShrink={0}>
                  <Text color="#6E7787">
                    PR
                  </Text>
                </Box>
                <Box flexGrow={1} flexShrink={1}>
                  <Text color="#E78284" wrap="wrap">
                    {prLine}
                  </Text>
                </Box>
                <Box flexShrink={0}>
                  <Button plain dimColor label="↗ 開啟" />
                </Box>
              </Box>
            </Box>
            <Box marginTop={1}>
              <Box flexDirection="column">
                <Box gap={2} flexWrap="wrap">
                  <Box gap={1}>
                    <Client module="./spinner.tsx" width={1} height={1} />
                    <Button plain label="下一步" />
                  </Box>
                  <Box gap={1}>
                    <Client module="./spinner.tsx" width={1} height={1} />
                    <Button plain label="下一步" />
                  </Box>
                  <Box gap={1}>
                    <Client module="./spinner.tsx" width={1} height={1} />
                    <Button plain label="下一步" />
                  </Box>
                  <Text color="#6E7787">
                    派工鎖定：
                    {blockedReason2}
                  </Text>
                  <Box>
                    <Button plain label={`⇢ 改用 Claude 派工（${actionLabel}）`} />
                  </Box>
                </Box>
                <Text color="#F0C674" wrap="wrap">
                  {pendingConfirm2}
                </Text>
                <Box gap={1} flexWrap="wrap">
                  <Text color="#6E7787">
                    執行者
                  </Text>
                  <Box gap={1}>
                    <Button plain label="[下一步]" />
                    <Button plain label="[下一步]" />
                    <Button plain label="[下一步]" />
                  </Box>
                  <Text color="#6E7787">
                    手動交接：面板不派工（CARD、驗證、關卡照常）
                  </Text>
                  <Text color="#F0C674" wrap="truncate-end">
                    Codex 未派工：
                    {reason2}
                  </Text>
                </Box>
              </Box>
            </Box>
            <Box flexDirection="column" marginTop={1}>
              <Text color="#6E7787" wrap="wrap">
                驗證指令
                ：
                {verify2}
              </Text>
              <Text color="#A6D189">
                ✓
                {" 最後驗證 "}
                {value4}
                （
                未正常結束
                ）
              </Text>
              <Text color="#F0C674">
                輸出已被執行器截斷，以下是擷取內容
              </Text>
              <Text color="#6E7787" wrap="truncate-end">
                {line4}
              </Text>
              <Text color="#6E7787" wrap="truncate-end">
                {line5}
              </Text>
              <Text color="#6E7787" wrap="truncate-end">
                {line6}
              </Text>
            </Box>
          </Box>
          <Box justifyContent="space-between">
            <Text color="#8AADF4" wrap="truncate-end">
              {"◆ 已選取 "}
              {sel}
              <Text color="#6E7787">
                {" 下一則提示會附上此專案"}
              </Text>
            </Text>
            <Button plain dimColor label="✕ 取消" />
          </Box>
        </Box>
        <Box flexDirection="column">
          <Box flexDirection="column" borderStyle="round" borderColor="#4A5260" paddingX={1} marginY={1}>
            <Box justifyContent="space-between" gap={1}>
              <Box gap={1} flexShrink={1}>
                <Text bold>
                  {` ${LABEL} `}
                </Text>
                <Text bold color="#E5EAF0" wrap="truncate-end">
                  {name3}
                </Text>
              </Box>
              <Text color="#6E7787">
                {`${age}前更新`}
              </Text>
            </Box>
            <Box marginTop={1}>
              <Box flexDirection="column">
                <Box flexWrap="wrap">
                  <Text wrap="truncate-end">
                    <Text>
                      {" ─ "}
                    </Text>
                    <Text>
                      {STAGE_GLYPH7}
                      {" "}
                      {label7}
                    </Text>
                  </Text>
                  <Text wrap="truncate-end">
                    <Text>
                      {" ─ "}
                    </Text>
                    <Text>
                      {STAGE_GLYPH8}
                      {" "}
                      {label8}
                    </Text>
                  </Text>
                  <Text wrap="truncate-end">
                    <Text>
                      {" ─ "}
                    </Text>
                    <Text>
                      {STAGE_GLYPH9}
                      {" "}
                      {label9}
                    </Text>
                  </Text>
                </Box>
                <Text wrap="wrap">
                  {note3}
                </Text>
              </Box>
            </Box>
            <Box flexDirection="column" marginTop={1}>
              <Box flexDirection="column">
                <Box gap={1}>
                  <Box width={2} flexShrink={0}>
                    <Text color="#8BD5CA">
                      ◉
                    </Text>
                  </Box>
                  <Box flexGrow={1} flexShrink={1}>
                    <Text color="#E5EAF0" wrap="truncate-end">
                      {id4}
                    </Text>
                  </Box>
                  <Box flexShrink={0}>
                    <Text color="#6E7787">
                      {meta4}
                    </Text>
                  </Box>
                </Box>
                <Text color="#6E7787" wrap="truncate-end">
                  {"   › "}
                  {last4}
                </Text>
              </Box>
              <Box flexDirection="column">
                <Box gap={1}>
                  <Box width={2} flexShrink={0}>
                    <Text color="#8BD5CA">
                      ◉
                    </Text>
                  </Box>
                  <Box flexGrow={1} flexShrink={1} />
                </Box>
              </Box>
            </Box>
          </Box>
        </Box>
      </Box>
    )
  })

  on('session.start', async ($, e, next) => {
    const name = '…'
    const actionLabel = '…'
    await $.ui.toast(`示範資料：不執行專案操作；/console refresh 回到實際資料。`)
    await $.ui.toast(`${name}：${actionLabel}…`)
    return next(e)
  })
}

Mod 自身のコード

Mod のライセンス（MIT）に従って載せています。全文は下にあります。写すときは著作権表示を残してください。

plugins/console-status/hooks/register.tsx 886〜932 行 · バンド

plugins/console-status/hooks/register.tsx:886

  on('ui.render', { component: 'AbovePrompt' }, async ($, e, nextHook) => {
    const generation = dataGeneration
    const demo = await demoEnabled($)
    const stored = await read($, snapshot)
    const s = demo && !stored?.demo ? demoSnapshot(await $.clock.now()) : stored
    if (e.props.hasSurvey || s === null || (await read($, isBandHidden))) return nextHook(e)
    const { Box, Text, Button } = $.ui.resolve(e)
    const paneOpen = await read($, isPaneOpen)
    const columns = Math.max(0, Math.floor(e.props.bodyColumns ?? 80))
    const here = await focused($, options, s)
    if (here && generation === dataGeneration) {
      const button = paneOpen ? '主控台 ▾' : '主控台 ▸'
      const buttonWidth = button.length + 1
      const others = s.projects.filter(p => p !== here.project && (hasAsk(p) || parseGate(p.gate))).length
      return (
        <Box flexDirection="row" flexWrap="nowrap" width={columns} height={1} overflow="hidden">
          <Box flexShrink={0} height={1}><Text bold color={C.strong}>{here.project.name} </Text></Box>
          <Box flexGrow={1} flexShrink={1} height={1} overflow="hidden">
            <Text wrap="truncate-end">
              {pipelineParts(here.pipeline, PIPE).map((part, index) => <Text key={'bp-' + index} color={part.c}>{part.t}</Text>)}
              <Text color={C.text}> {pipelineText(here.pipeline).replace(/^\S+\s?/, '')}</Text>
              {others > 0 && <Text color={C.amber}>{`　其他 ${others} 個專案待處理`}</Text>}
            </Text>
          </Box>
          <Box width={buttonWidth} flexShrink={0} height={1} overflow="hidden">
            <Button key="pane" plain dimColor label={button} onPress={() => void openPane($)} />
          </Box>
        </Box>
      )
    }
    const band = layoutBand(s, { columns, demo, paneOpen })
    if (generation !== dataGeneration) return <Box height={1} width={columns} overflow="hidden"><Text color={C.dim} wrap="truncate-end">{demoActive ? ' 示範資料 ' : '讀取中…'}</Text></Box>
    return (
      <Box flexDirection="row" flexWrap="nowrap" width={columns} height={1} overflow="hidden">
        <Box gap={1} flexShrink={0} height={1}>
          {band.items.map(item => <Box key={'band-' + item.id} width={item.width} flexShrink={0} height={1} overflow="hidden">
            <Text wrap="truncate-end" color={item.zero ? C.faint : item.id === 'demo' ? C.dim : item.id === 'next' ? C.amber : item.id === 'context' || item.id === 'ci' ? C.red : FG[item.id as State] ?? C.text}
              backgroundColor={item.id === 'demo' ? C.bar : undefined}>{item.text}</Text>
          </Box>)}
        </Box>
        <Box flexGrow={1} minWidth={band.items.length ? 1 : 0} />
        <Box width={band.buttonWidth} flexShrink={0} height={1} overflow="hidden">
          <Button key="pane" plain dimColor label={band.button} onPress={() => void openPane($)} />
        </Box>
      </Box>
    )
  })

plugins/console-status/hooks/register.tsx 982〜1141 行 · ペイン

plugins/console-status/hooks/register.tsx:982

  on('ui.render', { component: 'Pane', requestId: PANE }, async ($, e) => {
    const generation = dataGeneration
    const ui = $.ui.resolve(e) as any
    const { Box, Text, Button } = ui
    const demo = await demoEnabled($)
    const stored = await read($, snapshot)
    const s = demo && !stored?.demo ? demoSnapshot(await $.clock.now()) : stored
    if (s === null) return <Text color={C.dim}>讀取各專案狀態中…</Text>
    const detail = await read($, isDetail)
    const selectedName = await read($, selected)
    const sel = demo && !s.projects.some(project => project.name === selectedName) ? null : selectedName
    const cur = await read($, cursor)
    const feed = demo ? demoEvents(s.at) : await read($, feedAtom)
    const hov = await read($, hovered)
    const menu = await read($, menuFor)
    const refreshing = await read($, isRefreshing)
    const pending = await read($, pendingActions)
    const confirmations = await read($, continueConfirmations)
    const verified = await read($, verificationResults)
    const trusted = await read($, trustedVerify)
    await read($, actionPulse) // redraws running action labels once a second
    const offers = demo ? {} : await read($, fallbackOffers)
    const renderedAt = Object.keys(pending).length ? await $.clock.now() : s.at
    const revision = await read($, dispatchRevision)
    // Drawing never touches the disk on its own: settings are re-read after a write (revision) or a refresh (s.at).
    const { config, dispatch } = demo
      ? { config: demoContext?.config ?? resolveConfig(options, '', '', '/tmp'), dispatch: demoContext?.dispatch ?? { settings: { executor: s.executor ?? 'claude', model: '', effort: '' }, models: [] } }
      : await renderDispatch($, options, `${revision}|${s.at}`)
    const cycle = async (field: GlobalField) => {
      try {
        const saved = await changeDispatch($, config, field)
        if (await demoEnabled($)) demoContext = { config, dispatch: await readDispatch($, config) }
        await update($, dispatchRevision, v => v + 1)
        if (field === 'executor') await refresh($, options, true)
        $.ui.toast(`派工設定已儲存：${saved.executor} · ${saved.model || '預設'} · ${saved.effort || '預設'}`)
      } catch (error) { $.ui.toast(`設定未儲存：${error instanceof Error ? error.message : String(error)}`) }
    }
    /**
     * Pick one project's executor ('' = inherit). The snapshot is patched at once so the label,
     * the actions and the dispatch guard all agree before the (slow) refresh comes back.
     */
    const chooseProjectExecutor = async (p: Project, value: '' | 'claude' | 'codex' | 'manual') => {
      if (await demoEnabled($)) { $.ui.toast('示範資料：不變更專案設定。'); return }
      try {
        const root = projectRoot(p.statusPath)
        const saved = await changeProjectDispatch($, config, root, 'executor', value)
        const eff = effectiveDispatch(saved, root, p.registryExecutor)
        await update($, snapshot, current => current && {
          ...current,
          projects: current.projects.map(item => item.statusPath === p.statusPath ? { ...item, executor: eff.executor, executorSource: eff.source } : item),
        })
        await update($, fallbackOffers, values => { const rest = { ...values }; delete rest[p.statusPath]; return rest })
        await update($, dispatchRevision, v => v + 1)
        $.ui.toast(`${p.name} 執行者：${eff.executor}（${SOURCE_LABEL[eff.source]}）`)
        void refresh($, options, true)
      } catch (error) { $.ui.toast(`設定未儲存：${error instanceof Error ? error.message : String(error)}`) }
    }
    const codexShown = dispatch.settings.executor === 'codex' || !!s.codexInUse
    const n = next(s)
    const c = counts(s)
    const ctx = s.contextPercent
    const time = new Date(s.at).toTimeString().slice(0, 5)
    const health = codexHealth(s.codex)
    const width: number = Math.max(40, (e.props.bodyColumns ?? 80) - 1)
    const list = rows(s)
    const now = await $.clock.now()
    const showGit = s.projects.some(p => p.git)
    const W = { state: 8, project: projectColumnWidth(list.map(row => row.project)), age: 4, flow: width >= 64 ? 6 : 0, git: showGit && width >= 80 ? 7 : 0 }
    const badges = new Map(s.projects.map(p => [p.name, gitBadge(p.git, p.pr)]))
    const GIT_TONE: Record<string, string> = { red: C.red, amber: C.amber, blue: C.blue, teal: C.teal, green: C.green, dim: C.dim }
    const pipes = new Map(s.projects.map(p => [p.name, pipeline(p, verified[p.statusPath])]))
    const here = demo ? null : await focused($, options, s)

    const specs = list.map(r => ({
      id: r.full,
      shimmer: r.state === 'RUNNING',
      breathe: r.state === 'ACTION' ? [C.amberBg, '#443925', '#4D412B'] : r.state === 'GATE' ? [C.purpleBg, '#3D304B', '#463755'] : undefined,
      changedAt: s.projects.find(project => project.name === r.full)?.changedAt,
      cells: [
        { t: ` ${LABEL[r.state]} `, c: FG[r.state], bg: BG[r.state], b: r.state !== 'IDLE', w: W.state },
        { t: r.project, c: r.state === 'IDLE' ? C.dim : C.strong, w: W.project },
        { t: r.item, c: r.state === 'IDLE' ? C.dim : C.text },
        ...(W.flow ? [{ t: '', w: W.flow, parts: pipes.get(r.full) ? pipelineParts(pipes.get(r.full)!, PIPE) : [] }] : []),
        ...(W.git ? [{ t: badges.get(r.full)?.text ?? '', c: GIT_TONE[badges.get(r.full)?.tone ?? 'dim'], w: W.git }] : []),
        { t: r.age, c: C.dim, w: W.age, right: true },
      ],
    }))

    const rich = (e.surface === 'terminal' || e.surface === 'desktop') && Boolean(ui.Client) && !(await read($, isPlain))
    const table = rich
      ? (
        <ui.Client key="rows" module="./rows.tsx" width="100%"
          props={JSON.parse(JSON.stringify({ rows: specs, now, changed: ['#2C3B4B', '#24303D', '#1C252F'], selected: sel, cursor: cur, selectedBg: C.sel, hoverBg: C.hover, shimmer: SHIMMER }))} />
      )
      : (
        <Box flexDirection="column">
          {list.map(r => (
            <Box key={'row-' + r.project} gap={1} backgroundColor={sel === r.full ? C.sel : undefined}>
              <Box width={W.state}><Text bold color={FG[r.state]} backgroundColor={BG[r.state]}>{` ${LABEL[r.state]} `}</Text></Box>
              <Box width={W.project}>
                <Button key={'sel-' + r.project} plain label={r.project}
                  onPress={() => void update($, selected, v => (v === r.full ? null : r.full))} />
              </Box>
              <Box flexGrow={1} flexShrink={1}><Text color={C.text} wrap={detail ? 'wrap' : 'truncate-end'}>{r.item}</Text></Box>
              {W.flow > 0 && <Box width={W.flow} flexShrink={0}><Text>{(pipes.get(r.full) ? pipelineParts(pipes.get(r.full)!, PIPE) : []).map((part, index) => <Text key={'fp-' + index} color={part.c}>{part.t}</Text>)}</Text></Box>}
              {W.git > 0 && <Box width={W.git} flexShrink={0} overflow="hidden"><Text color={GIT_TONE[badges.get(r.full)?.tone ?? 'dim']} wrap="truncate-end">{badges.get(r.full)?.text ?? ''}</Text></Box>}
              <Box width={W.age} justifyContent="flex-end"><Text color={C.dim}>{r.age}</Text></Box>
            </Box>
          ))}
        </Box>
      )

    // Hidden line that appears while anything in the same hover scope is under the pointer.
    // Full, untruncated text of a row (the table cell is cut to fit).
    const fullItem = (full: string) => {
      const p = s.projects.find(x => x.name === full)
      if (!p) return ''
      if (!p.hasCard) return 'STATUS 卡不存在'
      if (hasAsk(p)) return askSummary(p.ask)
      if (parseGate(p.gate)) return `關卡：${p.gate}`
      const run = p.jobs.find(j => j.kind === 'running')
      if (run) return runLine(run, s.at)
      if (p.jobs.some(j => j.kind === 'newer')) return '結果未同步至 STATUS'
      return p.state || '—'
    }
    const hovRow = hov === null ? null : list.find(x => x.full === hov) ?? null
    // One-line help strip; labels replace its contents without adding a blank row above the controls.
    const helpStrip = (
      <Box key="help" height={1} backgroundColor={C.bar} paddingX={1}>
        {hovRow !== null
          ? <Text color={C.text} wrap="truncate-end"><Text bold color={FG[hovRow.state]}>{hovRow.project}　</Text>{fullItem(hovRow.full)}</Text>
          : <Text color={C.faint}>ⓘ 滑鼠移到標籤或專案列上，這裡會顯示說明或完整內容</Text>}
        {Object.keys(HELP).map(id => (
          <Box key={'tip-' + id} position="absolute" top={0} left={0} width="100%" height={1} paddingX={1}
            backgroundColor={C.bar} display="none" hover={{ scope: 'help-' + id, display: 'flex' }}>
            <Text color={C.blue} wrap="truncate-end">ⓘ {HELP[id]}</Text>
          </Box>
        ))}
      </Box>
    )
    // iPhone-style battery: body shows what is left, turns amber then red as it runs out; the nub follows.
    const Battery = ({ id, label, used, hint, note }: { id: string; label: string; used: number; hint: string; note?: string }) => {
      // Context goes low where rotation is advised (half used), red at 30% left.
      const b = id === 'ctx' ? battery(used, 10, 100 - ROTATE_PERCENT, 30) : battery(used, 10)
      const tone = b.tone === 'red' ? C.red : b.tone === 'low' ? C.orange : C.green
      return (
        <Box flexDirection="column">
        <Box gap={1} hover={{ scope: 'help-' + id }}>
          <Box width={9}><Text color={C.dim}>{label}</Text></Box>
          {rich ? <ui.Client key={'battery-' + id + '-' + label} module="./battery.tsx" width={16} height={1} props={{ percent: b.left, tone }} /> : batteryBody(b.left, tone, ui)}
          {hint !== '' && <Text color={C.red}>{hint}</Text>}
          {note ? <Text color={C.dim} wrap="truncate-end">{note}</Text> : null}
        </Box>
        </Box>
      )
    }
    const target = nextProject(s)
    const targetProject = s.projects.find(p => p.name === target)
    const targetState = list.find(r => r.full === target)?.state
    const primaryAction: ActionKind | null = targetState === 'ACTION' ? 'decide' : targetState === 'GATE' && parseGate(targetProject?.gate)?.kind !== 'unknown' ? 'gate' : targetState === 'SYNC' && targetProject && !isManual(targetProject) ? 'sync' : null

plugins/console-status/hooks/pipeline-view.tsx 25〜36 行 · ペイン

plugins/console-status/hooks/pipeline-view.tsx:25

export function pipelineLine(pl: Pipeline, palette: PipelinePalette, elements: any, key: string, opts: { noteless?: boolean } = {}) {
  const { Box, Text } = elements
  return <Box key={key} flexDirection="column">
    <Box flexWrap="wrap">
      {pl.stages.map((stage, index) => <Text key={key + '-' + stage.id} wrap="truncate-end">
        {index > 0 && <Text color={pl.stages[index - 1]!.status === 'done' ? palette.green : palette.faint}>{' ─ '}</Text>}
        <Text color={stageColor(stage, palette)} bold={stage.id === pl.current}>{STAGE_GLYPH[stage.status]} {stage.label}</Text>
      </Text>)}
    </Box>
    {!opts.noteless && pl.note && <Text color={pl.current ? stageColor(pl.stages.find(stage => stage.id === pl.current)!, palette) : palette.dim} wrap="wrap">{pl.note}</Text>}
  </Box>
}

ライセンスの全文（MIT）

MIT License

Copyright (c) 2026 SaM-runtime

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

コードが呼ぶもの

プログラム起動ファイル書き込み環境変数Claude を動かす保存

コードから読み取ったデザイン

Claude — Code

示範資料：不執行專案操作；/console refresh 回到實際資料。

Claude に頼む…

主控台

主控台示範資料 3 個專案2h 10m 更新

執行者

Opus

預設

專案模式 build/console mode console 切回主控台

─ auto build ─ auto build ─ auto build

Claude

下一步 Opus

./spinner.tsx

下一步

./spinner.tsx

下一步

./spinner.tsx

下一步

派工鎖定：Bypass

⇢ 改用 Claude 派工（build）

執行者

[下一步][下一步][下一步]

手動交接：面板不派工（CARD、驗證、關卡照常）Codex 未派工：Claude

驗證指令：Codex✓ 最後驗證 Codex（未正常結束）輸出已被執行器截斷，以下是擷取內容GitGitGit

下一步

./spinner.tsx

下一步

目前沒有需要處理的項目

● build Git

狀態

專案

項目

流程

Git

更新

build

my-app

Codex

CodexCodexCodex

2h 10m

build

my-app

Codex

CodexCodexCodex

2h 10m

build

my-app

Codex

CodexCodexCodex

2h 10m

build

✕ 關閉

─ auto build ─ auto build ─ auto build

Claude

◉

a1b2c3d

Claude

› Codex

◉

a1b2c3d

Claude

› Codex

◉

a1b2c3d

Claude

› Codex

狀態

待決

11.

Fix login

Claude

11.

Fix login

Claude

11.

Fix login

Claude

關卡

Opus

下一步

Opus

同步

執行者已結束，結果未寫回 STATUS

Git

Claude

↗ 開啟

./spinner.tsx

下一步

./spinner.tsx

下一步

./spinner.tsx

下一步

派工鎖定：Bypass

⇢ 改用 Claude 派工（build）

執行者

[下一步][下一步][下一步]

手動交接：面板不派工（CARD、驗證、關卡照常）Codex 未派工：Claude

驗證指令：Codex✓ 最後驗證 Codex（未正常結束）輸出已被執行器截斷，以下是擷取內容GitGitGit

◆ 已選取 Git 下一則提示會附上此專案✕ 取消

build build

2h 10m前更新

─ auto build ─ auto build ─ auto build

Claude

◉

a1b2c3d

Claude

› Codex

◉

読み取ったコミットのソースから描いたもので、動かした結果ではありません。一覧は 3 回描き、条件はデスクトップアプリで描く最初の分岐を取り、動かしたときにだけ決まる値は仮の例（点線の下線）にするか省きます。色と書体はこのサイトのものです。

コードから読めること

2026-10-06 に読んだコミット 10c3020028f4 のソースから。最初のまとまりが載せる条件で、残りは自分で判断するための材料です。後のコミットは、次に読むまで見ていません。

載せる条件: 確かめやすいコード
入口を読んだ	hooks/hooks.json が名指すモジュールをすべて読んだ。plugins/console-status/hooks/register.tsx
解析できる	すべてのファイルが TypeScript か JavaScript として解析できる。19 ファイルを解析
コードが Mod の中で完結	import は Mod 自身のファイルかエンジンのモジュールだけ。パッケージも require もない。コードはすべて Mod の中
読める	圧縮した行・eval・new Function・計算した道の import()・符号化した塊がない。圧縮・eval・符号化した塊なし
呼び出しが見える	通信とプログラム起動はその場で $.http.fetch・$.process.run と書き、他へ渡さない。外への呼び出しはすべてその場の $ で
入れる前に自分で判断する材料
描く場所	コードから読んだ、描く先。ターミナル・デスクトップアプリ・両方・何も描かない（フックだけ: 見張りやプロンプトの書き換え）のどれか。出すだけで、外す理由にはしない。ターミナルとデスクトップアプリに描く（デスクトップ用の分岐あり）
入れる手順	リポジトリ自身の .claude-plugin/marketplace.json にこの Mod が載っていて、ページに書いた手順でそのマーケットプレイスから入れられるか。リポジトリの .claude-plugin/marketplace.json に載っており、そこから入れられる
Windows のプログラム	$.process で起動するプログラムが Windows にあるか（tail・date・open・osascript・/usr/… などは無い）。Windows にないプログラムを使わない
通信	fetch の送り先（https のホスト）がコードに書いてあるか。通信なし
プログラム	起動するプログラムの名前がコードに書いてあり、シェル・インタプリタ・通信用の道具でないか。plugins/console-status/hooks/register.tsx:264 実行時に決まるプログラム; plugins/console-status/hooks/register.tsx:290 実行時に決まるプログラム; plugins/console-status/hooks/register.tsx:307 実行時に決まるプログラム; plugins/console-status/hooks/register.tsx:322 実行時に決まるプログラム; plugins/console-status/hooks/register.tsx:507 実行時に決まるプログラム
読んで送る	ファイルや環境変数を読み、かつ通信するか。reads environment variables and files and reaches the network
ソースの鍵	ソースに API キーや秘密鍵らしきものがあるか。ソースに鍵なし
ライセンス	オープンなライセンス（MIT・Apache-2.0・BSD・ISC・Unlicense・0BSD・CC0）で全文があれば、modscode にコードを載せる。違えばリンクだけ。MIT

コードの文面を読んだだけで、安全の審査ではありません。動かしてはおらず、起動するプログラムの中で何が起きるかも見えません。入れる前の確認はあなたの役目です。載せる条件

入れる

入れる前に、必ず自分で確かめてください。Mod はサンドボックスなしで、あなたの権限で動きます。modscode はこのコードの安全を保証しません。下のコードを読み（またはフォルダーで claude plugin validate .）、触るものを見て、読んだコミットを入れてください。

リポジトリがそのままマーケットプレイスです。このマーケットプレイスを足し（ターミナルでは次のコマンド、デスクトップアプリではプラグインの設定）、そこから Mod を入れます。

/plugin marketplace add SaM-runtime/claude-console

/plugin install console-status@claude-console

入るのはマーケットプレイスの最新のコミットで、ここで読んだもの（10c3020028f4）と違うことがあります。入れる前に見比べてください。

Claude に聞く

modscode のコネクタを入れると、Claude がこのデザイン・コードが触るもの・コードを読んで、それをもとに作れます。たとえば:

modscode のデザイン「sam-runtime-console-status」をコードごと読んで、同じようなペインを作って

Claude から探す: MCP コネクタ

console-status

何をするか

良いところ

作り始めるためのコード

雛形（register.tsx）

Mod 自身のコード

コードが呼ぶもの

コードから読み取ったデザイン

コードから読めること

入れる

Claude に聞く

似たデザイン