@intlayer/docs 7.0.0-canary.2 → 7.0.0

package/docs/en/configuration.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-08-13
-updatedAt: 2025-10-21
+updatedAt: 2025-10-25
 title: Configuration
 description: Learn how to configure Intlayer for your application. Understand the various settings and options available to customize Intlayer to your needs.
 keywords:
@@ -14,6 +14,9 @@ slugs:
   - concept
   - configuration
 history:
+  - version: 7.0.0
+    date: 2025-10-25
+    changes: Add `dictionary` configuration
   - version: 7.0.0
     date: 2025-10-21
     changes: Replace `middleware` by `routing` configuration
@@ -77,11 +80,14 @@ const config: IntlayerConfig = {
     locales: [Locales.ENGLISH],
   },
   content: {
-    autoFill: "./{{fileName}}.content.json",
     contentDir: ["src", "../ui-library"],
   },
-  middleware: {
-    noPrefix: false,
+  dictionary: {
+    fill: "./{{fileName}}.content.json",
+  },
+  routing: {
+    mode: "prefix-no-default",
+    storage: "cookie",
   },
   editor: {
     applicationURL: "https://example.com",
@@ -109,8 +115,9 @@ const config = {
   content: {
     contentDir: ["src", "../ui-library"],
   },
-  middleware: {
-    noPrefix: false,
+  routing: {
+    mode: "prefix-no-default",
+    storage: "cookie",
   },
   editor: {
     applicationURL: "https://example.com",
@@ -135,8 +142,12 @@ module.exports = config;
   "content": {
     "contentDir": ["src", "../ui-library"],
   },
-  "middleware": {
-    "noPrefix": false,
+  "dictionary": {
+    "fill": "./{{fileName}}.content.json",
+  },
+  "routing": {
+    "mode": "prefix-no-default",
+    "storage": "cookie",
   },
   "editor": {
     "applicationURL": "https://example.com",
@@ -287,15 +298,6 @@ Defines settings related to the integrated editor, including server port and act
   - _Example_: `'https://example.com'`
   - _Note_: Point to localhost by default but can be changed to any URL in the case of a remote live sync server.
 
-- **formatCommand**:
-  - _Type_: `string`
-  - _Default_: `undefined`
-  - _Description_: The command to format the content. When intlayer write your .content files locally, this command will be used to format the content.
-  - _Example_: `'npx prettier --write "{{file}}" --log-level silent'` Using Prettier
-  - _Example_: `'npx biome format "{{file}}" --write --log-level none'` Using Biome
-  - _Example_: `'npx eslint --fix "{{file}}"  --quiet'` Using ESLint
-  - _Note_: Intlayer will replace the {{file}} with the path of the file to format.
-
 ### Routing Configuration
 
 Settings that control routing behavior, including URL structure, locale storage, and middleware handling.
@@ -371,30 +373,6 @@ Settings that control routing behavior, including URL structure, locale storage,
     - The URL will be `https://example.com/my-app/en`
     - If the base path is not set, the URL will be `https://example.com/en`
 
-- **detectLocaleOnPrefetchNoPrefix**:
-  - _Type_: `boolean`
-  - _Default_: `false`
-  - _Description_: Controls whether locale detection occurs during Next.js prefetch requests.
-  - _Example_: `true`
-  - _Note_: This setting affects how Next.js handles locale prefetching:
-    - **Example scenario:**
-      - User's browser language is `'fr'`
-      - Current page is `/fr/about`
-      - Link prefetches `/about`
-    - **With `detectLocaleOnPrefetchNoPrefix: true`:**
-      - Prefetch detects `'fr'` locale from browser
-      - Redirects prefetch to `/fr/about`
-    - **With `detectLocaleOnPrefetchNoPrefix: false` (default):**
-      - Prefetch uses default locale
-      - Redirects prefetch to `/en/about` (assuming `'en'` is default)
-    - **When to use `true`:**
-      - Your app uses non-localized internal links (e.g. `<a href="/about">`)
-      - You want consistent locale detection behavior between regular and prefetch requests
-    - **When to use `false` (default):**
-      - Your app uses locale-prefixed links (e.g. `<a href="/fr/about">`)
-      - You want to optimize prefetching performance
-      - You want to avoid potential redirect loops
-
 #### Cookie Attributes
 
 When using cookie storage, you can configure additional cookie attributes:
@@ -432,7 +410,6 @@ export default defineConfig({
     storage: "localStorage",
     headerName: "x-intlayer-locale",
     basePath: "",
-    detectLocaleOnPrefetchNoPrefix: false,
   },
 });
 ```
@@ -463,7 +440,6 @@ export default defineConfig({
     ],
     headerName: "x-intlayer-locale",
     basePath: "",
-    detectLocaleOnPrefetchNoPrefix: false,
   },
 });
 ```
@@ -482,7 +458,6 @@ export default defineConfig({
     storage: "localStorage",
     headerName: "x-intlayer-locale",
     basePath: "",
-    detectLocaleOnPrefetchNoPrefix: false,
   },
 });
 ```
@@ -504,7 +479,6 @@ export default defineConfig({
     },
     headerName: "x-custom-locale",
     basePath: "/my-app",
-    detectLocaleOnPrefetchNoPrefix: true,
   },
 });
 ```
@@ -517,19 +491,6 @@ Settings related to content handling within the application, including directory
 
 #### Properties
 
-- **fill**:
-  - _Type_: `boolean | string | { [key in Locales]?: string }`
-  - _Default_: `undefined`
-  - _Description_: Indicate how the content should be automatically filled using AI. Can be declared globally in the `intlayer.config.ts` file.
-  - _Example_: true
-  - _Example_: `'./{{fileName}}.content.json'`
-  - _Example_: `{ fr: './{{fileName}}.fr.content.json', es: './{{fileName}}.es.content.json' }`
-  - _Note_: The auto fill configuration. It can be:
-    - `true`: Rewrites the current file with filled content for all locales
-    - `false`: Disables auto-fill completely
-    - `string`: Path to a single file or template with variables (fills the specified file without modifying the current one)
-    - `object`: Per-locale file paths
-
 - **watch**:
   - _Type_: `boolean`
   - _Default_: `process.env.NODE_ENV === 'development'`
@@ -597,6 +558,40 @@ Settings related to content handling within the application, including directory
   - _Description_: Directories excluded from content search.
   - _Note_: This setting is not yet used, but planned for future implementation.
 
+- **formatCommand**:
+  - _Type_: `string`
+  - _Default_: `undefined`
+  - _Description_: The command to format the content. When intlayer write your .content files locally, this command will be used to format the content.
+  - _Example_: `'npx prettier --write "{{file}}" --log-level silent'` Using Prettier
+  - _Example_: `'npx biome format "{{file}}" --write --log-level none'` Using Biome
+  - _Example_: `'npx eslint --fix "{{file}}"  --quiet'` Using ESLint
+  - _Note_: Intlayer will replace the {{file}} with the path of the file to format.
+  - _Note_: If not set, Intlayer will try to detect the format command automatically. By trying to resolve the following commands: prettier, biome, eslint.
+
+### Dictionary Configuration
+
+Settings that control dictionary operations, including auto-fill behavior and content generation.
+
+This dictionary configuration serves two main purposes:
+
+1. **Default Values**: Define default values when creating content declaration files
+2. **Fallback Behavior**: Provide fallback values when specific fields are not defined, allowing you to define dictionary operation behavior globally
+
+For more information about content declaration files and how configuration values are applied, see the [Content File Documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/dictionary/content_file.md).
+
+#### Properties
+
+- **fill**
+- **description**
+- **locale**
+- **priority**
+- **live**
+- **title**
+- **tags**
+- **version**
+
+---
+
 ### Logger Configuration
 
 Settings that control the logger, including the prefix to use.

package/docs/en/intlayer_with_nextjs_15.md

@@ -1,6 +1,6 @@
 ---
-createdAt: 2024-12-06
-updatedAt: 2025-10-09
+createdAt: 2025-10-25
+updatedAt: 2025-10-25
 title: How to translate your Next.js 15 app – i18n guide 2025
 description: Discover how to make your Next.js 15 website multilingual. Follow the documentation to internationalize (i18n) and translate it.
 keywords:
@@ -18,6 +18,9 @@ slugs:
 applicationTemplate: https://github.com/aymericzip/intlayer-next-15-template
 youtubeVideo: https://www.youtube.com/watch?v=e_PPG7PTqGU
 history:
+  - version: 7.0.0
+    date: 2025-10-25
+    changes: Added mention of `withIntlayerSync()` function
   - version: 6.2.0
     date: 2025-10-09
     changes: Added docs for `useLocale` hook with `onLocaleChange` option

package/docs/en/intlayer_with_nextjs_16.md

@@ -130,7 +130,7 @@ const config = {
 module.exports = config;
 ```
 
-> Through this configuration file, you can set up localized URLs, middleware redirection, cookie names, the location and extension of your content declarations, disable Intlayer logs in the console, and more. For a complete list of available parameters, refer to the [configuration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/configuration.md).
+> Through this configuration file, you can set up localized URLs, proxy redirection, cookie names, the location and extension of your content declarations, disable Intlayer logs in the console, and more. For a complete list of available parameters, refer to the [configuration documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/configuration.md).
 
 ### Step 3: Integrate Intlayer in Your Next.js Configuration
 
@@ -290,7 +290,7 @@ module.exports = LocaleLayout;
 
 > The `[locale]` path segment is used to define the locale. Example: `/en-US/about` will refer to `en-US` and `/fr/about` to `fr`.
 
-> At this stage, you will encounter the error: `Error: Missing <html> and <body> tags in the root layout.`. This is expected because the `/app/page.tsx` file is no longer in use and can be removed. Instead, the `[locale]` path segment will activate the `/app/[locale]/page.tsx` page. Consequently, pages will be accessible via paths like `/en`, `/fr`, `/es` in your browser. To set the default locale as the root page, refer to the `middleware` setup in step 7.
+> At this stage, you will encounter the error: `Error: Missing <html> and <body> tags in the root layout.`. This is expected because the `/app/page.tsx` file is no longer in use and can be removed. Instead, the `[locale]` path segment will activate the `/app/[locale]/page.tsx` page. Consequently, pages will be accessible via paths like `/en`, `/fr`, `/es` in your browser. To set the default locale as the root page, refer to the `proxy` setup in step 7.
 
 Then, implement the `generateStaticParams` function in your application Layout.
 
@@ -637,7 +637,7 @@ const ServerComponentExample = () => {
 
 ### (Optional) Step 7: Configure Proxy for Locale Detection
 
-Set up middleware to detect the user's preferred locale:
+Set up proxy to detect the user's preferred locale:
 
 ```typescript fileName="src/proxy.ts" codeFormat="typescript"
 export { intlayerProxy as proxy } from "next-intlayer/proxy";
@@ -1488,7 +1488,7 @@ export const myServerAction = async () => {
 
 > The `getLocale` function follows a cascading strategy to determine the user's locale:
 >
-> 1. First, it checks the request headers for a locale value that may have been set by the middleware
+> 1. First, it checks the request headers for a locale value that may have been set by the proxy
 > 2. If no locale is found in headers, it looks for a locale stored in cookies
 > 3. If no cookie is found, it attempts to detect the user's preferred language from their browser settings
 > 4. As a last resort, it falls back to the application's configured default locale

package/docs/en/releases/v7.md

@@ -26,6 +26,7 @@ Welcome to Intlayer v7! This major release introduces significant improvements i
 
 ## Highlights
 
+- Next.js 16 support
 - Caching strategy for faster builds
 - Improved TypeScript type generation with locale-specific types
 - Bundle optimization: Locales as strings instead of enum
@@ -35,10 +36,12 @@ Welcome to Intlayer v7! This major release introduces significant improvements i
 - 30% smaller Visual Editor package size
 - Enhanced middleware configuration options
 - Updated fill command behavior for better content management
+- New dictionary configuration section for better organization
 - Enhanced stability with complete content declaration file updates
 - Intelligent retry management for translation accuracy
 - Parallelization for faster translation processing
 - Smart chunking to handle large files within AI context limits
+- Automatic code formatting with configurable formatCommand
 
 ---
 
@@ -247,6 +250,127 @@ This results in faster download times and improved runtime performance for your
 
 ---
 
+## Automatic Code Formatting: formatCommand configuration
+
+v7 introduces the `formatCommand` option in the editor configuration, allowing you to automatically format content files when they are written by Intlayer. This ensures consistent code style and formatting across your content declaration files.
+
+If not set, Intlayer will try to detect the format command automatically. By trying to resolve the following commands: prettier, biome, eslint.
+
+### Configuration
+
+The `formatCommand` option accepts a string template where `{{file}}` will be replaced with the actual file path:
+
+```typescript
+// intlayer.config.ts
+export default {
+  content: {
+    formatCommand: 'bun x biome format "{{file}}" --write --log-level none',
+  },
+};
+```
+
+### Supported formatters
+
+You can use any code formatter that accepts file paths as arguments:
+
+**Using Biome:**
+
+```typescript
+formatCommand: 'bun x biome format "{{file}}" --write --log-level none';
+```
+
+**Using Prettier:**
+
+```typescript
+formatCommand: 'npx prettier --write "{{file}}" --log-level silent';
+```
+
+**Using ESLint:**
+
+```typescript
+formatCommand: 'npx eslint --fix "{{file}}" --quiet';
+```
+
+**Using Bun's built-in formatter:**
+
+```typescript
+formatCommand: 'bun format "{{file}}"';
+```
+
+### Benefits
+
+- **Consistent formatting**: All content files are automatically formatted according to your project's style guidelines
+- **Developer experience**: No need to manually format files after Intlayer writes them
+- **Team consistency**: Ensures all team members have the same formatting applied to content files
+- **CI/CD integration**: Content files maintain consistent formatting in automated workflows
+
+### How it works
+
+When Intlayer writes or updates a content declaration file (`.content.ts`, `.content.js`, etc.), it automatically runs the specified format command on the file. The `{{file}}` placeholder is replaced with the actual file path, and the command is executed in the project's base directory.
+
+---
+
+## Dictionary Configuration: Better organization and structure
+
+v7 introduces a new dedicated `dictionary` configuration section that provides better organization for dictionary-related settings and improved content management.
+
+### New dictionary configuration structure
+
+The `fill` property has been moved from the `content` section to a new `dictionary` section, providing clearer separation of concerns:
+
+**v6 configuration:**
+
+```typescript
+export default {
+  content: {
+    autoFill: "./{{fileName}}.content.json",
+    contentDir: ["src"],
+  },
+};
+```
+
+**v7 configuration:**
+
+```typescript
+export default {
+  content: {
+    contentDir: ["src"],
+  },
+  dictionary: {
+    fill: "./{{fileName}}.content.json",
+  },
+};
+```
+
+### Benefits of the new structure
+
+- **Clearer organization**: Dictionary-specific settings are now grouped together
+- **Better separation of concerns**: Content discovery vs. dictionary operations are clearly separated
+- **Enhanced maintainability**: Easier to understand and modify dictionary-related configurations
+- **Future extensibility**: The dictionary section can accommodate additional dictionary-specific settings
+- **Comprehensive dictionary management**: Includes properties like `title`, `live`, `priority`, `tags`, `version`, and `description` for creating and managing new dictionaries
+
+### Configuration usage
+
+The dictionary configuration serves two main purposes:
+
+1. **Default Values**: Define default values when creating content declaration files
+2. **Fallback Behavior**: Provide fallback values when specific fields are not defined, allowing you to define dictionary operation behavior globally
+
+The dictionary section includes comprehensive properties for dictionary management:
+
+- **`fill`**: Auto-fill behavior for content generation
+- **`title`**: Default title for new dictionaries
+- **`live`**: Live sync configuration for real-time updates
+- **`priority`**: Priority settings for dictionary resolution
+- **`tags`**: Default tags for content organization
+- **`version`**: Version management for dictionary updates
+- **`description`**: Default description for new content
+
+For more information about content declaration files and how configuration values are applied, see the [Content File Documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/dictionary/content_file.md).
+
+---
+
 ## Fill command: Updated behavior for better content management
 
 v7 introduces improved behavior for the `fill` command, providing more predictable and flexible content management:
@@ -394,13 +518,17 @@ The system automatically:
 - **`middleware.prefixDefault`**: Replaced by `routing.mode`
 - **`middleware.noPrefix`**: Replaced by `routing.mode`
 
+### New configurations
+
+- **`editor.formatCommand`**: New option for automatic code formatting of content files
+
 ### Migration mapping
 
 #### Configuration mapping
 
 | v6 Configuration           | v7 Configuration                                     |
 | -------------------------- | ---------------------------------------------------- |
-| `autoFill: xxx`            | `fill: xxx`                                          |
+| `content.autoFill: xxx`    | `dictionary.fill: xxx`                               |
 | `prefixDefault: false`     | `mode: 'prefix-no-default'`                          |
 | `prefixDefault: true`      | `mode: 'prefix-all'`                                 |
 | `noPrefix: true`           | `mode: 'no-prefix'`                                  |
@@ -413,6 +541,10 @@ The system automatically:
 
 ```typescript
 export default {
+  content: {
+    autoFill: "./{{fileName}}.content.json",
+    contentDir: ["src"],
+  },
   middleware: {
     headerName: "x-intlayer-locale",
     cookieName: "intlayer-locale",
@@ -428,12 +560,20 @@ export default {
 
 ```typescript
 export default {
+  content: {
+    contentDir: ["src"],
+  },
+  dictionary: {
+    fill: "./{{fileName}}.content.json",
+  },
   routing: {
     mode: "prefix-no-default",
     storage: "localStorage", // or 'cookie' if you need cookie storage
     headerName: "x-intlayer-locale",
     basePath: "",
-    detectLocaleOnPrefetchNoPrefix: false,
+  },
+  editor: {
+    formatCommand: 'bun x biome format "{{file}}" --write --log-level none', // Optional: automatic formatting
   },
 };
 ```

package/docs/en-GB/configuration.md

@@ -65,8 +65,9 @@ const config: IntlayerConfig = {
     autoFill: "./{{fileName}}.content.json",
     contentDir: ["src", "../ui-library"],
   },
-  middleware: {
-    noPrefix: false,
+  routing: {
+    mode: "prefix-no-default",
+    storage: "cookie",
   },
   editor: {
     applicationURL: "https://example.com",
@@ -95,8 +96,9 @@ const config = {
   content: {
     contentDir: ["src", "../ui-library"],
   },
-  middleware: {
-    noPrefix: false,
+  routing: {
+    mode: "prefix-no-default",
+    storage: "cookie",
   },
   editor: {
     applicationURL: "https://example.com",
@@ -121,8 +123,9 @@ module.exports = config;
   "content": {
     "contentDir": ["src", "../ui-library"],
   },
-  "middleware": {
-    "noPrefix": false,
+  "routing": {
+    "mode": "prefix-no-default",
+    "storage": "cookie",
   },
   "editor": {
     "applicationURL": "https://example.com",
@@ -333,30 +336,6 @@ Settings that control middleware behaviour, including how the application handle
       - If `noPrefix = false`: URL will be `https://example.com/my-app/en`
       - If `noPrefix = true`: URL will be `https://example.com`
 
-- **detectLocaleOnPrefetchNoPrefix**:
-  - _Type_: `boolean`
-  - _Default_: `false`
-  - _Description_: Controls whether locale detection occurs during Next.js prefetch requests.
-  - _Example_: `true`
-  - _Note_: This setting affects how Next.js handles locale prefetching:
-    - **Example scenario:**
-      - User's browser language is `'fr'`
-      - Current page is `/fr/about`
-      - Link prefetches `/about`
-    - **With `detectLocaleOnPrefetchNoPrefix: true`:**
-      - Prefetch detects `'fr'` locale from browser
-      - Redirects prefetch to `/fr/about`
-    - **With `detectLocaleOnPrefetchNoPrefix: false` (default):**
-      - Prefetch uses default locale
-      - Redirects prefetch to `/en/about` (assuming `'en'` is default)
-    - **When to use `true`:**
-      - Your app uses non-localised internal links (e.g. `<a href="/about">`)
-      - You want consistent locale detection behaviour between regular and prefetch requests
-    - **When to use `false` (default):**
-      - Your app uses locale-prefixed links (e.g. `<a href="/fr/about">`)
-      - You want to optimise prefetching performance
-      - You want to avoid potential redirect loops
-
 ---
 
 ### Content Configuration