@cosmicdrift/kumiko-renderer-web 0.122.5 → 0.123.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-renderer-web",
-  "version": "0.122.5",
+  "version": "0.123.1",
   "description": "Web-platform bindings for @cosmicdrift/kumiko-renderer. HTML default-primitives, browser history-based navigation, EventSource-backed live events, and a one-call createKumikoApp that mounts the whole stack via react-dom.",
   "license": "BUSL-1.1",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",
@@ -16,9 +16,9 @@
     "./styles.css": "./src/styles.css"
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-dispatcher-live": "0.122.5",
-    "@cosmicdrift/kumiko-headless": "0.122.5",
-    "@cosmicdrift/kumiko-renderer": "0.122.5",
+    "@cosmicdrift/kumiko-dispatcher-live": "0.123.1",
+    "@cosmicdrift/kumiko-headless": "0.123.1",
+    "@cosmicdrift/kumiko-renderer": "0.123.1",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-label": "^2.1.8",

package/src/index.ts

@@ -124,7 +124,12 @@ export type { WorkspaceSwitcherProps } from "./layout/workspace-switcher";
 export { WorkspaceSwitcher } from "./layout/workspace-switcher";
 export { cn } from "./lib/cn";
 export { postWithDownload } from "./lib/download";
-export { BareFormProvider, DefaultCard as Card, defaultPrimitives } from "./primitives";
+export {
+  BareFormProvider,
+  DefaultCard as Card,
+  defaultPrimitives,
+  FormScreenShell,
+} from "./primitives";
 export type { ActionMenuProps, MenuItemDef } from "./primitives/action-menu";
 export { ActionMenu } from "./primitives/action-menu";
 export {

package/src/primitives/index.tsx

@@ -1382,7 +1382,7 @@ function DefaultForm({
       data-testid={testId}
       className="flex flex-col w-full"
     >
-      <div className="px-6 pt-6 pb-12 max-w-3xl w-full mx-auto">
+      <FormScreenShell>
         <div className={cn(cardSurface(), "overflow-hidden")}>
           {(title !== undefined || subtitle !== undefined) && (
             <div className="px-6 pb-2 pt-5">
@@ -1426,11 +1426,32 @@ function DefaultForm({
             </div>
           )}
         </div>
-      </div>
+      </FormScreenShell>
     </form>
   );
 }
 
+// Kanonische Form/Settings-Shell: zentrierte max-w-3xl-Spalte mit Standard-
+// Screen-Padding. DefaultForm (configEdit/entityEdit) UND custom Settings-
+// Screens (url-settings, privacy-center) teilen sie → einheitliche Breite +
+// Zentrierung statt per-Screen-Wildwuchs. Inhalt nutzt Card-Primitives;
+// `className` (z.B. "flex flex-col gap-6") für Multi-Card-Stacks.
+export function FormScreenShell({
+  children,
+  className,
+  testId,
+}: {
+  readonly children: ReactNode;
+  readonly className?: string;
+  readonly testId?: string;
+}): ReactNode {
+  return (
+    <div data-testid={testId} className={cn("px-6 pt-6 pb-12 max-w-3xl w-full mx-auto", className)}>
+      {children}
+    </div>
+  );
+}
+
 function DefaultSection({ title, subtitle, children, actions, testId }: SectionProps): ReactNode {
   const insideForm = useContext(InsideFormContext);