Current File : /var/www/wordpress/wp-content/plugins/oxygen/i18n.md
# Internationalization in the Breakdance
The builder uses WordPress's i18n system (`wp.i18n`) with the "breakdance" text domain set by default.
## Translation Functions
All functions are available in templates and TypeScript (import from `@/lib/i18n` or use via `this`):
- **`__()`** - Simple translation: `__("Hello World")`
- **`_x()`** - Translation with context: `_x("Post", "button label")`
- **`_nx()`** - Plural translation: `_nx("1 item", "%s items", count, "context")`
- **`sprintf()`** - String formatting: `sprintf(__("Welcome, %s!"), userName)`
- **`_doc()`** - Translation with explanation (for translators): `_doc("ID %s", "%s: ID number")`
- **`_xdoc()`** - Combined context and documentation: `_xdoc("Post", "button", "Action button")`
## Usage Examples
**In Vue templates:**
```vue
<template>
<div>
<h1>{{ __("Page Title") }}</h1>
<p>{{ sprintf(__("Welcome, %s!"), userName) }}</p>
<span>{{ _doc("ID %s", "%s: ID number") }}</span>
</div>
</template>
```
> **Note:** Translation functions are automatically available in templates via the global `i18nMixin`, so no imports are needed.
**In TypeScript:**
```typescript
import { __, sprintf } from "@/lib/i18n";
@Component
export default class MyComponent extends Vue {
get message() {
return sprintf(__("Count: %s"), this.count);
}
}
```
## Translation Extraction
Strings are automatically extracted during development and build from `.vue` and `.ts` files.
## Key Files
- `builder/src/lib/i18n/index.ts` - Core i18n functions
- `builder/src/util/mixins.ts` - `i18nMixin` for Vue components
- `build-tools/extract-translations.js` - String extraction tool
- `plugin/loader/loader-utils.php` - PHP translation loading
## Best Practices
1. Always use translation functions for user-facing strings
2. Use `_x()` for ambiguous strings that need context
3. Use `sprintf()` for formatting (not string concatenation)
4. Use `_doc()` to document complex strings for translators