koto-react 1.0.0

package/dist/index.esm.js

@@ -0,0 +1,903 @@
+import React, { createContext, useContext, useState, useCallback, useEffect, useMemo } from 'react';
+
+const instanceOfAny = (object, constructors) => constructors.some((c) => object instanceof c);
+
+let idbProxyableTypes;
+let cursorAdvanceMethods;
+// This is a function to prevent it throwing up in node environments.
+function getIdbProxyableTypes() {
+    return (idbProxyableTypes ||
+        (idbProxyableTypes = [
+            IDBDatabase,
+            IDBObjectStore,
+            IDBIndex,
+            IDBCursor,
+            IDBTransaction,
+        ]));
+}
+// This is a function to prevent it throwing up in node environments.
+function getCursorAdvanceMethods() {
+    return (cursorAdvanceMethods ||
+        (cursorAdvanceMethods = [
+            IDBCursor.prototype.advance,
+            IDBCursor.prototype.continue,
+            IDBCursor.prototype.continuePrimaryKey,
+        ]));
+}
+const transactionDoneMap = new WeakMap();
+const transformCache = new WeakMap();
+const reverseTransformCache = new WeakMap();
+function promisifyRequest(request) {
+    const promise = new Promise((resolve, reject) => {
+        const unlisten = () => {
+            request.removeEventListener('success', success);
+            request.removeEventListener('error', error);
+        };
+        const success = () => {
+            resolve(wrap(request.result));
+            unlisten();
+        };
+        const error = () => {
+            reject(request.error);
+            unlisten();
+        };
+        request.addEventListener('success', success);
+        request.addEventListener('error', error);
+    });
+    // This mapping exists in reverseTransformCache but doesn't exist in transformCache. This
+    // is because we create many promises from a single IDBRequest.
+    reverseTransformCache.set(promise, request);
+    return promise;
+}
+function cacheDonePromiseForTransaction(tx) {
+    // Early bail if we've already created a done promise for this transaction.
+    if (transactionDoneMap.has(tx))
+        return;
+    const done = new Promise((resolve, reject) => {
+        const unlisten = () => {
+            tx.removeEventListener('complete', complete);
+            tx.removeEventListener('error', error);
+            tx.removeEventListener('abort', error);
+        };
+        const complete = () => {
+            resolve();
+            unlisten();
+        };
+        const error = () => {
+            reject(tx.error || new DOMException('AbortError', 'AbortError'));
+            unlisten();
+        };
+        tx.addEventListener('complete', complete);
+        tx.addEventListener('error', error);
+        tx.addEventListener('abort', error);
+    });
+    // Cache it for later retrieval.
+    transactionDoneMap.set(tx, done);
+}
+let idbProxyTraps = {
+    get(target, prop, receiver) {
+        if (target instanceof IDBTransaction) {
+            // Special handling for transaction.done.
+            if (prop === 'done')
+                return transactionDoneMap.get(target);
+            // Make tx.store return the only store in the transaction, or undefined if there are many.
+            if (prop === 'store') {
+                return receiver.objectStoreNames[1]
+                    ? undefined
+                    : receiver.objectStore(receiver.objectStoreNames[0]);
+            }
+        }
+        // Else transform whatever we get back.
+        return wrap(target[prop]);
+    },
+    set(target, prop, value) {
+        target[prop] = value;
+        return true;
+    },
+    has(target, prop) {
+        if (target instanceof IDBTransaction &&
+            (prop === 'done' || prop === 'store')) {
+            return true;
+        }
+        return prop in target;
+    },
+};
+function replaceTraps(callback) {
+    idbProxyTraps = callback(idbProxyTraps);
+}
+function wrapFunction(func) {
+    // Due to expected object equality (which is enforced by the caching in `wrap`), we
+    // only create one new func per func.
+    // Cursor methods are special, as the behaviour is a little more different to standard IDB. In
+    // IDB, you advance the cursor and wait for a new 'success' on the IDBRequest that gave you the
+    // cursor. It's kinda like a promise that can resolve with many values. That doesn't make sense
+    // with real promises, so each advance methods returns a new promise for the cursor object, or
+    // undefined if the end of the cursor has been reached.
+    if (getCursorAdvanceMethods().includes(func)) {
+        return function (...args) {
+            // Calling the original function with the proxy as 'this' causes ILLEGAL INVOCATION, so we use
+            // the original object.
+            func.apply(unwrap(this), args);
+            return wrap(this.request);
+        };
+    }
+    return function (...args) {
+        // Calling the original function with the proxy as 'this' causes ILLEGAL INVOCATION, so we use
+        // the original object.
+        return wrap(func.apply(unwrap(this), args));
+    };
+}
+function transformCachableValue(value) {
+    if (typeof value === 'function')
+        return wrapFunction(value);
+    // This doesn't return, it just creates a 'done' promise for the transaction,
+    // which is later returned for transaction.done (see idbObjectHandler).
+    if (value instanceof IDBTransaction)
+        cacheDonePromiseForTransaction(value);
+    if (instanceOfAny(value, getIdbProxyableTypes()))
+        return new Proxy(value, idbProxyTraps);
+    // Return the same value back if we're not going to transform it.
+    return value;
+}
+function wrap(value) {
+    // We sometimes generate multiple promises from a single IDBRequest (eg when cursoring), because
+    // IDB is weird and a single IDBRequest can yield many responses, so these can't be cached.
+    if (value instanceof IDBRequest)
+        return promisifyRequest(value);
+    // If we've already transformed this value before, reuse the transformed value.
+    // This is faster, but it also provides object equality.
+    if (transformCache.has(value))
+        return transformCache.get(value);
+    const newValue = transformCachableValue(value);
+    // Not all types are transformed.
+    // These may be primitive types, so they can't be WeakMap keys.
+    if (newValue !== value) {
+        transformCache.set(value, newValue);
+        reverseTransformCache.set(newValue, value);
+    }
+    return newValue;
+}
+const unwrap = (value) => reverseTransformCache.get(value);
+
+/**
+ * Open a database.
+ *
+ * @param name Name of the database.
+ * @param version Schema version.
+ * @param callbacks Additional callbacks.
+ */
+function openDB(name, version, { blocked, upgrade, blocking, terminated } = {}) {
+    const request = indexedDB.open(name, version);
+    const openPromise = wrap(request);
+    if (upgrade) {
+        request.addEventListener('upgradeneeded', (event) => {
+            upgrade(wrap(request.result), event.oldVersion, event.newVersion, wrap(request.transaction), event);
+        });
+    }
+    if (blocked) {
+        request.addEventListener('blocked', (event) => blocked(
+        // Casting due to https://github.com/microsoft/TypeScript-DOM-lib-generator/pull/1405
+        event.oldVersion, event.newVersion, event));
+    }
+    openPromise
+        .then((db) => {
+        if (terminated)
+            db.addEventListener('close', () => terminated());
+        if (blocking) {
+            db.addEventListener('versionchange', (event) => blocking(event.oldVersion, event.newVersion, event));
+        }
+    })
+        .catch(() => { });
+    return openPromise;
+}
+
+const readMethods = ['get', 'getKey', 'getAll', 'getAllKeys', 'count'];
+const writeMethods = ['put', 'add', 'delete', 'clear'];
+const cachedMethods = new Map();
+function getMethod(target, prop) {
+    if (!(target instanceof IDBDatabase &&
+        !(prop in target) &&
+        typeof prop === 'string')) {
+        return;
+    }
+    if (cachedMethods.get(prop))
+        return cachedMethods.get(prop);
+    const targetFuncName = prop.replace(/FromIndex$/, '');
+    const useIndex = prop !== targetFuncName;
+    const isWrite = writeMethods.includes(targetFuncName);
+    if (
+    // Bail if the target doesn't exist on the target. Eg, getAll isn't in Edge.
+    !(targetFuncName in (useIndex ? IDBIndex : IDBObjectStore).prototype) ||
+        !(isWrite || readMethods.includes(targetFuncName))) {
+        return;
+    }
+    const method = async function (storeName, ...args) {
+        // isWrite ? 'readwrite' : undefined gzipps better, but fails in Edge :(
+        const tx = this.transaction(storeName, isWrite ? 'readwrite' : 'readonly');
+        let target = tx.store;
+        if (useIndex)
+            target = target.index(args.shift());
+        // Must reject if op rejects.
+        // If it's a write operation, must reject if tx.done rejects.
+        // Must reject with op rejection first.
+        // Must resolve with op value.
+        // Must handle both promises (no unhandled rejections)
+        return (await Promise.all([
+            target[targetFuncName](...args),
+            isWrite && tx.done,
+        ]))[0];
+    };
+    cachedMethods.set(prop, method);
+    return method;
+}
+replaceTraps((oldTraps) => ({
+    ...oldTraps,
+    get: (target, prop, receiver) => getMethod(target, prop) || oldTraps.get(target, prop, receiver),
+    has: (target, prop) => !!getMethod(target, prop) || oldTraps.has(target, prop),
+}));
+
+const advanceMethodProps = ['continue', 'continuePrimaryKey', 'advance'];
+const methodMap = {};
+const advanceResults = new WeakMap();
+const ittrProxiedCursorToOriginalProxy = new WeakMap();
+const cursorIteratorTraps = {
+    get(target, prop) {
+        if (!advanceMethodProps.includes(prop))
+            return target[prop];
+        let cachedFunc = methodMap[prop];
+        if (!cachedFunc) {
+            cachedFunc = methodMap[prop] = function (...args) {
+                advanceResults.set(this, ittrProxiedCursorToOriginalProxy.get(this)[prop](...args));
+            };
+        }
+        return cachedFunc;
+    },
+};
+async function* iterate(...args) {
+    // tslint:disable-next-line:no-this-assignment
+    let cursor = this;
+    if (!(cursor instanceof IDBCursor)) {
+        cursor = await cursor.openCursor(...args);
+    }
+    if (!cursor)
+        return;
+    cursor = cursor;
+    const proxiedCursor = new Proxy(cursor, cursorIteratorTraps);
+    ittrProxiedCursorToOriginalProxy.set(proxiedCursor, cursor);
+    // Map this double-proxy back to the original, so other cursor methods work.
+    reverseTransformCache.set(proxiedCursor, unwrap(cursor));
+    while (cursor) {
+        yield proxiedCursor;
+        // If one of the advancing methods was not called, call continue().
+        cursor = await (advanceResults.get(proxiedCursor) || cursor.continue());
+        advanceResults.delete(proxiedCursor);
+    }
+}
+function isIteratorProp(target, prop) {
+    return ((prop === Symbol.asyncIterator &&
+        instanceOfAny(target, [IDBIndex, IDBObjectStore, IDBCursor])) ||
+        (prop === 'iterate' && instanceOfAny(target, [IDBIndex, IDBObjectStore])));
+}
+replaceTraps((oldTraps) => ({
+    ...oldTraps,
+    get(target, prop, receiver) {
+        if (isIteratorProp(target, prop))
+            return iterate;
+        return oldTraps.get(target, prop, receiver);
+    },
+    has(target, prop) {
+        return isIteratorProp(target, prop) || oldTraps.has(target, prop);
+    },
+}));
+
+const DB_NAME = 'koto-translations';
+const DB_VERSION = 3;
+const STORE_NAME = 'translations';
+const CACHE_DURATION = 1000 * 60 * 60; // 1 hour
+class TranslationStorage {
+    constructor() {
+        this.db = null;
+    }
+    async init() {
+        if (this.db)
+            return;
+        this.db = await openDB(DB_NAME, DB_VERSION, {
+            upgrade(db) {
+                // Create or keep translations store
+                if (!db.objectStoreNames.contains(STORE_NAME)) {
+                    db.createObjectStore(STORE_NAME);
+                }
+            },
+        });
+    }
+    async getTranslations(locale) {
+        await this.init();
+        if (!this.db)
+            return null;
+        try {
+            const stored = await this.db.get(STORE_NAME, locale);
+            if (!stored)
+                return null;
+            // Check if cache is still valid
+            const now = Date.now();
+            if (now - stored.timestamp > CACHE_DURATION) {
+                // Cache expired
+                await this.db.delete(STORE_NAME, locale);
+                return null;
+            }
+            return stored;
+        }
+        catch (error) {
+            console.error('Error getting translations from IndexedDB:', error);
+            return null;
+        }
+    }
+    async setTranslations(locale, translations, apiResponse) {
+        await this.init();
+        if (!this.db)
+            return;
+        try {
+            // Process translations based on API response format
+            const processedTranslations = this.processTranslations(translations);
+            const stored = {
+                locale,
+                translations: processedTranslations,
+                timestamp: Date.now(),
+                version: apiResponse?.version,
+            };
+            // Include metadata if provided in API response
+            if (apiResponse?.localeInfo || apiResponse?.localeName) {
+                stored.metadata = {
+                    name: apiResponse.localeName || apiResponse.localeInfo?.name,
+                    nativeName: apiResponse.localeNativeName || apiResponse.localeInfo?.nativeName,
+                    direction: apiResponse.direction || apiResponse.localeInfo?.direction || 'ltr',
+                };
+            }
+            await this.db.put(STORE_NAME, stored, locale);
+        }
+        catch (error) {
+            console.error('Error storing translations in IndexedDB:', error);
+        }
+    }
+    processTranslations(translations) {
+        // Handle different response formats
+        if (typeof translations === 'object' && translations !== null) {
+            // Check if it's already in the right format
+            if (this.isNestedStructure(translations)) {
+                return translations;
+            }
+            // Check if it's a flat key-value structure
+            if (this.isFlatStructure(translations)) {
+                return this.buildNestedFromFlat(translations);
+            }
+        }
+        // Return as-is if we can't determine the structure
+        return translations;
+    }
+    isNestedStructure(obj) {
+        // Check if any value is an object (nested structure)
+        return Object.values(obj).some(val => typeof val === 'object' && val !== null && !Array.isArray(val));
+    }
+    isFlatStructure(obj) {
+        // Check if all values are strings and keys contain dots
+        return Object.entries(obj).every(([, val]) => typeof val === 'string') && Object.keys(obj).some(key => key.includes('.'));
+    }
+    buildNestedFromFlat(flatData) {
+        const result = {};
+        for (const [key, value] of Object.entries(flatData)) {
+            const keys = key.split('.');
+            let current = result;
+            for (let i = 0; i < keys.length - 1; i++) {
+                const k = keys[i];
+                if (!(k in current)) {
+                    current[k] = {};
+                }
+                current = current[k];
+            }
+            current[keys[keys.length - 1]] = value;
+        }
+        return result;
+    }
+    async clearTranslations(locale) {
+        await this.init();
+        if (!this.db)
+            return;
+        try {
+            if (locale) {
+                await this.db.delete(STORE_NAME, locale);
+            }
+            else {
+                await this.db.clear(STORE_NAME);
+            }
+        }
+        catch (error) {
+            console.error('Error clearing translations from IndexedDB:', error);
+        }
+    }
+    async getAllLocales() {
+        await this.init();
+        if (!this.db)
+            return [];
+        try {
+            return await this.db.getAllKeys(STORE_NAME);
+        }
+        catch (error) {
+            console.error('Error getting locales from IndexedDB:', error);
+            return [];
+        }
+    }
+    async getSupportedLocales() {
+        await this.init();
+        if (!this.db)
+            return [];
+        try {
+            const allData = await this.db.getAll(STORE_NAME);
+            return allData.map(data => ({
+                code: data.locale,
+                metadata: data.metadata,
+            }));
+        }
+        catch (error) {
+            console.error('Error getting supported locales:', error);
+            return [];
+        }
+    }
+    async processApiResponse(locale, response) {
+        // Handle different response formats dynamically
+        let translations = {};
+        // Check for translations in various possible locations
+        if (response.translations) {
+            translations = response.translations;
+        }
+        else if (response.data) {
+            translations = response.data;
+        }
+        else if (typeof response === 'object' && !response.error) {
+            // Direct translation object - must be TranslationData format
+            translations = response;
+        }
+        // Store with API metadata
+        await this.setTranslations(locale, translations, response);
+        return this.processTranslations(translations);
+    }
+}
+const storage = new TranslationStorage();
+
+/**
+ * Get a nested translation value using dot notation
+ * @param translations - The translations object
+ * @param key - The dot-notated key (e.g., 'checkout.payment.title')
+ * @returns The translation value or null if not found
+ */
+function getNestedTranslation(translations, key) {
+    const keys = key.split('.');
+    let current = translations;
+    for (const k of keys) {
+        if (current && typeof current === 'object' && k in current) {
+            current = current[k];
+        }
+        else {
+            return null;
+        }
+    }
+    return typeof current === 'string' ? current : null;
+}
+/**
+ * Flatten nested translation object
+ * @param obj - The nested translation object
+ * @param prefix - The prefix for keys
+ * @returns Flattened object with dot-notated keys
+ */
+function flattenTranslations(obj, prefix = '') {
+    const flattened = {};
+    for (const [key, value] of Object.entries(obj)) {
+        const newKey = prefix ? `${prefix}.${key}` : key;
+        if (typeof value === 'string') {
+            flattened[newKey] = value;
+        }
+        else if (typeof value === 'object' && value !== null) {
+            Object.assign(flattened, flattenTranslations(value, newKey));
+        }
+    }
+    return flattened;
+}
+/**
+ * Unflatten dot-notated keys to nested object
+ * @param obj - The flattened object
+ * @returns Nested translation object
+ */
+function unflattenTranslations(obj) {
+    const result = {};
+    for (const [key, value] of Object.entries(obj)) {
+        const keys = key.split('.');
+        let current = result;
+        for (let i = 0; i < keys.length - 1; i++) {
+            const k = keys[i];
+            if (!(k in current)) {
+                current[k] = {};
+            }
+            current = current[k];
+        }
+        current[keys[keys.length - 1]] = value;
+    }
+    return result;
+}
+
+/**
+ * Available locales following BCP 47 standard (IETF language tags)
+ * Format: language[-script][-region]
+ * Examples: en, en-US, zh-CN, zh-Hans-CN
+ *
+ * These locale codes must match exactly what's in your database
+ * Following the same standard as react-i18next
+ */
+const AVAILABLE_LOCALES = [
+    // English variants
+    { code: 'en', name: 'English', nativeName: 'English', direction: 'ltr', enabled: true },
+    { code: 'en-US', name: 'English (US)', nativeName: 'English (US)', direction: 'ltr', enabled: true },
+    { code: 'en-GB', name: 'English (UK)', nativeName: 'English (UK)', direction: 'ltr', enabled: true },
+    // Chinese variants - using script subtags
+    { code: 'zh', name: 'Chinese', nativeName: '中文', direction: 'ltr', enabled: true },
+    { code: 'zh-CN', name: 'Chinese (Simplified)', nativeName: '简体中文', direction: 'ltr', enabled: true },
+    { code: 'zh-TW', name: 'Chinese (Traditional)', nativeName: '繁體中文', direction: 'ltr', enabled: true },
+    { code: 'zh-Hans', name: 'Chinese (Simplified)', nativeName: '简体中文', direction: 'ltr', enabled: true },
+    { code: 'zh-Hant', name: 'Chinese (Traditional)', nativeName: '繁體中文', direction: 'ltr', enabled: true },
+    // Spanish variants
+    { code: 'es', name: 'Spanish', nativeName: 'Español', direction: 'ltr', enabled: true },
+    { code: 'es-ES', name: 'Spanish (Spain)', nativeName: 'Español (España)', direction: 'ltr', enabled: true },
+    { code: 'es-MX', name: 'Spanish (Mexico)', nativeName: 'Español (México)', direction: 'ltr', enabled: true },
+    // Portuguese variants
+    { code: 'pt', name: 'Portuguese', nativeName: 'Português', direction: 'ltr', enabled: true },
+    { code: 'pt-BR', name: 'Portuguese (Brazil)', nativeName: 'Português (Brasil)', direction: 'ltr', enabled: true },
+    { code: 'pt-PT', name: 'Portuguese (Portugal)', nativeName: 'Português (Portugal)', direction: 'ltr', enabled: true },
+    // French variants
+    { code: 'fr', name: 'French', nativeName: 'Français', direction: 'ltr', enabled: true },
+    { code: 'fr-FR', name: 'French (France)', nativeName: 'Français (France)', direction: 'ltr', enabled: true },
+    { code: 'fr-CA', name: 'French (Canada)', nativeName: 'Français (Canada)', direction: 'ltr', enabled: true },
+    // German variants
+    { code: 'de', name: 'German', nativeName: 'Deutsch', direction: 'ltr', enabled: true },
+    { code: 'de-DE', name: 'German (Germany)', nativeName: 'Deutsch (Deutschland)', direction: 'ltr', enabled: true },
+    { code: 'de-AT', name: 'German (Austria)', nativeName: 'Deutsch (Österreich)', direction: 'ltr', enabled: true },
+    { code: 'de-CH', name: 'German (Switzerland)', nativeName: 'Deutsch (Schweiz)', direction: 'ltr', enabled: true },
+    // Other languages
+    { code: 'it', name: 'Italian', nativeName: 'Italiano', direction: 'ltr', enabled: true },
+    { code: 'it-IT', name: 'Italian (Italy)', nativeName: 'Italiano (Italia)', direction: 'ltr', enabled: true },
+    { code: 'ja', name: 'Japanese', nativeName: '日本語', direction: 'ltr', enabled: true },
+    { code: 'ja-JP', name: 'Japanese (Japan)', nativeName: '日本語 (日本)', direction: 'ltr', enabled: true },
+    { code: 'ko', name: 'Korean', nativeName: '한국어', direction: 'ltr', enabled: true },
+    { code: 'ko-KR', name: 'Korean (Korea)', nativeName: '한국어 (대한민국)', direction: 'ltr', enabled: true },
+    { code: 'ru', name: 'Russian', nativeName: 'Русский', direction: 'ltr', enabled: true },
+    { code: 'ru-RU', name: 'Russian (Russia)', nativeName: 'Русский (Россия)', direction: 'ltr', enabled: true },
+    // RTL languages
+    { code: 'ar', name: 'Arabic', nativeName: 'العربية', direction: 'rtl', enabled: true },
+    { code: 'ar-SA', name: 'Arabic (Saudi Arabia)', nativeName: 'العربية (المملكة العربية السعودية)', direction: 'rtl', enabled: true },
+    { code: 'ar-AE', name: 'Arabic (UAE)', nativeName: 'العربية (الإمارات)', direction: 'rtl', enabled: true },
+    { code: 'he', name: 'Hebrew', nativeName: 'עברית', direction: 'rtl', enabled: true },
+    { code: 'he-IL', name: 'Hebrew (Israel)', nativeName: 'עברית (ישראל)', direction: 'rtl', enabled: true },
+    // Other Asian languages
+    { code: 'hi', name: 'Hindi', nativeName: 'हिन्दी', direction: 'ltr', enabled: true },
+    { code: 'hi-IN', name: 'Hindi (India)', nativeName: 'हिन्दी (भारत)', direction: 'ltr', enabled: true },
+    { code: 'th', name: 'Thai', nativeName: 'ไทย', direction: 'ltr', enabled: true },
+    { code: 'th-TH', name: 'Thai (Thailand)', nativeName: 'ไทย (ประเทศไทย)', direction: 'ltr', enabled: true },
+    { code: 'vi', name: 'Vietnamese', nativeName: 'Tiếng Việt', direction: 'ltr', enabled: true },
+    { code: 'vi-VN', name: 'Vietnamese (Vietnam)', nativeName: 'Tiếng Việt (Việt Nam)', direction: 'ltr', enabled: true },
+    { code: 'id', name: 'Indonesian', nativeName: 'Bahasa Indonesia', direction: 'ltr', enabled: true },
+    { code: 'id-ID', name: 'Indonesian (Indonesia)', nativeName: 'Bahasa Indonesia (Indonesia)', direction: 'ltr', enabled: true },
+    // European languages
+    { code: 'nl', name: 'Dutch', nativeName: 'Nederlands', direction: 'ltr', enabled: true },
+    { code: 'nl-NL', name: 'Dutch (Netherlands)', nativeName: 'Nederlands (Nederland)', direction: 'ltr', enabled: true },
+    { code: 'nl-BE', name: 'Dutch (Belgium)', nativeName: 'Nederlands (België)', direction: 'ltr', enabled: true },
+    { code: 'pl', name: 'Polish', nativeName: 'Polski', direction: 'ltr', enabled: true },
+    { code: 'pl-PL', name: 'Polish (Poland)', nativeName: 'Polski (Polska)', direction: 'ltr', enabled: true },
+    { code: 'tr', name: 'Turkish', nativeName: 'Türkçe', direction: 'ltr', enabled: true },
+    { code: 'tr-TR', name: 'Turkish (Turkey)', nativeName: 'Türkçe (Türkiye)', direction: 'ltr', enabled: true },
+    { code: 'sv', name: 'Swedish', nativeName: 'Svenska', direction: 'ltr', enabled: true },
+    { code: 'sv-SE', name: 'Swedish (Sweden)', nativeName: 'Svenska (Sverige)', direction: 'ltr', enabled: true },
+    { code: 'da', name: 'Danish', nativeName: 'Dansk', direction: 'ltr', enabled: true },
+    { code: 'da-DK', name: 'Danish (Denmark)', nativeName: 'Dansk (Danmark)', direction: 'ltr', enabled: true },
+    { code: 'no', name: 'Norwegian', nativeName: 'Norsk', direction: 'ltr', enabled: true },
+    { code: 'nb-NO', name: 'Norwegian Bokmål', nativeName: 'Norsk Bokmål', direction: 'ltr', enabled: true },
+    { code: 'fi', name: 'Finnish', nativeName: 'Suomi', direction: 'ltr', enabled: true },
+    { code: 'fi-FI', name: 'Finnish (Finland)', nativeName: 'Suomi (Suomi)', direction: 'ltr', enabled: true },
+    { code: 'cs', name: 'Czech', nativeName: 'Čeština', direction: 'ltr', enabled: true },
+    { code: 'cs-CZ', name: 'Czech (Czech Republic)', nativeName: 'Čeština (Česká republika)', direction: 'ltr', enabled: true },
+    { code: 'hu', name: 'Hungarian', nativeName: 'Magyar', direction: 'ltr', enabled: true },
+    { code: 'hu-HU', name: 'Hungarian (Hungary)', nativeName: 'Magyar (Magyarország)', direction: 'ltr', enabled: true },
+    { code: 'el', name: 'Greek', nativeName: 'Ελληνικά', direction: 'ltr', enabled: true },
+    { code: 'el-GR', name: 'Greek (Greece)', nativeName: 'Ελληνικά (Ελλάδα)', direction: 'ltr', enabled: true },
+];
+/**
+ * Get locale info by code
+ */
+function getLocaleInfo(code) {
+    return AVAILABLE_LOCALES.find(locale => locale.code === code);
+}
+/**
+ * Check if a locale code is supported
+ */
+function isLocaleSupported(code) {
+    return AVAILABLE_LOCALES.some(locale => locale.code === code);
+}
+/**
+ * Get fallback locale code
+ * For example: en-US -> en, zh-CN -> zh
+ */
+function getFallbackLocale(code) {
+    // Already a base locale
+    if (!code.includes('-')) {
+        return undefined;
+    }
+    // Extract base language code
+    const baseCode = code.split('-')[0];
+    return isLocaleSupported(baseCode) ? baseCode : undefined;
+}
+/**
+ * Resolve locale with fallback
+ * Tries the exact locale, then fallback to base language
+ */
+function resolveLocale(code) {
+    // Exact match
+    if (isLocaleSupported(code)) {
+        return code;
+    }
+    // Try fallback
+    const fallback = getFallbackLocale(code);
+    if (fallback) {
+        return fallback;
+    }
+    // Default to English
+    return 'en';
+}
+
+const KotoContext = createContext(null);
+const LOCALE_STORAGE_KEY = 'koto-selected-locale';
+function KotoProvider({ children, apiKey, projectId, defaultLocale, apiUrl = 'https://api.koto.dev/v1/translations' }) {
+    // Initialize locale from localStorage or use defaultLocale
+    const getInitialLocale = () => {
+        if (typeof window !== 'undefined') {
+            const savedLocale = localStorage.getItem(LOCALE_STORAGE_KEY);
+            if (savedLocale) {
+                return savedLocale;
+            }
+        }
+        return defaultLocale;
+    };
+    const [translations, setTranslations] = useState({});
+    const [locale, setLocale] = useState(getInitialLocale());
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    // Use hardcoded locales that match the database
+    const availableLocales = AVAILABLE_LOCALES;
+    // Fetch translations from API
+    const fetchTranslations = useCallback(async (currentLocale) => {
+        try {
+            const response = await fetch(`${apiUrl}?locale=${currentLocale}&projectId=${projectId}`, {
+                headers: {
+                    'x-api-key': apiKey,
+                    'Content-Type': 'application/json',
+                },
+            });
+            if (!response.ok) {
+                throw new Error(`Failed to fetch translations: ${response.statusText}`);
+            }
+            const data = await response.json();
+            // Let storage handle the response format dynamically
+            return await storage.processApiResponse(currentLocale, data);
+        }
+        catch (err) {
+            throw err instanceof Error ? err : new Error('Failed to fetch translations');
+        }
+    }, [apiKey, projectId, apiUrl]);
+    // Load translations (from cache or API)
+    const loadTranslations = useCallback(async (currentLocale) => {
+        setLoading(true);
+        setError(null);
+        try {
+            // Try to get from IndexedDB first
+            const cached = await storage.getTranslations(currentLocale);
+            if (cached) {
+                setTranslations(cached.translations);
+                setLoading(false);
+                // Fetch fresh data in background
+                fetchTranslations(currentLocale)
+                    .then((freshTranslations) => {
+                    setTranslations(freshTranslations);
+                })
+                    .catch(console.error);
+            }
+            else {
+                // No cache, fetch from API
+                const freshTranslations = await fetchTranslations(currentLocale);
+                setTranslations(freshTranslations);
+                setLoading(false);
+            }
+        }
+        catch (err) {
+            setError(err instanceof Error ? err : new Error('Failed to load translations'));
+            setLoading(false);
+        }
+    }, [fetchTranslations]);
+    // Translation function
+    const t = useCallback((key, fallback) => {
+        const translation = getNestedTranslation(translations, key);
+        return translation || fallback || key;
+    }, [translations]);
+    // Function to change locale
+    const changeLocale = useCallback((newLocale) => {
+        if (newLocale !== locale) {
+            setLocale(newLocale);
+            // Save to localStorage
+            if (typeof window !== 'undefined') {
+                localStorage.setItem(LOCALE_STORAGE_KEY, newLocale);
+            }
+        }
+    }, [locale]);
+    // Get available locales (returns hardcoded list)
+    const getAvailableLocales = useCallback(() => {
+        return availableLocales;
+    }, [availableLocales]);
+    // Load translations on mount and locale change
+    useEffect(() => {
+        loadTranslations(locale);
+    }, [locale, loadTranslations]);
+    // Context value
+    const value = useMemo(() => ({
+        translations,
+        locale,
+        loading,
+        error,
+        t,
+        setLocale: changeLocale,
+        availableLocales,
+        getAvailableLocales,
+    }), [translations, locale, loading, error, t, changeLocale, availableLocales, getAvailableLocales]);
+    return (React.createElement(KotoContext.Provider, { value: value }, children));
+}
+// Hook to use Koto context
+function useKoto() {
+    const context = useContext(KotoContext);
+    if (!context) {
+        throw new Error('useKoto must be used within a KotoProvider');
+    }
+    return context;
+}
+// Hook to use translation function
+function useTranslation() {
+    const { t, locale, loading, setLocale, availableLocales, getAvailableLocales } = useKoto();
+    return { t, locale, loading, setLocale, availableLocales, getAvailableLocales };
+}
+
+/**
+ * Higher-Order Component for class components
+ * Wraps a component and injects translation props
+ */
+function withTranslation(Component) {
+    const ComponentWithTranslation = (props) => {
+        const { t, locale, loading, setLocale, translations, error } = useKoto();
+        return (React.createElement(Component, { ...props, t: t, locale: locale, loading: loading, setLocale: setLocale, translations: translations, error: error }));
+    };
+    ComponentWithTranslation.displayName = `withTranslation(${Component.displayName || Component.name || 'Component'})`;
+    return ComponentWithTranslation;
+}
+function Translation({ children }) {
+    const kotoContext = useKoto();
+    return React.createElement(React.Fragment, null, children(kotoContext));
+}
+/**
+ * Consumer component for direct context access
+ * Useful for class components that need conditional rendering
+ */
+class KotoConsumer extends React.Component {
+    render() {
+        return React.createElement(Translation, null, this.props.children);
+    }
+}
+
+// Global cache for translations
+let globalTranslations = {};
+let globalLocale = 'en';
+let isInitialized = false;
+/**
+ * Initialize the translation function with a locale
+ * This should be called once when the app starts
+ */
+async function initTranslations(locale) {
+    globalLocale = locale;
+    // Try to load from IndexedDB
+    const cached = await storage.getTranslations(locale);
+    if (cached) {
+        globalTranslations = cached.translations;
+        isInitialized = true;
+    }
+}
+/**
+ * Set translations directly (useful when fetched from API)
+ */
+function setTranslations(translations, locale) {
+    globalTranslations = translations;
+    globalLocale = locale;
+    isInitialized = true;
+    // Store in IndexedDB for future use
+    storage.setTranslations(locale, translations);
+}
+/**
+ * Get current locale
+ */
+function getLocale() {
+    return globalLocale;
+}
+/**
+ * Translation function
+ * @param key - The translation key (e.g., 'checkout.payment.title')
+ * @param fallback - Optional fallback value if translation not found
+ * @returns The translated string or the key if not found
+ */
+function t(key, fallback) {
+    if (!isInitialized) {
+        console.warn('Translations not initialized. Call initTranslations() first.');
+        return fallback || key;
+    }
+    const translation = getNestedTranslation(globalTranslations, key);
+    return translation || fallback || key;
+}
+/**
+ * Translation function with interpolation
+ * @param key - The translation key
+ * @param params - Object with values to interpolate
+ * @param fallback - Optional fallback value
+ * @returns The translated and interpolated string
+ *
+ * @example
+ * // Translation: "Hello, {{name}}!"
+ * ti('greeting', { name: 'John' }) // "Hello, John!"
+ */
+function ti(key, params, fallback) {
+    let translation = t(key, fallback);
+    // Replace placeholders with values
+    Object.entries(params).forEach(([paramKey, value]) => {
+        const placeholder = new RegExp(`{{\\s*${paramKey}\\s*}}`, 'g');
+        translation = translation.replace(placeholder, String(value));
+    });
+    return translation;
+}
+/**
+ * Pluralization helper
+ * @param key - The base translation key
+ * @param count - The count for pluralization
+ * @param params - Optional parameters for interpolation
+ * @returns The pluralized translation
+ *
+ * @example
+ * // Translations:
+ * // "items.zero": "No items"
+ * // "items.one": "One item"
+ * // "items.other": "{{count}} items"
+ * tp('items', 0) // "No items"
+ * tp('items', 1) // "One item"
+ * tp('items', 5) // "5 items"
+ */
+function tp(key, count, params) {
+    let pluralKey = key;
+    if (count === 0) {
+        pluralKey = `${key}.zero`;
+    }
+    else if (count === 1) {
+        pluralKey = `${key}.one`;
+    }
+    else {
+        pluralKey = `${key}.other`;
+    }
+    // Try the plural key first, fall back to base key
+    let translation = t(pluralKey);
+    if (translation === pluralKey) {
+        translation = t(key);
+    }
+    // Apply interpolation with count included
+    const allParams = { count, ...params };
+    return ti(translation, allParams);
+}
+
+// Provider and hooks
+
+export { AVAILABLE_LOCALES, KotoConsumer as HermesConsumer, KotoProvider as HermesProvider, KotoConsumer, KotoProvider, Translation, t as default, flattenTranslations, getFallbackLocale, getLocale, getLocaleInfo, getNestedTranslation, initTranslations, isLocaleSupported, resolveLocale, setTranslations, storage, t, ti, tp, unflattenTranslations, useKoto as useHermes, useKoto, useTranslation, withTranslation };
+//# sourceMappingURL=index.esm.js.map