@riverbankcms/sdk 0.8.0 → 0.8.1

package/dist/server/{Layout-l2v4Qa6E.d.ts → Layout-CZ-kxKfl.d.ts}

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { buildMenu, buildLogo } from './navigation.js';
-import { S as SiteResponse, R as RiverbankClient } from './types-D0rPF8l5.js';
+import { S as SiteResponse, R as RiverbankClient } from './types-CmBB0Osp.js';
 
 type HeaderData = {
     menu: ReturnType<typeof buildMenu>;

package/dist/server/{Layout-D4J009eS.d.mts → Layout-ESG8zvrk.d.mts}

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { buildMenu, buildLogo } from './navigation.mjs';
-import { S as SiteResponse, R as RiverbankClient } from './types-BRQ_6yOc.mjs';
+import { S as SiteResponse, R as RiverbankClient } from './types-DDNKxQXw.mjs';
 
 type HeaderData = {
     menu: ReturnType<typeof buildMenu>;

package/dist/server/{chunk-4YQJUL5W.mjs → chunk-5GCSRTIU.mjs}

@@ -1,6 +1,6 @@
 import {
   prefetchBlockData
-} from "./chunk-AEFWG657.mjs";
+} from "./chunk-HDHY4236.mjs";
 
 // src/rendering/helpers/loadContent.ts
 function isPageContent(result) {
@@ -46,7 +46,9 @@ async function loadContent(params) {
       dataContext: { contentEntry: entry.content },
       theme: site.theme,
       siteId,
-      site: site.site
+      site: site.site,
+      sdkConfig: site.sdkConfig ?? null,
+      supabaseUrl: site.supabaseUrl
     };
   }
   const { page: pageData } = contentResponse;
@@ -72,7 +74,9 @@ async function loadContent(params) {
     theme: site.theme,
     siteId,
     resolvedData,
-    site: site.site
+    site: site.site,
+    sdkConfig: site.sdkConfig ?? null,
+    supabaseUrl: site.supabaseUrl
   };
 }
 function isEntryResponse(response) {
@@ -141,4 +145,4 @@ export {
   isEntryContent,
   loadContent
 };
-//# sourceMappingURL=chunk-4YQJUL5W.mjs.map
+//# sourceMappingURL=chunk-5GCSRTIU.mjs.map

package/dist/server/chunk-5GCSRTIU.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/rendering/helpers/loadContent.ts"],"sourcesContent":["/**\n * Server-side helper to fetch content (page or entry) by path.\n *\n * Use this for dynamic routing where a path could resolve to either\n * a page or a content entry.\n */\n\nimport type { Theme } from '@riverbankcms/blocks';\nimport type { RiverbankClient, PageResponse, SiteResponse } from '../../client/types';\nimport type { PageProps } from '../components/Page';\nimport { prefetchBlockData } from '../../data/prefetchBlockData';\nimport type { ResolvedBlockData } from '../../data/prefetchBlockData';\nimport type { RuntimeSdkConfig } from './loadPage';\n\n/**\n * Site data included in content results for metadata generation.\n */\nexport type SiteData = SiteResponse['site'];\n\nexport type LoadContentParams = {\n  client: RiverbankClient;\n  siteId: string;\n  path: string;\n  /**\n   * If true, fetches draft/unpublished content instead of published content.\n   * This affects both pages and entries.\n   * Requires API key with site access.\n   *\n   * @default false\n   */\n  preview?: boolean;\n};\n\n/**\n * Content entry data returned when a path resolves to an entry\n */\nexport type ContentEntryData = {\n  id: string;\n  /** Content type key (e.g., 'blog-post', 'product') */\n  type: string | null;\n  title: string;\n  slug: string | null;\n  path: string | null;\n  status: string;\n  publishAt: string | null;\n  /** The raw content fields - use these to render your own UI */\n  content: Record<string, unknown>;\n  metaTitle: string | null;\n  metaDescription: string | null;\n  createdAt: string;\n  updatedAt: string;\n};\n\n/**\n * Result when path resolves to a page\n */\nexport type PageContentResult = {\n  type: 'page';\n  /** Page outline ready for rendering with <Page> component */\n  page: PageProps['page'];\n  /** Site theme for styling */\n  theme: Theme;\n  /** Site ID */\n  siteId: string;\n  /** Pre-fetched block data for data loaders */\n  resolvedData: ResolvedBlockData;\n  /** Site data for metadata generation */\n  site: SiteData;\n  /**\n   * SDK site configuration containing theme palette overrides.\n   * When provided, the SDK palette tokens are merged into the theme tokens,\n   * allowing blocks to use SDK-defined color tokens for section backgrounds.\n   */\n  sdkConfig: RuntimeSdkConfig | null;\n  /**\n   * Supabase storage URL for direct image access.\n   * SDK sites receive this from the API instead of requiring NEXT_PUBLIC_SUPABASE_URL env var.\n   */\n  supabaseUrl?: string;\n};\n\n/**\n * Result when path resolves to a content entry\n */\nexport type EntryContentResult = {\n  type: 'entry';\n  /** Raw entry data - render this however you want */\n  entry: ContentEntryData;\n  /** Template page for rendering the entry (if available) */\n  templatePage: PageProps['page'] | null;\n  /** Pre-fetched block data for template page data loaders */\n  resolvedData: ResolvedBlockData;\n  /** Data context for template blocks (includes entry content for bindings) */\n  dataContext: { contentEntry: Record<string, unknown> };\n  /** Site theme for styling (useful if rendering with SDK components) */\n  theme: Theme;\n  /** Site ID */\n  siteId: string;\n  /** Site data for metadata generation */\n  site: SiteData;\n  /**\n   * SDK site configuration containing theme palette overrides.\n   * When provided, the SDK palette tokens are merged into the theme tokens,\n   * allowing blocks to use SDK-defined color tokens for section backgrounds.\n   */\n  sdkConfig: RuntimeSdkConfig | null;\n  /**\n   * Supabase storage URL for direct image access.\n   * SDK sites receive this from the API instead of requiring NEXT_PUBLIC_SUPABASE_URL env var.\n   */\n  supabaseUrl?: string;\n};\n\n/**\n * Discriminated union result from loadContent\n */\nexport type LoadContentResult = PageContentResult | EntryContentResult;\n\n/**\n * Type guard to check if result is a page\n */\nexport function isPageContent(result: LoadContentResult): result is PageContentResult {\n  return result.type === 'page';\n}\n\n/**\n * Type guard to check if result is an entry\n */\nexport function isEntryContent(result: LoadContentResult): result is EntryContentResult {\n  return result.type === 'entry';\n}\n\n/**\n * Server-side helper to fetch content by path.\n *\n * Returns a discriminated union - either page data (ready for `<Page>` component)\n * or raw entry data (for custom rendering).\n *\n * @example Dynamic routing with both pages and entries\n * ```tsx\n * import { loadContent, Page, isPageContent } from '@riverbankcms/sdk';\n *\n * export default async function DynamicRoute({ params }) {\n *   const content = await loadContent({\n *     client,\n *     siteId: 'site-123',\n *     path: `/${params.slug?.join('/') || ''}`,\n *   });\n *\n *   if (isPageContent(content)) {\n *     return <Page {...content} />;\n *   }\n *\n *   // Render entry with custom UI\n *   return (\n *     <article>\n *       <h1>{content.entry.title}</h1>\n *       <div>{content.entry.content.body}</div>\n *     </article>\n *   );\n * }\n * ```\n *\n * @example Entry-specific rendering based on content type\n * ```tsx\n * const content = await loadContent({ client, siteId, path });\n *\n * if (content.type === 'entry') {\n *   switch (content.entry.type) {\n *     case 'blog-post':\n *       return <BlogPost entry={content.entry} theme={content.theme} />;\n *     case 'product':\n *       return <ProductPage entry={content.entry} theme={content.theme} />;\n *     default:\n *       return <GenericEntry entry={content.entry} />;\n *   }\n * }\n *\n * return <Page {...content} />;\n * ```\n *\n * @example Preview mode for draft content\n * ```tsx\n * const content = await loadContent({\n *   client,\n *   siteId,\n *   path,\n *   preview: true, // Fetches draft content for both pages and entries\n * });\n * ```\n */\nexport async function loadContent(params: LoadContentParams): Promise<LoadContentResult> {\n  const { client, siteId, path, preview = false } = params;\n\n  // Fetch site and content in parallel\n  const [site, contentResponse] = await Promise.all([\n    client.getSite({ id: siteId }),\n    client.getPage({ siteId, path, preview }),\n  ]);\n\n  // Check if response is an entry\n  if (isEntryResponse(contentResponse)) {\n    const entryData = contentResponse.entry;\n\n    const entry: ContentEntryData = {\n      id: entryData.id,\n      type: entryData.type,\n      title: entryData.title,\n      slug: entryData.slug,\n      path: entryData.path,\n      status: entryData.status,\n      publishAt: entryData.publishAt,\n      // Use draft content in preview mode, otherwise use published content\n      content: preview\n        ? (entryData.draftContent ?? entryData.content)\n        : entryData.content,\n      metaTitle: preview\n        ? (entryData.draftMetaTitle ?? entryData.metaTitle)\n        : entryData.metaTitle,\n      metaDescription: preview\n        ? (entryData.draftMetaDescription ?? entryData.metaDescription)\n        : entryData.metaDescription,\n      createdAt: entryData.createdAt,\n      updatedAt: entryData.updatedAt,\n    };\n\n    // Process template if available (uses first template from content type)\n    const { templatePage, resolvedData } = await processEntryTemplate(\n      contentResponse.templates as Template[] | undefined,\n      entry,\n      { siteId, preview },\n      client\n    );\n\n    return {\n      type: 'entry',\n      entry,\n      templatePage,\n      resolvedData,\n      dataContext: { contentEntry: entry.content },\n      theme: site.theme,\n      siteId,\n      site: site.site,\n      sdkConfig: site.sdkConfig ?? null,\n      supabaseUrl: site.supabaseUrl,\n    };\n  }\n\n  // Handle page response\n  const { page: pageData } = contentResponse;\n\n  // Convert API response blocks to PageOutline format with validation\n  const blocks = pageData.blocks.map((block) => validateAndConvertBlock(block, 'page'));\n\n  const pageOutline = {\n    name: pageData.name,\n    path: pageData.path,\n    purpose: pageData.purpose,\n    blocks,\n  };\n\n  // Prefetch block data loaders for pages\n  const resolvedData = await prefetchBlockData(\n    pageOutline,\n    {\n      siteId,\n      pageId: pageData.id,\n      previewStage: preview ? 'preview' : 'published',\n    },\n    client\n  );\n\n  return {\n    type: 'page',\n    page: pageOutline,\n    theme: site.theme,\n    siteId,\n    resolvedData,\n    site: site.site,\n    sdkConfig: site.sdkConfig ?? null,\n    supabaseUrl: site.supabaseUrl,\n  };\n}\n\n/**\n * Type guard to check if API response is an entry\n */\nfunction isEntryResponse(response: PageResponse): response is Extract<PageResponse, { type: 'entry' }> {\n  return 'type' in response && response.type === 'entry';\n}\n\n/**\n * Validates and converts a raw block from API response to PageOutline block format.\n * Used for both page blocks and template blocks to ensure consistent validation.\n */\nfunction validateAndConvertBlock(\n  block: unknown,\n  source: 'page' | 'template'\n): { id: string | null; kind: string; purpose: string; content?: Record<string, unknown> } {\n  if (!block || typeof block !== 'object') {\n    throw new Error(`Invalid block format in ${source} API response`);\n  }\n\n  const blockRecord = block as Record<string, unknown>;\n\n  // Template blocks use 'blockKind', page blocks use 'kind'\n  const kindField = source === 'template' ? 'blockKind' : 'kind';\n  const kindValue = blockRecord[kindField];\n\n  if (typeof blockRecord.id !== 'string' && blockRecord.id !== null) {\n    throw new Error(`Invalid block id in ${source}: expected string or null, got ${typeof blockRecord.id}`);\n  }\n  if (typeof kindValue !== 'string') {\n    throw new Error(`Invalid block ${kindField} in ${source}: expected string, got ${typeof kindValue}`);\n  }\n\n  // Template blocks derive purpose from scope, page blocks have explicit purpose\n  if (source === 'page') {\n    if (typeof blockRecord.purpose !== 'string') {\n      throw new Error(`Invalid block purpose in ${source}: expected string, got ${typeof blockRecord.purpose}`);\n    }\n    // Include content for page blocks - required for data loader binding resolution\n    const content = (blockRecord.content as Record<string, unknown> | null) ?? {};\n    return {\n      id: blockRecord.id as string | null,\n      kind: kindValue,\n      purpose: blockRecord.purpose,\n      content,\n    };\n  }\n\n  // Template block: derive purpose from scope, include content\n  const scope = blockRecord.scope as 'entry' | 'template' | undefined;\n  const content = (blockRecord.content as Record<string, unknown> | null) ?? {};\n\n  return {\n    id: blockRecord.id as string | null,\n    kind: kindValue,\n    purpose: scope === 'entry' ? 'entry-content' : 'template-layout',\n    content,\n  };\n}\n\n/** Template block structure from API response */\ntype TemplateBlock = {\n  id: string;\n  blockKind: string;\n  scope: 'entry' | 'template';\n  content: Record<string, unknown> | null;\n};\n\n/** Template structure from API response */\ntype Template = {\n  id: string;\n  name: string;\n  templateKey: string;\n  blocks: TemplateBlock[];\n};\n\n/**\n * Processes an entry's template into a PageOutline format and prefetches block data.\n * Returns null templatePage if no valid template with blocks is available.\n */\nasync function processEntryTemplate(\n  templates: Template[] | undefined,\n  entry: ContentEntryData,\n  context: { siteId: string; preview: boolean },\n  client: RiverbankClient\n): Promise<{ templatePage: PageProps['page'] | null; resolvedData: ResolvedBlockData }> {\n  const template = templates?.[0];\n\n  // Templates without blocks are treated as \"no template\" - the entry should be\n  // rendered with custom UI rather than an empty template page\n  if (!template || !template.blocks?.length) {\n    return { templatePage: null, resolvedData: {} };\n  }\n\n  // Convert template blocks to PageOutline format with validation\n  const blocks = template.blocks.map((block) => validateAndConvertBlock(block, 'template'));\n\n  const templatePage: PageProps['page'] = {\n    name: template.name || 'Entry Template',\n    path: entry.path || '/',\n    purpose: 'entry-template',\n    blocks,\n  };\n\n  // Prefetch block data for template\n  const resolvedData = await prefetchBlockData(\n    templatePage,\n    {\n      siteId: context.siteId,\n      pageId: template.id,\n      previewStage: context.preview ? 'preview' : 'published',\n    },\n    client\n  );\n\n  return { templatePage, resolvedData };\n}\n"],"mappings":"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","names":["resolvedData","content"]}

package/dist/server/{chunk-YYO3RIFO.js → chunk-6ERSDFTY.js}

@@ -108,7 +108,11 @@ var uiSchema = _zod.z.object({
   layout: _zod.z.enum(["stack", "grid"]).optional(),
   columns: _zod.z.number().int().min(2).max(4).optional(),
   // Entry picker configuration
-  contentTypeField: _zod.z.string().optional()
+  contentTypeField: _zod.z.string().optional(),
+  // Extras pattern: fields marked as extras are hidden behind a modal toggle
+  extras: _zod.z.boolean().optional(),
+  // Render in block header instead of form body (used for section styles)
+  renderInHeader: _zod.z.boolean().optional()
 }).partial();
 var baseFieldSchema = _zod.z.object({
   id: _zod.z.string().min(1, "Field id is required"),
@@ -1366,25 +1370,30 @@ function createButtonGroup(options = {}) {
       ui: { colSpan: 2 }
     }
   ];
-  const iconsGroup = {
-    id: "icons",
-    type: "group",
-    label: "Icons",
-    required: false,
-    ui: { preset: "disclosure", colSpan: 2 },
-    schema: {
-      fields: [
-        { id: "iconLeft", type: "media", label: "Left icon", required: false, mediaKinds: ["image"] },
-        { id: "iconRight", type: "media", label: "Right icon", required: false, mediaKinds: ["image"] }
-      ]
+  const iconFields = [
+    {
+      id: "iconLeft",
+      type: "media",
+      label: "Left icon",
+      required: false,
+      mediaKinds: ["image"],
+      ui: { extras: true }
+    },
+    {
+      id: "iconRight",
+      type: "media",
+      label: "Right icon",
+      required: false,
+      mediaKinds: ["image"],
+      ui: { extras: true }
     }
-  };
+  ];
   return {
     id: groupId,
     type: "group",
     label: groupLabel,
     ui: { layout: "grid", columns: 2, flattenInRepeater, hideLabel: !showGroupLabel },
-    schema: { fields: [...mainFields, iconsGroup] },
+    schema: { fields: [...mainFields, ...iconFields] },
     required: false
   };
 }
@@ -2705,6 +2714,10 @@ function getAnchorClasses(position) {
 }
 
 // ../blocks/src/system/fields/background.ts
+var BACKGROUND_WIDGETS = {
+  COLOR: "backgroundColor",
+  GRADIENT: "backgroundGradient"
+};
 function createBackgroundField(options = {}) {
   const {
     id = "background",
@@ -2730,8 +2743,7 @@ function createBackgroundField(options = {}) {
           required: false,
           multiline: false,
           ui: {
-            // Use BackgroundColorWidget via widget override
-            widget: "backgroundColor"
+            widget: BACKGROUND_WIDGETS.COLOR
           }
         }
       ]
@@ -2748,11 +2760,11 @@ function createBackgroundField(options = {}) {
           id: "gradient",
           type: "text",
           label: "Gradient",
-          description: "CSS gradient value (e.g., linear-gradient(to right, #ff0000, #00ff00)).",
+          description: "Select a gradient from theme presets.",
           required: false,
-          multiline: true,
+          multiline: false,
           ui: {
-            placeholder: "linear-gradient(to right, #ff0000, #00ff00)"
+            widget: BACKGROUND_WIDGETS.GRADIENT
           }
         }
       ]
@@ -2811,7 +2823,7 @@ function createBackgroundField(options = {}) {
         id: "position",
         type: "presetOrCustom",
         label: "Position",
-        description: 'Anchor point for the image. Relevant for "Fill" and "Custom size" options.',
+        description: 'Anchor point for scaled images. For "Fill" mode, the image focus point (if set) takes precedence.',
         required: false,
         presets: [...BACKGROUND_POSITION_PRESETS],
         customInput: {
@@ -2902,6 +2914,8 @@ function sectionStylesField(options = {}) {
     required: false,
     schema: { fields: fields4 },
     ui: {
+      // Render in block header instead of form body
+      renderInHeader: true,
       modalConfig: {
         buttonLabel: label,
         description: "Configure background and spacing for this section.",
@@ -5473,4 +5487,4 @@ function getBlockDefinition(name) {
 
 
 exports.bindingSchema = bindingSchema; exports.fieldSchema = fieldSchema; exports.blockCategoryEnum = blockCategoryEnum; exports.backgroundColorStyle = backgroundColorStyle; exports.textColorStyle = textColorStyle; exports.borderColorStyle = borderColorStyle; exports.mergeStyles = mergeStyles; exports.headingGroup = headingGroup; exports.isSemanticSpacing = isSemanticSpacing; exports.resolveSpacing = resolveSpacing; exports.ctaButton = ctaButton; exports.defineFragment = defineFragment; exports.bodyCopyFragment = bodyCopyFragment; exports.heroCopyFragment = heroCopyFragment; exports.createButtonGroup = createButtonGroup; exports.ctaRowFragment = ctaRowFragment; exports.ctaCopyFragment = ctaCopyFragment; exports.testimonialsHeadingFragment = testimonialsHeadingFragment; exports.testimonialsCarouselFragment = testimonialsCarouselFragment; exports.formCopyFragment = formCopyFragment; exports.formEmbedFragment = formEmbedFragment; exports.footerBottomTextFragment = footerBottomTextFragment; exports.footerLinkGroupsFragment = footerLinkGroupsFragment; exports.blogFeaturedPostFragment = blogFeaturedPostFragment; exports.blogListGridFragment = blogListGridFragment; exports.blogListStackFragment = blogListStackFragment; exports.faqHeadingFragment = faqHeadingFragment; exports.faqAccordionFragment = faqAccordionFragment; exports.cardFragment = cardFragment; exports.headingFragment = headingFragment; exports.richTextFragment = richTextFragment; exports.BACKGROUND_POSITION_PRESET_VALUES = BACKGROUND_POSITION_PRESET_VALUES; exports.getAnchorClasses = getAnchorClasses; exports.formattingTransforms = formattingTransforms; exports.uiTransforms = uiTransforms; exports.hexToRgb = hexToRgb; exports.oklchToHexGamut = oklchToHexGamut; exports.featuresFromHex = featuresFromHex; exports.layoutTransforms = layoutTransforms; exports.mediaTransforms = mediaTransforms; exports.siteHeaderManifest = siteHeaderManifest; exports.siteFooterManifest = siteFooterManifest; exports.getBlockDefinition = getBlockDefinition;
-//# sourceMappingURL=chunk-YYO3RIFO.js.map
+//# sourceMappingURL=chunk-6ERSDFTY.js.map