@riverbankcms/sdk 0.60.16 → 0.62.2

package/dist/server/theme-bridge.mjs

@@ -29,6 +29,24 @@ var MQ_TABLET_ONLY = mqBetween(BREAKPOINT_SM, BREAKPOINT_LG_DOWN);
 var MQ_MAX_640 = mqDown(BREAKPOINT_SM);
 var MQ_MAX_768 = mqDown(BREAKPOINT_MD);
 
+// ../theme-core/src/site-styles/appearancePresetResolution.ts
+function assertValidOptionGroups(preset) {
+  preset.optionGroups?.forEach((group) => {
+    const selectedOption = group.options.find(
+      (option) => option.id === group.selectedOptionId
+    );
+    if (!selectedOption) {
+      throw new Error(
+        `Appearance preset "${preset.id}" option group "${group.id}" selects missing option "${group.selectedOptionId}".`
+      );
+    }
+  });
+}
+function defineBlockAppearancePreset(preset) {
+  assertValidOptionGroups(preset);
+  return preset;
+}
+
 // ../theme-core/src/site-styles/types.ts
 function asDesignBlockId(value) {
   return brandNonEmptyString(value, "DesignBlockId");
@@ -104,6 +122,11 @@ function flushPanelFrame(options) {
     bleed: options.bleed
   };
 }
+var tileTreatmentValues = [
+  "default",
+  "quiet",
+  "brand-depth"
+];
 var eyebrowTreatmentValues = [
   "plain",
   "pill",
@@ -112,27 +135,8 @@ var eyebrowTreatmentValues = [
   "accent-pill-bounce"
 ];
 
-// ../theme-core/src/site-styles/appearancePresets.ts
-function assertValidOptionGroups(preset) {
-  preset.optionGroups?.forEach((group) => {
-    const selectedOption = group.options.find(
-      (option) => option.id === group.selectedOptionId
-    );
-    if (!selectedOption) {
-      throw new Error(
-        `Appearance preset "${preset.id}" option group "${group.id}" selects missing option "${group.selectedOptionId}".`
-      );
-    }
-  });
-}
-function defineBlockAppearancePreset(preset) {
-  assertValidOptionGroups(preset);
-  return preset;
-}
-function defineSiteChromeAppearancePreset(preset) {
-  return preset;
-}
-var appearancePresets = [
+// ../theme-core/src/site-styles/blockAppearancePresets.ts
+var blockAppearancePresets = [
   defineBlockAppearancePreset({
     kind: "block-design",
     id: "hero-immersive-image",
@@ -258,6 +262,24 @@ var appearancePresets = [
       eyebrowTreatment: "accent-pill-bounce"
     }
   }),
+  defineBlockAppearancePreset({
+    kind: "block-design",
+    id: "hero-brand-depth-expressive",
+    target: "hero",
+    label: "Expressive brand-depth hero",
+    blockKinds: ["block.hero"],
+    constraints: {
+      layoutFamilies: ["centered", "compact"]
+    },
+    design: {
+      sectionSurface: "brand-depth-band",
+      contentFrame: plainFrame,
+      itemSurface: "none",
+      transitionAfter: "soft-fade-short",
+      emphasis: "high",
+      eyebrowTreatment: "accent-pill-bounce"
+    }
+  }),
   defineBlockAppearancePreset({
     kind: "block-design",
     id: "hero-contained-intro",
@@ -286,6 +308,20 @@ var appearancePresets = [
       emphasis: "high"
     }
   }),
+  defineBlockAppearancePreset({
+    kind: "block-design",
+    id: "body-text-brand-depth-intro",
+    target: "body-text",
+    label: "Brand-depth intro copy",
+    blockKinds: ["block.body-text"],
+    design: {
+      sectionSurface: "brand-depth-band",
+      contentFrame: plainFrame,
+      itemSurface: "none",
+      transitionAfter: "soft-fade-short",
+      emphasis: "high"
+    }
+  }),
   defineBlockAppearancePreset({
     kind: "block-design",
     id: "offerings-calm-list",
@@ -328,6 +364,21 @@ var appearancePresets = [
       emphasis: "medium"
     }
   }),
+  defineBlockAppearancePreset({
+    kind: "block-design",
+    id: "schedule-details-brand-depth",
+    target: "events",
+    label: "Brand-depth schedule details",
+    blockKinds: ["block.event-details", "block.course-details"],
+    design: {
+      sectionSurface: "brand-depth-band",
+      contentFrame: plainFrame,
+      itemSurface: "none",
+      transitionAfter: "none",
+      emphasis: "medium",
+      tileTreatment: "brand-depth"
+    }
+  }),
   defineBlockAppearancePreset({
     kind: "block-design",
     id: "media-text-flush-feature",
@@ -413,6 +464,20 @@ var appearancePresets = [
       testimonialCardTreatment: "accent-quote"
     }
   }),
+  defineBlockAppearancePreset({
+    kind: "block-design",
+    id: "faq-base-accordion",
+    target: "faq",
+    label: "Base accordion FAQ",
+    blockKinds: ["block.faq"],
+    design: {
+      sectionSurface: "base",
+      contentFrame: plainFrame,
+      itemSurface: "default",
+      transitionAfter: "none",
+      emphasis: "medium"
+    }
+  }),
   defineBlockAppearancePreset({
     kind: "block-design",
     id: "faq-contained-help",
@@ -455,6 +520,20 @@ var appearancePresets = [
       emphasis: "high"
     }
   }),
+  defineBlockAppearancePreset({
+    kind: "block-design",
+    id: "contact-form-brand-depth-card",
+    target: "contact-form",
+    label: "Brand-depth form card",
+    blockKinds: ["block.form"],
+    design: {
+      sectionSurface: "brand-depth-band",
+      contentFrame: panelFrame("raised"),
+      itemSurface: "none",
+      transitionAfter: "none",
+      emphasis: "high"
+    }
+  }),
   defineBlockAppearancePreset({
     kind: "block-design",
     id: "cta-accent-band",
@@ -468,7 +547,14 @@ var appearancePresets = [
       transitionAfter: "none",
       emphasis: "high"
     }
-  }),
+  })
+];
+
+// ../theme-core/src/site-styles/siteChromeAppearancePresets.ts
+function defineSiteChromeAppearancePreset(preset) {
+  return preset;
+}
+var siteChromeAppearancePresets = [
   defineSiteChromeAppearancePreset({
     kind: "site-chrome",
     id: "header-clean-base",
@@ -536,6 +622,12 @@ var appearancePresets = [
   })
 ];
 
+// ../theme-core/src/site-styles/appearancePresetCatalog.ts
+var appearancePresets = [
+  ...blockAppearancePresets,
+  ...siteChromeAppearancePresets
+];
+
 // ../theme-core/src/site-styles/pageDesignIntent.ts
 import { z } from "zod";
 var pageDesignIntentSchemaVersion = 1;
@@ -2226,6 +2318,7 @@ var sectionStylesOverrideSchema = z15.object({
   background: boxBackgroundSchema.nullable().optional(),
   spacing: semanticSpacingSchema.nullable().optional(),
   minHeight: z15.enum(["none", "banner", "hero", "immersive"]).nullable().optional(),
+  tileTreatment: z15.enum(tileTreatmentValues).nullable().optional(),
   eyebrowTreatment: z15.enum(eyebrowTreatmentValues).nullable().optional()
 });
 var containerStylesOverrideSchema = z15.object({
@@ -3019,7 +3112,7 @@ var userContentFrames = [
 ];
 var generatedDesignOptionCatalog = {
   source: "generated",
-  sectionSurfaces: ["base", "muted-band", "accent-band", "hero-image"],
+  sectionSurfaces: ["base", "muted-band", "accent-band", "brand-depth-band", "hero-image"],
   contentFrames: generatedContentFrames,
   itemSurfaces: ["none", "default", "flat", "outlined", "raised"],
   transitions: ["none", "soft-fade-short", "soft-fade-long"],
@@ -3089,6 +3182,43 @@ var expressiveBudget = {
   mediaDensity: "high",
   decorativeRepetition: "medium"
 };
+var expressiveUnderlineInputs = {
+  base: {
+    background: { type: "transparent" },
+    textColorToken: "text",
+    border: {
+      widthClass: "border-2",
+      colorToken: "border",
+      style: "underline"
+    },
+    corners: "square",
+    shadow: null,
+    spacing: "compact",
+    fontSize: "base"
+  },
+  label: {
+    textColorToken: "primary",
+    fontWeight: "black",
+    fontSize: "xs",
+    textTransform: "uppercase",
+    letterSpacing: "widest",
+    opacity: 1
+  },
+  focus: {
+    ringColorToken: "secondary",
+    ringWidth: "0",
+    borderColorToken: "secondary"
+  },
+  error: {
+    borderColorToken: "destructive",
+    textColorToken: "destructive"
+  },
+  disabled: {
+    backgroundColorToken: "surface",
+    textColorToken: "text",
+    opacity: 0.6
+  }
+};
 function uniqueContentFrameKinds() {
   const kinds = [...new Set(
     generatedDesignOptionCatalog.contentFrames.map((frame) => frame.kind)
@@ -3439,15 +3569,17 @@ var curatedSiteStyles = [
           paragraphSize: "editorial",
           headingSize: "editorial"
         }
-      }
+      },
+      inputs: expressiveUnderlineInputs
     },
     recommendedAppearancePresetIds: [
       "site-header-brand-solid-inverted-cta",
       "site-footer-brand-two-band",
       "hero-brand-scrim-fixed-frame",
       "body-text-editorial-intro",
+      "schedule-details-brand-depth",
       "testimonials-accent-quote-proof",
-      "contact-form-dark-card"
+      "contact-form-brand-depth-card"
     ],
     buttonPersonalityChoices: [
       buttonChoice("showtime-pill"),
@@ -3581,6 +3713,7 @@ var imageSurfaceTreatmentSchema = z17.discriminatedUnion("kind", [
   }).strict()
 ]);
 var testimonialCardTreatmentSchema = z17.enum(["default", "accent-quote"]);
+var tileTreatmentSchema = z17.enum(tileTreatmentValues);
 var eyebrowTreatmentSchema = z17.enum(eyebrowTreatmentValues);
 function uniqueNonEmpty(values) {
   const uniqueValues = [...new Set(values)];
@@ -3625,6 +3758,7 @@ var blockDesignPlanSchema = z17.object({
   imageSurfaceTreatment: imageSurfaceTreatmentSchema.optional(),
   imageSurfaceMotion: imageSurfaceMotionSchema.optional(),
   testimonialCardTreatment: testimonialCardTreatmentSchema.optional(),
+  tileTreatment: tileTreatmentSchema.optional(),
   eyebrowTreatment: eyebrowTreatmentSchema.optional()
 }).strict();
 var styleAuthoritySchema = z17.discriminatedUnion("kind", [
@@ -3688,6 +3822,14 @@ var defaultDesignRuntimeRules = defineDesignRuntimeRules({
         headingColor: "primaryForeground"
       }
     },
+    "brand-depth-band": {
+      background: {
+        type: "color",
+        color: "primary-800",
+        textColor: "primaryForeground",
+        headingColor: "primaryForeground"
+      }
+    },
     "hero-image": {
       background: {
         type: "image",
@@ -13623,15 +13765,15 @@ var containerResponsiveThemeCss = `/*
   text-align: left;
   padding: 1rem;
   border-radius: var(--rb-event-tile-radius, calc(var(--rb-block-radius) * 0.75));
-  border-style: var(--rb-event-tile-border-style, var(--rb-border-style, solid));
-  border-width: var(--rb-event-tile-border-width, var(--rb-border-width, 1px));
-  border-color: var(--rb-event-tile-border, rgb(var(--tb-border)));
-  background: var(--rb-event-tile-bg, transparent);
+  border-style: var(--rb-tile-border-style, var(--rb-event-tile-border-style, var(--rb-border-style, solid)));
+  border-width: var(--rb-tile-border-width, var(--rb-event-tile-border-width, var(--rb-border-width, 1px)));
+  border-color: var(--rb-tile-border, var(--rb-event-tile-border, rgb(var(--tb-border))));
+  background: var(--rb-tile-bg, var(--rb-event-tile-bg, transparent));
   transition: border-color var(--rb-block-transition) ease,
               background-color var(--rb-block-transition) ease,
               opacity var(--rb-block-transition) ease;
   display: block;
-  opacity: var(--rb-event-tile-opacity, 1);
+  opacity: var(--rb-tile-opacity, var(--rb-event-tile-opacity, 1));
   color: inherit;
   text-decoration: none;
 }
@@ -13642,6 +13784,25 @@ var containerResponsiveThemeCss = `/*
   gap: var(--rb-event-tiles-grid-gap, 0.5rem);
 }
 
+:where(.theme-scope) .rb-tile-treatment-quiet {
+  --rb-tile-bg: color-mix(in oklab, rgb(var(--tb-surface)), rgb(var(--tb-muted)) 48%);
+  --rb-tile-border: color-mix(in oklab, rgb(var(--tb-border)), transparent 35%);
+  --rb-tile-border-hover: color-mix(in oklab, rgb(var(--tb-primary)), transparent 40%);
+}
+
+:where(.theme-scope) .rb-tile-treatment-brand-depth {
+  --rb-brand-depth-surface: rgb(var(--tb-primary-800));
+  --rb-brand-depth-tile-surface: rgb(var(--tb-primary-900));
+  --rb-brand-depth-tile-surface-selected: rgb(var(--tb-primary-950));
+  --rb-tile-bg: var(--rb-brand-depth-tile-surface);
+  --rb-tile-bg-selected: var(--rb-brand-depth-tile-surface-selected);
+  --rb-tile-border: transparent;
+  --rb-tile-border-hover: transparent;
+  --rb-tile-border-selected: transparent;
+  --rb-tile-border-width: 0;
+  --rb-event-tile-radius: var(--rb-block-radius);
+}
+
 @container rb-site (min-width: 768px) {
 @scope ([data-rb-responsive-mode="container"]) to (:scope [data-rb-responsive-mode]) {
 :where(.theme-scope) .rb-tiles-grid {
@@ -13660,13 +13821,13 @@ var containerResponsiveThemeCss = `/*
 }
 
 :where(.theme-scope) :where(.rb-tile--interactive, .er-event-card):hover:not(:disabled) {
-  border-color: var(--rb-event-tile-border-hover, rgba(var(--tb-primary), 0.5));
-  opacity: var(--rb-event-tile-hover-opacity, var(--rb-event-tile-opacity, 1));
+  border-color: var(--rb-tile-border-hover, var(--rb-event-tile-border-hover, rgba(var(--tb-primary), 0.5)));
+  opacity: var(--rb-tile-hover-opacity, var(--rb-event-tile-hover-opacity, var(--rb-tile-opacity, var(--rb-event-tile-opacity, 1))));
 }
 
 :where(.theme-scope) :where(.rb-tile--selected, .er-event-card--selected) {
-  border-color: var(--rb-event-tile-border-selected, rgb(var(--tb-primary)));
-  background: var(--rb-event-tile-bg-selected, rgba(var(--tb-primary), 0.1));
+  border-color: var(--rb-tile-border-selected, var(--rb-event-tile-border-selected, rgb(var(--tb-primary))));
+  background: var(--rb-tile-bg-selected, var(--rb-event-tile-bg-selected, rgba(var(--tb-primary), 0.1)));
 }
 
 :where(.theme-scope) :where(.rb-tile--disabled, .er-event-card--disabled) {
@@ -15312,6 +15473,9 @@ function buildThemeRuntimeFromBridge(config) {
   return cssVars;
 }
 
+// ../theme-core/src/siteChrome.tsx
+import { Fragment as Fragment2, jsxs as jsxs5 } from "react/jsx-runtime";
+
 // src/theme-bridge/generateCssVars.ts
 var SCOPE_ID = "sdk";
 var SYSTEM_FONT_STACK2 = 'ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"';

package/dist/server/theme.mjs

@@ -14,6 +14,11 @@ function brandNonEmptyString(value, label) {
   }
   return value;
 }
+var tileTreatmentValues = [
+  "default",
+  "quiet",
+  "brand-depth"
+];
 var eyebrowTreatmentValues = [
   "plain",
   "pill",
@@ -1390,6 +1395,7 @@ var sectionStylesOverrideSchema = z14.object({
   background: boxBackgroundSchema.nullable().optional(),
   spacing: semanticSpacingSchema.nullable().optional(),
   minHeight: z14.enum(["none", "banner", "hero", "immersive"]).nullable().optional(),
+  tileTreatment: z14.enum(tileTreatmentValues).nullable().optional(),
   eyebrowTreatment: z14.enum(eyebrowTreatmentValues).nullable().optional()
 });
 var containerStylesOverrideSchema = z14.object({

package/dist/styles/index.css

@@ -7455,15 +7455,15 @@
   text-align: left;
   padding: 1rem;
   border-radius: var(--rb-event-tile-radius, calc(var(--rb-block-radius) * 0.75));
-  border-style: var(--rb-event-tile-border-style, var(--rb-border-style, solid));
-  border-width: var(--rb-event-tile-border-width, var(--rb-border-width, 1px));
-  border-color: var(--rb-event-tile-border, rgb(var(--tb-border)));
-  background: var(--rb-event-tile-bg, transparent);
+  border-style: var(--rb-tile-border-style, var(--rb-event-tile-border-style, var(--rb-border-style, solid)));
+  border-width: var(--rb-tile-border-width, var(--rb-event-tile-border-width, var(--rb-border-width, 1px)));
+  border-color: var(--rb-tile-border, var(--rb-event-tile-border, rgb(var(--tb-border))));
+  background: var(--rb-tile-bg, var(--rb-event-tile-bg, transparent));
   transition: border-color var(--rb-block-transition) ease,
               background-color var(--rb-block-transition) ease,
               opacity var(--rb-block-transition) ease;
   display: block;
-  opacity: var(--rb-event-tile-opacity, 1);
+  opacity: var(--rb-tile-opacity, var(--rb-event-tile-opacity, 1));
   color: inherit;
   text-decoration: none;
 }
@@ -7474,6 +7474,25 @@
   gap: var(--rb-event-tiles-grid-gap, 0.5rem);
 }
 
+:where(.theme-scope) .rb-tile-treatment-quiet {
+  --rb-tile-bg: color-mix(in oklab, rgb(var(--tb-surface)), rgb(var(--tb-muted)) 48%);
+  --rb-tile-border: color-mix(in oklab, rgb(var(--tb-border)), transparent 35%);
+  --rb-tile-border-hover: color-mix(in oklab, rgb(var(--tb-primary)), transparent 40%);
+}
+
+:where(.theme-scope) .rb-tile-treatment-brand-depth {
+  --rb-brand-depth-surface: rgb(var(--tb-primary-800));
+  --rb-brand-depth-tile-surface: rgb(var(--tb-primary-900));
+  --rb-brand-depth-tile-surface-selected: rgb(var(--tb-primary-950));
+  --rb-tile-bg: var(--rb-brand-depth-tile-surface);
+  --rb-tile-bg-selected: var(--rb-brand-depth-tile-surface-selected);
+  --rb-tile-border: transparent;
+  --rb-tile-border-hover: transparent;
+  --rb-tile-border-selected: transparent;
+  --rb-tile-border-width: 0;
+  --rb-event-tile-radius: var(--rb-block-radius);
+}
+
 @media (min-width: 768px) {
   :where(.theme-scope) .rb-tiles-grid {
     grid-template-columns: repeat(var(--rb-tiles-grid-cols-md, var(--rb-tiles-grid-cols-sm, 2)), minmax(0, 1fr));
@@ -7490,13 +7509,13 @@
 }
 
 :where(.theme-scope) :where(.rb-tile--interactive, .er-event-card):hover:not(:disabled) {
-  border-color: var(--rb-event-tile-border-hover, rgba(var(--tb-primary), 0.5));
-  opacity: var(--rb-event-tile-hover-opacity, var(--rb-event-tile-opacity, 1));
+  border-color: var(--rb-tile-border-hover, var(--rb-event-tile-border-hover, rgba(var(--tb-primary), 0.5)));
+  opacity: var(--rb-tile-hover-opacity, var(--rb-event-tile-hover-opacity, var(--rb-tile-opacity, var(--rb-event-tile-opacity, 1))));
 }
 
 :where(.theme-scope) :where(.rb-tile--selected, .er-event-card--selected) {
-  border-color: var(--rb-event-tile-border-selected, rgb(var(--tb-primary)));
-  background: var(--rb-event-tile-bg-selected, rgba(var(--tb-primary), 0.1));
+  border-color: var(--rb-tile-border-selected, var(--rb-event-tile-border-selected, rgb(var(--tb-primary))));
+  background: var(--rb-tile-bg-selected, var(--rb-event-tile-bg-selected, rgba(var(--tb-primary), 0.1)));
 }
 
 :where(.theme-scope) :where(.rb-tile--disabled, .er-event-card--disabled) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riverbankcms/sdk",
-  "version": "0.60.16",
+  "version": "0.62.2",
   "description": "Riverbank CMS SDK for headless content consumption",
   "main": "./dist/server/index.mjs",
   "module": "./dist/server/index.mjs",