GitHub Alerts
GitHub 形式の > [!NOTE] アラートブロック引用をアドモニションマークアップに変換します。
GitHub Alerts 機能は、GitHub 形式のアラートブロック引用(README で見かける > [!NOTE] 構文)を、アドモニションレシピ(directives マップ)が生成するのと同じアドモニションマークアップに変換します。これにより、使い慣れた GitHub 構文でコールアウトを書きながら、:::note 形式のディレクティブとまったく同じように描画できます。
標準プリセットに含まれます
zudoDoc() は GitHub Alerts を有効にします。個別の設定フィールドは不要です。
// zfb.config.ts
import { defineConfig } from "zfb/config";
import { zudoDoc } from "@takazudo/zudo-doc/config";
export default defineConfig(
zudoDoc({
siteName: "My Docs",
}),
);構文
ブロック引用の 1 行目に [!TYPE] を前置します(タイプは大文字小文字を区別せずに一致)。
> [!NOTE]
> Useful information that users should know, even when skimming content.バリアント
5 種類のアラートタイプがサポートされています。それぞれがアドモニションバリアントに対応します。
| 前置 | バリアント |
|---|---|
[!NOTE] | note |
[!TIP] | tip |
[!IMPORTANT] | important |
[!WARNING] | warning |
[!CAUTION] | caution |
パッケージが提供するコンポーネント
zudo-doc は Important と Caution コンポーネントを登録するため、5 つのアラートバリアントはプロジェクト側でコンポーネントを登録しなくてもすべて描画されます。これらのコンポーネントは mdxExtras を通じて上書きできます。
ライブデモ
以下に 5 つのバリアントすべてをライブで描画しています。
Note
ユーザーが流し読みしていても知っておくべき有用な情報。
Tip
物事をより良く、より簡単に行うための役立つアドバイス。
Important
ユーザーが目的を達成するために知っておくべき重要な情報。
Warning
問題を避けるためにユーザーの即時の注意が必要な緊急情報。
Caution
特定の操作のリスクや悪い結果について助言します。
出力されるマークアップ
出力はアドモニションレシピ(directives マップ)と同一です。たとえば > [!NOTE] は次を生成します。
<div data-admonition="note" class="admonition admonition-note">
<p class="admonition-title">…</p>
<div class="admonition-body">…</div>
</div>メモ
サポートされる構文は
[!TYPE]のみです。> [!NOTE] My Titleのように末尾にインラインタイトルを付けると、アラートではなく通常のブロック引用として扱われます。複数段落がサポートされ、すべての本文がアドモニション内に収まります。
GitHub Alerts とアドモニションレシピ(
directivesマップ)は共存します。GitHub アラートはアドモニションパスより前に処理されるため、両方を同時に有効化できます。