@intlayer/docs 7.5.0-canary.0 → 7.5.0

package/docs/de/intlayer_with_nextjs_16.md

@@ -27,7 +27,7 @@ history:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="Die beste i18n-Lösung für Next.js? Entdecken Sie Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/e_PPG7PTqGU?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="Die beste i18n-Lösung für Next.js? Entdecken Sie Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/e_PPG7PTqGU?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/de/intlayer_with_nuxt.md

@@ -49,7 +49,7 @@ Mit Intlayer können Sie:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="Wie übersetzt man seine Nuxt- und Vue-App mit Intlayer? Entdecken Sie Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/nhUcUAVQ6eQ?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="Wie übersetzt man seine Nuxt- und Vue-App mit Intlayer? Entdecken Sie Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/nhUcUAVQ6eQ?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/de/intlayer_with_react_router_v7.md

@@ -85,7 +85,7 @@ pnpm add vite-intlayer --save-dev
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="How to translate your React Router v7 app using Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="How to translate your React Router v7 app using Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/de/intlayer_with_react_router_v7_fs_routes.md

@@ -54,7 +54,7 @@ Mit Intlayer können Sie:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="How to translate your React Router v7 (File-System Routes) app using Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="How to translate your React Router v7 (File-System Routes) app using Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/de/intlayer_with_tanstack.md

@@ -57,7 +57,7 @@ Mit Intlayer können Sie:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="Die beste i18n-Lösung für Tanstack Start? Entdecken Sie Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/_XTdKVWaeqg?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="Die beste i18n-Lösung für Tanstack Start? Entdecken Sie Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/_XTdKVWaeqg?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/de/intlayer_with_vite+react.md

@@ -47,7 +47,7 @@ Mit Intlayer können Sie:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="The best i18n solution for Vite and React? Discover Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?si=VaKmrYMmXjo3xpk2"/>
+<iframe title="The best i18n solution for Vite and React? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?si=VaKmrYMmXjo3xpk2"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/de/intlayer_with_vite+vue.md

@@ -44,7 +44,7 @@ Mit Intlayer können Sie:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="The best i18n solution for Vite and Vue? Discover Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/IE3XWkZ6a5U?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="The best i18n solution for Vite and Vue? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/IE3XWkZ6a5U?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/de/plugins/sync-json.md

@@ -34,7 +34,7 @@ history:
 
 # Sync JSON (i18n-Brücken) - Sync JSON mit ICU / i18next-Unterstützung
 
-<iframe title="Wie Sie Ihre JSON-Übersetzungen mit Intlayer synchronisiert halten" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/MpGMxniDHNg?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="Wie Sie Ihre JSON-Übersetzungen mit Intlayer synchronisiert halten" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/MpGMxniDHNg?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
 Verwenden Sie Intlayer als Ergänzung zu Ihrem bestehenden i18n-Stack. Dieses Plugin hält Ihre JSON-Nachrichten mit den Intlayer-Wörterbüchern synchron, sodass Sie:
 

package/docs/en/cli/index.md

@@ -103,6 +103,10 @@ To see how to configure available locales, or other parameters, refer to the [co
 
 ## Run intlayer commands
 
+### Authentication
+
+- **[Login](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/login.md)** - Authenticate with the Intlayer CMS and get access credentials
+
 ### Core Commands
 
 - **[Build Dictionaries](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/cli/build.md)** - Build your dictionaries from content declaration files
@@ -144,6 +148,7 @@ To see how to configure available locales, or other parameters, refer to the [co
 
 ```json fileName="package.json"
 "scripts": {
+  "intlayer:login": "npx intlayer login",
   "intlayer:build": "npx intlayer build",
   "intlayer:watch": "npx intlayer build --watch",
   "intlayer:push": "npx intlayer push",

package/docs/en/cli/login.md

@@ -0,0 +1,157 @@
+---
+createdAt: 2025-12-16
+updatedAt: 2025-12-16
+title: CLI - Login
+description: Learn how to use the Intlayer CLI login command to authenticate with the Intlayer CMS and obtain access credentials.
+keywords:
+  - CLI
+  - Login
+  - Authentication
+  - CMS
+  - Intlayer
+  - Credentials
+slugs:
+  - doc
+  - concept
+  - cli
+  - login
+---
+
+# Intlayer CLI Login Command
+
+---
+
+## Description
+
+The `login` command of the Intlayer CLI allows you to authenticate with the Intlayer CMS. This command automatically opens your default browser to complete the authentication process and receive the necessary credentials (Client ID and Client Secret) to use Intlayer services.
+
+## Usage
+
+```bash
+npx intlayer login [options]
+```
+
+or
+
+```bash
+intlayer login [options]
+```
+
+## Options
+
+### `--cms-url <url>`
+
+Specify the URL of the Intlayer CMS to connect to for authentication.
+
+- **Type**: `string`
+- **Default**: The value configured in `intlayer.config.*` or `https://intlayer.org`
+- **Example**:
+
+```bash
+npx intlayer login --cms-url https://intlayer.org
+```
+
+### Configuration Options
+
+You can also use common configuration options:
+
+- `--env-file <path>`: Path to the environment file
+- `-e, --env <env>`: Execution environment
+- `--base-dir <dir>`: Base directory of the project
+- `--verbose`: Enable detailed output (default: true)
+- `--prefix <prefix>`: Prefix for logs
+
+## How It Works
+
+1. **Local Server Start**: The command starts a local HTTP server on a random port to receive credentials from the CMS
+2. **Browser Opening**: The command automatically opens your default browser to the CMS login URL
+3. **Authentication**: Complete authentication in the browser using your Intlayer account
+4. **Credentials Reception**: The local server receives the Client ID and Client Secret from the CMS
+5. **Instructions**: The command displays instructions for configuring credentials in your project
+
+## Output
+
+After a successful login, the command will display:
+
+1. **The received credentials** (Client ID and Client Secret)
+2. **Instructions for the `.env` file**:
+
+```bash
+INTLAYER_CLIENT_ID=your_client_id
+INTLAYER_CLIENT_SECRET=your_client_secret
+```
+
+3. **Instructions for the Intlayer configuration file**:
+
+```typescript
+{
+  editor: {
+    cmsURL: 'https://intlayer.org',
+    clientId: process.env.INTLAYER_CLIENT_ID,
+    clientSecret: process.env.INTLAYER_CLIENT_SECRET,
+  },
+}
+```
+
+## Manual Configuration
+
+If the browser doesn't open automatically, you can manually visit the URL displayed in the terminal.
+
+## Examples
+
+### Login with Custom CMS URL
+
+```bash
+npx intlayer login --cms-url https://custom-cms.example.com
+```
+
+### Login with Specific Environment File
+
+```bash
+npx intlayer login --env-file .env.production
+```
+
+### Login in Verbose Mode
+
+```bash
+npx intlayer login --verbose
+```
+
+## Troubleshooting
+
+### Browser Doesn't Open
+
+If the browser doesn't open automatically, copy the URL displayed in the terminal and open it manually in your browser.
+
+### Connection Issues
+
+If you encounter connection issues, verify:
+
+1. That the CMS URL is correct
+2. That your internet connection is working properly
+3. That there are no firewalls blocking the connection
+
+### Credentials Not Received
+
+If credentials are not received:
+
+1. Make sure you completed the authentication process in the browser
+2. Verify that the local port is not blocked
+3. Try the command again
+
+## Next Steps
+
+After completing the login:
+
+1. Add the credentials to your `.env` file
+2. Configure your `intlayer.config.*` file with the credentials
+3. Use CLI commands to manage your dictionaries:
+   - [`npx intlayer push`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/cli/push.md) - Push dictionaries to the CMS
+   - [`npx intlayer pull`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/cli/pull.md) - Pull dictionaries from the CMS
+   - [`npx intlayer fill`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/cli/fill.md) - Fill missing translations
+
+## See Also
+
+- [CLI Documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/cli/index.md)
+- [Intlayer Configuration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/configuration.md)
+- [Intlayer CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_CMS.md)

package/docs/en/configuration.md

@@ -14,6 +14,9 @@ slugs:
   - concept
   - configuration
 history:
+  - version: 7.5.0
+    date: 2025-12-17
+    changes: Add `buildMode` option
   - version: 7.0.0
     date: 2025-10-25
     changes: Add `dictionary` configuration
@@ -103,6 +106,7 @@ const config: IntlayerConfig = {
     applicationContext: "This is a test application",
   },
   build: {
+    mode: "auto",
     importMode: "dynamic",
   },
 };
@@ -668,6 +672,15 @@ Build options apply to the `@intlayer/babel` and `@intlayer/swc` plugins.
 
 #### Properties
 
+- **mode**:
+  - _Type_: `'auto' | 'manual'`
+  - _Default_: `'auto'`
+  - _Description_: Controls the mode of the build.
+  - _Example_: `'manual'`
+  - _Note_: If 'auto', the build will be enabled automatically when the application is built.
+  - _Note_: If 'manual', the build will be set only when the build command is executed.
+  - _Note_: Can be used to disable dictionaries build, for instance when execution on Node.js environment should be avoided.
+
 - **optimize**:
   - _Type_: `boolean`
   - _Default_: `undefined`

package/docs/en/dictionary/content_file.md

@@ -28,7 +28,7 @@ history:
 
 # Content File
 
-<iframe title="i18n, Markdown, JSON… one single solution to manage it all | Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/1VHgSY_j9_I?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="i18n, Markdown, JSON… one single solution to manage it all | Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/1VHgSY_j9_I?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
 ## What is a Content File?
 

package/docs/en/index.md

@@ -98,6 +98,7 @@ We’ve built Intlayer with flexibility in mind, offering seamless integration a
 - **[Intlayer with React CRA](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_create_react_app.md)**
 - **[Intlayer with Vite + React](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_vite+react.md)**
 - **[Intlayer with React Router v7](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_react_router_v7.md)**
+- **[Intlayer with React Router v7 (fs routes)](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_react_router_v7_fs_routes.md)**
 - **[Intlayer with Tanstack Start](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_tanstack.md)**
 - **[Intlayer with React Native and Expo](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_react_native+expo.md)**
 - **[Intlayer with Lynx and React](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_lynx+react.md)**

package/docs/en/intlayer_CMS.md

@@ -31,7 +31,7 @@ history:
 
 # Intlayer Content Management System (CMS) Documentation
 
-<iframe title="Visual Editor + CMS for Your Web App: Intlayer Explained" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/UDDTnirwi_4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="Visual Editor + CMS for Your Web App: Intlayer Explained" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/UDDTnirwi_4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
 The Intlayer CMS is am Application that allows you to externalize your content of an Intlayer project.
 

package/docs/en/intlayer_visual_editor.md

@@ -33,7 +33,7 @@ history:
 
 # Intlayer Visual Editor Documentation
 
-<iframe title="Visual Editor + CMS for Your Web App: Intlayer Explained" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/UDDTnirwi_4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="Visual Editor + CMS for Your Web App: Intlayer Explained" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/UDDTnirwi_4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
 The Intlayer Visual Editor is a tool that will wrap your website to interact with your content declaration files using a visual editor.
 

package/docs/en/intlayer_with_nextjs_15.md

@@ -71,7 +71,7 @@ With Intlayer, you can:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
 
-<iframe title="The best i18n solution for Next.js? Discover Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/e_PPG7PTqGU?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="The best i18n solution for Next.js? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/e_PPG7PTqGU?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/en/intlayer_with_nextjs_16.md

@@ -30,7 +30,7 @@ history:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="The best i18n solution for Next.js? Discover Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/e_PPG7PTqGU?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="The best i18n solution for Next.js? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/e_PPG7PTqGU?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/en/intlayer_with_nuxt.md

@@ -52,7 +52,7 @@ With Intlayer, you can:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="How to translate your Nuxt and Vue app using Intlayer? Discover Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/nhUcUAVQ6eQ?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="How to translate your Nuxt and Vue app using Intlayer? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/nhUcUAVQ6eQ?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/en/intlayer_with_react_router_v7.md

@@ -91,7 +91,7 @@ pnpm add vite-intlayer --save-dev
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="How to translate your React Router v7 app using Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="How to translate your React Router v7 app using Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/en/intlayer_with_react_router_v7_fs_routes.md

@@ -54,7 +54,7 @@ With Intlayer, you can:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="How to translate your React Router v7 (File-System Routes) app using Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="How to translate your React Router v7 (File-System Routes) app using Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/en/intlayer_with_tanstack.md

@@ -66,7 +66,7 @@ With Intlayer, you can:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="The best i18n solution for Tanstack Start? Discover Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/_XTdKVWaeqg?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="The best i18n solution for Tanstack Start? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/_XTdKVWaeqg?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">
@@ -220,17 +220,17 @@ const appContent = {
       }),
     },
     meta: {
+      title: t({
+        en: "Welcome to Intlayer + TanStack Router",
+        es: "Bienvenido a Intlayer + TanStack Router",
+        fr: "Bienvenue à Intlayer + TanStack Router",
+      }),
       description: t({
         en: "This is an example of using Intlayer with TanStack Router",
         es: "Este es un ejemplo de uso de Intlayer con TanStack Router",
         fr: "Ceci est un exemple d'utilisation d'Intlayer avec TanStack Router",
       }),
     },
-    title: t({
-      en: "Welcome to Intlayer + TanStack Router",
-      es: "Bienvenido a Intlayer + TanStack Router",
-      fr: "Bienvenue à Intlayer + TanStack Router",
-    }),
   },
   key: "app",
 } satisfies Dictionary;
@@ -512,10 +512,11 @@ function LayoutComponent() {
   useI18nHTMLAttributes(); // add this line
 
   const { locale } = Route.useParams();
+  const { defaultLocale } = useLocale();
 
   return (
     <IntlayerProvider
-      locale={locale} // If no locale included as a parameter, the default locale will be used
+      locale={locale ?? defaultLocale} // If no locale included as a parameter, the default locale will be used
     >
       <Outlet />
     </IntlayerProvider>

package/docs/en/intlayer_with_vite+preact.md

@@ -1467,8 +1467,7 @@ import { useLocale, useLocation, route } from "preact-intlayer"; // Assuming use
 import type { JSX } from "preact"; // For HTMLAttributes
 import { forwardRef } from "preact/compat"; // For forwarding refs
 
-export interface LocalizedLinkProps
-  extends JSX.HTMLAttributes<HTMLAnchorElement> {
+export interface LocalizedLinkProps extends JSX.HTMLAttributes<HTMLAnchorElement> {
   href: string;
   replace?: boolean; // Optional: to replace history state
 }

package/docs/en/intlayer_with_vite+react.md

@@ -47,7 +47,7 @@ With Intlayer, you can:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="The best i18n solution for Vite and React? Discover Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?si=VaKmrYMmXjo3xpk2"/>
+<iframe title="The best i18n solution for Vite and React? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/dS9L7uJeak4?si=VaKmrYMmXjo3xpk2"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/en/intlayer_with_vite+vue.md

@@ -46,7 +46,7 @@ With Intlayer, you can:
 <Tab defaultTab="video">
   <TabItem label="Video" value="video">
   
-<iframe title="The best i18n solution for Vite and Vue? Discover Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/IE3XWkZ6a5U?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="The best i18n solution for Vite and Vue? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/IE3XWkZ6a5U?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </TabItem>
   <TabItem label="Code" value="code">

package/docs/en/plugins/sync-json.md

@@ -34,7 +34,7 @@ history:
 
 # Sync JSON (i18n bridges) - Sync JSON with ICU / i18next support
 
-<iframe title="How to keep your JSON translations in sync with Intlayer" class="m-auto aspect-[16/9] w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/MpGMxniDHNg?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
+<iframe title="How to keep your JSON translations in sync with Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/MpGMxniDHNg?autoplay=0&amp;origin=http://intlayer.org&amp;controls=0&amp;rel=1"/>
 
 Use Intlayer as an add‑on to your existing i18n stack. This plugin keeps your JSON messages in sync with Intlayer dictionaries so you can:
 

package/docs/en-GB/cli/index.md

@@ -103,6 +103,10 @@ To see how to configure available locales, or other parameters, refer to the [co
 
 ## Run intlayer commands
 
+### Authentication
+
+- **[Login](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/cli/login.md)** - Authenticate with the Intlayer CMS and get access credentials
+
 ### Core Commands
 
 - **[Build Dictionaries](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en-GB/cli/build.md)** - Build your dictionaries from content declaration files
@@ -144,6 +148,7 @@ To see how to configure available locales, or other parameters, refer to the [co
 
 ```json fileName="package.json"
 "scripts": {
+  "intlayer:login": "npx intlayer login",
   "intlayer:build": "npx intlayer build",
   "intlayer:watch": "npx intlayer build --watch",
   "intlayer:push": "npx intlayer push",