@intlayer/docs 9.5.4 → 9.5.5

package/docs/en-GB/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 - Complete guide to translate your app"
 description: "No more i18next. The 2026 guide to building a multilingual (i18n) Remix 3 app. Translate with AI agents and optimise bundle size, SEO and performance."
 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: "Use the remix-intlayer middleware and hooks"
   - version: 9.5.0
     date: 2026-09-09
     changes: "Initial documentation for Remix 3"
@@ -39,7 +42,7 @@ This guide demonstrates how to integrate **Intlayer** for seamless international
 - **`remix/node-fetch-server`**: Server adapters for Node.js, while natively supporting Bun, Deno, and edge runtimes.
 - **`remix/cookie`**: Cryptographically secure cookie parsing and serialisation.
 
-Combined with **Intlayer**, you get a complete internationalisation system that delivers compile-time safety, automated AI translations, zero-overhead server rendering, and seamless locale routing.
+Combined with **Intlayer** and the **`remix-intlayer`** package, a locale middleware plus the same `useIntlayer` / `useDictionary` / `useLocale` hooks as `react-intlayer`, bound to the Remix request context, you get a complete internationalisation system that delivers compile-time safety, automated AI translations, zero-overhead server rendering, and seamless locale routing.
 
 ## Table of Contents
 
@@ -52,7 +55,7 @@ Compared to traditional solutions like `i18next` or bespoke translation loaders,
 <AccordionGroup>
 <Accordion header="Full Remix 3 & Web Standards Coverage">
 
-Intlayer is built to work seamlessly with web standards (`Request`, `Response`, `Headers`, and `URL`). It integrates effortlessly into Remix 3's Fetch router through lightweight middleware, extracting locales from URL paths, cookies, or `Accept-Language` headers without locking you into a specific runtime.
+Intlayer is built to work seamlessly with web standards (`Request`, `Response`, `Headers`, and `URL`). `remix-intlayer` plugs into Remix 3's Fetch router as a lightweight middleware, extracting the locale from URL paths, cookies, or `Accept-Language` headers and exposing it to the rest of the request, handlers, views and `remix/ui` components, without passing it around or locking you into a specific runtime.
 
 </Accordion>
 <Accordion header="Type-Safe Content Declarations">
@@ -109,25 +112,26 @@ See the [Application Template](https://github.com/aymericzip/intlayer-remix-3-te
 <Steps>
 <Step number={1} title="Install Dependencies">
 
-Install `intlayer` and `remix` (version 3) using your preferred package manager:
+Install `intlayer`, `remix-intlayer` and `remix` (version 3) using your preferred package manager:
 
 ```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`**: Core internationalisation engine providing configuration management, dictionary declaration (`t()`, `Dictionary`), CLI tools, and runtime interpreter.
+- **`remix-intlayer`**: The Remix 3 integration: the `intlayer()` router middleware that resolves the locale of each request, and the `useIntlayer`, `useDictionary` and `useLocale` hooks that read it anywhere downstream.
 - **`remix`**: The unified Remix 3 framework package exporting `remix/router`, `remix/routes`, `remix/ui`, `remix/middleware/render`, and `remix/node-fetch-server`.
 
 </Step>
@@ -254,65 +258,30 @@ bun x intlayer build
 This compiles your content into the `.intlayer` artifact directory, enabling full TypeScript autocompletion and rapid dictionary lookup.
 
 </Step>
-<Step number={5} title="Implement the Intlayer Middleware">
+<Step number={5} title="Add the Intlayer Middleware">
 
 Remix 3 provides a composable middleware pipeline via `createRouter({ middleware: [...] })`.
 
-Create an Intlayer middleware that resolves the locale of each incoming request using:
-
-1. The URL path prefix via Intlayer's `getLocaleFromPath` (e.g. `/en-GB` or `/fr`).
-2. Intlayer's `getLocale` helper, which automatically negotiates across storage cookies (`INTLAYER_LOCALE`), custom headers (`x-intlayer-locale`), standard `Accept-Language` headers, and your configured `defaultLocale`.
-
-```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";
-
-/**
- * Type-safe context key to retrieve the resolved locale from Remix 3 RequestContext.
- */
-export const localeKey = createContextKey<Locale>(defaultLocale);
-
-/**
- * Intlayer middleware for Remix 3.
- *
- * Resolves the request locale following priority:
- * 1. URL path prefix (e.g. `/en-GB/...`) via `getLocaleFromPath`
- * 2. Storage & headers negotiation via Intlayer `getLocale` (cookie, custom header, Accept-Language negotiation, fallback defaultLocale)
- *
- * Attaches the resolved locale to the Remix 3 RequestContext.
- */
-export const intlayer = (): Middleware => {
-  return async (context, next) => {
-    // Path detection (/en-GB/about -> "en-GB", /about -> undefined)
-    const pathLocale = getLocaleFromPath(context.url.pathname);
-
-    if (pathLocale) {
-      // Attach resolved locale to Remix 3 request context
-      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),
-    });
-
-    // Attach resolved locale to Remix 3 request context
-    context.set(localeKey, storedLocale ?? defaultLocale);
-
-    return next();
-  };
-};
+`remix-intlayer` ships the `intlayer()` middleware. For each incoming request it resolves the locale using:
+
+1. The URL, in every routing mode but `no-prefix`: the path prefix (e.g. `/en-GB` or `/fr`) or the `?locale=` search param.
+2. The locale persisted by the client: the storage cookie (`INTLAYER_LOCALE`) or custom header (`x-intlayer-locale`).
+3. Standard `Accept-Language` negotiation, falling back to your configured `defaultLocale`.
+
+The result is stored in the Remix request context as `context.intlayer` (or `context.get(Intlayer)`), with `locale`, `defaultLocale` and `availableLocales`. The middleware then runs the rest of the request inside an `AsyncLocalStorage` scope bound to that context, which is what lets the hooks of the package read the locale with no argument, in route handlers, views and `remix/ui` components alike:
+
+```typescript
+import { useIntlayer, useLocale } from "remix-intlayer";
+
+// Anywhere downstream of the middleware
+const { locale, availableLocales } = useLocale();
+const { title } = useIntlayer("home");
 ```
 
+`useIntlayer("home", "fr")` or `useIntlayer("faq", { item: 2 })` override the request locale for one call, and `useDictionary(homeContent)` reads an imported dictionary instead of a key. Outside of a request the hooks fall back to the default locale.
+
+> The middleware also prepares the Intlayer dictionaries when the server starts, so a missing `intlayer build` does not leave the registry empty.
+
 </Step>
 <Step number={6} title="Define Type-Safe Routes">
 
@@ -342,20 +311,21 @@ routes.localizedHome.href({ locale: "en-GB" }); // "/en-GB"
 
 Remix 3 renders UI with JSX components from `remix/ui`. A component is a **setup function** that receives a `Handle` and returns a **render function**. Setup runs once per instance, render runs on every update, and props are read through `handle.props`.
 
-Start with a shared `Document` shell that sets the `<html lang="..." dir="...">` attributes from the resolved locale:
+Start with a shared `Document` shell that sets the `<html lang="..." dir="...">` attributes from the locale resolved by the middleware:
 
 ```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>) => () => {
 };
 ```
 
-Then create the home page. It extracts the localised dictionary with `getIntlayer` and renders a language switcher:
+Then create the home page. It reads the localised dictionary with `useIntlayer` and renders a language switcher:
 
 ```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 is not React: there are no hooks, `class` is written as-is (`className` is also accepted), and re-renders are triggered explicitly with `handle.update()`. Interpolated values are escaped automatically.
+> Remix JSX is not React: `class` is written as-is (`className` is also accepted), and re-renders are triggered explicitly with `handle.update()`. Interpolated values are escaped automatically. The Intlayer hooks are plain functions reading the request scope, so they can be called from the setup function or the render function alike.
 
 </Step>
 <Step number={8} title="Wire Up the Router and Server">
@@ -431,9 +394,9 @@ Add the `render()` middleware from `remix/middleware/render` next to the Intlaye
 
 ```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";
 
@@ -447,8 +410,7 @@ 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
@@ -456,14 +418,13 @@ router.map(routes, {
       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` accepts an optional `ResponseInit` as second argument, e.g. `context.render(<NotFoundPage locale={locale} />, { status: 404 })`.
+> `context.render` accepts an optional `ResponseInit` as second argument, e.g. `context.render(<NotFoundPage />, { status: 404 })`. The resolved locale stays reachable from the handler as `context.intlayer.locale`, for instance to build a `Response.json` payload.
 
 Finally, expose the router through a standard `fetch` handler. The same router runs on Node.js, Bun, Deno, and Cloudflare Workers:
 

package/docs/en-GB/intlayer_with_tanstack+solid.md

@@ -1260,6 +1260,13 @@ Yes: [plural forms](https://github.com/aymericzip/intlayer/blob/main/docs/docs/e
 
 Through the [visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md), which runs on your own infrastructure and lets anyone edit text in place on the running app, or the [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_CMS.md), which externalizes content so it can change without a deployment.
 
+</Question>
+<Question title="What is the cost of the visual editor? Is it overkill if I don't need it?">
+
+The [Intlayer visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md) has **zero cost** on your application if it is not set up. The extra logic is only loaded if explicitly enabled and needed.
+
+If enabled, the cost is extremely light (+5 KB, dynamically loaded only when activated) because the main logic is handled by the server editor on [app.intlayer.org](https://app.intlayer.org) or via the `intlayer-editor` package. If you only need a simple translation setup without visual editing, Intlayer adds no overhead to your app.
+
 </Question>
 <Question title="Is Intlayer free and open source?">
 

package/docs/en-GB/intlayer_with_tanstack.md

@@ -1331,6 +1331,13 @@ Yes. Content declarations support [plural forms](https://github.com/aymericzip/i
 
 Through the [visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md), which runs on your own infrastructure and lets anyone edit text in place on the running site, or the [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_CMS.md), which externalizes content so it can change without a deployment.
 
+</Question>
+<Question title="What is the cost of the visual editor? Is it overkill if I don't need it?">
+
+The [Intlayer visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md) has **zero cost** on your application if it is not set up. The extra logic is only loaded if explicitly enabled and needed.
+
+If enabled, the cost is extremely light (+5 KB, dynamically loaded only when activated) because the main logic is handled by the server editor on [app.intlayer.org](https://app.intlayer.org) or via the `intlayer-editor` package. If you only need a simple translation setup without visual editing, Intlayer adds no overhead to your app.
+
 </Question>
 <Question title="Is Intlayer free and open source?">
 

package/docs/en-GB/intlayer_with_vite+preact.md

@@ -1125,6 +1125,13 @@ Yes: [plural forms](https://github.com/aymericzip/intlayer/blob/main/docs/docs/e
 
 Through the [visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md), which runs on your own infrastructure and lets anyone edit text in place on the running app, or the [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_CMS.md), which externalizes content so it can change without a deployment.
 
+</Question>
+<Question title="What is the cost of the visual editor? Is it overkill if I don't need it?">
+
+The [Intlayer visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md) has **zero cost** on your application if it is not set up. The extra logic is only loaded if explicitly enabled and needed.
+
+If enabled, the cost is extremely light (+5 KB, dynamically loaded only when activated) because the main logic is handled by the server editor on [app.intlayer.org](https://app.intlayer.org) or via the `intlayer-editor` package. If you only need a simple translation setup without visual editing, Intlayer adds no overhead to your app.
+
 </Question>
 <Question title="Is Intlayer free and open source?">
 

package/docs/en-GB/intlayer_with_vite+react.md

@@ -1170,6 +1170,13 @@ Yes: [plural forms](https://github.com/aymericzip/intlayer/blob/main/docs/docs/e
 
 Through the [visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md), self hosted, which lets anyone edit text in place on the running app, or the [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_CMS.md) for content that must change without a deployment.
 
+</Question>
+<Question title="What is the cost of the visual editor? Is it overkill if I don't need it?">
+
+The [Intlayer visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md) has **zero cost** on your application if it is not set up. The extra logic is only loaded if explicitly enabled and needed.
+
+If enabled, the cost is extremely light (+5 KB, dynamically loaded only when activated) because the main logic is handled by the server editor on [app.intlayer.org](https://app.intlayer.org) or via the `intlayer-editor` package. If you only need a simple translation setup without visual editing, Intlayer adds no overhead to your app.
+
 </Question>
 <Question title="Is Intlayer free and open source?">
 

package/docs/en-GB/intlayer_with_vite+solid.md

@@ -811,6 +811,13 @@ Yes: [plural forms](https://github.com/aymericzip/intlayer/blob/main/docs/docs/e
 
 Through the [visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md), which runs on your own infrastructure and lets anyone edit text in place on the running app, or the [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_CMS.md), which externalizes content so it can change without a deployment.
 
+</Question>
+<Question title="What is the cost of the visual editor? Is it overkill if I don't need it?">
+
+The [Intlayer visual editor](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/intlayer_visual_editor.md) has **zero cost** on your application if it is not set up. The extra logic is only loaded if explicitly enabled and needed.
+
+If enabled, the cost is extremely light (+5 KB, dynamically loaded only when activated) because the main logic is handled by the server editor on [app.intlayer.org](https://app.intlayer.org) or via the `intlayer-editor` package. If you only need a simple translation setup without visual editing, Intlayer adds no overhead to your app.
+
 </Question>
 <Question title="Is Intlayer free and open source?">
 

package/docs/en-GB/packages/astro-intlayer/exports.md

@@ -1,12 +1,12 @@
 ---
 createdAt: 2026-01-21
-updatedAt: 2026-01-21
+updatedAt: 2026-09-19
 title: astro-intlayer Package Documentation
-description: Astro integration for Intlayer, providing setup for locale-based routing and dictionary management.
+description: Astro integration for Intlayer, providing setup for locale-based routing, middleware, hooks, client store, and dictionary management.
 keywords:
   - astro-intlayer
   - astro
-  - internationalization
+  - internationalisation
   - i18n
 slugs:
   - doc
@@ -14,6 +14,9 @@ slugs:
   - astro-intlayer
   - exports
 history:
+  - version: 9.5.5
+    date: 2026-09-19
+    changes: "Add useIntlayer, useDictionary, useLocale hooks, middleware, and formatters documentation"
   - version: 8.0.0
     date: 2026-01-21
     changes: "Unified documentation for all exports"
@@ -22,7 +25,7 @@ author: aymericzip
 
 # astro-intlayer Package
 
-The `astro-intlayer` package provides the necessary tools to integrate Intlayer into Astro applications. It configures locale-based routing and dictionary management.
+The `astro-intlayer` package provides the necessary tools to integrate Intlayer into Astro applications. It configures locale-based routing, dictionary management, build-time page rewriting, request middleware, and hooks for accessing multilingual content across both server-rendered `.astro` components and client-side scripts.
 
 ## Installation
 
@@ -34,22 +37,171 @@ npm install astro-intlayer
 
 ### Integration
 
-The `astro-intlayer` package provides an Astro integration to set Intlayer up in your project.
+The `astro-intlayer` package provides an Astro integration that sets up Intlayer in your project.
 
 Import:
 
 ```tsx
-import "astro-intlayer";
+import { intlayer } from "astro-intlayer";
 ```
 
-or add it to `astro.config.mjs`:
+or default import in `astro.config.mjs`:
 
 ```ts
+import { defineConfig } from "astro/config";
+import intlayer from "astro-intlayer";
+
 export default defineConfig({
   integrations: [intlayer()],
 });
 ```
 
-| Function   | Description                                              |
-| ---------- | -------------------------------------------------------- |
-| `intlayer` | Astro integration that sets Intlayer up in your project. |
+| Function   | Description                                                                                                                                                                                                 | Related Doc                                                                                                      |
+| ---------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- |
+| `intlayer` | Astro integration that prepares dictionaries, configures Vite plugins (aliases, routing proxy, prune), automatically registers request middleware, and emits prerendered pages at localised rewritten URLs. | [intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/packages/astro-intlayer/intlayer.md) |
+
+### Hooks (Server & Client)
+
+Import:
+
+```tsx
+import { useIntlayer, useDictionary, useLocale } from "astro-intlayer";
+```
+
+| Hook            | Description                                                                                                                                                                                        | Related Doc                                                                                                                |
+| --------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- |
+| `useIntlayer`   | Picks one dictionary by its key and returns its localised content. In `.astro` frontmatter, it reads the request locale from `Astro.locals`. In client `<script>`, it reads from the client store. | [useIntlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/packages/astro-intlayer/useIntlayer.md)     |
+| `useDictionary` | Transforms a dictionary object and returns content for the resolved locale. Works in frontmatter and client scripts.                                                                               | [useDictionary](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/packages/astro-intlayer/useDictionary.md) |
+| `useLocale`     | Returns the current locale, default locale, available locales, and a function to update the locale.                                                                                                | [useLocale](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/packages/astro-intlayer/useLocale.md)         |
+
+### Middleware (astro-intlayer/middleware)
+
+Import:
+
+```tsx
+import { onRequest } from "astro-intlayer/middleware";
+```
+
+| Export      | Type                | Description                                                                                                                                                       | Related Doc                                                                                                        |
+| ----------- | ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ |
+| `onRequest` | `MiddlewareHandler` | Astro middleware that detects the request locale and attaches `Astro.locals.intlayer`. Registered automatically by `intlayer()`, or imported manually to compose. | [onRequest](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/packages/astro-intlayer/onRequest.md) |
+
+### Utilities
+
+Import:
+
+```tsx
+import { getIntlayerLocals } from "astro-intlayer";
+```
+
+| Function            | Description                                                                                                             | Related Doc |
+| ------------------- | ----------------------------------------------------------------------------------------------------------------------- | ----------- |
+| `getIntlayerLocals` | Helper function to retrieve the current `IntlayerLocals` object from the request storage scope outside of Astro.locals. | -           |
+
+### Client Utilities (astro-intlayer/client)
+
+Import:
+
+```tsx
+import {
+  useIntlayer,
+  useDictionary,
+  useDictionaryDynamic,
+  useLocale,
+  useLocaleStorage,
+  useLocaleCookie,
+  getIntlayer,
+  getDictionary,
+  installIntlayer,
+  setLocaleInStorage,
+  setLocaleCookie,
+  localeInStorage,
+  localeCookie,
+} from "astro-intlayer/client";
+```
+
+When imported in the browser or inside client `<script>` tags, `astro-intlayer` automatically maps to `astro-intlayer/client` (powered by `vanilla-intlayer`), providing client-side dictionary getters, store subscribers, and locale persistence tools.
+
+### Formatters (astro-intlayer/format)
+
+Import:
+
+```tsx
+import {
+  useIntl,
+  useDate,
+  useNumber,
+  useCurrency,
+  usePercentage,
+  useRelativeTime,
+  useList,
+  useUnit,
+  useCompact,
+} from "astro-intlayer/format";
+```
+
+| Hook              | Description                                                                                                |
+| ----------------- | ---------------------------------------------------------------------------------------------------------- |
+| `useIntl`         | Returns an Intl instance bound to the request or client locale with caching and subscription capabilities. |
+| `useDate`         | Returns a date formatting function pre-bound to the current locale (`Intl.DateTimeFormat`).                |
+| `useNumber`       | Returns a number formatting function pre-bound to the current locale (`Intl.NumberFormat`).                |
+| `useCurrency`     | Returns a currency formatting function pre-bound to the current locale.                                    |
+| `usePercentage`   | Returns a percentage formatting function pre-bound to the current locale.                                  |
+| `useRelativeTime` | Returns a relative time formatting function pre-bound to the current locale (`Intl.RelativeTimeFormat`).   |
+| `useList`         | Returns a list formatting function pre-bound to the current locale (`Intl.ListFormat`).                    |
+| `useUnit`         | Returns a unit formatting function pre-bound to the current locale.                                        |
+| `useCompact`      | Returns a compact number formatting function pre-bound to the current locale (e.g. `1.5K`).                |
+
+### HTML Utilities (astro-intlayer/html)
+
+Import:
+
+```tsx
+import { renderHTML, useHTML, useHTMLRenderer } from "astro-intlayer/html";
+```
+
+| Export            | Type       | Description                                              |
+| ----------------- | ---------- | -------------------------------------------------------- |
+| `renderHTML`      | `Function` | Standalone utility function to render HTML nodes.        |
+| `useHTML`         | `Hook`     | Hook to get the HTML provider context and configuration. |
+| `useHTMLRenderer` | `Hook`     | Hook to obtain a pre-configured HTML renderer function.  |
+
+### Markdown Utilities (astro-intlayer/markdown)
+
+Import:
+
+```tsx
+import {
+  compileMarkdown,
+  renderMarkdown,
+  parseMarkdown,
+  useMarkdown,
+  useMarkdownRenderer,
+} from "astro-intlayer/markdown";
+```
+
+| Export                | Type       | Description                                                 |
+| --------------------- | ---------- | ----------------------------------------------------------- |
+| `compileMarkdown`     | `Function` | Compiles markdown strings into structured representation.   |
+| `renderMarkdown`      | `Function` | Renders markdown content into output nodes.                 |
+| `parseMarkdown`       | `Function` | Parses raw markdown content into an AST.                    |
+| `useMarkdown`         | `Hook`     | Hook to get the markdown provider context.                  |
+| `useMarkdownRenderer` | `Hook`     | Hook to obtain a pre-configured Markdown renderer function. |
+
+### Types
+
+Import:
+
+```tsx
+import type {
+  IntlayerLocals,
+  UseLocaleProps,
+  UseLocaleResult,
+} from "astro-intlayer";
+```
+
+| Type              | Description                                                                                                  |
+| ----------------- | ------------------------------------------------------------------------------------------------------------ |
+| `IntlayerLocals`  | The object attached to `Astro.locals.intlayer` containing `locale`, `defaultLocale`, and `availableLocales`. |
+| `UseLocaleProps`  | Optional configuration properties accepted by `useLocale()`.                                                 |
+| `UseLocaleResult` | The return type of `useLocale()`, providing locale properties and update methods.                            |