mcpField
C
current-slide

current-slide

github.com/open-slideドキュメント9.4k144 回インストール今日更新
リポジトリ

current-slide について

current-slide は、Open Slide の開発ビューアーでスライドを編集するエージェント向けのスキルです。編集のたびに最新のナビゲーション状態と選択状態を読み、対象のスライド、ページ、要素を特定します。

主な機能

  1. 01JSON からビューアーの状態を取得
  2. 02スライド・ページ・選択要素の特定
  3. 03現在位置の指示ごとに状態を再取得
  4. 04編集前に状態の鮮度を確認
  5. 05ソースパスと行位置を参照

活用シーン

  1. 01ビューアーで表示中のスライドを編集
  2. 02インスペクターで選択した要素を調整
  3. 03ナビゲーション状態が古い場合に対象を確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/open-slide/open-slide --skill current-slide

インストール後、Claude Code で/current-slideを入力して読み込まれたか確認します。

詳細

ユーザーは今どこにいますか?

ユーザーが「このページを修正して」「この見出しを調整して」「今見ているスライド」と言うとき、スライド ID、ページ番号、要素を指定することはほとんどありません。意味しているのは、開発用ビューアーで現在表示している場所です。「どのスライドですか?」「どの要素ですか?」と尋ねる前に、開発サーバーがナビゲーションやインスペクターでの選択のたびに書き込むファイルを確認してください。

指示語を含むターンでは毎回読み直す — 前回の読み取り結果を再利用しない

current.json は現在のカーソル位置を示すものであり、会話の事実を記録したものではありません。ユーザーは、あなたのターンの合間にスライド、ページ、要素を自由に切り替えます。ほかの作業をしている間に切り替えることもあります。指示語を含む参照がある新しいターンの開始時には、必ずファイルを新たに読み込んでください。次の場合も例外ではありません。

  • この会話ですでに読み込んでいる場合
  • ファイルが指していたスライドの編集を終えたばかりの場合
  • ユーザーの新しいメッセージが続きのように聞こえる場合(「次はこれを大きくして」「これも修正して」「続けて」)

「編集を続けて」というフォローアップは、ユーザーが別のスライドに移動したり、別の要素を選択したりした可能性が高いケースです。ここで前回の読み取り結果を信用すると、気付かないまま別のファイルを編集してしまいます。再読み込みし、前回使用した値と slideId/pageIndex/selection を比較して、新しい値に基づいて作業してください。

読み取り方法

node_modules/.open-slide/current.json

パスはプロジェクトルート(ユーザーの cwd、つまり slides/ と package.json があるディレクトリ)からの相対パスです。Read ツールを使用してください。ファイルは JSON です。

ファイルに含まれる情報

{
  "slideId": "q2-roadmap",
  "pageIndex": 2,
  "pageNumber": 3,
  "totalPages": 8,
  "slideTitle": "Q2 Roadmap",
  "view": "slides",
  "pagePath": "slides/q2-roadmap/index.tsx",
  "selection": {
    "line": 42,
    "column": 6,
    "tagName": "h1",
    "text": "Q2 Roadmap"
  },
  "updatedAt": "2026-05-09T14:32:11.123Z"
}
  • slideId — slides/ 配下のフォルダー名です。/__slides/<id>/... の API や URL セグメントには、そのまま使用してください。
  • pageIndex — 0 始まりです。index.tsx のページ配列(export default [Cover, Body, ...])で使用します。
  • pageNumber — 1 始まりです。ユーザーへのメッセージ(「全 8 ページ中 3 ページ目」)や URL の ?p=N に使用します。
  • pagePath — スライドのソースへの相対パスです。そのまま Read/Edit に渡してください。
  • view — "slides"(キャンバスビュー)または "assets"(アセットマネージャー)です。"assets" の場合、ユーザーはページを表示しているのではなく、そのスライドのファイルを閲覧しています。
  • selection — 何も選択されていない場合は null です。それ以外の場合は、ユーザーがインスペクターオーバーレイで選択した JSX 要素です。
    • line(1 始まり)と column(0 始まり)は、pagePath 内の JSX 開始タグを示します。これが正式な参照先です。レンダリング済み DOM ではなく、ソースの行と照合してください。
    • tagName は、レンダリングされた DOM タグ名を小文字にしたものです("h1"、"div"、"img")。
    • text は、要素の textContent から切り出した前後の空白を除いたテキストスニペット(120 文字以下)で、対象のノードが正しいか確認するのに役立ちます。
    • ユーザーが別のスライドやページに移動すると、選択は自動的に解除されます。
  • updatedAt — 最後にナビゲーションまたは選択が変更された時刻を示す ISO タイムスタンプです。古い情報かどうかの判定に使用してください。

使用する状況

  • ユーザーが現在のスライドやページを指示語で参照している場合:「これ」「ここ」「今開いているページ」「今見ているスライド」「作業中のもの」。
  • ユーザーが特定の要素に言及している場合:「この見出し」「この画像」「今クリックしたボタン」「これを詰めて」「これの色を変えて」。selection が null でなければ、それがユーザーの指している要素です。
  • 確認のために「どのスライドですか?」「どの要素ですか?」と尋ねる前に、このファイルを確認してください。
  • git log、最近編集されたファイル、または最も新しいスライドフォルダーから推測する前に、このファイルを確認してください。

使用しない状況

  • ユーザーがスライドを明示している場合(「q2-roadmap を編集して」)は、その名前を直接使用してください。
  • apply-comments ワークフローでは @slide-comment マーカーによって対象ファイルが特定されるため、このスキルは必要ありません。
  • スライドの一覧表示や検索には、slides/ を直接読み込んでください。

古さ — 操作する前に確認する

updatedAt は、ユーザーが最後に移動した時刻です。キャッシュのように扱ってください。

  • 新しい(約5分以内):信頼してかまいません。pagePath を開き、作業します。
  • 約5分より古い:編集する前にユーザーに確認します。開発サーバーが起動していない可能性があり、ユーザーがコンテキストを切り替えている可能性もあります。
  • 数時間〜数日前:無視します。どのスライドを指しているのか、ユーザーに尋ねます。

前回確認したものより新しい updatedAt は、ユーザーが移動したことを示す通常のシグナルです。確認せずに、新しい slideId/pageIndex/selection に切り替えてください。

ファイルが見つからない場合

  • 開発サーバーでスライドがまだ開かれていないか、サーバーが一度も起動されていません。
  • ファイルを作成したり、推測したりしないでください。どのスライドを指しているのかユーザーに尋ねるか、開発サーバーで先にスライドを開くよう提案してください。

例 — ページ単位の参照

ユーザー:「このページの間隔を詰めて」

  1. node_modules/.open-slide/current.json を読みます。
  2. updatedAt が新しいことを確認します。
  3. pagePath(例:slides/q2-roadmap/index.tsx)を読みます。
  4. デフォルトエクスポートされた配列の pageIndex にあるページを特定します。
  5. 間隔のルールについて slide-authoring スキルを参照してから、そのページをその場で編集します。
  6. 結果を視覚的に確認するには、開発サーバーで s/<slideId>/preview?p=<pageNumber> のスクリーンショットを撮ります — slide-authoring の ページの視覚的なプレビュー を参照してください。

current.json が見つからないか古い場合は、次のように尋ねます。「どのスライドのどのページの間隔を詰めればよいですか?開発サーバーは最近、現在のページを公開していません。」

例 — 要素単位の参照

ユーザー:「これを大きくして」

  1. node_modules/.open-slide/current.json を読みます。
  2. selection が null でない場合、ユーザーはその要素を指しています。pagePath を読み、selection.line に移動し、その行/列の近くにある JSX の開始タグを見つけます。selection.text のスニペットと tagName で確認します。
  3. 編集する前に、文字サイズとレイアウトのルールについて slide-authoring を参照します。
  4. JSX ノードをその場で編集します。

selection が null の場合は、上記のページ単位の手順に従います — ユーザーは指示語を使っていますが、インスペクターで要素を選択していないため、「どの要素ですか?」と尋ねることも検討してください。

コメント