@saasicat/ui-vue 0.5.0 → 0.7.0

package/README.md

@@ -80,6 +80,23 @@ pnpm create saasicat-admin admin --project-key=myapp
 See the [quickstart](https://github.com/uelker70/saasicat/blob/main/docs/quickstart.md) (step 9) for the full setup
 and the [handbook](https://github.com/uelker70/saasicat/blob/main/docs/handbook.md) for the architecture.
 
+## Language
+
+The UI ships German (reference) and English catalogs — plain typed objects, no
+`vue-i18n` dependency. German is the default:
+
+```ts
+createSuperAdminApp({
+    // …
+    i18n: { locale: 'en' },
+});
+```
+
+Pass a `Ref<SaLocale>` instead of a literal to switch at runtime, and
+`i18n.overrides` to replace individual strings per locale. Components read the
+catalog via `useSaMessages('<namespace>')` / `useSuperAdminI18n()`.
+See [handbook §8.6](https://github.com/uelker70/saasicat/blob/main/docs/handbook.md#86-ui-language-i18n).
+
 ## Build
 
 ```bash

package/dist/{chunk-EH7TOD4H.js → chunk-A3W2N26K.js}

@@ -1,7 +1,12 @@
 import {
+  DEFAULT_SA_LOCALE,
+  SA_INTL_LOCALES,
   defaultHttpClient,
-  defaultKvStore
-} from "./chunk-LVGUSD3T.js";
+  defaultKvStore,
+  formatMessage,
+  navMessages,
+  planVersionsMessages
+} from "./chunk-X5SQ5HMB.js";
 
 // src/client/version.ts
 var ADMIN_UI_VERSION = "1.2.0";
@@ -64,7 +69,7 @@ var BootLoader = class {
   constructor(options) {
     if (!options?.endpoint) {
       throw new Error(
-        'BootLoader: `endpoint` ist Pflicht (z. B. "/api/admin/boot" oder "/api/v1/admin/boot"). Plattform hat keinen Default, weil Apps unterschiedliche globalPrefix-Konventionen haben.'
+        'BootLoader: `endpoint` is required (e.g. "/api/admin/boot" or "/api/v1/admin/boot"). The platform has no default because apps use different globalPrefix conventions.'
       );
     }
     this.endpoint = options.endpoint;
@@ -98,7 +103,7 @@ var ManifestLoader = class {
   constructor(options) {
     if (!options?.endpoint) {
       throw new Error(
-        'ManifestLoader: `endpoint` ist Pflicht (z. B. "/api/admin/manifest" oder "/api/v1/admin/manifest"). Plattform hat keinen Default, weil Apps unterschiedliche globalPrefix-Konventionen haben.'
+        'ManifestLoader: `endpoint` is required (e.g. "/api/admin/manifest" or "/api/v1/admin/manifest"). The platform has no default because apps use different globalPrefix conventions.'
       );
     }
     this.endpoint = options.endpoint;
@@ -125,7 +130,7 @@ var ManifestLoader = class {
       if (!cachedBody) {
         throw new ManifestLoadError(
           304,
-          "Server lieferte 304, aber Cache-Body fehlt \u2014 bitte clearCache() + reload"
+          "Server returned 304 but the cache body is missing \u2014 call clearCache() and reload"
         );
       }
       return cachedBody.body;
@@ -175,28 +180,10 @@ var DEFAULT_STANDARD_PAGE_ROUTES = {
   pilots: "/admin/pilots",
   discovery: "/admin/discovery",
   bundles: "/admin/bundles",
-  businessTypes: "/admin/business-types",
   marketingCatalog: "/admin/marketing-catalog",
   platformEmail: "/admin/platform-email",
   platformEmailHistory: "/admin/platform-email-history"
 };
-var DEFAULT_LABELS = {
-  dashboard: "Dashboard",
-  tenants: "Mandanten",
-  subscriptions: "Abonnements",
-  promoCodes: "Promo-Codes",
-  plans: "Pl\xE4ne & Versionen",
-  planVersions: "Plan-Versionen",
-  audit: "Audit-Log",
-  users: "Benutzer",
-  pilots: "Piloten",
-  discovery: "Discovery",
-  bundles: "Bundles",
-  businessTypes: "Gesch\xE4ftstypen",
-  marketingCatalog: "Marketing-Catalog",
-  platformEmail: "Plattform-E-Mail",
-  platformEmailHistory: "E-Mail-Verlauf"
-};
 var DEFAULT_ICONS = {
   dashboard: "dashboard",
   tenants: "business",
@@ -209,42 +196,42 @@ var DEFAULT_ICONS = {
   pilots: "flight_takeoff",
   discovery: "travel_explore",
   bundles: "inventory_2",
-  businessTypes: "category",
   marketingCatalog: "campaign",
   platformEmail: "mail",
   platformEmailHistory: "mark_email_read"
 };
-var DEFAULT_NAV_SECTIONS = {
-  dashboard: "\xDCbersicht",
-  discovery: "Produktkatalog",
-  businessTypes: "Produktkatalog",
-  bundles: "Produktkatalog",
-  plans: "Produktkatalog",
-  planVersions: "Produktkatalog",
-  marketingCatalog: "Produktkatalog",
-  promoCodes: "Produktkatalog",
-  tenants: "Kunden",
-  subscriptions: "Kunden",
-  users: "Kunden",
-  pilots: "Kunden",
-  audit: "System",
-  platformEmail: "System",
-  platformEmailHistory: "System"
+var PAGE_SECTIONS = {
+  dashboard: "overview",
+  discovery: "catalog",
+  bundles: "catalog",
+  plans: "catalog",
+  planVersions: "catalog",
+  marketingCatalog: "catalog",
+  promoCodes: "catalog",
+  tenants: "customers",
+  subscriptions: "customers",
+  users: "customers",
+  pilots: "customers",
+  audit: "system",
+  platformEmail: "system",
+  platformEmailHistory: "system"
 };
-var DEFAULT_SECTION_ORDER = [
-  "\xDCbersicht",
-  "Produktkatalog",
-  "Kunden",
-  "System"
-];
+function defaultSectionOrder(locale = DEFAULT_SA_LOCALE) {
+  const sections = navMessages[locale].sections;
+  return [sections.overview, sections.catalog, sections.customers, sections.system];
+}
 function buildRoutes(manifest, options = {}) {
   const routes = [];
   const capabilities = manifest.capabilities ?? {};
   const standard = manifest.navigation?.standardPages ?? {};
+  const nav = navMessages[options.locale ?? DEFAULT_SA_LOCALE];
+  const defaultNavSections = Object.fromEntries(
+    Object.entries(PAGE_SECTIONS).map(([page, section]) => [page, nav.sections[section]])
+  );
   const overrideRoutes = { ...DEFAULT_STANDARD_PAGE_ROUTES, ...options.standardPageRoutes };
-  const overrideLabels = { ...DEFAULT_LABELS, ...options.standardPageLabels };
+  const overrideLabels = { ...nav.pages, ...options.standardPageLabels };
   const overrideIcons = { ...DEFAULT_ICONS, ...options.standardPageIcons };
-  const overrideNavSection = { ...DEFAULT_NAV_SECTIONS, ...options.standardPageNavSection };
+  const overrideNavSection = { ...defaultNavSections, ...options.standardPageNavSection };
   for (const key of Object.keys(standard)) {
     const def = standard[key];
     if (!def?.enabled) continue;
@@ -281,7 +268,7 @@ function buildRoutes(manifest, options = {}) {
   }
   return routes;
 }
-function buildSidebar(routes, sectionOrder = DEFAULT_SECTION_ORDER) {
+function buildSidebar(routes, sectionOrder = defaultSectionOrder()) {
   const bySection = /* @__PURE__ */ new Map();
   for (const r of routes) {
     const section = r.navSection ?? null;
@@ -314,7 +301,7 @@ function resolveExtension(componentKey, extensions) {
 var MissingHandlerError = class extends Error {
   constructor(actionKey) {
     super(
-      `Kein Handler f\xFCr actionKey "${actionKey}" registriert. Konsument-Shell muss \`actions["${actionKey}"]\` bereitstellen.`
+      `No handler registered for actionKey "${actionKey}". The consumer shell must provide \`actions["${actionKey}"]\`.`
     );
     this.name = "MissingHandlerError";
   }
@@ -322,7 +309,7 @@ var MissingHandlerError = class extends Error {
 var ActionDefNotInManifestError = class extends Error {
   constructor(actionKey) {
     super(
-      `actionKey "${actionKey}" ist im Manifest nicht deklariert. Bitte als TenantAction in einer ManifestContribution registrieren.`
+      `actionKey "${actionKey}" is not declared in the manifest. Register it as a TenantAction in a ManifestContribution.`
     );
     this.name = "ActionDefNotInManifestError";
   }
@@ -466,12 +453,12 @@ var BatchColumnFetcher = class {
   }
   validateBatchEndpoint(col) {
     if (!col.endpoint || col.endpoint.trim().length === 0) {
-      throw new BatchColumnDriftError(col, "endpoint ist leer");
+      throw new BatchColumnDriftError(col, "endpoint is empty");
     }
     if (col.endpoint.includes("{slug}") || col.endpoint.includes("{tenantId}")) {
       throw new BatchColumnDriftError(
         col,
-        "endpoint enth\xE4lt per-Tenant-Placeholder ({slug}/{tenantId}). Spalten-Endpoints m\xFCssen batchf\xE4hig sein \u2014 bitte Backend auf `?tenantIds=...`-Parameter umstellen."
+        "endpoint contains per-tenant placeholders ({slug}/{tenantId}). Column endpoints must be batchable \u2014 switch the backend to a `?tenantIds=...` parameter."
       );
     }
   }
@@ -548,14 +535,20 @@ function resolvePlan(source, liveBase) {
     maxStorageGb: quotas.storageGb
   };
 }
-function dateLabelDe(iso) {
-  return new Date(iso).toLocaleDateString("de-DE", {
+function draftsTitle(draftCount, msg) {
+  if (draftCount === 0) return msg.draftsTitleEmpty;
+  const template = draftCount === 1 ? msg.draftsTitleOne : msg.draftsTitleMany;
+  return formatMessage(template, { count: draftCount });
+}
+function dateLabel(iso, locale) {
+  return new Date(iso).toLocaleDateString(SA_INTL_LOCALES[locale], {
     day: "2-digit",
     month: "short",
     year: "numeric"
   });
 }
-function buildDraftsSnapshot(data, sortPlansFn) {
+function buildDraftsSnapshot(data, sortPlansFn, locale) {
+  const msg = planVersionsMessages[locale].catalog;
   const planByKey = groupBy(data.planVersions, (r) => r.planId);
   const plans = [];
   for (const [, rows] of planByKey) {
@@ -569,9 +562,9 @@ function buildDraftsSnapshot(data, sortPlansFn) {
     id: "drafts",
     kind: "drafts",
     status: "DRAFT",
-    label: "Arbeitsstand",
-    title: draftCount === 0 ? "Keine offenen Drafts" : `${draftCount} offene${draftCount === 1 ? "r" : ""} Draft${draftCount === 1 ? "" : "s"} bereit f\xFCr Publish`,
-    description: draftCount === 0 ? "Lege einen Draft an, um Limits, Preise oder Features zu \xE4ndern. Drafts sind ohne MFA editierbar und werden erst beim Publish wirksam." : "Diese Tabelle zeigt, wie der Catalog nach Publish aller Drafts aussehen w\xFCrde. Bestehende Mandanten bleiben auf der vorherigen Version, bis sie aktiv migriert werden.",
+    label: msg.draftsLabel,
+    title: draftsTitle(draftCount, msg),
+    description: draftCount === 0 ? msg.draftsDescriptionEmpty : msg.draftsDescription,
     asOf: null,
     createdAt: null,
     publishedAt: null,
@@ -581,7 +574,8 @@ function buildDraftsSnapshot(data, sortPlansFn) {
     regressionCount: 0
   };
 }
-function buildActiveSnapshot(data, sortPlansFn) {
+function buildActiveSnapshot(data, sortPlansFn, locale) {
+  const msg = planVersionsMessages[locale].catalog;
   const planByKey = groupBy(data.planVersions, (r) => r.planId);
   const plans = [];
   for (const [, rows] of planByKey) {
@@ -595,9 +589,9 @@ function buildActiveSnapshot(data, sortPlansFn) {
     id: "active",
     kind: "active",
     status: "ACTIVE",
-    label: "Aktuell",
-    title: "Live-Catalog",
-    description: "Diese Plan-Versionen sind aktuell f\xFCr neue Onboardings und f\xFCr Renewals nach Stichtag aktiv.",
+    label: msg.activeLabel,
+    title: msg.activeTitle,
+    description: msg.activeDescription,
     asOf: latestPublished ?? null,
     createdAt: null,
     publishedAt: latestPublished ?? null,
@@ -607,7 +601,8 @@ function buildActiveSnapshot(data, sortPlansFn) {
     regressionCount: 0
   };
 }
-function buildHistoricalSnapshots(data, sortPlansFn) {
+function buildHistoricalSnapshots(data, sortPlansFn, locale) {
+  const msg = planVersionsMessages[locale].catalog;
   const allPublishedAt = /* @__PURE__ */ new Set();
   for (const r of data.planVersions) if (r.publishedAt) allPublishedAt.add(r.publishedAt);
   if (allPublishedAt.size === 0) return [];
@@ -637,9 +632,9 @@ function buildHistoricalSnapshots(data, sortPlansFn) {
       id: `hist-${ts}`,
       kind: "historical",
       status: "ARCHIVED",
-      label: dateLabelDe(ts),
-      title: summarizeEvent(publishedAtThisEvent),
-      description: detailEvent(publishedAtThisEvent),
+      label: dateLabel(ts, locale),
+      title: summarizeEvent(publishedAtThisEvent, msg),
+      description: detailEvent(publishedAtThisEvent, msg),
       asOf: ts,
       createdAt: ts,
       publishedAt: ts,
@@ -651,18 +646,18 @@ function buildHistoricalSnapshots(data, sortPlansFn) {
   }
   return out;
 }
-function summarizeEvent(rows) {
-  if (rows.length === 0) return "Publish-Event";
+function summarizeEvent(rows, msg) {
+  if (rows.length === 0) return msg.publishEvent;
   if (rows.length === 1) {
     const r = rows[0];
-    return `${r.planId} v${r.version} publiziert`;
+    return formatMessage(msg.publishEventSingle, { planId: r.planId, version: r.version });
   }
-  return `${rows.length} Versionen publiziert`;
+  return formatMessage(msg.publishEventMultiple, { count: rows.length });
 }
-function detailEvent(rows) {
+function detailEvent(rows, msg) {
   if (rows.length === 0) return "";
   const note = rows[0]?.changeNote ?? "";
-  return note.length > 0 ? note : "Snapshot rekonstruiert aus per-Entity-Versionen.";
+  return note.length > 0 ? note : msg.reconstructedSnapshot;
 }
 function sortPlansBy(order) {
   if (!order || order.length === 0) {
@@ -678,10 +673,11 @@ function sortPlansBy(order) {
   });
 }
 function buildSnapshots(data, options = {}) {
+  const locale = options.locale ?? DEFAULT_SA_LOCALE;
   const sortPlansFn = sortPlansBy(options.planSortOrder);
-  const drafts = buildDraftsSnapshot(data, sortPlansFn);
-  const active = buildActiveSnapshot(data, sortPlansFn);
-  const historical = buildHistoricalSnapshots(data, sortPlansFn);
+  const drafts = buildDraftsSnapshot(data, sortPlansFn, locale);
+  const active = buildActiveSnapshot(data, sortPlansFn, locale);
+  const historical = buildHistoricalSnapshots(data, sortPlansFn, locale);
   const out = [drafts];
   if (active) out.push(active);
   out.push(...historical);
@@ -704,7 +700,7 @@ export {
   ManifestLoadError,
   ManifestLoader,
   DEFAULT_STANDARD_PAGE_ROUTES,
-  DEFAULT_SECTION_ORDER,
+  defaultSectionOrder,
   buildRoutes,
   buildSidebar,
   resolveExtension,

package/dist/{chunk-3YP2ZAOD.js → chunk-QZOSDCNP.js}

@@ -1,3 +1,9 @@
+import {
+  DEFAULT_SA_LOCALE,
+  SA_INTL_LOCALES,
+  resolveMessages
+} from "./chunk-X5SQ5HMB.js";
+
 // src/vue/super-admin-context.ts
 var SUPER_ADMIN_BRAND_KEY = /* @__PURE__ */ Symbol.for(
   "@saasicat/ui-vue/SUPER_ADMIN_BRAND"
@@ -50,6 +56,31 @@ var SUPER_ADMIN_NOTIFY_KEY = /* @__PURE__ */ Symbol.for(
   "@saasicat/ui-vue/SUPER_ADMIN_NOTIFY"
 );
 
+// src/vue/use-super-admin-i18n.ts
+import { computed, inject, isRef, ref } from "vue";
+var SUPER_ADMIN_I18N_KEY = /* @__PURE__ */ Symbol.for(
+  "@saasicat/ui-vue/SUPER_ADMIN_I18N"
+);
+function createSuperAdminI18n(options = {}) {
+  const locale = isRef(options.locale) ? options.locale : ref(options.locale ?? DEFAULT_SA_LOCALE);
+  const messages = computed(
+    () => resolveMessages(locale.value, options.overrides?.[locale.value])
+  );
+  const intlLocale = computed(() => SA_INTL_LOCALES[locale.value]);
+  return { locale, messages, intlLocale };
+}
+var fallbackI18n = null;
+function useSuperAdminI18n() {
+  const injected = inject(SUPER_ADMIN_I18N_KEY, null);
+  if (injected) return injected;
+  fallbackI18n ??= createSuperAdminI18n();
+  return fallbackI18n;
+}
+function useSaMessages(namespace) {
+  const { messages } = useSuperAdminI18n();
+  return computed(() => messages.value[namespace]);
+}
+
 export {
   SUPER_ADMIN_BRAND_KEY,
   SUPER_ADMIN_ENDPOINTS_KEY,
@@ -59,5 +90,9 @@ export {
   SUPER_ADMIN_LOGIN_ADAPTER_KEY,
   SUPER_ADMIN_HTTP_KEY,
   buildNavigationGuard,
-  SUPER_ADMIN_NOTIFY_KEY
+  SUPER_ADMIN_NOTIFY_KEY,
+  SUPER_ADMIN_I18N_KEY,
+  createSuperAdminI18n,
+  useSuperAdminI18n,
+  useSaMessages
 };