ブロックリファレンス

このページはエディターに同梱されるすべてのブロック型を記載します。各ブロックには JSON の形、レンダラー、editor.blocks.insert によるプログラムからの挿入経路があります。

すべてのブロックはシリアライズ時に同じエンベロープを共有します: id、type、data、そして任意の tunes レコード。

ブロックの形状

すべてのブロックは同じ JSON エンベロープにシリアライズされます。id はエディターによって割り当てられ、データをプログラムで構築する際に省略できます。

JSON

{
  "id": "abc123",
  "type": "paragraph",
  "data": { "html": "Hello <b>world</b>" },
  "tunes": {}
}

alert

4 種類のバリアントを持つ強調表示の注意ボックス。

フィールド	型	必須	説明
html	string	はい	アラートメッセージの HTML コンテンツ。インラインツールのマークアップがサポートされています。
variant	'error' \| 'info' \| 'success' \| 'warning'	はい	アラートの視覚スタイル。次のいずれか: error、info、success、warning。

JSON

{
  "type": "alert",
  "data": { "html": "Your session will expire in 5 minutes.", "variant": "warning" }
}

audio

オーディオブロック。Editor.create の audioUploader コールバックを介して処理されます。

フィールド	型	必須	説明
url	string	はい	埋め込むオーディオファイルの URL。
caption	string	いいえ	プレーヤーの下に表示されるプレーンテキストのキャプション。
alt	string	いいえ	オーディオ要素のアクセシブルなラベル。
alignment	'center' \| 'left' \| 'right'	いいえ	プレーヤーの水平配置。次のいずれか: center、left、right。

JSON

{
  "type": "audio",
  "data": { "url": "/media/podcast.mp3", "caption": "Episode 12", "alignment": "center" }
}

checklist

項目ごとのチェック状態を持つインタラクティブなチェックボックスリスト。

フィールド	型	必須	説明
items	ChecklistItem[]	はい	チェックリスト項目の配列。各項目には text とチェック状態があります。
items[].text	string	はい	項目ラベルの HTML コンテンツ。
items[].checked	boolean	はい	チェックボックスがチェックされているかどうか。

JSON

{
  "type": "checklist",
  "data": {
    "items": [
      { "text": "Install the package", "checked": true },
      { "text": "Mount the editor", "checked": false }
    ]
  }
}

code

シンタックスハイライト付きのコードブロック。typescript、python、rust、go、ruby、swift、kotlin など 50 の言語に対応しています。

フィールド	型	必須	説明
code	string	はい	表示する生のコード文字列。
language	CodeLanguage	いいえ	構文ハイライトの言語。デフォルトは typescript です。
theme	CodeTheme	いいえ	エディターのカラーテーマ。デフォルトは github-dark です。
showCopy	boolean	いいえ	レンダリングされた出力にコピーボタンを表示します。
syncKey	string	いいえ	キーを共有するブロックは、言語を一緒に切り替えます。
variants	CodeVariant[]	いいえ	空でない場合、バリアントのタブストリップを描画し、権威あるソースになります。

JSON

{
  "type": "code",
  "data": { "code": "const x = 42;", "language": "typescript", "theme": "github-dark", "showCopy": true }
}

collapsible

タイトルとネストされた子ブロックを持つ折りたたみ可能なセクション。未知の子ブロック型はそのまま保持されるため、新しいドキュメントは古いレンダラーでも壊れません。

フィールド	型	必須	説明
html	string	はい	インライン HTML としてのセクションタイトル。
open	boolean	いいえ	セクションを展開した状態で表示するかどうか。
children	Block[]	いいえ	ネストされた子ブロック。

JSON

{
  "type": "collapsible",
  "data": {
    "html": "Details",
    "open": true,
    "children": [{ "type": "paragraph", "data": { "html": "Hidden until opened." } }]
  }
}

collection

id を使ってライブなコレクションビューを埋め込みます。ブロックはコレクションの識別子だけを保存し、形状とデータはサーバーが管理します。

フィールド	型	必須	説明
collectionId	string	はい	埋め込まれたコレクションの id。保存される唯一の情報。

JSON

{
  "type": "collection",
  "data": { "collectionId": "c-42" }
}

columns

2 から 4 列のマルチカラムレイアウト。各列が自身の子ブロックのリストを持ちます。

フィールド	型	必須	説明
columns	Block[][]	はい	各カラム。それぞれ子ブロックのリスト。2 から 4 列。

JSON

{
  "type": "columns",
  "data": {
    "columns": [
      [{ "type": "paragraph", "data": { "html": "Left" } }],
      [{ "type": "paragraph", "data": { "html": "Right" } }]
    ]
  }
}

date

カレンダー上の日付。タイムゾーンなしで保存されるため、すべての共同編集者の認識が一致します。

フィールド	型	必須	説明
date	string	はい	yyyy-MM-dd 形式の ISO 日付。タイムゾーンなし。

JSON

{
  "type": "date",
  "data": { "date": "2026-08-31" }
}

delimiter

セクション間の視覚的な区切り。

フィールド	型	必須	説明
variant	'line' \| 'stars'	はい	区切り線の視覚スタイル。次のいずれか: line、stars。

JSON

{
  "type": "delimiter",
  "data": { "variant": "line" }
}

doc_card

別のドキュメントへのリッチリンクカード。参照先ページの id と、名前変更時にホストが更新する表示スナップショットを保存します。

フィールド	型	必須	説明
pageId	string	はい	参照先ページの id。カードの識別子。
title	string	はい	ページタイトルの表示スナップショット。
icon	string	いいえ	カードに表示される任意のアイコン。
description	string	いいえ	タイトルの下に表示される任意の説明。

JSON

{
  "type": "doc_card",
  "data": { "pageId": "p-7", "title": "Release notes", "icon": "📄" }
}

embed

埋め込みリンク。ブロックは URL を保存し、プロバイダーと埋め込みマークアップは表示時に導出されます。unfurl フィールドはフォールバックカードになります。

フィールド	型	必須	説明
url	string	はい	埋め込まれたリンク。プロバイダーと埋め込みマークアップは表示時にここから導出されます。
title	string	いいえ	リンクカード用の unfurl スナップショット。
description	string	いいえ	リンクカード用の unfurl 説明。
imageUrl	string	いいえ	リンクカード用の unfurl プレビュー画像。
display	'card'	いいえ	ライブ表示が可能な場合でもリンクカードを表示するための "card"。
file	object	いいえ	Drive ファイルの名前、種類、アイコン。貼り付けた人の Google アカウントから取得。
gist	object	いいえ	貼り付け時の gist のファイル。GitHub 自身の表示が読み込めない場所ではコードとして描画。
reason	string	いいえ	ライブ表示が表示されない理由: connect_google、no_access、provider_unreachable、switched_off のいずれか。
issue	object	いいえ	カードとして表示される課題リンク: 最後に読み取ったスナップショット (tool、key、title、stateName、category、assigneeName、updatedAt、reason)。

JSON

{
  "type": "embed",
  "data": { "url": "https://www.youtube.com/watch?v=abc123" }
}

file

ダウンロードリンク、名前、任意のサイズとコンテンツタイプを持つファイル添付。

フィールド	型	必須	説明
url	string	はい	ファイルの配信元。
name	string	はい	添付に表示されるファイル名。
size	number	いいえ	バイト単位のファイルサイズ。
contentType	string	いいえ	ファイルの MIME タイプ。

JSON

{
  "type": "file",
  "data": { "url": "/files/notes.pdf", "name": "notes.pdf", "size": 2048, "contentType": "application/pdf" }
}

glance

ラベルと値のサマリーパネル。ひと目で読める事実の行に、任意のキャプションと背景バリアントを添えられます。

フィールド	型	必須	説明
rows	GlanceRow[]	はい	表示する事実。各行はラベルとインライン HTML 値です。
caption	string	いいえ	行の上に表示される任意のキャプション。
variant	'plain' \| 'error' \| 'info' \| 'success' \| 'warning'	いいえ	背景バリアント。plain はスタイルなし、残りはアラートのパレットに一致します。

JSON

{
  "type": "glance",
  "data": {
    "caption": "Facts",
    "rows": [{ "label": "Version", "html": "<b>1.0</b>" }],
    "variant": "plain"
  }
}

header

トップレベルおよびセクションの見出し（h1 から h6）。インラインツールは html ペイロード内で動作します。

フィールド	型	必須	説明
html	string	はい	見出しの HTML コンテンツ。インラインツールのマークアップがサポートされています。
level	'h1' \| 'h2' \| 'h3' \| 'h4' \| 'h5' \| 'h6'	いいえ	見出しレベル。次のいずれか: h1、h2、h3、h4、h5、h6。デフォルトは h1 です。

JSON

{
  "type": "header",
  "data": { "html": "Getting started", "level": "h2" }
}

image

キャプションと alt テキストを持つ画像ブロック。Editor.create の imageUploader コールバックを介して処理されます。

フィールド	型	必須	説明
url	string	はい	埋め込む画像の URL。
caption	string	いいえ	画像の下に表示されるプレーンテキストのキャプション。
alt	string	いいえ	画像要素の alt テキスト。
alignment	'center' \| 'left' \| 'right'	いいえ	画像の水平配置。次のいずれか: center、left、right。

JSON

{
  "type": "image",
  "data": { "url": "/img/hero.jpg", "caption": "Hero image", "alt": "A hero", "alignment": "center" }
}

issues

ページ上の課題チップとカードから表示時に導出される関連課題の表 (課題、タイトル、状態、担当者)。自身のデータは保存しません。

このブロックはフィールドを保存しません。行は表示時にページ上の課題チップとカードから導出されます。

JSON

{
  "type": "issues",
  "data": {}
}

latex

LaTeX の数式。ソースとして保存され、表示時に組版されます。後により良いレンダラーが登場すれば、既存のすべてのドキュメントが改善されます。

フィールド	型	必須	説明
source	string	はい	LaTeX ソース。ソースとして保存され、レンダリング結果としては保存されません。

JSON

{
  "type": "latex",
  "data": { "source": "\\frac{a}{b}" }
}

list

順序付きまたは順序なしのリスト。各項目は html です。

フィールド	型	必須	説明
type	'ordered' \| 'unordered'	はい	リストの種類。次のいずれか: ordered、unordered。
items	string[]	はい	HTML 文字列の配列、リスト項目ごとに 1 つ。

JSON

{
  "type": "list",
  "data": { "type": "unordered", "items": ["First item", "Second item"] }
}

mermaid

Mermaid の図。ソースとして保存され、表示時に描画されます。ラスタとしては保存されません。

フィールド	型	必須	説明
source	string	はい	Mermaid ソース。ソースとして保存され、描画結果としては保存されません。

JSON

{
  "type": "mermaid",
  "data": { "source": "flowchart TD\n  A --> B" }
}

openapi

OpenAPI 3.x ドキュメントからインタラクティブな API リファレンスを描画します。インラインまたは URL から取得し、サーバーピッカーとコードスニペット付き。

フィールド	型	必須	説明
spec	object	いいえ	インラインの OpenAPI 3.x ドキュメント。両方設定されている場合は url より優先されます。
url	string	いいえ	表示時に OpenAPI ドキュメントを取得する場所。
include	OpenApiFilter	いいえ	どの操作を表示するかのフィルター。
exclude	OpenApiFilter	いいえ	どの操作を隠すかのフィルター。
defaultServer	string	いいえ	リファレンスがデフォルトで選択するサーバー。
snippetLanguages	CodeLanguage[]	いいえ	リクエストスニペットで提供される言語。

JSON

{
  "type": "openapi",
  "data": { "url": "/api/openapi.json", "defaultServer": "https://api.example.com" }
}

paragraph

リッチテキストの段落。bold、italic、code、link、marker、tooltip などのインラインツールのマークアップを受け付けます。

フィールド	型	必須	説明
html	string	はい	段落の HTML コンテンツ。インラインツールのマークアップがサポートされています。

JSON

{
  "type": "paragraph",
  "data": { "html": "This is a <b>paragraph</b> with inline markup." }
}

quote

任意の著者表記を付けられる引用ブロック。

フィールド	型	必須	説明
html	string	はい	引用本文の HTML コンテンツ。インラインツールのマークアップがサポートされています。
author	string	いいえ	引用の下に表示されるプレーンテキストまたは HTML の帰属。

JSON

{
  "type": "quote",
  "data": { "html": "The best way to predict the future is to invent it.", "author": "Alan Kay" }
}

sketch

ストロークとして保存されるフリーハンドの描画。ラスタではないため、編集可能なまま、きれいに拡大縮小できます。

フィールド	型	必須	説明
strokes	SketchStroke[]	はい	ストロークとしての描画。各ストロークは、任意の色と幅を持つ点のリストです。

JSON

{
  "type": "sketch",
  "data": { "strokes": [{ "points": [0, 0, 10, 10], "color": "#ff0000", "width": 3 }] }
}

table

データグリッド。最初の行はヘッダーとして使用できます。各セルは html です。

フィールド	型	必須	説明
data	string[][]	はい	HTML セル文字列の 2 次元配列。最初の行がヘッダー行です。
caption	string	いいえ	テーブルの下に表示されるプレーンテキストまたは HTML のキャプション。
showDownload	boolean	いいえ	レンダリングされた出力にダウンロードボタンを表示します。

JSON

{
  "type": "table",
  "data": {
    "data": [["Name", "Type"], ["html", "string"], ["variant", "AlertVariant"]],
    "caption": "AlertData fields",
    "showDownload": false
  }
}

updates

ドキュメントのライブアクティビティフィード。スナップショットではなく識別子を保存するため、常に現在のアクティビティを表示し続けます。

フィールド	型	必須	説明
pageId	string	いいえ	どのドキュメントのアクティビティを表示するか。未指定ならブロックが置かれているドキュメント。

JSON

{
  "type": "updates",
  "data": { "pageId": "p-7" }
}

video

ビデオブロック。Editor.create の videoUploader コールバックを介して処理されます。

フィールド	型	必須	説明
url	string	はい	ビデオファイルの URL または YouTube/Vimeo の埋め込みリンク。
caption	string	いいえ	プレーヤーの下に表示されるプレーンテキストのキャプション。
alt	string	いいえ	ビデオ要素のアクセシブルなラベル。
alignment	'center' \| 'left' \| 'right'	いいえ	プレーヤーの水平配置。次のいずれか: center、left、right。

JSON

{
  "type": "video",
  "data": { "url": "/media/demo.mp4", "caption": "Product demo", "alignment": "center" }
}

リファレンス

パッケージ

ブロックリファレンス

ブロックの形状

alert

audio

checklist

code

collapsible

collection

columns

date

delimiter

doc_card

embed

file

glance

header

image

issues

latex

list

mermaid

openapi

paragraph

quote

sketch

table

toc

updates

video