@riverbankcms/sdk 0.145.0 → 0.147.0

package/dist/preview-next/client/runtime.mjs

@@ -1,16 +1,16 @@
 "use client";
-import { a as usePreviewLayout, i as useOptionalPreviewLayout, n as createPreviewQueryClient, r as PreviewLayoutProvider, t as PreviewQueryProvider } from "../../PreviewQueryProvider-BxGwdOCV.mjs";
+import { a as usePreviewLayout, i as useOptionalPreviewLayout, n as createPreviewQueryClient, r as PreviewLayoutProvider, t as PreviewQueryProvider } from "../../PreviewQueryProvider-Dd4dxOiU.mjs";
 import React from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/preview-next/client/runtime.tsx
 const LazySdkPreviewMode = React.lazy(async () => {
-	return { default: (await import("../../SdkPreviewModeRuntime-DYbA_4iv.mjs").then((n) => n.n)).SdkPreviewModeRuntime };
+	return { default: (await import("../../SdkPreviewModeRuntime-DMMNCngt.mjs").then((n) => n.n)).SdkPreviewModeRuntime };
 });
 const LazyPreviewShell = React.lazy(async () => {
-	return { default: (await import("../../sdk-runtime-D0uZFev7.mjs")).PreviewShell };
+	return { default: (await import("../../sdk-runtime-BIkJg5y1.mjs")).PreviewShell };
 });
 const LazyPreviewShellLayout = React.lazy(async () => {
-	return { default: (await import("../../sdk-runtime-D0uZFev7.mjs")).PreviewShellLayout };
+	return { default: (await import("../../sdk-runtime-BIkJg5y1.mjs")).PreviewShellLayout };
 });
 function SdkPreviewMode(props) {
 	return /* @__PURE__ */ jsx(React.Suspense, {

package/dist/preview-next/editor-base.css

@@ -33,6 +33,11 @@
   --surface: oklch(0.96 0.012 185);
   --surface-foreground: oklch(0.35 0.02 30);
 
+  /* Inverse - a dark band with light text (launch address panel). Surfaces
+     with a brand ink override it. */
+  --inverse: var(--foreground);
+  --inverse-foreground: var(--background);
+
   /* Accent - Light teal tint */
   --accent: oklch(0.96 0.02 180);
   --accent-foreground: oklch(0.35 0.02 30);
@@ -44,11 +49,21 @@
   --field-background: oklch(0.992 0.008 180);
   --field-border-subtle: oklch(0.90 0.02 180);
   --field-border-strong: oklch(0.72 0.06 180);
-  --field-control-radius: 0.6rem;
+  --item-radius: 0.6rem;
   --control-font-size: 0.875rem;
   --control-font-weight: 400;
   --control-letter-spacing: 0.01em;
 
+  /* One field shape for every control (Input, Textarea, SelectTrigger,
+   * Checkbox, Radio); the class strings live in src/fieldControl.ts. The
+   * compact size is the default, and public screens opt into the roomy one
+   * with `data-field-size="roomy"` (below). */
+  --field-radius: 0.75rem;
+  --field-height: 2.5rem;
+  --field-padding-x: 0.75rem;
+  --field-font-size: 0.875rem;
+  --field-textarea-min-height: 5rem;
+
   /* Button tuning shared by dashboard chrome and frontend preview chrome */
   --button-radius: var(--radius-md);
   --button-padding-x: 1rem;
@@ -59,6 +74,10 @@
   --button-padding-y-lg: 0.625rem;
   --button-outline-border-width: 1px;
   --button-outline-hover: oklch(0.92 0.03 180);
+
+  /* The line joining steps on a stem (the launch checklists). Surfaces with a
+     plant of their own restyle it; see macadamia-tokens.css. */
+  --step-stem-width: 1px;
   --table-row-hover-background: oklch(0.94 0.018 185);
 
   /* Destructive - Terracotta red #a34d3d */
@@ -122,6 +141,15 @@
   --spacing: 0.27rem;
 }
 
+/* The roomy field size, for public screens where a form is the whole page
+ * (sign-in, onboarding, contact). Same shape, more room. */
+[data-field-size="roomy"] {
+  --field-height: 3rem;
+  --field-padding-x: 1rem;
+  --field-font-size: 1rem;
+  --field-textarea-min-height: 6.5rem;
+}
+
 /* Dark mode overrides - Earthy palette adjusted for dark backgrounds */
 .dark {
   --background: oklch(0.20 0.02 30);           /* Very dark brown */
@@ -148,6 +176,10 @@
   --surface: oklch(0.26 0.02 185);
   --surface-foreground: oklch(0.92 0.02 55);
 
+  /* Inverse - Dark mode keeps a darker band than the page */
+  --inverse: oklch(0.14 0.02 30);
+  --inverse-foreground: var(--foreground);
+
   --accent: oklch(0.30 0.03 180);
   --accent-foreground: oklch(0.92 0.02 55);
 
@@ -156,7 +188,7 @@
   --field-background: oklch(0.28 0.02 180);
   --field-border-subtle: oklch(0.52 0.03 180);
   --field-border-strong: oklch(0.78 0.06 180);
-  --field-control-radius: 0.6rem;
+  --item-radius: 0.6rem;
   --control-font-size: 0.875rem;
   --control-font-weight: 400;
   --control-letter-spacing: 0.01em;
@@ -265,6 +297,8 @@
   --color-sidebar-ring: var(--sidebar-ring);
   --color-surface: var(--surface);
   --color-surface-foreground: var(--surface-foreground);
+  --color-inverse: var(--inverse);
+  --color-inverse-foreground: var(--inverse-foreground);
   --color-editor-chrome-surface: var(--editor-chrome-surface);
   --color-field-background: var(--field-background);
   --color-field-border: var(--field-border-subtle);
@@ -298,3 +332,31 @@
   --tracking-wider: calc(var(--tracking-normal) + 0.05em);
   --tracking-widest: calc(var(--tracking-normal) + 0.1em);
 }
+
+/* Inverse surface: the dark band (`<Surface variant="inverse">`). Shared
+ * controls inside it read light on dark. Don't nest light surfaces (cards,
+ * fields on white) inside it: they inherit these remapped tokens. A light
+ * field inside must set its own colours, as SiteAddressEditor's field does. The primary action fills with the
+ * surface's inverse primary (Macadamia's pale leaf; the light accent on core),
+ * secondary fills with the band's light text colour, and an outline takes that
+ * text colour, per the "weight decides shape, ground decides colour" rule. */
+.surface-inverse {
+  --primary: var(--inverse-primary, var(--accent));
+  --primary-foreground: var(--inverse);
+  --primary-hover: var(--inverse-primary-hover, color-mix(in oklab, var(--accent) 80%, var(--inverse-foreground)));
+  --button-outline-border: color-mix(in oklab, var(--inverse-foreground) 40%, transparent);
+  --button-outline-background: transparent;
+  --button-outline-foreground: var(--inverse-foreground);
+  --button-secondary-border: transparent;
+  --button-secondary-background: var(--inverse-foreground);
+  --button-secondary-foreground: var(--inverse);
+  --muted-foreground: color-mix(in oklab, var(--inverse-foreground) 72%, transparent);
+}
+
+/* Keyboard focus on the band: a light outline around the control, clear of
+ * light-filled controls (the ring token stays the surface's own, for fields).
+ * The data-slot qualifier outranks a surface's page-wide focus colour. */
+[data-slot="surface"].surface-inverse :focus-visible {
+  outline: 2px solid var(--inverse-foreground);
+  outline-offset: 2px;
+}

package/dist/preview-next/editor-chrome.css

@@ -60,11 +60,14 @@
     letter-spacing: var(--tracking-normal);
   }
 
+  /* Page titles. A surface can restyle them through the --page-title-* tokens;
+   * core leaves them unset and keeps these values. */
   .builder-dashboard-chrome-theme h1 {
-    font-size: 1.875rem;
-    font-weight: 600;
-    letter-spacing: var(--heading-letter-spacing);
-    line-height: 2.25rem;
+    font-size: var(--page-title-font-size, 1.875rem);
+    font-weight: var(--page-title-font-weight, 600);
+    letter-spacing: var(--page-title-letter-spacing, var(--heading-letter-spacing));
+    line-height: var(--page-title-line-height, 2.25rem);
+    color: var(--page-title-foreground, inherit);
   }
 
   .builder-dashboard-chrome-theme h2 {