| name | intlayer-content |
| description | Define rich content structures using Intlayer content nodes. Use when the user asks to "create translations", "handle pluralization", "use markdown in content", or implement "conditional content". Use when this capability is needed. |
| metadata | {"author":"aymericzip"} |
Intlayer Content Nodes
Define rich and dynamic content using Intlayer functions. Use the reference below for each node type.
Translation (t)
Define multilingual content mapped to locales.
Doc
import { t } from "intlayer";
const content = t({
en: "Hello",
fr: "Bonjour",
es: "Hola",
});
Find locales to declare in config file. Supported configuration files:
intlayer.config.{ts|js|json|json5|jsonc|cjs|mjs}
.intlayerrc
Enumeration (enu)
Map content to specific keys, numbers, or ranges (useful for pluralization).
Doc
import { enu } from "intlayer";
const carCount = enu({
"0": "No cars",
"1": "One car",
">1": "Multiple cars",
fallback: "Unknown amount",
});
Condition (cond)
Define content based on a boolean condition.
Doc
import { cond } from "intlayer";
const isLoggedIn = cond({
true: "Welcome back!",
false: "Please log in",
fallback: "Status unknown",
});
Markdown (md)
Define rich text using Markdown syntax.
Doc
import { md } from "intlayer";
const article = md("# Title\n\nSome **bold** text.");
HTML (html)
Define HTML content, optionally with custom components.
Doc
import { html } from "intlayer";
const richText = html("<p>Hello <strong>World</strong></p>");
Nesting (nest)
Reuse content from another dictionary.
Doc
import { nest } from "intlayer";
const fullRef = nest("other_dictionary_key");
const partialRef = nest("other_dictionary_key", "path.to.value");
Function Fetching
Execute logic to generate content (synchronous or asynchronous).
Doc
const computed = () => `Current time: ${new Date().toISOString()}`;
const fetched = async () => {
const data = await fetch("/api/data").then((res) => res.json());
return data.message;
};
Insertion (insert)
Define dynamic content with variables.
Doc
import { insert } from "intlayer";
const welcome = insert("Hello {{name}}!");
File (file)
Reference external files as content.
Doc
import { file } from "intlayer";
const myFile = file("./path/to/file.txt");
Gender (gender)
Define content based on gender ('male', 'female', etc.).
Doc
import { gender } from "intlayer";
const greeting = gender({
male: "Welcome sir",
female: "Welcome madam",
fallback: "Welcome",
});
Example Directory Structure (react)
src/
├── components/
│ ├── MyComponent/
│ │ ├── index.content.ts # Content declaration
│ │ └── index.tsx # Component
│ ├── myOtherComponent.content.ts # Content declaration
│ └── MyOtherComponent.tsx # Component
Content Templates
TypeScript (.content.ts)
import { t, type Dictionary } from "intlayer";
const content = {
key: "my-component-key",
content: {
title: "...",
},
} satisfies Dictionary;
export default content;
TypeScript with React (.content.tsx)
import { t, type Dictionary } from "intlayer";
import { ReactNode } from "react";
const content = {
key: "my-component-key",
content: {
title: <>My React Node</>,
},
} satisfies Dictionary;
export default content;
{
"key": "my-component-key",
"content": {
"title": "..."
}
}
import { t } from "intlayer";
const content = {
key: "my-component-key",
content: {
title: "...",
},
};
export default content;
Content declaration combination
Nodes can be imbricated for complex logic.
import {
cond,
enu,
file,
gender,
insert,
html,
md,
nest,
t,
type Dictionary,
} from "intlayer";
const content = {
key: "test",
title: "Test component content",
description:
"Content declarations for the Test component, including examples of plurals, conditions, gender-specific messages, dynamic insertions, markdown, file-based content and nested dictionaries used for demonstration and testing purposes.",
content: {
baseContent: "Intlayer",
welcomeMessage: t({
en: "Welcome to our application",
"en-GB": "Welcome to our application",
fr: "Bienvenue dans notre application",
es: "Bienvenido a nuestra aplicación",
}),
numberOfCar: enu({
"<-1": "Less than minus one car",
"-1": "Minus one car",
"0": "No cars",
"1": "One car",
">19": "Many cars",
">5": "Some cars",
fallback: ,
}),
: ({
: ,
: ,
: ,
}),
: ({
: ,
: ,
: ,
}),
: (
),
: (
({
: ,
: ,
: ,
: ,
})
),
: (),
: {
: ,
: ,
},
: (),
: (, ),
: (),
: (()),
: ({
: (),
: (),
: (),
: (),
}),
: (),
: (()),
: [, , ],
: [
{
: ,
: ,
},
{
: ,
: ,
},
],
: {
: [, , ],
: {
: ,
: ,
},
},
},
: [, ],
} ;
content;
Type validation of dictionary
Dictionary<{ title: string; description?: string }>;
Key Dictionary Fields for AI Management
Core Metadata
- key: The identifier for the dictionary (e.g.,
about-page-meta). AI can ensure consistent naming conventions.
- title: A human-readable name for identification in the CMS or editor.
- description: Provides context for the dictionary. AI uses this to understand the purpose and generate better translations or content.
- tags: Categorization strings (e.g.,
metadata, SEO) to help organize and filter dictionaries.
Content & Localization
- locale: Specifies the language of the content for (per-locale file)[references/concept_per-locale-file.md]
- contentAutoTransformation: A toggle to automatically convert raw strings into specialized formats like Markdown, HTML, or Insertions (variables).
- fill: An instruction indicating whether the dictionary should be automatically populated by AI/automation tools.
Behaviorals Settings
- priority: A numeric value used to resolve conflicts during merge of dictionaries under a same key.
- importMode: Defines how content is loaded (
static, dynamic, or live). AI can recommend the best mode based on performance needs.
- location: Controls CMS synchronization (
hybrid, remote, local). AI can manage where the source of truth resides.
- schema: string that use zod schema declared in config file to validate data
References
Source: aymericzip/intlayer — distributed by TomeVault.