@morphika/andami 0.2.11 → 0.2.13

package/lib/builder/store-helpers.ts

@@ -15,8 +15,9 @@ import type {
   ParallaxSlideV2,
   SectionColumn,
   SectionV2Preset,
+  CoverSection,
 } from "../../lib/sanity/types";
-import { isPageSectionV2, isParallaxGroup } from "../../lib/sanity/types";
+import { isPageSectionV2, isParallaxGroup, isCoverSection } from "../../lib/sanity/types";
 import { columnsFromPreset, detectPreset } from "./cascade";
 import { resizeColumnLeft as cascadeResizeLeft, moveColumn as cascadeMoveColumn, type ResizeLeftResult } from "./cascade";
 import { applyBlocksToColumns, toCascadeColumns, type CascadeColumn } from "./cascade-helpers";
@@ -74,6 +75,14 @@ export function moveBlockInState(
         );
         break;
       }
+    } else if (isCoverSection(item)) {
+      const updatedCols = removeFromColumns((item as CoverSection).columns);
+      if (movedBlock) {
+        rowsAfterRemove = rows.map((r, idx) =>
+          idx === i ? { ...r, columns: updatedCols } as ContentItem : r
+        );
+        break;
+      }
     } else if (isParallaxGroup(item)) {
       const group = item as ParallaxGroup;
       let foundInSlide = false;
@@ -217,8 +226,8 @@ export function addSectionV2InState(
       grid_columns: gridColumns,
       col_gap: 20,
       row_gap: 20,
-      spacing_top: "32",
-      spacing_bottom: "32",
+      spacing_top: "0",
+      spacing_bottom: "0",
     },
   };
 
@@ -369,7 +378,8 @@ export function moveColumnToGapV2InState(
 
 export type SectionPath =
   | { type: "v2"; index: number }
-  | { type: "parallaxSlide"; groupIndex: number; slideIndex: number };
+  | { type: "parallaxSlide"; groupIndex: number; slideIndex: number }
+  | { type: "cover"; index: number };
 
 /**
  * Find a V2 section by key — searches both top-level PageSectionV2
@@ -388,6 +398,9 @@ export function findSectionPath(
     if (item._key === sectionKey && isPageSectionV2(item)) {
       return { type: "v2", index: i };
     }
+    if (item._key === sectionKey && isCoverSection(item)) {
+      return { type: "cover", index: i };
+    }
     if (isParallaxGroup(item)) {
       const group = item as ParallaxGroup;
       for (let j = 0; j < group.slides.length; j++) {
@@ -412,6 +425,29 @@ export function getSectionFromPath(
     const item = rows[path.index];
     return isPageSectionV2(item) ? (item as PageSectionV2) : null;
   }
+  if (path.type === "cover") {
+    const item = rows[path.index];
+    if (!isCoverSection(item)) return null;
+    const cover = item as CoverSection;
+    return {
+      _type: "pageSectionV2",
+      _key: cover._key,
+      section_type: "empty-v2",
+      columns: cover.columns,
+      settings: {
+        preset: "custom",
+        grid_columns: cover.settings.grid_columns,
+        col_gap: cover.settings.col_gap,
+        row_gap: cover.settings.row_gap,
+        spacing_top: cover.settings.spacing_top,
+        spacing_right: cover.settings.spacing_right,
+        spacing_bottom: cover.settings.spacing_bottom,
+        spacing_left: cover.settings.spacing_left,
+        enter_animation: cover.settings.enter_animation,
+        stagger: cover.settings.stagger,
+      },
+    };
+  }
   const group = rows[path.groupIndex];
   if (!isParallaxGroup(group)) return null;
   const slide = (group as ParallaxGroup).slides[path.slideIndex];
@@ -440,6 +476,47 @@ export function updateSectionAtPath(
       return updater(item as PageSectionV2) as ContentItem;
     });
   }
+  if (path.type === "cover") {
+    return rows.map((item, i) => {
+      if (i !== path.index || !isCoverSection(item)) return item;
+      const cover = item as CoverSection;
+      const virtualSection: PageSectionV2 = {
+        _type: "pageSectionV2",
+        _key: cover._key,
+        section_type: "empty-v2",
+        columns: cover.columns,
+        settings: {
+          preset: "custom",
+          grid_columns: cover.settings.grid_columns,
+          col_gap: cover.settings.col_gap,
+          row_gap: cover.settings.row_gap,
+          spacing_top: cover.settings.spacing_top,
+          spacing_right: cover.settings.spacing_right,
+          spacing_bottom: cover.settings.spacing_bottom,
+          spacing_left: cover.settings.spacing_left,
+          enter_animation: cover.settings.enter_animation,
+          stagger: cover.settings.stagger,
+        },
+      };
+      const updated = updater(virtualSection);
+      return {
+        ...cover,
+        columns: updated.columns,
+        settings: {
+          ...cover.settings,
+          grid_columns: updated.settings.grid_columns,
+          col_gap: updated.settings.col_gap,
+          row_gap: updated.settings.row_gap,
+          spacing_top: updated.settings.spacing_top,
+          spacing_right: updated.settings.spacing_right,
+          spacing_bottom: updated.settings.spacing_bottom,
+          spacing_left: updated.settings.spacing_left,
+          enter_animation: updated.settings.enter_animation,
+          stagger: updated.settings.stagger,
+        },
+      } as ContentItem;
+    });
+  }
   // parallaxSlide path
   return rows.map((item, i) => {
     if (i !== path.groupIndex || !isParallaxGroup(item)) return item;

package/lib/builder/store-sections.ts

@@ -7,6 +7,7 @@ import type {
   CustomSectionInstance,
   ParallaxGroup,
   ParallaxSlideV2,
+  CoverSection,
   SectionV2Preset,
   EnterAnimationConfig,
 } from "../../lib/sanity/types";
@@ -14,6 +15,7 @@ import {
   isPageSectionV2,
   isCustomSectionInstance,
   isParallaxGroup,
+  isCoverSection,
 } from "../../lib/sanity/types";
 import { createDefaultBlock, createDefaultParallaxSlide } from "./defaults";
 import { generateKey } from "./utils";
@@ -78,8 +80,8 @@ export function createSectionActions(set: StoreSet, get: StoreGet) {
           grid_columns: gridColumns,
           col_gap: 20,
           row_gap: 20,
-          spacing_top: "32",
-          spacing_bottom: "32",
+          spacing_top: "0",
+          spacing_bottom: "0",
         },
       };
 
@@ -141,6 +143,14 @@ export function createSectionActions(set: StoreSet, get: StoreGet) {
               blocks: col.blocks.map((b) => ({ ...b, _key: generateKey() })),
             })
           );
+        } else if (isCoverSection(clone)) {
+          const cover = clone as CoverSection;
+          cover.cover_rows = cover.cover_rows.map((r) => ({ ...r, _key: generateKey() }));
+          cover.columns = cover.columns.map((col) => ({
+            ...col,
+            _key: generateKey(),
+            blocks: col.blocks.map((b) => ({ ...b, _key: generateKey() })),
+          }));
         } else if (isParallaxGroup(clone)) {
           const group = clone as ParallaxGroup;
           group.slides = group.slides.map((slide) => ({

package/lib/builder/store.ts

@@ -3,8 +3,8 @@ import type { BuilderStore, BuilderState, BlockType, PageSettings, CanvasTool, D
 import { DEFAULT_PAGE_SETTINGS, DEFAULT_GRID_SETTINGS, DEVICE_WIDTHS } from "./types";
 import { stateToDocument, documentToState } from "./serializer";
 import { generateKey } from "./utils";
-import type { ContentBlock, ContentItem, PageSectionV2, SectionV2Settings, PageMetadata, CustomSectionInstance, ParallaxGroup, ParallaxSlideV2 } from "../../lib/sanity/types";
-import { isPageSectionV2, isCustomSectionInstance, isParallaxGroup } from "../../lib/sanity/types";
+import type { ContentBlock, ContentItem, PageSectionV2, SectionV2Settings, PageMetadata, CustomSectionInstance, ParallaxGroup, ParallaxSlideV2, CoverSection } from "../../lib/sanity/types";
+import { isPageSectionV2, isCustomSectionInstance, isParallaxGroup, isCoverSection } from "../../lib/sanity/types";
 import { createDefaultBlock, createDefaultParallaxSlide } from "./defaults";
 import { MAX_HISTORY, pushSnapshot } from "./history";
 import {
@@ -33,6 +33,7 @@ import { revalidateSite } from "../../lib/revalidate";
 import { createSectionActions } from "./store-sections";
 import { createBlockActions } from "./store-blocks";
 import { createCanvasActions } from "./store-canvas";
+import { createCoverActions } from "./store-cover";
 
 // ============================================
 // RC-003 fix: Block parent key cache — O(1) lookup in selectBlock().
@@ -55,6 +56,13 @@ function getBlockParentCache(rows: ContentItem[]): Map<string, BlockParent> {
           cache.set(b._key, { rowKey: item._key, colKey: col._key });
         }
       }
+    } else if (isCoverSection(item)) {
+      const cover = item as CoverSection;
+      for (const col of cover.columns) {
+        for (const b of col.blocks) {
+          cache.set(b._key, { rowKey: item._key, colKey: col._key });
+        }
+      }
     } else if (isParallaxGroup(item)) {
       const group = item as ParallaxGroup;
       for (const slide of group.slides) {
@@ -346,4 +354,5 @@ export const useBuilderStore = create<BuilderStore>((set, get) => ({
   ...createSectionActions(set, get),
   ...createBlockActions(set, get),
   ...createCanvasActions(set, get),
+  ...createCoverActions(set, get),
 }));

package/lib/builder/types.ts

@@ -15,6 +15,9 @@ import type {
   SectionColumn,
   PageMetadata,
   ColorField,
+  CoverSection,
+  CoverSectionSettings,
+  CoverRow,
 } from "../../lib/sanity/types";
 import { DEFAULT_BG_COLOR, DEFAULT_TEXT_COLOR, DEFAULT_GRID_WIDTH } from "./constants";
 
@@ -48,7 +51,6 @@ export const BLOCK_TYPE_REGISTRY: BlockTypeInfo[] = [
   { type: "videoBlock", label: "Video", description: "Vimeo, YouTube, or MP4", group: "generic", icon: "▶", category: "content" },
   { type: "spacerBlock", label: "Spacer", description: "Vertical spacing", group: "generic", icon: "↕", category: "content" },
   { type: "buttonBlock", label: "Button", description: "Call-to-action button", group: "generic", icon: "▣", category: "content" },
-  { type: "coverBlock", label: "Cover", description: "Full-screen hero section", group: "generic", icon: "◈", category: "content" },
 ];
 
 /**
@@ -90,7 +92,7 @@ export function isSectionBlockSection(section: { columns?: Array<{ blocks?: Arra
   return blocks.length === 1 && SECTION_BLOCK_TYPES.has(blocks[0]._type);
 }
 
-export type SectionType = "empty-v2" | "parallaxGroup" | SectionBlockType;
+export type SectionType = "empty-v2" | "parallaxGroup" | "coverSection" | SectionBlockType;
 
 export interface SectionTypeInfo {
   type: SectionType;
@@ -103,6 +105,7 @@ export interface SectionTypeInfo {
 
 export const SECTION_TYPE_REGISTRY: SectionTypeInfo[] = [
   { type: "empty-v2", label: "Empty Section", description: "Grid section with flexible columns", icon: "⊞" },
+  { type: "coverSection", label: "Cover Section", description: "Full-viewport section with background and proportional rows", icon: "◆" },
   { type: "projectGridBlock", label: "Project Grid", description: "Staggered project showcase grid", icon: "⬡", blockType: "projectGridBlock" },
   { type: "parallaxGroup", label: "Parallax Section", description: "Full-screen parallax showcase with V2 slides", icon: "▽" },
 ];
@@ -374,6 +377,16 @@ export interface BuilderActions {
   /** Update group-level settings (transition effect, snap, etc.) */
   updateParallaxGroupSettings: (groupKey: string, fields: Partial<Pick<import("../../lib/sanity/types").ParallaxGroup, "transition_effect" | "snap_enabled" | "parallax_intensity">>) => void;
 
+  // ---- Cover Section operations (Session 176) ----
+  addCoverSection: (afterRowKey?: string | null) => void;
+  addCoverRow: (sectionKey: string) => void;
+  removeCoverRow: (sectionKey: string, rowKey: string) => void;
+  resizeCoverRow: (sectionKey: string, handleIndex: number, deltaPercent: number, startAbove: number, startBelow: number) => void;
+  updateCoverRowAlign: (sectionKey: string, rowKey: string, align: CoverRow["vertical_align"]) => void;
+  updateCoverBackground: (sectionKey: string, fields: Partial<Pick<CoverSection, "background_type" | "background_image" | "background_video" | "background_position" | "background_size" | "background_overlay_color" | "background_overlay_opacity">>) => void;
+  updateCoverSettings: (sectionKey: string, settings: Partial<CoverSectionSettings>) => void;
+  updateCoverHeight: (sectionKey: string, height: CoverSection["height"]) => void;
+
   // Page-level settings
   updatePageSettings: (settings: Partial<PageSettings>) => void;
   applyGlobalStyles: () => Promise<void>;

package/lib/sanity/types.ts

@@ -210,47 +210,6 @@ export interface ButtonBlock {
   responsive?: ResponsiveOverrides<ButtonBlock>;
 }
 
-export interface CoverBlock {
-  _type: "coverBlock";
-  _key: string;
-  // Content
-  headline?: string;
-  subheadline?: string;
-  cta_button?: {
-    text?: string;
-    url?: string;
-    target_blank?: boolean;
-    style?: "primary" | "secondary" | "outline" | "text";
-  };
-  // Media
-  media_type?: "image" | "video";
-  media_path?: string;
-  video_poster?: string;
-  background_size?: "cover" | "contain" | "none";
-  background_position?: string;
-  background_repeat?: "no-repeat" | "repeat" | "repeat-x" | "repeat-y";
-  // Overlay
-  overlay?: "none" | "dark" | "light" | "gradient-bottom" | "gradient-top";
-  overlay_opacity?: number;
-  /** Custom overlay gradient (Phase 4). JSON-serialized ColorField.
-   *  When set, takes precedence over overlay + overlay_opacity. */
-  overlay_gradient?: string;
-  // Layout
-  content_align_h?: "left" | "center" | "right";
-  content_align_v?: "top" | "center" | "bottom";
-  content_max_width?: string;
-  height?: "100vh" | "80vh" | "60vh" | "40vh" | "custom";
-  custom_height?: string;
-  mobile_height?: "same" | "100vh" | "80vh" | "60vh" | "500px" | "400px";
-  // Appearance
-  text_color?: string;
-  show_scroll_indicator?: boolean;
-  enter_animation?: import("../../lib/animation/enter-types").EnterAnimationConfig;
-  hover_effect?: import("../../lib/animation/hover-effect-types").HoverEffectConfig;
-  layout?: BlockLayout;
-  responsive?: ResponsiveOverrides<CoverBlock>;
-}
-
 // ============================================
 // Project Grid Block v2 (template-only, Session 105)
 // ============================================
@@ -477,11 +436,84 @@ export interface CustomSectionInstance {
   responsive_overrides?: PageSectionV2["responsive"];
 }
 
+// ============================================
+// Cover Section — proportional rows (Session 176)
+// ============================================
+// Full-viewport section with fixed-height rows and background media.
+// Uses the same SectionColumn/block system as V2 but with explicit
+// row heights (percentages) instead of content-driven auto rows.
+
+export type CoverSectionHeight = "100vh" | "80vh" | "50vh";
+
+/** A single proportional row within a Cover Section */
+export interface CoverRow {
+  _key: string;
+  height_percent: number;      // 5–95, all rows must sum to 100
+  vertical_align: "start" | "center" | "end";
+}
+
+/** Cover Section settings (subset of SectionV2Settings — no background/border) */
+export interface CoverSectionSettings {
+  grid_columns: number;        // default 12
+  col_gap: number;
+  row_gap: number;
+  spacing_top?: string;
+  spacing_right?: string;
+  spacing_bottom?: string;
+  spacing_left?: string;
+  enter_animation?: import("../../lib/animation/enter-types").EnterAnimationConfig;
+  stagger?: {
+    enabled?: boolean;
+    delayPerChild?: number;
+    direction?: "left-to-right" | "right-to-left";
+  };
+}
+
+/** Responsive override for Cover Sections */
+export interface CoverSectionResponsiveOverride {
+  columns?: ColumnOverride[];
+  cover_rows?: Array<{ _key: string; height_percent?: number }>;
+  settings?: Partial<CoverSectionSettings>;
+}
+
+/** Cover Section — full-viewport section with background and proportional rows */
+export interface CoverSection {
+  _type: "coverSection";
+  _key: string;
+
+  // Background
+  background_type: "image" | "video";
+  background_image?: string;
+  background_video?: string;
+  background_position?: string;
+  background_size?: "cover" | "contain" | "auto";
+  background_overlay_color?: string;
+  background_overlay_opacity?: number;   // 0–100
+
+  // Height
+  height: CoverSectionHeight;
+
+  // Rows (explicit proportional heights)
+  cover_rows: CoverRow[];
+
+  // Columns (same as V2 — flat array with grid_row referencing cover_rows index)
+  columns: SectionColumn[];
+
+  // Settings
+  settings: CoverSectionSettings;
+
+  // Responsive
+  responsive?: {
+    tablet?: CoverSectionResponsiveOverride;
+    phone?: CoverSectionResponsiveOverride;
+  };
+}
+
 // ============================================
 // Content Item — union of section types in content_rows
 // ============================================
 
-export type ContentItem = PageSectionV2 | CustomSectionInstance | ParallaxGroup;
+export type ContentItem = PageSectionV2 | CustomSectionInstance | ParallaxGroup | CoverSection;
 
 /** Type guard: check if a content item is a PageSectionV2 */
 export function isPageSectionV2(item: ContentItem): item is PageSectionV2 {
@@ -498,6 +530,11 @@ export function isParallaxGroup(item: ContentItem): item is ParallaxGroup {
   return (item as ParallaxGroup)._type === "parallaxGroup";
 }
 
+/** Type guard: check if a content item is a CoverSection (Session 176) */
+export function isCoverSection(item: ContentItem): item is CoverSection {
+  return (item as CoverSection)._type === "coverSection";
+}
+
 // ============================================
 // Shared references
 // ============================================
@@ -520,7 +557,6 @@ export type ContentBlock =
   | VideoBlock
   | SpacerBlock
   | ButtonBlock
-  | CoverBlock
   | ProjectGridBlock;
 
 // ============================================

package/lib/version.ts

@@ -6,4 +6,4 @@
  * Exposed as a plain constant so it can be imported without reading
  * package.json at runtime.
  */
-export const ANDAMI_VERSION = "0.2.11";
+export const ANDAMI_VERSION = "0.2.13";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morphika/andami",
-  "version": "0.2.11",
+  "version": "0.2.13",
   "description": "Visual Page Builder — core library. A reusable website builder with visual editing, CMS integration, and asset management.",
   "type": "module",
   "license": "MIT",

package/sanity/schemas/blocks/index.ts

@@ -1,9 +1,8 @@
-// Block schemas (8)
+// Block schemas (7)
 export { textBlock } from "./textBlock";
 export { imageBlock } from "./imageBlock";
 export { imageGridBlock } from "./imageGridBlock";
 export { videoBlock } from "./videoBlock";
 export { spacerBlock } from "./spacerBlock";
 export { buttonBlock } from "./buttonBlock";
-export { coverBlock } from "./coverBlock";
 export { projectGridBlock } from "./projectGridBlock";

package/sanity/schemas/index.ts

@@ -10,6 +10,7 @@ import hoverEffectConfig from "./objects/hoverEffectConfig";
 import typewriterConfig from "./objects/typewriterConfig";
 import parallaxSlide from "./objects/parallaxSlide";
 import parallaxGroup from "./objects/parallaxGroup";
+import coverSection from "./objects/coverSection";
 import {
   textBlock,
   imageBlock,
@@ -17,7 +18,6 @@ import {
   videoBlock,
   spacerBlock,
   buttonBlock,
-  coverBlock,
   projectGridBlock,
 } from "./blocks";
 
@@ -58,6 +58,9 @@ export {
 export {
   default as parallaxGroup,
 } from "./objects/parallaxGroup";
+export {
+  default as coverSection,
+} from "./objects/coverSection";
 export {
   textBlock,
   imageBlock,
@@ -65,7 +68,6 @@ export {
   videoBlock,
   spacerBlock,
   buttonBlock,
-  coverBlock,
   projectGridBlock,
 } from "./blocks";
 
@@ -87,6 +89,7 @@ export const schemaTypes = [
   typewriterConfig,         // Typewriter config for textBlock (Session 117)
   parallaxSlide,            // Parallax V2 slide (Session 123)
   parallaxGroup,            // Parallax V2 group (Session 123)
+  coverSection,             // Cover Section — proportional rows (Session 176)
 
   // Blocks (8)
   textBlock,
@@ -95,7 +98,6 @@ export const schemaTypes = [
   videoBlock,
   spacerBlock,
   buttonBlock,
-  coverBlock,
   projectGridBlock,
 ];