@bleedingdev/modern-js-create 3.2.0-ultramodern.11 → 3.2.0-ultramodern.13

package/dist/index.js

@@ -561,8 +561,10 @@ const TYPESCRIPT_NATIVE_PREVIEW_VERSION = '7.0.0-dev.20260518.1';
 const OXLINT_VERSION = '1.65.0';
 const OXFMT_VERSION = '0.50.0';
 const ULTRACITE_VERSION = '7.7.0';
+const I18NEXT_VERSION = '26.2.0';
 const REACT_VERSION = '^19.2.6';
 const REACT_DOM_VERSION = '^19.2.6';
+const REACT_I18NEXT_VERSION = '17.0.8';
 const WORKSPACE_PACKAGE_VERSION = 'workspace:*';
 const RSTACK_AGENT_SKILLS_COMMIT = '61c948b42512e223bad44b83af4080eba48b2677';
 const baselineAgentSkills = [
@@ -585,6 +587,7 @@ const effectTsgoTypecheckCommand = "node -e \"const fs = require('node:fs'); con
 const modernPackageNames = [
     '@modern-js/app-tools',
     '@modern-js/plugin-bff',
+    '@modern-js/plugin-i18n',
     '@modern-js/plugin-tanstack',
     '@modern-js/runtime'
 ];
@@ -917,6 +920,7 @@ function modernPackageSpecifier(packageName, packageSource) {
 }
 function appDependencies(scope, packageSource) {
     return {
+        '@modern-js/plugin-i18n': modernPackageSpecifier('@modern-js/plugin-i18n', packageSource),
         '@modern-js/plugin-tanstack': modernPackageSpecifier('@modern-js/plugin-tanstack', packageSource),
         '@modern-js/runtime': modernPackageSpecifier('@modern-js/runtime', packageSource),
         '@module-federation/modern-js-v3': MODULE_FEDERATION_VERSION,
@@ -924,8 +928,10 @@ function appDependencies(scope, packageSource) {
         '@tanstack/react-router': TANSTACK_ROUTER_VERSION,
         [ultramodern_workspace_packageName(scope, 'shared-contracts')]: WORKSPACE_PACKAGE_VERSION,
         [ultramodern_workspace_packageName(scope, 'shared-design-tokens')]: WORKSPACE_PACKAGE_VERSION,
+        i18next: I18NEXT_VERSION,
         react: REACT_VERSION,
-        'react-dom': REACT_DOM_VERSION
+        'react-dom': REACT_DOM_VERSION,
+        'react-i18next': REACT_I18NEXT_VERSION
     };
 }
 function appDevDependencies(packageSource) {
@@ -955,13 +961,14 @@ function createRootPackageJson(scope, packageSource) {
             build: 'pnpm -r --filter ./apps/** --filter ./services/** build',
             format: 'oxfmt .',
             'format:check': 'oxfmt --check .',
+            'i18n:check': "node ./scripts/check-i18n-strings.mjs",
             lint: 'oxlint .',
             'lint:fix': 'oxlint . --fix',
             typecheck: `pnpm -r --filter "@${scope}/*" typecheck`,
             'skills:install': "node ./scripts/bootstrap-agent-skills.mjs",
             'skills:check': "node ./scripts/bootstrap-agent-skills.mjs --check",
             'ultramodern:check': "node ./scripts/validate-ultramodern-workspace.mjs",
-            check: 'pnpm format:check && pnpm lint && pnpm typecheck && pnpm skills:check && pnpm ultramodern:check'
+            check: 'pnpm format:check && pnpm lint && pnpm typecheck && pnpm i18n:check && pnpm skills:check && pnpm ultramodern:check'
         },
         engines: {
             node: '>=20',
@@ -1126,11 +1133,24 @@ function createSharedPackage(scope, id, description) {
 function createAppModernConfig(app) {
     return `// @effect-diagnostics processEnv:off
 import { appTools, defineConfig, presetUltramodern } from '@modern-js/app-tools';
+import { i18nPlugin } from '@modern-js/plugin-i18n';
 import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
 import { moduleFederationPlugin } from '@module-federation/modern-js-v3';
 
 const appId = '${app.id}';
 const port = Number(process.env['${app.portEnv}'] ?? ${app.port});
+const configuredSiteUrl = process.env['MODERN_PUBLIC_SITE_URL'];
+const hasConfiguredSiteUrl = typeof configuredSiteUrl === 'string' && configuredSiteUrl.length > 0;
+const isProductionBuild =
+  process.env['NODE_ENV'] === 'production' || process.argv.includes('build');
+
+if (isProductionBuild && !hasConfiguredSiteUrl) {
+  throw new Error(
+    'MODERN_PUBLIC_SITE_URL must be set for production builds so canonical and hreflang URLs use the deployed origin.',
+  );
+}
+
+const siteUrl = hasConfiguredSiteUrl ? configuredSiteUrl : \`http://localhost:\${port}\`;
 
 export default defineConfig(
   presetUltramodern(
@@ -1140,7 +1160,18 @@ export default defineConfig(
         polyfill: 'off',
         splitRouteChunks: false,
       },
-      plugins: [appTools(), tanstackRouterPlugin(), moduleFederationPlugin()],
+      plugins: [
+        appTools(),
+        i18nPlugin({
+          localeDetection: {
+            fallbackLanguage: 'en',
+            languages: ['en', 'cs'],
+            localePathRedirect: true,
+          },
+        }),
+        tanstackRouterPlugin(),
+        moduleFederationPlugin(),
+      ],
       server: {
         port,
         ssr: {
@@ -1148,6 +1179,11 @@ export default defineConfig(
           moduleFederationAppSSR: true,
         },
       },
+      source: {
+        globalVars: {
+          ULTRAMODERN_SITE_URL: siteUrl,
+        },
+      },
     },
     {
       appId,
@@ -1172,6 +1208,11 @@ function createSharedModuleFederationConfig() {
       singleton: true,
       treeShaking: false,
     },
+    i18next: {
+      requiredVersion: dependencies.i18next,
+      singleton: true,
+      treeShaking: false,
+    },
     react: {
       requiredVersion: reactVersion,
       singleton: true,
@@ -1182,6 +1223,11 @@ function createSharedModuleFederationConfig() {
       singleton: true,
       treeShaking: false,
     },
+    'react-i18next': {
+      requiredVersion: dependencies['react-i18next'],
+      singleton: true,
+      treeShaking: false,
+    },
   }`;
 }
 function formatTsObjectLiteral(value) {
@@ -1277,17 +1323,135 @@ export default defineConfig(
 );
 `;
 }
+function createAppRuntimeConfig() {
+    return `import { defineRuntimeConfig } from '@modern-js/runtime';
+import { createInstance } from 'i18next';
+
+const i18nInstance = createInstance();
+
+export default defineRuntimeConfig({
+  i18n: {
+    i18nInstance,
+    initOptions: {
+      defaultNS: 'translation',
+      fallbackLng: 'en',
+      interpolation: {
+        escapeValue: false,
+      },
+      ns: ['translation'],
+      supportedLngs: ['en', 'cs'],
+    },
+  },
+  router: {
+    framework: 'tanstack',
+  },
+});
+`;
+}
+function createLocalizedHeadComponent(includeLocationSuffix = false) {
+    return `const fallbackLanguage = 'en';
+const supportedLanguages = ['en', 'cs'] as const;
+type SupportedLanguage = (typeof supportedLanguages)[number];
+
+const isSupportedLanguage = (value: string): value is SupportedLanguage =>
+  supportedLanguages.includes(value as SupportedLanguage);
+
+const stripLanguagePrefix = (pathname: string) => {
+  const segments = pathname.split('/').filter(Boolean);
+  if (segments.length > 0 && isSupportedLanguage(segments[0] ?? '')) {
+    segments.shift();
+  }
+  return \`/\${segments.join('/')}\`;
+};
+
+const localizedPath = (pathname: string, language: SupportedLanguage) => {
+  const pathWithoutLanguage = stripLanguagePrefix(pathname);
+  return pathWithoutLanguage === '/' ? \`/\${language}\` : \`/\${language}\${pathWithoutLanguage}\`;
+};
+
+const absoluteUrl = (pathname: string) => {
+  const origin = ULTRAMODERN_SITE_URL.replace(/\\/+$/u, '');
+  return \`\${origin}\${pathname}\`;
+};
+${includeLocationSuffix ? `
+const locationSuffix = (location: { hash?: unknown; search?: unknown; searchStr?: unknown }) => {
+  const { hash, search, searchStr } = location;
+  let locationSearch = '';
+  if (typeof searchStr === 'string') {
+    locationSearch = searchStr;
+  } else if (typeof search === 'string') {
+    locationSearch = search;
+  }
+  const locationHash = typeof hash === 'string' ? hash : '';
+  return \`\${locationSearch}\${locationHash}\`;
+};
+` : ''}
+const LocalizedHead = () => {
+  const { language } = useModernI18n();
+  const location = useLocation();
+  const currentLanguage = isSupportedLanguage(language) ? language : fallbackLanguage;
+  const canonicalPath = localizedPath(location.pathname, currentLanguage);
+
+  return (
+    <Helmet>
+      <link rel="canonical" href={absoluteUrl(canonicalPath)} />
+      {supportedLanguages.map((code) => (
+        <link
+          href={absoluteUrl(localizedPath(location.pathname, code))}
+          hrefLang={code}
+          key={code}
+          rel="alternate"
+        />
+      ))}
+      <link
+        href={absoluteUrl(localizedPath(location.pathname, fallbackLanguage))}
+        hrefLang="x-default"
+        rel="alternate"
+      />
+    </Helmet>
+  );
+};
+`;
+}
 function createShellPage() {
-    return `const remotes = ['remote-commerce', 'remote-identity', 'remote-design-system'];
+    return `import { Helmet } from '@modern-js/runtime/head';
+import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { useLocation } from '@modern-js/runtime/tanstack-router';
+import { useTranslation } from 'react-i18next';
 
+const remotes = ['remote-commerce', 'remote-identity', 'remote-design-system'];
+
+${createLocalizedHeadComponent(true)}
 export default function ShellHome() {
+  const { t } = useTranslation();
+  const { language } = useModernI18n();
+  const location = useLocation();
+  const currentLanguage = isSupportedLanguage(language) ? language : fallbackLanguage;
+  const suffix = locationSuffix(location);
+  const languageOptions = supportedLanguages.map((code) => ({
+    code,
+    href: \`\${localizedPath(location.pathname, code)}\${suffix}\`,
+    label: t(\`language.\${code}\`),
+  }));
   return (
     <main>
-      <h1>UltraModern SuperApp Shell</h1>
-      <p data-testid="ultramodern-preset">presetUltramodern workspace</p>
+      <LocalizedHead />
+      <nav aria-label={t('language.switcher')}>
+        {languageOptions.map((option) => (
+          <a
+            aria-current={currentLanguage === option.code ? 'page' : undefined}
+            href={option.href}
+            key={option.code}
+          >
+            {option.label}
+          </a>
+        ))}
+      </nav>
+      <h1>{t('shell.title')}</h1>
+      <p data-testid="ultramodern-preset">{t('shell.preset')}</p>
       <ul>
         {remotes.map((remote) => (
-          <li key={remote}>{remote}</li>
+          <li key={remote}>{t(\`shell.remotes.\${remote}\`)}</li>
         ))}
       </ul>
     </main>
@@ -1296,11 +1460,20 @@ export default function ShellHome() {
 `;
 }
 function createRemotePage(app) {
-    return `export default function ${toPascalCase(app.id)}Home() {
+    return `import { Helmet } from '@modern-js/runtime/head';
+import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { useLocation } from '@modern-js/runtime/tanstack-router';
+import { useTranslation } from 'react-i18next';
+
+${createLocalizedHeadComponent()}
+export default function ${toPascalCase(app.id)}Home() {
+  const { t } = useTranslation();
+
   return (
     <main>
-      <h1>${app.displayName}</h1>
-      <p data-mf-role="${app.kind}">${app.domain ?? app.kind}</p>
+      <LocalizedHead />
+      <h1>{t('remote.title')}</h1>
+      <p data-mf-role="${app.kind}">{t('remote.domain')}</p>
     </main>
   );
 }
@@ -1321,11 +1494,15 @@ function createRemoteEntry(app) {
 }
 function createRemoteWidget(app) {
     const componentName = 'remote-identity' === app.id ? 'IdentityWidget' : 'CommerceWidget';
-    return `export default function ${componentName}() {
+    return `import { useTranslation } from 'react-i18next';
+
+export default function ${componentName}() {
+  const { t } = useTranslation();
+
   return (
     <section data-mf-remote="${app.id}">
-      <h2>${app.displayName}</h2>
-      <p>Owns the ${app.domain} vertical route surface.</p>
+      <h2>{t('remote.widget.title')}</h2>
+      <p>{t('remote.widget.body')}</p>
     </section>
   );
 }
@@ -1334,7 +1511,7 @@ function createRemoteWidget(app) {
 function createDesignButton() {
     return `import { designTokens } from '../tokens';
 
-export default function Button({ label = 'Design System Button' }: { label?: string }) {
+export default function Button({ label }: { label: string }) {
   return (
     <button
       type="button"
@@ -1361,6 +1538,62 @@ function createDesignTokens() {
 } as const;
 `;
 }
+function createEnglishTranslations(app) {
+    if ('shell' === app.kind) return {
+        language: {
+            cs: 'Czech',
+            en: 'English',
+            switcher: 'Language'
+        },
+        shell: {
+            preset: 'presetUltramodern workspace',
+            remotes: {
+                'remote-commerce': 'Commerce Remote',
+                'remote-design-system': 'Design System Remote',
+                'remote-identity': 'Identity Remote'
+            },
+            title: 'UltraModern SuperApp Shell'
+        }
+    };
+    return {
+        remote: {
+            domain: app.domain ?? app.kind,
+            title: app.displayName,
+            widget: {
+                body: 'vertical' === app.kind ? `Owns the ${app.domain} vertical route surface.` : 'Provides shared UI primitives for the workspace.',
+                title: app.displayName
+            }
+        }
+    };
+}
+function createCzechTranslations(app) {
+    if ('shell' === app.kind) return {
+        language: {
+            cs: 'Cestina',
+            en: 'Anglictina',
+            switcher: 'Jazyk'
+        },
+        shell: {
+            preset: 'presetUltramodern workspace',
+            remotes: {
+                'remote-commerce': 'Commerce remote',
+                'remote-design-system': 'Design system remote',
+                'remote-identity': 'Identity remote'
+            },
+            title: 'UltraModern SuperApp shell'
+        }
+    };
+    return {
+        remote: {
+            domain: app.domain ?? app.kind,
+            title: app.displayName,
+            widget: {
+                body: 'vertical' === app.kind ? `Vlastni ${app.domain} vertical route surface.` : 'Poskytuje sdilene UI prvky pro workspace.',
+                title: app.displayName
+            }
+        }
+    };
+}
 function createEffectSharedApi() {
     return `import {
   HttpApi,
@@ -1698,11 +1931,14 @@ function createTemplateManifest(modernVersion, packageSource) {
 function writeApp(targetDir, scope, app, packageSource) {
     writeJson(targetDir, `${app.directory}/package.json`, createAppPackage(scope, app, packageSource));
     writeJson(targetDir, `${app.directory}/tsconfig.json`, createPackageTsConfig(app.directory));
-    writeFile(targetDir, `${app.directory}/src/modern-app-env.d.ts`, "/// <reference types='@modern-js/app-tools/types' />\n");
+    writeFile(targetDir, `${app.directory}/src/modern-app-env.d.ts`, "/// <reference types='@modern-js/app-tools/types' />\n\ndeclare const ULTRAMODERN_SITE_URL: string;\n");
     writeFile(targetDir, `${app.directory}/modern.config.ts`, createAppModernConfig(app));
+    writeFile(targetDir, `${app.directory}/src/modern.runtime.ts`, createAppRuntimeConfig());
+    writeJson(targetDir, `${app.directory}/config/public/locales/en/translation.json`, createEnglishTranslations(app));
+    writeJson(targetDir, `${app.directory}/config/public/locales/cs/translation.json`, createCzechTranslations(app));
     writeFile(targetDir, `${app.directory}/module-federation.config.ts`, 'shell' === app.kind ? createShellModuleFederationConfig() : createRemoteModuleFederationConfig(app));
     writeFile(targetDir, `${app.directory}/src/routes/layout.tsx`, createLayout(app.id));
-    writeFile(targetDir, `${app.directory}/src/routes/page.tsx`, 'shell' === app.kind ? createShellPage() : createRemotePage(app));
+    writeFile(targetDir, `${app.directory}/src/routes/[lang]/page.tsx`, 'shell' === app.kind ? createShellPage() : createRemotePage(app));
     if ('vertical' === app.kind) {
         writeFile(targetDir, `${app.directory}/src/remote-entry.tsx`, createRemoteEntry(app));
         const widgetFile = 'remote-identity' === app.id ? 'identity-widget.tsx' : 'commerce-widget.tsx';
@@ -1855,7 +2091,7 @@ function detectBffRuntime() {
     process.exit(1);
 }
 function src_renderTemplate(template, data) {
-    const tagRegex = /\{\{(#if|#unless|\/if|\/unless)(?:\s+(\w+))?\}\}/g;
+    const tagRegex = /\{\{(~?)(#if|#unless|\/if|\/unless)(?:\s+(\w+))?(~?)\}\}/g;
     function renderConditionals(startIndex, expectedClose) {
         let rendered = '';
         let cursor = startIndex;
@@ -1866,7 +2102,7 @@ function src_renderTemplate(template, data) {
                 rendered: rendered + template.slice(cursor),
                 nextIndex: template.length
             };
-            const [raw, tag, condition] = match;
+            const [raw, , tag, condition, rightTrim] = match;
             const tagIndex = match.index;
             rendered += template.slice(cursor, tagIndex);
             cursor = tagIndex + raw.length;
@@ -1882,10 +2118,17 @@ function src_renderTemplate(template, data) {
             }
             if ('/if' === tag || '/unless' === tag) {
                 const kind = '/if' === tag ? 'if' : 'unless';
-                if (expectedClose === kind) return {
-                    rendered,
-                    nextIndex: cursor
-                };
+                if (expectedClose === kind) {
+                    let nextIndex = cursor;
+                    if ('~' === rightTrim) {
+                        const trailingWhitespace = /^\s*/u.exec(template.slice(nextIndex));
+                        nextIndex += trailingWhitespace?.[0].length ?? 0;
+                    }
+                    return {
+                        rendered,
+                        nextIndex
+                    };
+                }
                 rendered += raw;
             }
         }
@@ -1974,6 +2217,7 @@ function createBuiltinTemplateManifest(version) {
                 'AGENTS.md',
                 'README.md',
                 'api/**',
+                'config/**',
                 'modern.config.ts',
                 'oxfmt.config.ts',
                 'oxlint.config.ts',
@@ -2368,6 +2612,7 @@ async function main() {
         tsconfigVersion: singleAppModernPackageSpecifier('@modern-js/tsconfig', packageSource, useWorkspaceProtocol),
         pluginTanstackVersion: singleAppModernPackageSpecifier('@modern-js/plugin-tanstack', packageSource, useWorkspaceProtocol),
         pluginBffVersion: singleAppModernPackageSpecifier('@modern-js/plugin-bff', packageSource, useWorkspaceProtocol),
+        pluginI18nVersion: singleAppModernPackageSpecifier('@modern-js/plugin-i18n', packageSource, useWorkspaceProtocol),
         isSubproject,
         routerFramework,
         bffRuntime,
@@ -2447,6 +2692,7 @@ function copyTemplate(src, dest, options) {
                     tsconfigVersion: options.tsconfigVersion,
                     pluginTanstackVersion: options.pluginTanstackVersion,
                     pluginBffVersion: options.pluginBffVersion,
+                    pluginI18nVersion: options.pluginI18nVersion,
                     isSubproject: options.isSubproject,
                     isTanstackRouter: 'tanstack' === options.routerFramework,
                     enableBff: 'none' !== options.bffRuntime,

package/package.json

@@ -21,7 +21,7 @@
   "engines": {
     "node": ">=20"
   },
-  "version": "3.2.0-ultramodern.11",
+  "version": "3.2.0-ultramodern.13",
   "types": "./dist/types/index.d.ts",
   "main": "./dist/index.js",
   "bin": {
@@ -41,7 +41,7 @@
     "@types/node": "^25.8.0",
     "@typescript/native-preview": "7.0.0-dev.20260516.1",
     "tsx": "^4.22.0",
-    "@modern-js/i18n-utils": "npm:@bleedingdev/modern-js-i18n-utils@3.2.0-ultramodern.11"
+    "@modern-js/i18n-utils": "npm:@bleedingdev/modern-js-i18n-utils@3.2.0-ultramodern.13"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
@@ -54,6 +54,6 @@
     "start": "node ./dist/index.js"
   },
   "ultramodern": {
-    "frameworkVersion": "3.2.0-ultramodern.11"
+    "frameworkVersion": "3.2.0-ultramodern.13"
   }
 }

package/template/AGENTS.md

@@ -7,8 +7,15 @@ This project is generated for Codex-first UltraModern.js work.
 - `pnpm lint` runs Oxlint with the Ultracite preset.
 - `pnpm format` runs oxfmt.
 - `pnpm typecheck` runs effect-tsgo as the TypeScript checker.
+- `pnpm i18n:check` rejects hardcoded user-visible JSX text.
 - `pnpm ultramodern:check` verifies the generated contract.
 
+## Internationalization
+
+Runtime i18n is enabled by default. Agents must put user-visible UI copy in `config/public/locales/<lang>/translation.json` and render it through `react-i18next` or `@modern-js/plugin-i18n/runtime`. Do not add hardcoded JSX text, `aria-label`, `title`, `alt`, or `placeholder` strings unless the value is a non-translatable technical token.
+
+Routes are locale-prefixed by default through `localePathRedirect: true`. Keep localized pages under `src/routes/[lang]`, use links for language switching, and preserve canonical plus `hreflang` metadata. Production builds fail unless `MODERN_PUBLIC_SITE_URL` is set, so deployed canonical URLs always use the production origin.
+
 ## Private Skills
 
 Private orchestration skills are not vendored into this template. If you are authorized for `TechsioCZ/skills`, run:

package/template/config/public/locales/cs/translation.json

@@ -0,0 +1,39 @@
+{
+  "home": {
+    "bff": {
+      "response": "Odpoved Effect HttpApi:"
+    },
+    "cards": {
+      "bff": {
+        "body": "Pouzivej Effect jako hlavni BFF cestu, Hono nech jako explicitni zalozni volbu.",
+        "title": "BFF + Effect"
+      },
+      "config": {
+        "body": "Upravuj vygenerovane vychozi hodnoty v modern.config.ts.",
+        "title": "Konfigurace presetUltramodern"
+      },
+      "gates": {
+        "body": "Starter obsahuje PR workflow pro ultramodern:check a build.",
+        "title": "Ultramodern kontroly"
+      },
+      "guide": {
+        "body": "Projdi si verejny preset pripraveny pro MV, TanStack a Effect.",
+        "title": "UltraModern.js pruvodce"
+      }
+    },
+    "description": {
+      "afterConfig": ", udrzuj",
+      "afterPreset": "profil. Zacni v",
+      "end": "zelene a lad vygenerovany preset jen tam, kde aplikace potrebuje mekci cestu.",
+      "intro": "Tento starter prinasi verejny"
+    },
+    "language": {
+      "cs": "Cestina",
+      "en": "Anglictina",
+      "switcher": "Jazyk"
+    },
+    "logoAlt": "Logo UltraModern.js",
+    "name": "presetUltramodern",
+    "title": "UltraModern.js 3.0"
+  }
+}

package/template/config/public/locales/en/translation.json

@@ -0,0 +1,39 @@
+{
+  "home": {
+    "bff": {
+      "response": "Effect HttpApi response:"
+    },
+    "cards": {
+      "bff": {
+        "body": "Keep Effect as the preferred BFF lane while Hono stays an explicit fallback.",
+        "title": "BFF + Effect"
+      },
+      "config": {
+        "body": "Tune the generated defaults in modern.config.ts.",
+        "title": "Configure presetUltramodern"
+      },
+      "gates": {
+        "body": "The starter includes a PR workflow for ultramodern:check and build.",
+        "title": "Ultramodern Gates"
+      },
+      "guide": {
+        "body": "Review the MV-first, TanStack-ready, Effect-ready public preset.",
+        "title": "UltraModern.js Guide"
+      }
+    },
+    "description": {
+      "afterConfig": ", keep",
+      "afterPreset": "profile. Start in",
+      "end": "green, and tune the generated preset only where your app needs a softer lane.",
+      "intro": "This starter ships the public"
+    },
+    "language": {
+      "cs": "Czech",
+      "en": "English",
+      "switcher": "Language"
+    },
+    "logoAlt": "UltraModern.js Logo",
+    "name": "presetUltramodern",
+    "title": "UltraModern.js 3.0"
+  }
+}

package/template/modern.config.ts.handlebars

@@ -2,7 +2,8 @@
 import { appTools, defineConfig, presetUltramodern } from '@modern-js/app-tools';
 import path from 'node:path';
 {{#if enableBff}}import { bffPlugin } from '@modern-js/plugin-bff';
-{{/if}}{{#if isTanstackRouter}}import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
+{{/if}}import { i18nPlugin } from '@modern-js/plugin-i18n';
+{{#if isTanstackRouter}}import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
 {{/if}}
 const appId = process.env['MODERN_BASELINE_APP_ID'] || path.basename(process.cwd());
 const enableModuleFederationSSR = process.env['MODERN_BASELINE_ENABLE_MF_SSR'] !== 'false';
@@ -11,6 +12,18 @@ const enableTelemetryExporters =
   process.env['MODERN_BASELINE_ENABLE_TELEMETRY_EXPORTERS'] !== 'false';
 const telemetryFailLoudStartup = process.env['MODERN_TELEMETRY_FAIL_LOUD_STARTUP'] !== 'false';
 const otlpEndpoint = process.env['MODERN_TELEMETRY_OTLP_ENDPOINT'];
+const configuredSiteUrl = process.env['MODERN_PUBLIC_SITE_URL'];
+const hasConfiguredSiteUrl = typeof configuredSiteUrl === 'string' && configuredSiteUrl.length > 0;
+const isProductionBuild =
+  process.env['NODE_ENV'] === 'production' || process.argv.includes('build');
+
+if (isProductionBuild && !hasConfiguredSiteUrl) {
+  throw new Error(
+    'MODERN_PUBLIC_SITE_URL must be set for production builds so canonical and hreflang URLs use the deployed origin.',
+  );
+}
+
+const siteUrl = hasConfiguredSiteUrl ? configuredSiteUrl : 'http://localhost:8080';
 const victoriaMetricsEndpoint = process.env['MODERN_TELEMETRY_VICTORIA_ENDPOINT'];
 
 // https://bleedingdev.github.io/ultramodern.js/configure/app/usage.html
@@ -27,11 +40,23 @@ export default defineConfig(
 
 {{/if}}      plugins: [
         appTools(),
+        i18nPlugin({
+          localeDetection: {
+            fallbackLanguage: 'en',
+            languages: ['en', 'cs'],
+            localePathRedirect: true,
+          },
+        }),
 {{#if isTanstackRouter}}
         tanstackRouterPlugin(),
 {{/if}}{{#if enableBff}}
         bffPlugin(),
 {{/if}}      ],
+      source: {
+        globalVars: {
+          ULTRAMODERN_SITE_URL: siteUrl,
+        },
+      },
     },
     {
       appId,

package/template/package.json.handlebars

@@ -8,9 +8,10 @@
     "build": "modern build",
     "serve": "modern serve",
     "typecheck": "node -e \"const fs = require('node:fs'); const { execFileSync, spawnSync } = require('node:child_process'); const bin = execFileSync('effect-tsgo', ['get-exe-path'], { encoding: 'utf8' }).trim(); if (process.platform !== 'win32') fs.chmodSync(bin, 0o755); const result = spawnSync(bin, ['--noEmit', '-p', 'tsconfig.json'], { stdio: 'inherit' }); process.exit(result.status ?? 1);\"",
+    "i18n:check": "node ./scripts/check-i18n-strings.mjs",
     "skills:install": "node ./scripts/bootstrap-agent-skills.mjs",
     "skills:check": "node ./scripts/bootstrap-agent-skills.mjs --check",
-    "ultramodern:check": "{{#unless isSubproject}}pnpm format:check && pnpm lint && {{/unless}}pnpm typecheck{{#unless isSubproject}} && pnpm skills:check{{/unless}} && node ./scripts/validate-ultramodern.mjs"{{#unless isSubproject}},
+    "ultramodern:check": "{{#unless isSubproject}}pnpm format:check && pnpm lint && {{/unless}}pnpm typecheck && pnpm i18n:check{{#unless isSubproject}} && pnpm skills:check{{/unless}} && node ./scripts/validate-ultramodern.mjs"{{#unless isSubproject}},
     "format": "oxfmt .",
     "format:check": "oxfmt --check .",
     "lint": "oxlint .",
@@ -18,12 +19,16 @@
     "prepare": "simple-git-hooks"{{/unless}}
   },
   "dependencies": {
+    "@modern-js/plugin-i18n": "{{pluginI18nVersion}}",
 {{#if isTanstackRouter}}    "@modern-js/plugin-tanstack": "{{pluginTanstackVersion}}",
-{{/if}}    "@modern-js/runtime": "{{runtimeVersion}}",
+{{/if}}
+    "@modern-js/runtime": "{{runtimeVersion}}",
 {{#if isTanstackRouter}}    "@tanstack/react-router": "1.170.1",
 {{/if}}
+    "i18next": "26.2.0",
     "react": "^19.2.3",
-    "react-dom": "^19.2.0"
+    "react-dom": "^19.2.0",
+    "react-i18next": "17.0.8"
   },
   "devDependencies": {
     "@effect/tsgo": "0.7.3",