@intlayer/docs 9.5.4-canary.0 → 9.5.5

package/docs/ja/intlayer_with_remix_3.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2026-09-09
-updatedAt: 2026-09-11
+updatedAt: 2026-09-19
 title: "Remix 3 i18n - アプリを多言語化するための完全ガイド"
 description: "もう i18next は不要です。2026 年版、多言語 (i18n) Remix 3 アプリ構築ガイド。AI エージェントで翻訳し、バンドルサイズ、SEO、パフォーマンスを最適化します。"
 keywords:
@@ -19,6 +19,9 @@ slugs:
 applicationTemplate: https://github.com/aymericzip/intlayer-remix-3-template
 applicationShowcase: https://intlayer-remix-3-template.vercel.app
 history:
+  - version: 9.5.5
+    date: 2026-09-19
+    changes: "remix-intlayer ミドルウェアとフックの使用"
   - version: 9.5.0
     date: 2026-09-09
     changes: "Remix 3 用の初期ドキュメント"
@@ -39,7 +42,7 @@ author: aymericzip
 - **`remix/node-fetch-server`**: Bun、Deno、およびエッジランタイムをネイティブサポートする Node.js 用サーバーアダプター。
 - **`remix/cookie`**: 暗号学的に安全な Cookie の解析とシリアル化。
 
-**Intlayer** と組み合わせることで、コンパイル時安全性、自動 AI 翻訳、オーバーヘッドのないサーバーレンダリング、および滑らかなロケールルーティングを提供する完全な国際化システムが手に入ります。
+**Intlayer** と **`remix-intlayer`** パッケージ（ロケールミドルウェアおよび Remix リクエストコンテキストにバインドされた `react-intlayer` と同じ `useIntlayer` / `useDictionary` / `useLocale` フック）を組み合わせることで、コンパイル時の安全性、AI による自動翻訳、オーバーヘッドのないサーバーレンダリング、シームレスなロケールルーティングを提供する完全な国際化システムが実現します。
 
 ## 目次
 
@@ -52,7 +55,7 @@ author: aymericzip
 <AccordionGroup>
 <Accordion header="Remix 3 と Web 標準の完全なサポート">
 
-Intlayer は Web 標準 (`Request`、`Response`、`Headers`、`URL`) とシームレスに連携するように設計されています。軽量なミドルウェアを介して Remix 3 の Fetch ルーターに簡単に統合され、特定のランタイムに縛られることなく URL パス、Cookie、または `Accept-Language` ヘッダーからロケールを抽出します。
+Intlayer はウェブ標準（`Request`、`Response`、`Headers`、`URL`）とシームレスに連携するように構築されています。`remix-intlayer` は軽量なミドルウェアとして Remix 3 の Fetch ルーターに組み込まれ、URL パス、Cookie、または `Accept-Language` ヘッダーからロケールを抽出し、引数として引き回すことなく、ハンドラー、ビュー、`remix/ui` コンポーネントなどのリクエスト全体に公開します。
 
 </Accordion>
 <Accordion header="型安全なコンテンツ宣言">
@@ -109,25 +112,26 @@ GitHub の [アプリケーションテンプレート](https://github.com/aymer
 <Steps>
 <Step number={1} title="依存関係のインストール">
 
-お好みのパッケージマネージャーを使用して `intlayer` と `remix` (バージョン 3) をインストールします。
+お好みのパッケージマネージャーを使用して、`intlayer`、`remix-intlayer`、および `remix`（バージョン 3）をインストールします:
 
 ```bash packageManager="npm"
-npm install intlayer remix@next
+npm install intlayer remix-intlayer remix@next
 ```
 
 ```bash packageManager="pnpm"
-pnpm add intlayer remix@next
+pnpm add intlayer remix-intlayer remix@next
 ```
 
 ```bash packageManager="yarn"
-yarn add intlayer remix@next
+yarn add intlayer remix-intlayer remix@next
 ```
 
 ```bash packageManager="bun"
-bun add intlayer remix@next
+bun add intlayer remix-intlayer remix@next
 ```
 
 - **`intlayer`**: 設定管理、辞書宣言 (`t()`, `Dictionary`)、CLI ツール、およびランタイムインタープリターを提供するコア国際化エンジン。
+- **`remix-intlayer`**: Remix 3 統合: 各リクエストのロケールを解決する `intlayer()` ルーターミドルウェア、およびそれ以降の任意の場所で読み取る `useIntlayer`、`useDictionary`、`useLocale` フック。
 - **`remix`**: `remix/router`、`remix/routes`、`remix/ui`、`remix/middleware/render`、および `remix/node-fetch-server` をエクスポートする統合 Remix 3 フレームワークパッケージ。
 
 </Step>
@@ -254,65 +258,30 @@ bun x intlayer build
 これにより、コンテンツが `.intlayer` アーティファクトディレクトリにコンパイルされ、TypeScript による完全な自動補完と高速な辞書参照が可能になります。
 
 </Step>
-<Step number={5} title="Intlayer ミドルウェアの実装">
-
-Remix 3 は `createRouter({ middleware: [...] })` を通じてコンポーザブルなミドルウェアパイプラインを提供します。
-
-以下の優先順位に従って受信リクエストのロケールを解決する Intlayer ミドルウェアを作成します。
-
-1. Intlayer の `getLocaleFromPath` による URL パスプレフィックス (例: `/ja` または `/fr`)。
-2. ストレージ Cookie (`INTLAYER_LOCALE`)、カスタムヘッダー (`x-intlayer-locale`)、標準の `Accept-Language` ヘッダー、および `defaultLocale` を自動ネゴシエーションする Intlayer の `getLocale` ヘルパー。
-
-```typescript fileName="src/middleware/intlayer.ts" codeFormat={["typescript", "esm"]}
-import {
-  defaultLocale,
-  getCookie,
-  getLocale,
-  getLocaleFromPath,
-  type Locale,
-} from "intlayer";
-import { createContextKey, type Middleware } from "remix/router";
-
-/**
- * Remix 3 RequestContext から解決されたロケールを取得するための型安全なコンテキストキー。
- */
-export const localeKey = createContextKey<Locale>(defaultLocale);
-
-/**
- * Remix 3 用 Intlayer ミドルウェア。
- *
- * 次の優先順位でリクエストロケールを解決します:
- * 1. `getLocaleFromPath` を使用した URL パスプレフィックス (例: `/ja/...`)
- * 2. `getLocale` を使用したヘッダーおよびストレージのネゴシエーション (Cookie、カスタムヘッダー、Accept-Language、フォールバック defaultLocale)
- *
- * 解決されたロケールを Remix 3 RequestContext に付加します。
- */
-export const intlayer = (): Middleware => {
-  return async (context, next) => {
-    // パス検出 (/ja/about -> "ja", /about -> undefined)
-    const pathLocale = getLocaleFromPath(context.url.pathname);
-
-    if (pathLocale) {
-      // 解決されたロケールを Remix 3 リクエストコンテキストに設定
-      context.set(localeKey, pathLocale);
-
-      return next();
-    }
-
-    const storedLocale = await getLocale({
-      getHeader: (name) => context.headers.get(name),
-      getCookie: (name) =>
-        getCookie(name, context.headers.get("cookie") ?? undefined),
-    });
-
-    // 解決されたロケールを Remix 3 リクエストコンテキストに設定
-    context.set(localeKey, storedLocale ?? defaultLocale);
-
-    return next();
-  };
-};
+<Step number={5} title="Intlayer ミドルウェアの追加">
+
+Remix 3 は、`createRouter({ middleware: [...] })` を介して構成可能なミドルウェアパイプラインを提供します。
+
+`remix-intlayer` は `intlayer()` ミドルウェアを提供します。受信するリクエストごとに、以下を使用してロケールを解決します:
+
+1. `no-prefix` 以外のすべてのルーティングモードにおける URL: パスプレフィックス（例: `/ja` または `/en`）または `?locale=` 検索パラメータ。
+2. クライアントによって永続化されたロケール: ストレージ Cookie（`INTLAYER_LOCALE`）またはカスタムヘッダー（`x-intlayer-locale`）。
+3. 標準の `Accept-Language` ネゴシエーション（設定された `defaultLocale` へのフォールバック）。
+
+結果は `locale`、`defaultLocale`、`availableLocales` とともに Remix リクエストコンテキストに `context.intlayer`（または `context.get(Intlayer)`）として保存されます。ミドルウェアはその後、そのコンテキストにバインドされた `AsyncLocalStorage` スコープ内でリクエストの残りを実行します。これにより、パッケージのフックはルートハンドラー、ビュー、`remix/ui` コンポーネントのいずれでも引数なしでロケールを読み取ることができます:
+
+```typescript
+import { useIntlayer, useLocale } from "remix-intlayer";
+
+// ミドルウェア以降の任意の場所
+const { locale, availableLocales } = useLocale();
+const { title } = useIntlayer("home");
 ```
 
+`useIntlayer("home", "fr")` または `useIntlayer("faq", { item: 2 })` は1回の呼び出しでリクエストロケールを上書きし、`useDictionary(homeContent)` はキーの代わりにインポートされた辞書を読み取ります。リクエスト外ではフックはデフォルトロケールにフォールバックします。
+
+> ミドルウェアはサーバー起動時に Intlayer 辞書も準備するため、`intlayer build` が実行されていなくてもレジストリが空になることはありません。
+
 </Step>
 <Step number={6} title="型安全なルートの定義">
 
@@ -342,20 +311,21 @@ routes.localizedHome.href({ locale: "ja" }); // "/ja"
 
 Remix 3 は `remix/ui` の JSX コンポーネントを使用して UI をレンダリングします。コンポーネントは `Handle` を受け取り**レンダー関数**を返す**セットアップ関数**です。セットアップはインスタンスごとに 1 回だけ実行され、レンダリングは更新ごとに実行され、props は `handle.props` を介して読み取られます。
 
-まず、解決されたロケールから `<html lang="..." dir="...">` 属性を設定する共有 `Document` シェルを作成します。
+ミドルウェアによって解決されたロケールから `<html lang="..." dir="...">` 属性を設定する共有 `Document` シェルから始めます:
 
 ```tsx fileName="src/views/document.tsx" codeFormat={["typescript", "esm"]}
-import { getHTMLTextDir, type Locale } from "intlayer";
+import { getHTMLTextDir } from "intlayer";
+import { useLocale } from "remix-intlayer";
 import type { Handle, RemixNode } from "remix/ui";
 
 type DocumentProps = {
-  locale: Locale;
   title: string;
   children?: RemixNode;
 };
 
 export const Document = (handle: Handle<DocumentProps>) => () => {
-  const { locale, title, children } = handle.props;
+  const { title, children } = handle.props;
+  const { locale } = useLocale();
 
   return (
     <html lang={locale} dir={getHTMLTextDir(locale)}>
@@ -370,47 +340,40 @@ export const Document = (handle: Handle<DocumentProps>) => () => {
 };
 ```
 
-次にホームページを作成します。`getIntlayer` でローカライズされた辞書を取得し、言語スイッチャーを表示します。
+次にホームページを作成します。`useIntlayer` でローカライズされた辞書を読み取り、言語スイッチャーをレンダリングします:
 
 ```tsx fileName="src/views/home.tsx" codeFormat={["typescript", "esm"]}
-import {
-  getIntlayer,
-  getLocaleName,
-  getLocalizedPath,
-  type Locale,
-  locales,
-} from "intlayer";
-import type { Handle } from "remix/ui";
-import { routes } from "../routes";
+import { getLocaleName, getLocalizedUrl, getPathWithoutLocale } from "intlayer";
+import { useIntlayer, useLocale } from "remix-intlayer";
 import { Document } from "./document";
 
-type HomePageProps = {
-  locale: Locale;
-};
-
-export const HomePage = (handle: Handle<HomePageProps>) => () => {
-  const { locale } = handle.props;
-  const home = getIntlayer("home", locale);
+export const HomePage = () => () => {
+  const { locale, availableLocales } = useLocale();
+  const home = useIntlayer("home");
+  const pathWithoutLocale = getPathWithoutLocale();
 
   return (
-    <Document locale={locale} title={home.title}>
+    <Document title={home.title}>
       <header>
         <nav aria-label="Languages">
           <span>{home.switchLanguage}</span>
-          {locales.map((targetLocale) => {
-            const isActive = targetLocale === locale;
-
-            return (
-              <a
-                key={targetLocale}
-                href={getLocalizedPath(routes.home.href(), targetLocale)}
-                class={isActive ? "active" : undefined}
-                aria-current={isActive ? "page" : undefined}
-              >
-                {getLocaleName(targetLocale, locale)}
-              </a>
-            );
-          })}
+          <ul>
+            {availableLocales.map((localeItem) => {
+              const isActive = localeItem === locale;
+
+              return (
+                <li key={localeItem} class="p-1">
+                  <a
+                    href={getLocalizedUrl(pathWithoutLocale, localeItem)}
+                    class={isActive ? "active" : undefined}
+                    aria-current={isActive ? "page" : undefined}
+                  >
+                    {getLocaleName(localeItem, locale)}
+                  </a>
+                </li>
+              );
+            })}
+          </ul>
         </nav>
       </header>
       <main>
@@ -422,7 +385,7 @@ export const HomePage = (handle: Handle<HomePageProps>) => () => {
 };
 ```
 
-> Remix JSX は React ではありません。フックはなく、`class` はそのまま記述し (`className` も利用可能)、再レンダリングは `handle.update()` で明示的にトリガーします。展開された値は自動的にエスケープされます。
+> Remix JSX は React ではありません: `class` はそのまま記述され（`className` も使用可能）、再レンダリングは `handle.update()` で明示的にトリガーされます。補間された値は自動的にエスケープされます。Intlayer フックはリクエストスコープを読み取るプレーンな関数であるため、セットアップ関数またはレンダリング関数のどちらからでも呼び出すことができます。
 
 </Step>
 <Step number={8} title="ルーターとサーバーの接続">
@@ -431,39 +394,37 @@ Intlayer ミドルウェアの横に `remix/middleware/render` の `render()`
 
 ```tsx fileName="src/router.tsx" codeFormat={["typescript", "esm"]}
 import { isDeclaredLocale } from "intlayer";
+import { intlayer } from "remix-intlayer";
 import { render } from "remix/middleware/render";
 import { createRouter } from "remix/router";
-import { intlayer, localeKey } from "./middleware/intlayer";
 import { routes } from "./routes";
 import { HomePage } from "./views/home";
 
-// 1. Intlayer + render ミドルウェアでルーターを初期化
+// 1. Initialize router with Intlayer + render middleware
 export const router = createRouter({
   middleware: [intlayer(), render()],
 });
 
-// 2. ルートハンドラーをマッピング
+// 2. Map route handlers
 router.map(routes, {
   actions: {
-    // デフォルトロケールルート
+    // Default locale route
     home(context) {
-      const locale = context.get(localeKey);
-      return context.render(<HomePage locale={locale} />);
+      return context.render(<HomePage />);
     },
 
-    // ローカライズルート
+    // Localized route
     localizedHome(context) {
       if (!isDeclaredLocale(context.params.locale)) {
         return new Response("Not Found", { status: 404 });
       }
-      const locale = context.get(localeKey);
-      return context.render(<HomePage locale={locale} />);
+      return context.render(<HomePage />);
     },
   },
 });
 ```
 
-> `context.render` は第 2 引数としてオプションの `ResponseInit` を受け取ります (例: `context.render(<NotFoundPage locale={locale} />, { status: 404 })`)。
+> `context.render` は第2引数としてオプションの `ResponseInit` を受け入れます（例: `context.render(<NotFoundPage />, { status: 404 })`）。解決されたロケールは、`Response.json` ペイロードを作成する場合などに、ハンドラーから `context.intlayer.locale` としてアクセスできます。
 
 最後に、標準の `fetch` ハンドラーを介してルーターを公開します。同じルーターが Node.js、Bun、Deno、および Cloudflare Workers 上で動作します。
 

package/docs/ja/intlayer_with_tanstack+solid.md

@@ -1260,6 +1260,13 @@ TanStack Start には i18n レイヤーが付属していないため、Solid
 
 [ビジュアルエディター](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)を通じて、独自のインフラストラクチャで実行され、誰もが実行中のアプリ上でテキストをその場で編集できます。または、[CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_CMS.md)を通じて、コンテンツを外部化してデプロイメントなしで変更できます。
 
+</Question>
+<Question title="ビジュアルエディターのコストはどれくらいですか？不要な場合はオーバースペックですか？">
+
+Intlayerの[ビジュアルエディター](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)は、セットアップされていない場合はアプリケーションへの**コストはゼロ**です。追加のロジックは、明示的に有効化され、必要な場合にのみ読み込まれます。
+
+有効にした場合でも、ロジックの大半は[app.intlayer.org](https://app.intlayer.org)のサーバーエディターまたは`intlayer-editor`パッケージによって処理されるため、負荷は極めて軽量です（有効化時に動的に読み込まれる+5 kBのみ）。ビジュアル編集を必要とせず、シンプルな翻訳ソリューションのみが必要な場合、Intlayerがアプリにオーバーヘッドを追加することはありません。
+
 </Question>
 <Question title="Intlayer は無料でオープンソースですか？">
 

package/docs/ja/intlayer_with_tanstack.md

@@ -1339,6 +1339,13 @@ TanStack Start で重要な違いはルーティングとサーバーレンダ
 
 独自のインフラストラクチャ上で動作し、実行中のアプリでテキストをその場で編集できる[ビジュアルエディター](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)、またはコンテンツを外部化してデプロイなしで変更できるようにする[CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_CMS.md)を通じて可能です。
 
+</Question>
+<Question title="ビジュアルエディターのコストはどれくらいですか？不要な場合はオーバースペックですか？">
+
+Intlayerの[ビジュアルエディター](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)は、セットアップされていない場合はアプリケーションへの**コストはゼロ**です。追加のロジックは、明示的に有効化され、必要な場合にのみ読み込まれます。
+
+有効にした場合でも、ロジックの大半は[app.intlayer.org](https://app.intlayer.org)のサーバーエディターまたは`intlayer-editor`パッケージによって処理されるため、負荷は極めて軽量です（有効化時に動的に読み込まれる+5 kBのみ）。ビジュアル編集を必要とせず、シンプルな翻訳ソリューションのみが必要な場合、Intlayerがアプリにオーバーヘッドを追加することはありません。
+
 </Question>
 <Question title="Intlayer は無料でオープンソースですか？">
 

package/docs/ja/intlayer_with_vite+preact.md

@@ -1138,6 +1138,13 @@ namespace ベースのセットアップよりもはるかに少なくなりま
 
 [ビジュアルエディタ](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)を通じて、独自のインフラストラクチャで実行され、誰でも実行中のアプリでテキストをその場で編集できます。または、[CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_CMS.md)を通じて、コンテンツを外部化してデプロイメントなしで変更できます。
 
+</Question>
+<Question title="ビジュアルエディターのコストはどれくらいですか？不要な場合はオーバースペックですか？">
+
+Intlayerの[ビジュアルエディター](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)は、セットアップされていない場合はアプリケーションへの**コストはゼロ**です。追加のロジックは、明示的に有効化され、必要な場合にのみ読み込まれます。
+
+有効にした場合でも、ロジックの大半は[app.intlayer.org](https://app.intlayer.org)のサーバーエディターまたは`intlayer-editor`パッケージによって処理されるため、負荷は極めて軽量です（有効化時に動的に読み込まれる+5 kBのみ）。ビジュアル編集を必要とせず、シンプルな翻訳ソリューションのみが必要な場合、Intlayerがアプリにオーバーヘッドを追加することはありません。
+
 </Question>
 <Question title="Intlayer は無料でオープンソースですか？">
 

package/docs/ja/intlayer_with_vite+react.md

@@ -1081,6 +1081,13 @@ Intlayer はロケール解決を処理し、ルーティングをルーター
 
 [ビジュアルエディタ](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)（自己ホスト型）を通じて、誰でも実行中のアプリ上でテキストをその場で編集できます。または、デプロイメントなしで変更する必要があるコンテンツの場合は [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_CMS.md) を使用します。
 
+</Question>
+<Question title="ビジュアルエディターのコストはどれくらいですか？不要な場合はオーバースペックですか？">
+
+Intlayerの[ビジュアルエディター](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)は、セットアップされていない場合はアプリケーションへの**コストはゼロ**です。追加のロジックは、明示的に有効化され、必要な場合にのみ読み込まれます。
+
+有効にした場合でも、ロジックの大半は[app.intlayer.org](https://app.intlayer.org)のサーバーエディターまたは`intlayer-editor`パッケージによって処理されるため、負荷は極めて軽量です（有効化時に動的に読み込まれる+5 kBのみ）。ビジュアル編集を必要とせず、シンプルな翻訳ソリューションのみが必要な場合、Intlayerがアプリにオーバーヘッドを追加することはありません。
+
 </Question>
 <Question title="Intlayer は無料でオープンソースですか？">
 

package/docs/ja/intlayer_with_vite+solid.md

@@ -823,6 +823,13 @@ Vite 固有の利点は、翻訳がコンパイル時に解決され tree shakin
 
 [ビジュアルエディタ](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)を通じて、独自のインフラストラクチャで実行され、実行中のアプリでテキストをその場で編集できるようにします。または、[CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_CMS.md)を通じて、コンテンツを外部化してデプロイメントなしで変更できるようにします。
 
+</Question>
+<Question title="ビジュアルエディターのコストはどれくらいですか？不要な場合はオーバースペックですか？">
+
+Intlayerの[ビジュアルエディター](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/intlayer_visual_editor.md)は、セットアップされていない場合はアプリケーションへの**コストはゼロ**です。追加のロジックは、明示的に有効化され、必要な場合にのみ読み込まれます。
+
+有効にした場合でも、ロジックの大半は[app.intlayer.org](https://app.intlayer.org)のサーバーエディターまたは`intlayer-editor`パッケージによって処理されるため、負荷は極めて軽量です（有効化時に動的に読み込まれる+5 kBのみ）。ビジュアル編集を必要とせず、シンプルな翻訳ソリューションのみが必要な場合、Intlayerがアプリにオーバーヘッドを追加することはありません。
+
 </Question>
 <Question title="Intlayer は無料でオープンソースですか？">
 

package/docs/ja/packages/astro-intlayer/exports.md

@@ -1,8 +1,8 @@
 ---
 createdAt: 2026-01-21
-updatedAt: 2026-01-21
+updatedAt: 2026-09-19
 title: astro-intlayer パッケージのドキュメント
-description: Intlayer向けのAstro統合。ロケールベースのルーティングと辞書管理の設定を提供します。
+description: ロケールベースのルーティング、ミドルウェア、フック、クライアントストア、辞書管理の設定を提供する Intlayer の Astro 統合。
 keywords:
   - astro-intlayer
   - astro
@@ -14,15 +14,18 @@ slugs:
   - astro-intlayer
   - exports
 history:
+  - version: 9.5.5
+    date: 2026-09-19
+    changes: "useIntlayer、useDictionary、useLocale フック、ミドルウェア、フォーマッターのドキュメントを追加"
   - version: 8.0.0
     date: 2026-01-21
-    changes: "すべてのエクスポートのドキュメントを統合"
+    changes: "すべてのエクスポートのドキュメントを統一"
 author: aymericzip
 ---
 
 # astro-intlayer パッケージ
 
-`astro-intlayer` パッケージは、IntlayerをAstroアプリケーションに統合するために必要なツールを提供します。ロケールベースのルーティングと辞書管理を設定します。
+`astro-intlayer` パッケージは、Intlayer を Astro アプリケーションに統合するために必要なツールを提供します。ロケールベースのルーティング、辞書管理、ビルド時のページ書き換え、リクエストミドルウェア、およびサーバーレンダリングされた `.astro` コンポーネントとクライアント側スクリプトの両方で多言語コンテンツにアクセスするためのフックを設定します。
 
 ## インストール
 
@@ -32,24 +35,173 @@ npm install astro-intlayer
 
 ## エクスポート
 
-### インテグレーション
+### 統合
 
-`astro-intlayer` パッケージは、プロジェクトで Intlayer を設定するための Astro 統合を提供します。
+`astro-intlayer` パッケージは、プロジェクトに Intlayer を設定する Astro 統合を提供します。
 
 インポート:
 
 ```tsx
-import "astro-intlayer";
+import { intlayer } from "astro-intlayer";
 ```
 
-または `astro.config.mjs` に追加:
+または `astro.config.mjs` でのデフォルトインポート:
 
 ```ts
+import { defineConfig } from "astro/config";
+import intlayer from "astro-intlayer";
+
 export default defineConfig({
   integrations: [intlayer()],
 });
 ```
 
-| 関数       | 説明                                                      |
-| ---------- | --------------------------------------------------------- |
-| `intlayer` | プロジェクトで Intlayer をセットアップする Astro の統合。 |
+| 関数       | 説明                                                                                                                                                                                                | 関連ドキュメント                                                                                              |
+| ---------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- |
+| `intlayer` | 辞書を準備し、Vite プラグイン（エイリアス、ルーティングプロキシ、プルーニング）を設定し、リクエストミドルウェアを自動登録し、ローカライズされた URL でプリレンダリングページを出力する Astro 統合。 | [intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/packages/astro-intlayer/intlayer.md) |
+
+### フック（サーバーおよびクライアント）
+
+インポート:
+
+```tsx
+import { useIntlayer, useDictionary, useLocale } from "astro-intlayer";
+```
+
+| フック          | 説明                                                                                                                                                                                                        | 関連ドキュメント                                                                                                        |
+| --------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
+| `useIntlayer`   | キーによって辞書を1つ選択し、そのローカライズされたコンテンツを返します。`.astro` のフロントマターでは `Astro.locals` からリクエストロケールを読み取り、`<script>` ではクライアントストアから読み取ります。 | [useIntlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/packages/astro-intlayer/useIntlayer.md)     |
+| `useDictionary` | 辞書オブジェクトを変換し、解決されたロケールのコンテンツを返します。フロントマターおよびクライアントスクリプトで動作します。                                                                                | [useDictionary](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/packages/astro-intlayer/useDictionary.md) |
+| `useLocale`     | 現在のロケール、デフォルトロケール、利用可能なロケール一覧、およびロケール更新関数を返します。                                                                                                              | [useLocale](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/packages/astro-intlayer/useLocale.md)         |
+
+### ミドルウェア (astro-intlayer/middleware)
+
+インポート:
+
+```tsx
+import { onRequest } from "astro-intlayer/middleware";
+```
+
+| エクスポート | タイプ              | 説明                                                                                                                                                                | 関連ドキュメント                                                                                                |
+| ------------ | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------- |
+| `onRequest`  | `MiddlewareHandler` | リクエストロケールを検出し `Astro.locals.intlayer` をアタッチする Astro ミドルウェア。`intlayer()` によって自動登録されるか、手動で合成するためにインポートします。 | [onRequest](https://github.com/aymericzip/intlayer/blob/main/docs/docs/ja/packages/astro-intlayer/onRequest.md) |
+
+### ユーティリティ
+
+インポート:
+
+```tsx
+import { getIntlayerLocals } from "astro-intlayer";
+```
+
+| 関数                | 説明                                                                                                                | 関連ドキュメント |
+| ------------------- | ------------------------------------------------------------------------------------------------------------------- | ---------------- |
+| `getIntlayerLocals` | `Astro.locals` の外部でリクエストストレージスコープから現在の `IntlayerLocals` オブジェクトを取得するヘルパー関数。 | -                |
+
+### クライアントユーティリティ (astro-intlayer/client)
+
+インポート:
+
+```tsx
+import {
+  useIntlayer,
+  useDictionary,
+  useDictionaryDynamic,
+  useLocale,
+  useLocaleStorage,
+  useLocaleCookie,
+  getIntlayer,
+  getDictionary,
+  installIntlayer,
+  setLocaleInStorage,
+  setLocaleCookie,
+  localeInStorage,
+  localeCookie,
+} from "astro-intlayer/client";
+```
+
+ブラウザまたはクライアントの `<script>` タグ内でインポートされると、`astro-intlayer` は自動的に `astro-intlayer/client`（`vanilla-intlayer` 提供）にマップされ、クライアント側の辞書ゲッター、ストア購読、およびロケール永続化ツールを提供します。
+
+### フォーマッター (astro-intlayer/format)
+
+インポート:
+
+```tsx
+import {
+  useIntl,
+  useDate,
+  useNumber,
+  useCurrency,
+  usePercentage,
+  useRelativeTime,
+  useList,
+  useUnit,
+  useCompact,
+} from "astro-intlayer/format";
+```
+
+| フック            | 説明                                                                                                                 |
+| ----------------- | -------------------------------------------------------------------------------------------------------------------- |
+| `useIntl`         | キャッシュおよび購読機能を備えた、リクエストまたはクライアントロケールにバインドされた Intl インスタンスを返します。 |
+| `useDate`         | 現在のロケールにバインドされた日付フォーマット関数を返します (`Intl.DateTimeFormat`)。                               |
+| `useNumber`       | 現在のロケールにバインドされた数値フォーマット関数を返します (`Intl.NumberFormat`)。                                 |
+| `useCurrency`     | 現在のロケールにバインドされた通貨フォーマット関数を返します。                                                       |
+| `usePercentage`   | 現在のロケールにバインドされたパーセンテージフォーマット関数を返します。                                             |
+| `useRelativeTime` | 現在のロケールにバインドされた相対時間フォーマット関数を返します (`Intl.RelativeTimeFormat`)。                       |
+| `useList`         | 現在のロケールにバインドされたリストフォーマット関数を返します (`Intl.ListFormat`)。                                 |
+| `useUnit`         | 現在のロケールにバインドされた単位フォーマット関数を返します。                                                       |
+| `useCompact`      | 現在のロケールにバインドされたコンパクト数値フォーマット関数を返します（例: `1.5K`）。                               |
+
+### HTML ユーティリティ (astro-intlayer/html)
+
+インポート:
+
+```tsx
+import { renderHTML, useHTML, useHTMLRenderer } from "astro-intlayer/html";
+```
+
+| エクスポート      | タイプ     | 説明                                                            |
+| ----------------- | ---------- | --------------------------------------------------------------- |
+| `renderHTML`      | `Function` | HTML ノードをレンダリングするスタンドアロンユーティリティ関数。 |
+| `useHTML`         | `Hook`     | HTML プロバイダーコンテキストと設定を取得するフック。           |
+| `useHTMLRenderer` | `Hook`     | 事前設定された HTML レンダラー関数を取得するフック。            |
+
+### Markdown ユーティリティ (astro-intlayer/markdown)
+
+インポート:
+
+```tsx
+import {
+  compileMarkdown,
+  renderMarkdown,
+  parseMarkdown,
+  useMarkdown,
+  useMarkdownRenderer,
+} from "astro-intlayer/markdown";
+```
+
+| エクスポート          | タイプ     | 説明                                                     |
+| --------------------- | ---------- | -------------------------------------------------------- |
+| `compileMarkdown`     | `Function` | Markdown 文字列を構造化表現にコンパイルします。          |
+| `renderMarkdown`      | `Function` | Markdown コンテンツを出力ノードにレンダリングします。    |
+| `parseMarkdown`       | `Function` | 生の Markdown コンテンツを AST に解析します。            |
+| `useMarkdown`         | `Hook`     | Markdown プロバイダーコンテキストを取得するフック。      |
+| `useMarkdownRenderer` | `Hook`     | 事前設定された Markdown レンダラー関数を取得するフック。 |
+
+### タイプ
+
+インポート:
+
+```tsx
+import type {
+  IntlayerLocals,
+  UseLocaleProps,
+  UseLocaleResult,
+} from "astro-intlayer";
+```
+
+| タイプ            | 説明                                                                                                               |
+| ----------------- | ------------------------------------------------------------------------------------------------------------------ |
+| `IntlayerLocals`  | `locale`、`defaultLocale`、および `availableLocales` を含む `Astro.locals.intlayer` にアタッチされたオブジェクト。 |
+| `UseLocaleProps`  | `useLocale()` が受け入れるオプションの設定プロパティ。                                                             |
+| `UseLocaleResult` | ロケールプロパティと更新メソッドを提供する `useLocale()` の戻り値の型。                                            |