@cosmicdrift/kumiko-bundled-features 0.123.0 → 0.123.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-bundled-features",
-  "version": "0.123.0",
+  "version": "0.123.2",
   "description": "Built-in features — tenant, user, auth, delivery. The stuff you'd rewrite anyway, already typed.",
   "license": "BUSL-1.1",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",
@@ -92,15 +92,16 @@
     "./legal-pages/web": "./src/legal-pages/web/index.ts",
     "./page-render": "./src/page-render/index.ts",
     "./managed-pages": "./src/managed-pages/index.ts",
+    "./managed-pages/web": "./src/managed-pages/web/index.ts",
     "./managed-pages/seeding": "./src/managed-pages/seeding.ts",
     "./step-dispatcher": "./src/step-dispatcher/index.ts"
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-dispatcher-live": "0.123.0",
-    "@cosmicdrift/kumiko-framework": "0.123.0",
-    "@cosmicdrift/kumiko-headless": "0.123.0",
-    "@cosmicdrift/kumiko-renderer": "0.123.0",
-    "@cosmicdrift/kumiko-renderer-web": "0.123.0",
+    "@cosmicdrift/kumiko-dispatcher-live": "0.123.2",
+    "@cosmicdrift/kumiko-framework": "0.123.2",
+    "@cosmicdrift/kumiko-headless": "0.123.2",
+    "@cosmicdrift/kumiko-renderer": "0.123.2",
+    "@cosmicdrift/kumiko-renderer-web": "0.123.2",
     "@mollie/api-client": "^4.5.0",
     "@node-rs/argon2": "^2.0.2",
     "@types/nodemailer": "^8.0.0",

package/src/managed-pages/i18n.ts

@@ -1,3 +1,8 @@
+// @runtime client
+// Pure-Data (i18n-Keys) — client-marked, damit das web/-Bundle sie in den
+// Browser-Store pivotieren darf; feature.ts (server) importiert sie ebenso
+// (server darf client-safe Pure-Data importieren, wie PAT constants.ts).
+//
 // Übersetzungs-Bundle für die managed-pages Admin-Screens. Ohne diese Keys
 // rendert die UI die Roh-i18n-Keys (screen:*.title, entity:*:field:*, Section-
 // Header). Der Boot-Validator (required-surface-keys) verlangt — sobald ein

package/src/managed-pages/web/client-plugin.tsx

@@ -0,0 +1,22 @@
+// @runtime client
+// Client-Feature-Factory für managed-pages. Bringt NUR die Übersetzungen mit —
+// die Screens (page-list/page-edit/branding-settings) sind schema-driven
+// (entityList/entityEdit/configEdit), also keine custom-React-Components zu
+// registrieren. Apps mounten es in createKumikoApp({ clientFeatures:
+// [managedPagesClient()] }), damit die Admin-Labels übersetzt rendern.
+
+import { mergeTranslations, type TranslationsByLocale } from "@cosmicdrift/kumiko-renderer";
+import type { ClientFeatureDefinition } from "@cosmicdrift/kumiko-renderer-web";
+import { defaultTranslations } from "./i18n";
+
+export type ManagedPagesClientOptions = {
+  /** Key-wise Overrides über die Default-Bundles (de/en). */
+  readonly translations?: TranslationsByLocale;
+};
+
+export function managedPagesClient(options?: ManagedPagesClientOptions): ClientFeatureDefinition {
+  return {
+    name: "managed-pages",
+    translations: mergeTranslations(defaultTranslations, options?.translations ?? {}),
+  };
+}

package/src/managed-pages/web/i18n.ts

@@ -0,0 +1,24 @@
+// @runtime client
+// Client-i18n-Bundle für die managed-pages Admin-Screens. Der Browser-Renderer
+// baut seinen Fallback-Locale-Store NUR aus clientFeatures[].translations — der
+// server-seitige r.translations-Bundle (feature.ts) erreicht ihn nie. Damit die
+// configEdit/entityEdit-Labels im Client übersetzt rendern statt roh, spiegeln
+// wir hier dieselben Keys.
+//
+// Single source: pivotiert MANAGED_PAGES_I18N (key-first { key: {de,en} },
+// Server-Form) in die locale-first TranslationsByLocale-Form die der Client
+// erwartet — kein Key-Duplikat, kein Drift.
+
+import type { TranslationsByLocale } from "@cosmicdrift/kumiko-renderer";
+import { MANAGED_PAGES_I18N } from "../i18n";
+
+const LOCALES = ["de", "en"] as const;
+
+export const defaultTranslations: TranslationsByLocale = Object.fromEntries(
+  LOCALES.map((locale) => [
+    locale,
+    Object.fromEntries(
+      Object.entries(MANAGED_PAGES_I18N).map(([key, value]) => [key, value[locale]]),
+    ),
+  ]),
+);

package/src/managed-pages/web/index.ts

@@ -0,0 +1,3 @@
+// @runtime client
+export { type ManagedPagesClientOptions, managedPagesClient } from "./client-plugin";
+export { defaultTranslations } from "./i18n";

package/src/user-data-rights/web/privacy-center-screen.tsx

@@ -19,7 +19,7 @@ import {
   useQuery,
   useTranslation,
 } from "@cosmicdrift/kumiko-renderer";
-import { postWithDownload } from "@cosmicdrift/kumiko-renderer-web";
+import { FormScreenShell, postWithDownload } from "@cosmicdrift/kumiko-renderer-web";
 import { type ReactNode, useEffect, useState } from "react";
 import {
   EXPORT_JOB_STATUS,
@@ -384,12 +384,12 @@ export function PrivacyCenterScreen({
   };
 
   return (
-    <div className="p-6 flex flex-col gap-6 max-w-2xl" data-testid="privacy-center-screen">
+    <FormScreenShell className="flex flex-col gap-6" testId="privacy-center-screen">
       <Heading variant="page">{t("userDataRights.privacyCenter.title")}</Heading>
       <p className="text-sm text-muted-foreground">{t("userDataRights.privacyCenter.intro")}</p>
       <ExportSection />
       <RestrictionSection me={me} onChanged={refetch} />
       {showDeletion && <DeletionSection me={me} onChanged={refetch} />}
-    </div>
+    </FormScreenShell>
   );
 }

package/src/user-profile/web/profile-screen.tsx

@@ -12,6 +12,7 @@ import {
   useQuery,
   useTranslation,
 } from "@cosmicdrift/kumiko-renderer";
+import { FormScreenShell } from "@cosmicdrift/kumiko-renderer-web";
 import { type ReactNode, useState } from "react";
 import { AuthHandlers } from "../../auth-email-password/constants";
 import { requestEmailVerification } from "../../auth-email-password/web";
@@ -360,7 +361,7 @@ export function ProfileScreen(): ReactNode {
   };
 
   return (
-    <div className="flex max-w-5xl flex-col gap-6 p-6" data-testid="profile-screen">
+    <FormScreenShell className="flex flex-col gap-6" testId="profile-screen">
       <Heading variant="page">{t("profile.title")}</Heading>
       {/* Die zwei kurzen Konto-Forms teilen sich eine Reihe (md+); die
           Danger-Zone bleibt volle Breite darunter. */}
@@ -369,6 +370,6 @@ export function ProfileScreen(): ReactNode {
         <ChangePasswordSection />
       </div>
       <DangerZoneSection me={me} onChanged={refetch} />
-    </div>
+    </FormScreenShell>
   );
 }