@uipkge/nuxt 0.1.15 → 0.1.17

package/README.md

@@ -104,12 +104,23 @@ i18now: {
 
 ## Playground
 
-A minimal playground is included in `playground/`. To run it:
+A minimal playground is included in `playground/`. It runs on **port 3227**.
 
 ```bash
 pnpm dev:playground
 ```
 
+### Framework playground ports
+
+All SDK playgrounds use fixed ports so they can run simultaneously alongside the i18now server (port 3220):
+
+| Package | Port |
+|---|---|
+| `@uipkge/react` | 3224 |
+| `@uipkge/vue` | 3225 |
+| `@uipkge/next` | 3226 |
+| `@uipkge/nuxt` | 3227 |
+
 ## Building locally
 
 ```bash

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.0.0"
   },
-  "version": "0.1.15",
+  "version": "0.1.17",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/module.mjs

@@ -49,11 +49,18 @@ const module$1 = defineNuxtModule({
       src: resolver.resolve("./runtime/plugin"),
       mode: "server"
     });
-    addImports({
-      name: "useI18now",
-      as: "useI18now",
-      from: resolver.resolve("./runtime/composables/useI18n")
-    });
+    addImports([
+      {
+        name: "useI18now",
+        as: "useI18now",
+        from: resolver.resolve("./runtime/composables/useI18n")
+      },
+      {
+        name: "useI18nowLocales",
+        as: "useI18nowLocales",
+        from: resolver.resolve("./runtime/composables/useI18nowLocales")
+      }
+    ]);
     if (nuxt.options.dev) {
       addPlugin({
         src: resolver.resolve("./runtime/plugin.client"),

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

@@ -0,0 +1,34 @@
+export interface I18nowLocale {
+    code: string;
+    name: string;
+    nativeName: string;
+    isSource: boolean;
+}
+/**
+ * Returns the list of locales published in the i18now dashboard.
+ *
+ * Fetches `{cdnUrl}/{projectId}/locales.json` (written on every publish)
+ * so the app auto-discovers new languages without code changes or redeployment.
+ *
+ * Usage:
+ * ```vue
+ * <script setup>
+ * const { locales, sourceLocale, pending } = useI18nowLocales()
+ * </script>
+ *
+ * <template>
+ *   <select @change="setLocale($event.target.value)">
+ *     <option v-for="l in locales" :key="l.code" :value="l.code">
+ *       {{ l.nativeName }}
+ *     </option>
+ *   </select>
+ * </template>
+ * ```
+ */
+export declare function useI18nowLocales(): {
+    locales: import("vue").ComputedRef<any>;
+    sourceLocale: import("vue").ComputedRef<any>;
+    pending: any;
+    error: any;
+    refresh: any;
+};

package/dist/runtime/composables/useI18nowLocales.js

@@ -0,0 +1,21 @@
+import { useAsyncData, useRuntimeConfig } from "#app";
+import { computed } from "vue";
+export function useI18nowLocales() {
+  const { projectId, cdnUrl } = useRuntimeConfig().public.i18now;
+  const { data, pending, error, refresh } = useAsyncData(
+    "i18now-locales",
+    async () => {
+      if (!projectId) return [];
+      const url = `${cdnUrl}/${projectId}/locales.json`;
+      const res = await fetch(url, { signal: AbortSignal.timeout(5e3) });
+      if (!res.ok) return [];
+      const data2 = await res.json();
+      if (!Array.isArray(data2)) return [];
+      return data2;
+    },
+    { default: () => [] }
+  );
+  const locales = computed(() => data.value ?? []);
+  const sourceLocale = computed(() => data.value?.find((l) => l.isSource) ?? null);
+  return { locales, sourceLocale, pending, error, refresh };
+}

package/dist/runtime/plugin.client.js

@@ -107,7 +107,13 @@ export default defineNuxtPlugin(async (nuxtApp) => {
       }
     }
   }
-  await loadLocale(locale);
+  let currentLocale = locale;
+  const ssrKeys = nuxtApp.payload.i18nowCdnKeys;
+  if (ssrKeys && ssrKeys.length > 0) {
+    syncer.setExistingKeys(ssrKeys);
+  } else {
+    await loadLocale(locale);
+  }
   const originalGlobalT = nuxtApp.vueApp.config.globalProperties.$t;
   if (originalGlobalT) {
     nuxtApp.vueApp.config.globalProperties.$t = function(key, defaultValue, ...rest) {
@@ -120,6 +126,8 @@ export default defineNuxtPlugin(async (nuxtApp) => {
     };
   }
   nuxtApp.hook("i18n:beforeLocaleSwitch", async ({ newLocale }) => {
+    if (newLocale === currentLocale) return;
+    currentLocale = newLocale;
     await loadLocale(newLocale);
   });
   return {

package/dist/runtime/plugin.js

@@ -24,6 +24,7 @@ export default defineNuxtPlugin(async (nuxtApp) => {
       }
       const messages = data;
       if (i18n) i18n.setLocaleMessage(locale, messages);
+      nuxtApp.payload.i18nowCdnKeys = Object.keys(messages);
     } catch (err) {
       if (import.meta.dev) {
         console.warn(`[i18now] Failed to load locale '${locale}' from CDN:`, err);
@@ -31,8 +32,11 @@ export default defineNuxtPlugin(async (nuxtApp) => {
     }
   }
   const currentLocale = i18n?.locale?.value ?? i18n?.locale ?? configLocale;
+  let activeLocale = currentLocale;
   await loadLocale(currentLocale);
   nuxtApp.hook("i18n:beforeLocaleSwitch", async ({ newLocale }) => {
+    if (newLocale === activeLocale) return;
+    activeLocale = newLocale;
     await loadLocale(newLocale);
   });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uipkge/nuxt",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -42,7 +42,7 @@
   "scripts": {
     "build": "nuxt-module-build build",
     "dev": "nuxt-module-build prepare",
-    "dev:playground": "nuxi dev playground",
+    "dev:playground": "nuxi dev playground --port 3227",
     "test": "vitest run",
     "test:watch": "vitest",
     "test:coverage": "vitest run --coverage",