@yiiamee/multilinguist 1.0.0

package/README.md

@@ -0,0 +1,18 @@
+# Nuxt MultiLinguist module
+
+[![npm version][npm-version-src]][npm-version-href]
+[![npm downloads][npm-downloads-src]][npm-downloads-href]
+[![License][license-src]][license-href]
+[![Nuxt][nuxt-src]][nuxt-href]
+
+This module is a simple, but smoothly working module for easy and seamless localization implementation in Nuxt 3. 
+
+## Features
+
+## Quick Setup
+
+Install the module to your Nuxt application with one command:
+
+```bash
+npx nuxi module add @nuxtjs/multilinguist
+```

package/dist/module.d.mts

@@ -0,0 +1,5 @@
+import * as _nuxt_schema from '@nuxt/schema';
+
+declare const _default: _nuxt_schema.NuxtModule<_nuxt_schema.ModuleOptions, _nuxt_schema.ModuleOptions, false>;
+
+export { _default as default };

package/dist/module.json

@@ -0,0 +1,9 @@
+{
+  "name": "multilinguist",
+  "configKey": "multilinguist",
+  "version": "0.0.1",
+  "builder": {
+    "@nuxt/module-builder": "1.0.1",
+    "unbuild": "3.5.0"
+  }
+}

package/dist/module.mjs

@@ -0,0 +1,86 @@
+import { defineNuxtModule, createResolver, addPlugin, addImportsDir, addTypeTemplate } from '@nuxt/kit';
+import fs from 'fs';
+import path from 'path';
+
+function GenerateLocaleKeysPlugin(defaultLocaleFromConfig, localesPath, outPath) {
+  async function generateTypes() {
+    const defaultLocalePath = path.join(localesPath, `${defaultLocaleFromConfig}.json`);
+    if (!fs.existsSync(defaultLocalePath)) {
+      console?.error(`Default locale file not found: ${defaultLocalePath}`);
+      return;
+    }
+    const json = JSON.parse(fs.readFileSync(defaultLocalePath, "utf-8"));
+    const keys = Object.keys(json);
+    const output = [
+      `// AUTO-GENERATED FILE \u2014 DO NOT EDIT MANUALLY`,
+      `export interface TranslationMessages {`,
+      ...keys.map((key) => `  ${JSON.stringify(key)}: string;`),
+      `}`,
+      ``,
+      `export type LocaleKey = keyof TranslationMessages;`
+    ].join("\n");
+    fs.mkdirSync(path.dirname(outPath), { recursive: true });
+    fs.writeFileSync(outPath, output, "utf-8");
+    console?.warn(`Generated types/generated-locales.d.ts from ${defaultLocalePath}`);
+  }
+  return {
+    name: "vite-plugin-generate-locales-types",
+    async buildStart() {
+      await generateTypes();
+    },
+    async handleHotUpdate(ctx) {
+      if (ctx.file.endsWith(".json") && ctx.file.includes(localesPath)) {
+        await generateTypes();
+      }
+    }
+  };
+}
+
+const module = defineNuxtModule({
+  meta: {
+    name: "multilinguist",
+    configKey: "multilinguist",
+    version: "0.0.1"
+  },
+  setup(moduleOptions, nuxtApp) {
+    const resolver = createResolver(import.meta.url);
+    addPlugin(resolver.resolve("./runtime/plugin"));
+    addImportsDir(resolver.resolve("runtime/composables"));
+    addTypeTemplate({
+      filename: "types/multilinguist.d.ts",
+      getContents: () => `
+        import type { TranslationMessages } from './generated-locales'
+
+        declare module '#app' {
+          interface NuxtApp {
+            $t: (key: keyof TranslationMessages) => string
+          }
+        }
+
+        declare module 'vue' {
+          interface ComponentCustomProperties {
+            $t: (key: keyof TranslationMessages) => string
+          }
+        }
+      `
+    });
+    nuxtApp.hook("vite:extendConfig", (viteConfig) => {
+      viteConfig.plugins = viteConfig.plugins || [];
+      viteConfig.plugins.push(GenerateLocaleKeysPlugin(moduleOptions.defaultLocale, `${nuxtApp.options.rootDir}/public/locales`, resolver.resolve("./runtime/types/generated-locales.d.ts")));
+    });
+    nuxtApp.hook("prepare:types", ({ references }) => {
+      references.push({
+        path: resolver.resolve("./runtime/types/generated-locales.d.ts")
+      });
+      references.push({
+        path: resolver.resolve("./runtime/types/multilinguist.d.ts")
+      });
+    });
+    nuxtApp.options.runtimeConfig.public.multilinguist = {
+      defaultLocale: moduleOptions.defaultLocale,
+      supportedLanguages: moduleOptions.supportedLanguages
+    };
+  }
+});
+
+export { module as default };

package/dist/runtime/composables/useLocale.d.ts

@@ -0,0 +1,4 @@
+import type { Locale, TranslationMap } from "./useLocalization.js";
+export default function useLocale<const T extends TranslationMap>(supportedLanguages: T, defaultLocale: Locale<T>): {
+    locale: any;
+};

package/dist/runtime/composables/useLocale.js

@@ -0,0 +1,16 @@
+export default function useLocale(supportedLanguages, defaultLocale) {
+  const locale = computed(() => {
+    if (import.meta.server) {
+      const headers = useRequestHeaders(["accept-language"]);
+      const locale2 = headers["accept-language"]?.split(",")[0]?.split("-")[0] || defaultLocale;
+      return supportedLanguages.includes(locale2) ? locale2 : defaultLocale;
+    } else if (import.meta.client) {
+      const locale2 = navigator.language || defaultLocale;
+      return supportedLanguages.includes(locale2) ? locale2 : defaultLocale;
+    }
+    return defaultLocale;
+  });
+  return {
+    locale
+  };
+}

package/dist/runtime/composables/useLocalization.d.ts

@@ -0,0 +1,11 @@
+import type { LocaleKey } from "../types/generated-locales.js";
+export type TranslationMap = readonly string[];
+export type Locale<T extends TranslationMap> = T[number];
+export type LocaleKeys<T extends TranslationMap> = T[keyof T];
+export type TMultilinguistResponse<T extends TranslationMap> = {
+    t: (key: LocaleKey) => string;
+    setLocale: (locale: Locale<T>) => void;
+    initLocalization: () => Promise<void>;
+    locale: Ref<Locale<T>>;
+};
+export default function useLocalization<const T extends TranslationMap>(supportedLanguages: T, defaultLocale: Locale<T>): TMultilinguistResponse<T>;

package/dist/runtime/composables/useLocalization.js

@@ -0,0 +1,50 @@
+import useLocale from "../composables/useLocale.js";
+export default function useLocalization(supportedLanguages, defaultLocale) {
+  const userSelectedLocale = useCookie("multilinguist-locale", { default: () => defaultLocale });
+  const { locale: userBrowserLocale } = useLocale(supportedLanguages, defaultLocale);
+  const loadedLanguages = useState("loaded-languages", () => ({}));
+  const loadDefaultLocale = async () => {
+    if (!loadedLanguages.value[defaultLocale]) {
+      const messages = await import(`@/public/locales/${defaultLocale}.json`);
+      loadedLanguages.value[defaultLocale] = messages.default;
+    }
+  };
+  const userPrefferableLocale = computed(() => {
+    return userSelectedLocale.value ? userSelectedLocale.value : userBrowserLocale.value;
+  });
+  const locale = useState(() => {
+    return userPrefferableLocale.value || defaultLocale;
+  });
+  const t = (key) => {
+    const localeKeys = loadedLanguages.value[locale.value];
+    return String(localeKeys?.[key] || key);
+  };
+  const setLocale = async (newLocale) => {
+    if (!loadedLanguages.value[newLocale] && supportedLanguages.includes(newLocale)) {
+      const loadedLocale = await import(`@/public/locales/${newLocale}.json`).then(
+        (module) => module.default || module
+      );
+      loadedLanguages.value[newLocale] = loadedLocale;
+    }
+    userSelectedLocale.value = newLocale;
+    locale.value = newLocale;
+  };
+  const initLocalization = async () => {
+    await loadDefaultLocale();
+    await setLocale(userPrefferableLocale.value);
+  };
+  watch(
+    () => locale.value,
+    async (val) => {
+      if (val !== userSelectedLocale.value) {
+        userSelectedLocale.value = val;
+      }
+    }
+  );
+  return {
+    t,
+    setLocale,
+    initLocalization,
+    locale
+  };
+}

package/dist/runtime/composables/useMultilinguist.d.ts

@@ -0,0 +1,6 @@
+export default function useMultilinguist(): {
+    t: (key: import("../types/generated-locales.js").LocaleKey) => string;
+    setLocale: (locale: string) => void;
+    initLocalization: () => Promise<void>;
+    locale: Ref<import("./useLocalization.js").Locale<T>>;
+};

package/dist/runtime/composables/useMultilinguist.js

@@ -0,0 +1,8 @@
+export default function useMultilinguist() {
+  const nuxtApp = useNuxtApp();
+  const localization = nuxtApp.$localization || nuxtApp._localization;
+  if (!localization) {
+    throw new Error("Localization plugin not initialized");
+  }
+  return { ...localization };
+}

package/dist/runtime/plugin.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/runtime/plugin.js

@@ -0,0 +1,15 @@
+import useLocalization from "../runtime/composables/useLocalization";
+export default defineNuxtPlugin(async (nuxtApp) => {
+  const config = useRuntimeConfig().public.multilinguist || {
+    defaultLocale: "en",
+    supportedLanguages: ["en"]
+  };
+  const supportedLanguages = config.supportedLanguages;
+  const defaultLocale = config.defaultLocale;
+  const localization = useLocalization(supportedLanguages, defaultLocale);
+  await localization.initLocalization();
+  console.log("[multilinguist] is initialised", config.supportedLanguages, config.defaultLocale);
+  nuxtApp.provide("localization", localization);
+  nuxtApp.provide("t", localization.t);
+  nuxtApp._localization = localization;
+});

package/dist/runtime/server/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "../../../.nuxt/tsconfig.server.json",
+}

package/dist/runtime/types/generated-locales.d.ts

@@ -0,0 +1,7 @@
+// AUTO-GENERATED FILE — DO NOT EDIT MANUALLY
+export interface TranslationMessages {
+  "Hello, World": string;
+  "Switch Locale": string;
+}
+
+export type LocaleKey = keyof TranslationMessages;

package/dist/types.d.mts

@@ -0,0 +1,7 @@
+import type { NuxtModule } from '@nuxt/schema'
+
+import type { default as Module } from './module.mjs'
+
+export type ModuleOptions = typeof Module extends NuxtModule<infer O> ? Partial<O> : Record<string, any>
+
+export { default } from './module.mjs'

package/package.json

@@ -0,0 +1,53 @@
+{
+  "name": "@yiiamee/multilinguist",
+  "version": "1.0.0",
+  "description": "Nuxt 3 Multilinguist Localization module",
+  "repository": "yiiameeMich/multilinguist",
+  "license": "MIT",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/types.d.mts",
+      "import": "./dist/module.mjs"
+    }
+  },
+  "main": "./dist/module.mjs",
+  "typesVersions": {
+    "*": {
+      ".": [
+        "./dist/types.d.mts"
+      ]
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "prepack": "nuxt-module-build build",
+    "dev": "nuxi dev playground",
+    "dev:build": "nuxi build playground",
+    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
+    "release": "npm run lint && npm run test && npm run prepack && changelogen --release && npm publish && git push --follow-tags",
+    "lint": "eslint .",
+    "test": "vitest run",
+    "test:watch": "vitest watch",
+    "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit"
+  },
+  "dependencies": {
+    "@nuxt/kit": "^3.17.4"
+  },
+  "devDependencies": {
+    "@nuxt/devtools": "^2.4.1",
+    "@nuxt/eslint-config": "^1.4.1",
+    "@nuxt/module-builder": "^1.0.1",
+    "@nuxt/schema": "^3.17.4",
+    "@nuxt/test-utils": "^3.19.1",
+    "@types/node": "latest",
+    "changelogen": "^0.6.1",
+    "eslint": "^9.27.0",
+    "nuxt": "^3.17.4",
+    "typescript": "~5.8.3",
+    "vitest": "^3.1.4",
+    "vue-tsc": "^2.2.10"
+  }
+}