cloudflare-next-intl 0.1.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Demian
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,66 @@
+# cloudflare-next-intl
+
+Optimized internationalization (i18n) package specialized for Next.js App Router
+and Cloudflare environment.
+
+## Features
+
+- **Optimized for Cloudflare**: Designed to work seamlessly with Cloudflare
+  Pages and Workers.
+- **Server Components Support**: Full support for Next.js App Router and Server
+  Components.
+- **Fast and Efficient**: Low overhead and minimal bundle size.
+- **Tree-shaking**: Properly architected for optimal tree-shaking.
+
+## Installation
+
+```bash
+npm install cloudflare-next-intl
+```
+
+## Usage
+
+### Configuration
+
+Set up your internationalization configuration:
+
+```typescript
+import { setIntlConfig } from "cloudflare-next-intl/setIntlConfig";
+
+export default setIntlConfig({
+    locales: ["en", "de"],
+    defaultLocale: "en",
+    // ... other config
+});
+```
+
+### Server Components
+
+```tsx
+import { getTranslations } from "cloudflare-next-intl/server";
+
+export default async function Page() {
+    const t = await getTranslations("Index");
+    return <h1>{t("title")}</h1>;
+}
+```
+
+### Client Components
+
+```tsx
+"use client";
+
+import { LocaleLink } from "cloudflare-next-intl/client";
+
+export function Navigation() {
+    return (
+        <LocaleLink href="/about">
+            About Us
+        </LocaleLink>
+    );
+}
+```
+
+## License
+
+MIT

package/dist/global_jsx_helper.d.ts

@@ -0,0 +1,4 @@
+import type { JSX } from "react";
+declare global {
+    type Component = JSX.Element;
+}

package/dist/global_jsx_helper.js

@@ -0,0 +1 @@
+export {};

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './src';

package/dist/index.js

@@ -0,0 +1 @@
+export * from './src';

package/dist/src/client/components/client_helper_script.d.ts

@@ -0,0 +1 @@
+export default function ClientHelperScript(): null;

package/dist/src/client/components/client_helper_script.js

@@ -0,0 +1,15 @@
+'use client';
+import { useEffect } from "react";
+import { isDarkCookieKey } from "../../config";
+import getCookie from "../functions/get_cookie";
+export default function ClientHelperScript() {
+    useEffect(() => {
+        const isDark = getCookie(isDarkCookieKey);
+        const classList = document.documentElement.classList;
+        const isDarkBool = isDark === 'true';
+        if (classList.contains('dark') !== isDarkBool) {
+            classList.toggle('dark', isDarkBool);
+        }
+    }, []);
+    return null;
+}

package/dist/src/client/components/client_provider.d.ts

@@ -0,0 +1,12 @@
+import type { TranslationObject } from "../../types/types";
+interface LocaleContextType {
+    language: string;
+    messages: TranslationObject;
+}
+export declare const LocaleContext: import("react").Context<LocaleContextType | undefined>;
+export default function LocationzationClientProvider({ language, messages, children }: {
+    language: string;
+    messages: TranslationObject;
+    children: React.ReactNode;
+}): Component;
+export {};

package/dist/src/client/components/client_provider.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { setLocaleCache, setMessageForLocaleCache } from "../../general/cache_variables";
+import { createContext } from "react";
+export const LocaleContext = createContext(undefined);
+export default function LocationzationClientProvider({ language, messages, children }) {
+    setLocaleCache(language);
+    setMessageForLocaleCache(language, messages);
+    return _jsx(LocaleContext.Provider, { value: { language, messages }, children: children });
+}

package/dist/src/client/components/locale_link.d.ts

@@ -0,0 +1,8 @@
+import { type LinkProps } from 'next/link';
+import { type ComponentProps } from 'react';
+type NextLinkProps = Omit<ComponentProps<'a'>, keyof LinkProps> & Omit<LinkProps, 'locale' | 'href' | 'prefetch' | 'onNavigate' | 'hrefLang' | 'replace' | 'scroll'>;
+export type LocaleLinkProps = NextLinkProps & {
+    locale: string;
+};
+declare const LocaleLink: import("react").ForwardRefExoticComponent<Omit<LocaleLinkProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
+export default LocaleLink;

package/dist/src/client/components/locale_link.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, Suspense, } from 'react';
+import LocaleLinkClient from './locale_link_client';
+function LocaleLinkComponent(params, ref) {
+    return _jsx(Suspense, { fallback: _jsx("a", { ...params, ref: ref, className: params.className + ' pointer-events-none' }), children: _jsx(LocaleLinkClient, { ref: ref, ...params }) });
+}
+const LocaleLink = forwardRef(LocaleLinkComponent);
+export default LocaleLink;

package/dist/src/client/components/locale_link_client.d.ts

@@ -0,0 +1,3 @@
+import type { LocaleLinkProps } from './locale_link';
+declare const LocaleLinkClient: import("react").ForwardRefExoticComponent<Omit<LocaleLinkProps, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
+export default LocaleLinkClient;

package/dist/src/client/components/locale_link_client.js

@@ -0,0 +1,31 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useState, } from 'react';
+import config from '../../config/intl_config';
+import usePathname from '../hooks/use_path_name';
+import { localeCookieName } from '../../config/cookie_key';
+import setCookie from '../functions/set_cookie';
+import { useSearchParams } from 'next/navigation';
+function ClientLocaleLinkComponent({ locale, className, ...rest }, ref) {
+    const pathname = usePathname();
+    const searchParams = useSearchParams();
+    const [hash, setHash] = useState('');
+    useEffect(() => {
+        setHash(window.location.hash);
+    }, [pathname, searchParams]);
+    const isDefaultLocale = locale === config.defaultLocale;
+    const localePrefix = isDefaultLocale ? '' : `/${locale}`;
+    const search = searchParams.toString();
+    // Fix for the root path to avoid a trailing slash like `/fr/`
+    const newPathname = pathname === '/' && (localePrefix) ? '' : pathname;
+    const href = `${localePrefix}${newPathname}${search ? `?${search}` : ''}${hash}`;
+    function handleNavigate(e) {
+        e.preventDefault();
+        setCookie({ name: localeCookieName, value: locale });
+        window.location.replace(href);
+    }
+    ;
+    return _jsx("a", { ref: ref, hrefLang: locale, className: className, ...rest, href: href, onClick: handleNavigate });
+}
+const LocaleLinkClient = forwardRef(ClientLocaleLinkComponent);
+export default LocaleLinkClient;

package/dist/src/client/functions/get_cookie.d.ts

@@ -0,0 +1 @@
+export default function getCookie(name: string): string | null;

package/dist/src/client/functions/get_cookie.js

@@ -0,0 +1,12 @@
+"use client";
+export default function getCookie(name) {
+    try {
+        const match = document.cookie.match(new RegExp(`(?:^|; )${name}=([^;]*)`));
+        return match ? decodeURIComponent(match[1]) : null;
+    }
+    catch (e) {
+        console.error(`Get cookie on client side error: ${e}`);
+        return null;
+    }
+}
+;

package/dist/src/client/functions/set_cookie.d.ts

@@ -0,0 +1,5 @@
+export default function setCookie({ name, value, maxAge }: {
+    name: string;
+    value: unknown;
+    maxAge?: number;
+}): void;

package/dist/src/client/functions/set_cookie.js

@@ -0,0 +1,11 @@
+"use client";
+export default function setCookie({ name, value, maxAge }) {
+    try {
+        const cookieString = `${name}=${value}; path=/; max-age=${maxAge ?? 31536000}; SameSite=Lax;`;
+        document.cookie = cookieString;
+    }
+    catch (e) {
+        console.error(`Set cookie on client side error: ${e}`);
+    }
+}
+;

package/dist/src/client/hooks/client_hooks.d.ts

@@ -0,0 +1,3 @@
+import type { TranslatorReturnType } from "../../types/types";
+export declare function useLocale(): string;
+export declare function useTranslations(namespace: string): TranslatorReturnType;

package/dist/src/client/hooks/client_hooks.js

@@ -0,0 +1,19 @@
+"use client";
+import { useContext, useMemo } from "react";
+import { LocaleContext } from "../components/client_provider";
+import { getTranslationsImpl } from "../../general/general_functions";
+export function useLocale() {
+    const context = useContext(LocaleContext);
+    if (context === undefined) {
+        throw new Error('useLocale must be used within a LocaleContext');
+    }
+    return context.language;
+}
+export function useTranslations(namespace) {
+    const context = useContext(LocaleContext);
+    if (context === undefined) {
+        throw new Error('useTranslations must be used within a LocaleContext');
+    }
+    const { language, messages } = context;
+    return useMemo(() => getTranslationsImpl(language, messages, namespace), [language, messages, namespace]);
+}

package/dist/src/client/hooks/use_path_name.d.ts

@@ -0,0 +1 @@
+export default function usePathname(): string;

package/dist/src/client/hooks/use_path_name.js

@@ -0,0 +1,14 @@
+"use client";
+import { usePathname as nextUsePathname } from "next/navigation";
+import { useLocale } from "./client_hooks";
+export default function usePathname() {
+    const pathname = nextUsePathname();
+    const locale = useLocale();
+    const path = pathname.replace(`/${locale}`, '');
+    if (path) {
+        return path;
+    }
+    else {
+        return '/';
+    }
+}

package/dist/src/client/index.d.ts

@@ -0,0 +1,4 @@
+export { default as LocaleLink } from './components/locale_link';
+export { default as usePathname } from './hooks/use_path_name';
+export { default as setCookieClient } from './functions/set_cookie';
+export { default as getCookieClient } from './functions/get_cookie';

package/dist/src/client/index.js

@@ -0,0 +1,5 @@
+export { default as LocaleLink } from './components/locale_link';
+export { default as usePathname } from './hooks/use_path_name';
+export { default as setCookieClient } from './functions/set_cookie';
+export { default as getCookieClient } from './functions/get_cookie';
+// export { useLocale, useTranslations } from './hooks/client_hooks';

package/dist/src/config/cookie_key.d.ts

@@ -0,0 +1,3 @@
+export declare const localeCookieName = "__user_locale_key__";
+export declare const isBotCookieKey = "__is_bot_key__";
+export declare const isDarkCookieKey = "__is_dark_key__";

package/dist/src/config/cookie_key.js

@@ -0,0 +1,3 @@
+export const localeCookieName = '__user_locale_key__';
+export const isBotCookieKey = '__is_bot_key__';
+export const isDarkCookieKey = '__is_dark_key__';

package/dist/src/config/index.d.ts

@@ -0,0 +1,4 @@
+export { isBotCookieKey, localeCookieName, isDarkCookieKey } from './cookie_key';
+export { default as intlMiddleware } from './middleware';
+export { setIntlConfig } from './init_config';
+export { default as generateIntlSitemap } from './intl_sitemap';

package/dist/src/config/index.js

@@ -0,0 +1,4 @@
+export { isBotCookieKey, localeCookieName, isDarkCookieKey } from './cookie_key'; // Export specific middleware function
+export { default as intlMiddleware } from './middleware'; // Export specific middleware function
+export { setIntlConfig } from './init_config';
+export { default as generateIntlSitemap } from './intl_sitemap';

package/dist/src/config/init_config.d.ts

@@ -0,0 +1,2 @@
+import type { LocalePrefixMode, Locales, RoutingConfig } from '../types/types';
+export declare function setIntlConfig<const AppLocales extends Locales, const AppLocalePrefixMode extends LocalePrefixMode = 'as-needed'>(config: RoutingConfig<AppLocales, AppLocalePrefixMode>): RoutingConfig<AppLocales, AppLocalePrefixMode>;

package/dist/src/config/init_config.js

@@ -0,0 +1,3 @@
+export function setIntlConfig(config) {
+    return config;
+}

package/dist/src/config/intl_config.d.ts

@@ -0,0 +1,3 @@
+import type { LocalePrefixMode, Locales, RoutingConfig } from '../types/types';
+declare const config: RoutingConfig<Locales, LocalePrefixMode>;
+export default config;

package/dist/src/config/intl_config.js

@@ -0,0 +1,12 @@
+import intlConfig from '@intl-config';
+function getConfig() {
+    const value = intlConfig;
+    if (value) {
+        return intlConfig;
+    }
+    else {
+        throw Error('Please set config file and set path to it in next.config as in the example');
+    }
+}
+const config = getConfig();
+export default config;

package/dist/src/config/intl_sitemap.d.ts

@@ -0,0 +1,8 @@
+import type { MetadataRoute } from 'next';
+import type { IntlSitemap } from '../types/types';
+declare function generateIntlSitemapIml({ intlSitemap, url }: {
+    intlSitemap: IntlSitemap[];
+    url: string;
+}): MetadataRoute.Sitemap;
+declare const generateIntlSitemap: typeof generateIntlSitemapIml;
+export default generateIntlSitemap;

package/dist/src/config/intl_sitemap.js

@@ -0,0 +1,28 @@
+import { languages } from '../general/metadata';
+import config from './intl_config';
+import { cache } from 'react';
+function generateAlternates(url, link) {
+    return {
+        languages: languages(url, link),
+    };
+}
+function generateIntlSitemapIml({ intlSitemap, url }) {
+    const sitemap = [];
+    for (const customRoute of intlSitemap) {
+        const linkPart = customRoute.link == '/' ? undefined : customRoute.link;
+        const alternates = generateAlternates(url, linkPart);
+        for (const locale of config.locales) {
+            const localeValue = locale === config.defaultLocale ? '' : `/${locale}`;
+            const localeUrl = url + localeValue;
+            sitemap.push({
+                ...customRoute,
+                alternates: alternates,
+                url: localeUrl + (linkPart ?? ''),
+            });
+        }
+    }
+    sitemap.sort((a, b) => a.url.localeCompare(b.url));
+    return sitemap;
+}
+const generateIntlSitemap = cache(generateIntlSitemapIml);
+export default generateIntlSitemap;

package/dist/src/config/middleware.d.ts

@@ -0,0 +1,4 @@
+import type { NextRequest } from 'next/server';
+import { NextResponse } from 'next/server';
+export declare const localesSet: Set<string>;
+export default function intlMiddleware(request: NextRequest): Promise<NextResponse<unknown>>;

package/dist/src/config/middleware.js

@@ -0,0 +1,93 @@
+import { NextResponse } from 'next/server';
+import { languageDetecotr } from '../server/functions/get_user_locale';
+import config from './intl_config';
+import { isBotCookieKey, localeCookieName } from './cookie_key';
+import { cache } from 'react';
+const sameSite = false;
+const defaultCookieOption = {
+    path: '/', // Cookie is valid for the entire domain
+    maxAge: 2592000, // Store cookie for 30 days (in seconds).
+    httpOnly: false,
+    secure: false, // Send cookie only over HTTPS in production
+    sameSite: sameSite, // Protection against CSRF attacks. 'strict' or 'lax' are good choices.
+};
+async function getIsBotValue(userAgent) {
+    if (userAgent === null)
+        return false;
+    const { isBot } = await import('next/dist/server/web/spec-extension/user-agent');
+    return isBot(userAgent ?? '');
+}
+const getIsBotValueCache = cache(getIsBotValue);
+export const localesSet = new Set(config.locales);
+// This middleware function runs for every incoming request
+export default async function intlMiddleware(request) {
+    try {
+        let initialChosenLocale;
+        const existingLocaleCookie = request.cookies.get(localeCookieName)?.value;
+        let isSEOBot = undefined;
+        // 1. The most performant step: Check if a locale cookie is already set
+        // Also, verify if the value from this cookie is actually supported
+        if (existingLocaleCookie && localesSet.has(existingLocaleCookie)) {
+            initialChosenLocale = existingLocaleCookie;
+        }
+        else {
+            const userAgent = request.headers.get('user-agent');
+            isSEOBot = await getIsBotValueCache(userAgent);
+            initialChosenLocale = isSEOBot ? config.defaultLocale : languageDetecotr(request.headers.get('accept-language'));
+        }
+        const { pathname, search, hash } = request.nextUrl;
+        let urlLocale;
+        let pathWithoutLocale;
+        const pathSegments = pathname.split('/').filter(Boolean); // e.g., ['', 'en', 'about'] -> ['en', 'about']
+        const firstSegment = pathSegments[0];
+        const languageValue = firstSegment;
+        // Check if the first segment of the path is one of the supported locales
+        if (pathSegments.length > 0 && localesSet.has(languageValue)) {
+            urlLocale = languageValue;
+            pathWithoutLocale = '/' + pathSegments.slice(1).join('/'); // Remove the locale segment
+            if (pathWithoutLocale === '')
+                pathWithoutLocale = '/'; // Ensure it's '/' for root after removing locale
+        }
+        else {
+            // No locale prefix in the URL. The actual pathname is the full original pathname.
+            pathWithoutLocale = pathname;
+        }
+        const effectiveLocaleForRequest = urlLocale ?? initialChosenLocale;
+        let response;
+        if (!urlLocale) {
+            const targetPath = `/${effectiveLocaleForRequest}${pathWithoutLocale === '/' ? '' : pathWithoutLocale}`;
+            const targetUrl = new URL(`${targetPath}${search}${hash}`, request.url);
+            if (initialChosenLocale === config.defaultLocale) {
+                response = NextResponse.rewrite(targetUrl, { request });
+            }
+            else {
+                response = NextResponse.redirect(targetUrl, request);
+            }
+        }
+        else {
+            response = NextResponse.next({
+                request,
+            });
+        }
+        if (!existingLocaleCookie ||
+            existingLocaleCookie !== effectiveLocaleForRequest) {
+            response.cookies.set(localeCookieName, effectiveLocaleForRequest, defaultCookieOption);
+            if (isSEOBot !== undefined) {
+                response.cookies.set(isBotCookieKey, isSEOBot.toString(), {
+                    ...defaultCookieOption,
+                    maxAge: 31536000, // 1 year
+                    secure: process.env.NODE_ENV === 'production',
+                    httpOnly: true,
+                });
+            }
+        }
+        response.headers.set('Content-Language', effectiveLocaleForRequest);
+        return response;
+    }
+    catch (e) {
+        console.error(`Middleware Error ${e}`);
+        return NextResponse.next({
+            request,
+        });
+    }
+}

package/dist/src/general/cache_variables.d.ts

@@ -0,0 +1,13 @@
+import type { TranslationObject, TranslatorReturnType } from "../types/types";
+/**
+ * Sets the current locale.
+ * @param locale The language to set.
+ */
+export declare function setLocaleCache(locale: string): void;
+export declare function setLocaleAsync(params: Promise<{
+    locale: string;
+}>): Promise<void>;
+export declare function getLocaleCache(): string | undefined;
+export declare function setMessageForLocaleCache(locale: string, message: TranslationObject): void;
+export declare function getMessageCache(locale?: string): TranslationObject | undefined;
+export declare function setTranslationCache(cache: string, value: TranslatorReturnType): void;

package/dist/src/general/cache_variables.js

@@ -0,0 +1,32 @@
+// Caches for loaded translation objects and memoized translation functions.
+const loadedTranslations = new Map();
+const translationFunctionsCache = new Map();
+let currentLanguage = undefined; // Renamed 'language' to 'currentLanguage' for clarity
+/**
+ * Sets the current locale.
+ * @param locale The language to set.
+ */
+export function setLocaleCache(locale) {
+    currentLanguage = locale;
+}
+export async function setLocaleAsync(params) {
+    const { locale } = await params;
+    setLocaleCache(locale);
+}
+export function getLocaleCache() {
+    return currentLanguage;
+}
+export function setMessageForLocaleCache(locale, message) {
+    loadedTranslations.set(locale, message);
+}
+export function getMessageCache(locale) {
+    if (locale && loadedTranslations.has(locale)) {
+        return loadedTranslations.get(locale);
+    }
+    else {
+        return undefined;
+    }
+}
+export function setTranslationCache(cache, value) {
+    translationFunctionsCache.set(cache, value);
+}

package/dist/src/general/general_functions.d.ts

@@ -0,0 +1,2 @@
+import type { TranslationObject, TranslatorReturnType } from "../types/types";
+export declare function getTranslationsImpl(locale: string, messages: TranslationObject, namespace: string, cacheKey?: string): TranslatorReturnType;

package/dist/src/general/general_functions.js

@@ -0,0 +1,96 @@
+import { setTranslationCache } from "./cache_variables";
+/**
+ * Logs a warning message and returns a fallback translation function.
+ * This function helps in debugging missing translations or incorrect structures.
+ * @param message The main warning message.
+ * @param cacheKey The key used for caching the translation function.
+ * @param locale The effective locale.
+ * @param namespace The namespace being accessed.
+ * @param key The specific translation key being looked up.
+ * @returns A fallback function that returns the key itself.
+ */
+const errorAndReturnFallback = (message, cacheKey, locale, namespace, key) => {
+    const parts = [
+        message,
+        namespace ? `Namespace: "${namespace}"` : '',
+        key ? `Key: "${key}"` : '',
+        `Locale: "${locale}"`,
+    ].filter(Boolean); // Filter out empty parts
+    console.error(parts.join(' | '));
+    const fallbackFn = (k) => k; // Fallback function simply returns the key
+    setTranslationCache(cacheKey, fallbackFn);
+    return fallbackFn;
+};
+export function getTranslationsImpl(locale, messages, namespace, cacheKey) {
+    const cacheKeyValue = cacheKey ?? `${locale}-${namespace}`;
+    const namespaceParts = namespace.split('.');
+    let currentLevel = messages;
+    let translationsBase;
+    // Traverse the translation object based on the namespace parts.
+    for (let i = 0; i < namespaceParts.length; i++) {
+        const part = namespaceParts[i];
+        const nextLevel = currentLevel[part];
+        if (i === namespaceParts.length - 1) {
+            // Last part of the namespace, should resolve to an object (the base for translations).
+            if (typeof nextLevel === 'object' && nextLevel !== null) {
+                translationsBase = nextLevel;
+            }
+            else {
+                // Namespace does not resolve to an object as expected.
+                return errorAndReturnFallback(`Namespace "${namespace}" does not resolve to an object.`, cacheKeyValue, locale, namespace);
+            }
+        }
+        else {
+            // Intermediate part of the namespace, must be an object.
+            if (typeof nextLevel === 'object' && nextLevel !== null) {
+                currentLevel = nextLevel;
+            }
+            else {
+                // Invalid structure in the middle of the namespace path.
+                return errorAndReturnFallback(`Namespace "${namespace}" has invalid structure at "${part}". Expected object, got "${typeof nextLevel}".`, cacheKeyValue, locale, namespace);
+            }
+        }
+    }
+    // If after traversal, no base translations object was found.
+    if (!translationsBase) {
+        return errorAndReturnFallback(`Translations for namespace "${namespace}" could not be found.`, cacheKeyValue, locale, namespace);
+    }
+    /**
+     * The actual translation function for a given key within the resolved namespace.
+     * @param key The dot-separated translation key (e.g., "title", "description.long").
+     * @returns The translated string or the key itself if not found/invalid.
+     */
+    const translateFunction = (key) => {
+        const keyParts = key.split('.');
+        let currentTranslation = translationsBase;
+        // Traverse the resolved translations base using the key parts.
+        for (let i = 0; i < keyParts.length; i++) {
+            const part = keyParts[i];
+            if (typeof currentTranslation === 'string') {
+                // Translation key path prematurely leads to a string.
+                console.warn(`Translation key "${key}" in namespace "${namespace}" leads to a string prematurely at "${part}" for locale "${locale}".`);
+                return key; // Return the key as fallback
+            }
+            const value = currentTranslation[part];
+            if (i === keyParts.length - 1) {
+                return value;
+            }
+            else {
+                // Intermediate part of the key, must be an object.
+                if (typeof value === 'object' && value !== null) {
+                    currentTranslation = value;
+                }
+                else {
+                    // Invalid structure in the middle of the translation key path.
+                    console.warn(`Translation key "${key}" in namespace "${namespace}" has invalid structure at "${part}" for locale "${locale}". Expected object, got "${typeof value}".`);
+                    return key; // Return the key as fallback
+                }
+            }
+        }
+        // If the loop completes and no string translation was found (e.g., key missing or not a string).
+        console.warn(`Translation key "${key}" in namespace "${namespace}" is missing or not a string for locale "${locale}".`);
+        return key; // Return the key as fallback
+    };
+    setTranslationCache(cacheKeyValue, translateFunction);
+    return translateFunction;
+}