glotstack 0.0.0

package/.prettierrc

@@ -0,0 +1,10 @@
+{
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": false,
+  "singleQuote": true,
+  "jsxSingleQuote": true,
+  "jsxBracketSameLine": false,
+  "quoteProps": "as-needed",
+  "printWidth": 80
+}

package/dist/index.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+export type LocaleRegion = 'en' | 'en-US' | 'en-US-genz' | 'fr-FR' | 'de-DE' | 'nl-NL' | 'jp-JP' | string;
+export interface TranslationLeaf {
+    value: string;
+    context?: string;
+}
+export interface Translations {
+    [key: string]: Translations | TranslationLeaf;
+}
+export interface ContextType {
+    translations: Translations;
+    requireTranslations: (localeRegion: string) => Promise<unknown>;
+    setLocale: (locale: LocaleRegion) => Promise<unknown>;
+    locale: string | null;
+    t: (key: string, options?: {
+        locale?: LocaleRegion;
+    }) => string;
+}
+export declare const GlotstackContext: React.Context<ContextType>;
+export declare const Provider: ({ children, locale: defaultLocale, onUpdated, initialTranslations, onLocaleChange }: {
+    children: React.ReactNode;
+    locale: string;
+    onUpdated: (value: ContextType) => void;
+    initialTranslations?: Translations;
+    onLocaleChange: (locale: string | null, value: ContextType) => void;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const useTranslations: (_options?: Record<never, never>) => ContextType;

package/dist/index.js

@@ -0,0 +1,137 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTranslations = exports.Provider = exports.GlotstackContext = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const object_1 = require("./util/object");
+exports.GlotstackContext = React.createContext({
+    translations: {},
+    requireTranslations: () => Promise.resolve(),
+    setLocale: (_locale) => Promise.resolve(),
+    locale: null,
+    t: () => '',
+});
+const Provider = ({ children, locale: defaultLocale, onUpdated, initialTranslations, onLocaleChange }) => {
+    const [translations, setTranslations] = React.useState(initialTranslations !== null && initialTranslations !== void 0 ? initialTranslations : {});
+    const loadingRef = React.useRef({});
+    const [locale, setLocalLocale] = React.useState(defaultLocale);
+    React.useEffect(() => {
+        setLocalLocale(defaultLocale);
+    }, [defaultLocale]);
+    const requireTranslations = React.useMemo(() => {
+        return (locale) => {
+            var _a;
+            const current = translations === null || translations === void 0 ? void 0 : translations[locale];
+            if (current != null) {
+                return Promise.resolve();
+            }
+            if (((_a = loadingRef.current) === null || _a === void 0 ? void 0 : _a[locale]) == null) {
+                loadingRef.current[locale] = Promise.resolve(`${`domains/application/translations/${locale}.json`}`).then(s => __importStar(require(s)));
+            }
+            loadingRef.current[locale].then((Module) => __awaiter(void 0, void 0, void 0, function* () {
+                if ((Module === null || Module === void 0 ? void 0 : Module.default) != null) {
+                    const data = yield (yield fetch(Module.default)).json();
+                    setTranslations((0, object_1.merge)({}, translations, { [locale]: data }));
+                }
+            }));
+            return loadingRef.current[locale];
+        };
+    }, [locale, translations]);
+    const t = React.useMemo(() => (key, options) => {
+        var _a;
+        React.useEffect(() => {
+            var _a;
+            if ((options === null || options === void 0 ? void 0 : options.locale) == null) {
+                return;
+            }
+            (_a = requireTranslations(options === null || options === void 0 ? void 0 : options.locale)) === null || _a === void 0 ? void 0 : _a.then(() => {
+                if ((options === null || options === void 0 ? void 0 : options.locale) == null) {
+                    return;
+                }
+                setLocale(options === null || options === void 0 ? void 0 : options.locale);
+            });
+        }, [locale]);
+        if (translations === null) {
+            return key;
+        }
+        const access = [...key.split('.')];
+        const localeTranslations = translations === null || translations === void 0 ? void 0 : translations[locale];
+        if (localeTranslations == null) {
+            return key;
+        }
+        const value = access.reduce((acc, key) => {
+            // @ts-expect-error expected
+            return acc === null || acc === void 0 ? void 0 : acc[key];
+        }, localeTranslations);
+        return ((_a = value === null || value === void 0 ? void 0 : value.value) !== null && _a !== void 0 ? _a : key);
+    }, [translations, requireTranslations]);
+    const setLocale = React.useMemo(() => (locale) => {
+        setLocalLocale(locale);
+        return requireTranslations(locale).then(_ => {
+            onLocaleChange(valueRef.current.locale, valueRef.current);
+        });
+    }, [setLocalLocale, requireTranslations]);
+    const valueRef = React.useRef({
+        requireTranslations,
+        locale,
+        translations: initialTranslations !== null && initialTranslations !== void 0 ? initialTranslations : {},
+        setLocale,
+        t
+    });
+    const current = valueRef.current;
+    React.useEffect(() => {
+        valueRef.current = {
+            translations,
+            requireTranslations,
+            setLocale,
+            locale,
+            t
+        };
+        if (!(0, object_1.isEqual)(valueRef.current, current)) {
+            onUpdated === null || onUpdated === void 0 ? void 0 : onUpdated(valueRef.current);
+        }
+    }, [locale, translations, requireTranslations]);
+    React.useEffect(() => {
+        requireTranslations(locale);
+    }, [requireTranslations, locale]);
+    return (0, jsx_runtime_1.jsx)(exports.GlotstackContext.Provider, { value: valueRef.current, children: children });
+};
+exports.Provider = Provider;
+const useTranslations = (_options) => {
+    const context = React.useContext(exports.GlotstackContext);
+    return context;
+};
+exports.useTranslations = useTranslations;
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"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"}

package/dist/util/object.d.ts

@@ -0,0 +1,5 @@
+export declare function isObject(val: any): val is Record<string, any>;
+type MergeTarget = Record<string | number | symbol, any>;
+export declare function merge(target: MergeTarget, ...sources: MergeTarget[]): MergeTarget;
+export declare function isEqual(a: any, b: any): boolean;
+export {};

package/dist/util/object.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isEqual = exports.merge = exports.isObject = void 0;
+function isObject(val) {
+    return typeof val === 'object' && val !== null && !Array.isArray(val);
+}
+exports.isObject = isObject;
+function _merge(target, source) {
+    if (!isObject(target) || !isObject(source))
+        return target;
+    for (const key of Object.keys(source)) {
+        const srcVal = source[key];
+        const tgtVal = target[key];
+        if (Array.isArray(srcVal) && Array.isArray(tgtVal)) {
+            target[key] = tgtVal.concat(srcVal);
+        }
+        else if (isObject(srcVal) && isObject(tgtVal)) {
+            _merge(tgtVal, srcVal);
+        }
+        else {
+            target[key] = srcVal;
+        }
+    }
+    return target;
+}
+function merge(target, ...sources) {
+    return sources.reduce((previous, current) => {
+        return merge(previous, current);
+    }, target);
+}
+exports.merge = merge;
+function isEqual(a, b) {
+    if (a === b)
+        return true;
+    if (typeof a !== typeof b || a == null || b == null)
+        return false;
+    if (Array.isArray(a)) {
+        if (!Array.isArray(b) || a.length !== b.length)
+            return false;
+        return a.every((val, i) => isEqual(val, b[i]));
+    }
+    if (typeof a === 'object') {
+        const aKeys = Object.keys(a);
+        const bKeys = Object.keys(b);
+        if (aKeys.length !== bKeys.length)
+            return false;
+        return aKeys.every(key => b.hasOwnProperty(key) && isEqual(a[key], b[key]));
+    }
+    return false;
+}
+exports.isEqual = isEqual;
+//# sourceMappingURL=object.js.map

package/dist/util/object.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"object.js","sourceRoot":"","sources":["../../src/util/object.ts"],"names":[],"mappings":";;;AAAA,SAAgB,QAAQ,CAAC,GAAQ;IAC/B,OAAO,OAAO,GAAG,KAAK,QAAQ,IAAI,GAAG,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;AACxE,CAAC;AAFD,4BAEC;AAED,SAAS,MAAM,CAAC,MAAW,EAAE,MAAW;IACtC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;QAAE,OAAO,MAAM,CAAC;IAE1D,KAAK,MAAM,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;QAC3B,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;QAE3B,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC;YACnD,MAAM,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACtC,CAAC;aAAM,IAAI,QAAQ,CAAC,MAAM,CAAC,IAAI,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;YAChD,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QACzB,CAAC;aAAM,CAAC;YACN,MAAM,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;QACvB,CAAC;IACH,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC;AAID,SAAgB,KAAK,CAAC,MAAmB,EAAE,GAAG,OAAsB;IAClE,OAAO,OAAO,CAAC,MAAM,CAAC,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE;QAC1C,OAAO,KAAK,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAClC,CAAC,EAAE,MAAM,CAAC,CAAA;AACZ,CAAC;AAJD,sBAIC;AAED,SAAgB,OAAO,CAAC,CAAM,EAAE,CAAM;IACpC,IAAI,CAAC,KAAK,CAAC;QAAE,OAAO,IAAI,CAAC;IAEzB,IAAI,OAAO,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,IAAI;QAAE,OAAO,KAAK,CAAC;IAElE,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;QACrB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,MAAM;YAAE,OAAO,KAAK,CAAC;QAC7D,OAAO,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACjD,CAAC;IAED,IAAI,OAAO,CAAC,KAAK,QAAQ,EAAE,CAAC;QAC1B,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC7B,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAC7B,IAAI,KAAK,CAAC,MAAM,KAAK,KAAK,CAAC,MAAM;YAAE,OAAO,KAAK,CAAC;QAEhD,OAAO,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;IAC9E,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC;AAnBD,0BAmBC"}

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "glotstack",
+  "version": "0.0.0",
+  "main": "dist/index.js",
+  "author": "JD Cumpson",
+  "license": "MIT",
+  "private": false,
+  "dependencies": {
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.1",
+    "react": "^18.3.1",
+    "typescript": "5.4.4",
+    "typescript-eslint": "^8.17.0"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1"
+  },
+  "bin": {
+    "glotstack": "dist/glotstack-ci.js"
+  },
+  "scripts": {
+    "build": "tsc",
+    "prepublishOnly": "yarn run build"
+  }
+}

package/src/index.tsx

@@ -0,0 +1,150 @@
+import * as React from 'react'
+import { merge, isEqual } from './util/object'
+
+export type LocaleRegion =
+  | 'en'
+  | 'en-US'
+  | 'en-US-genz'
+  | 'fr-FR'
+  | 'de-DE'
+  | 'nl-NL'
+  | 'jp-JP'
+  | string
+
+
+export interface TranslationLeaf {
+  value: string
+  context?: string
+}
+
+export interface Translations {
+  [key: string]: Translations | TranslationLeaf
+}
+
+export interface ContextType {
+  translations: Translations
+  requireTranslations: (localeRegion: string) => Promise<unknown>
+  setLocale: (locale: LocaleRegion) => Promise<unknown>
+  locale: string | null
+  t: (key: string, options?: { locale?: LocaleRegion }) => string
+}
+
+export const GlotstackContext = React.createContext<ContextType>({
+  translations: {},
+  requireTranslations: () => Promise.resolve(),
+  setLocale: (_locale: LocaleRegion) => Promise.resolve(),
+  locale: null,
+  t: () => '',
+})
+
+export const Provider = ({ children, locale: defaultLocale, onUpdated, initialTranslations, onLocaleChange }: {
+  children: React.ReactNode; locale: string; onUpdated: (value: ContextType) => void
+  initialTranslations?: Translations
+  onLocaleChange: (locale: string | null, value: ContextType) => void
+}) => {
+  const [translations, setTranslations] = React.useState<Translations>(initialTranslations ?? {})
+  const loadingRef = React.useRef<Record<string, Promise<{ default: string }>>>({})
+  const [locale, setLocalLocale] = React.useState(defaultLocale)
+
+  React.useEffect(() => {
+    setLocalLocale(defaultLocale)
+  }, [defaultLocale])
+
+  const requireTranslations = React.useMemo(() => {
+    return (locale: string) => {
+      const current = translations?.[locale]
+      if (current != null) {
+        return Promise.resolve()
+      }
+      if (loadingRef.current?.[locale] == null) {
+        loadingRef.current[locale] = import(`domains/application/translations/${locale}.json`)
+      }
+      loadingRef.current[locale].then(async (Module) => {
+        if (Module?.default != null) {
+          const data = await (await fetch(Module.default)).json()
+          setTranslations(merge({}, translations, { [locale]: data }))
+        }
+      })
+      return loadingRef.current[locale]
+    }
+  }, [locale, translations])
+
+  const t = React.useMemo(() => (key: string, options?: { locale?: LocaleRegion }) => {
+    React.useEffect(() => {
+      if (options?.locale == null) {
+        return
+      }
+      requireTranslations(options?.locale)?.then(() => {
+        if (options?.locale == null) {
+          return
+        }
+        setLocale(options?.locale)
+      })
+    }, [locale])
+
+    if (translations === null) {
+      return key
+    }
+
+    const access = [...key.split('.')] as [LocaleRegion, ...string[]]
+    const localeTranslations = translations?.[locale]
+
+    if (localeTranslations == null) {
+      return key
+    }
+
+    const value = access.reduce((acc: Translations[string], key) => {
+      // @ts-expect-error expected
+      return acc?.[key]
+    }, localeTranslations)
+
+    return (value?.value ?? key) as string
+  }, [translations, requireTranslations])
+
+  const setLocale = React.useMemo(() => (locale: LocaleRegion) => {
+    setLocalLocale(locale)
+    return requireTranslations(locale).then(_ => {
+      onLocaleChange(valueRef.current.locale, valueRef.current)
+    })
+  }, [setLocalLocale, requireTranslations])
+
+  const valueRef = React.useRef<ContextType>({
+    requireTranslations,
+    locale,
+    translations: initialTranslations ?? {},
+    setLocale,
+    t
+  })
+
+  const current = valueRef.current
+
+  React.useEffect(() => {
+    valueRef.current = {
+      translations,
+      requireTranslations,
+      setLocale,
+      locale,
+      t
+    }
+
+    if (!isEqual(valueRef.current, current)) {
+      onUpdated?.(valueRef.current)
+    }
+
+  }, [locale, translations, requireTranslations])
+
+  React.useEffect(() => {
+    requireTranslations(locale)
+  }, [requireTranslations, locale])
+
+  return <GlotstackContext.Provider value={valueRef.current}>
+    {children}
+  </GlotstackContext.Provider>
+}
+
+
+export const useTranslations = (_options?: Record<never, never>) => {
+  const context = React.useContext(GlotstackContext)
+  return context
+}
+

package/src/util/object.ts

@@ -0,0 +1,52 @@
+export function isObject(val: any): val is Record<string, any> {
+  return typeof val === 'object' && val !== null && !Array.isArray(val);
+}
+
+function _merge(target: any, source: any): any {
+  if (!isObject(target) || !isObject(source)) return target;
+
+  for (const key of Object.keys(source)) {
+    const srcVal = source[key];
+    const tgtVal = target[key];
+
+    if (Array.isArray(srcVal) && Array.isArray(tgtVal)) {
+      target[key] = tgtVal.concat(srcVal);
+    } else if (isObject(srcVal) && isObject(tgtVal)) {
+      _merge(tgtVal, srcVal);
+    } else {
+      target[key] = srcVal;
+    }
+  }
+
+  return target;
+}
+
+type MergeTarget = Record<string|number|symbol, any>
+
+export function merge(target: MergeTarget, ...sources: MergeTarget[]): MergeTarget {
+  return sources.reduce((previous, current) => {
+    return merge(previous, current);
+  }, target)
+}
+
+export function isEqual(a: any, b: any): boolean {
+  if (a === b) return true;
+
+  if (typeof a !== typeof b || a == null || b == null) return false;
+
+  if (Array.isArray(a)) {
+    if (!Array.isArray(b) || a.length !== b.length) return false;
+    return a.every((val, i) => isEqual(val, b[i]));
+  }
+
+  if (typeof a === 'object') {
+    const aKeys = Object.keys(a);
+    const bKeys = Object.keys(b);
+    if (aKeys.length !== bKeys.length) return false;
+
+    return aKeys.every(key => b.hasOwnProperty(key) && isEqual(a[key], b[key]));
+  }
+
+  return false;
+}
+

package/tsconfig.json

@@ -0,0 +1,25 @@
+{
+  "exclude": ["node_modules", "dist"],
+  "external": ["react", "react-dom"],
+  "include": ["./"],
+  "files": ["./types/global.d.ts"],
+  "compilerOptions": {
+    "outDir": "dist",
+    "target": "ES6",
+    "module": "CommonJS",
+    "declaration": true,
+    "strict": true,
+    "jsx": "react-jsx",
+    "sourceMap": true,
+    "baseUrl": ".",
+    "paths": {
+    },
+    "rootDirs": ["./*"],
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "noImplicitAny": true,
+    "noImplicitThis": true,
+    "strictNullChecks": true
+  }
+}

package/types/global.d.ts

@@ -0,0 +1,7 @@
+declare module '*.png'
+declare module '*.svg'
+declare module '*.jpeg'
+declare module '*.jpg'
+declare module '*.webp'
+declare module '*.lottie'
+declare module '*.json'