@morphika/andami 0.1.3 → 0.1.5

package/lib/sanity/types.ts

@@ -232,6 +232,9 @@ export interface CoverBlock {
   // 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";
@@ -676,7 +679,8 @@ export interface NavItem {
 
 export interface NavDesign {
   logo_text?: string;
-  color?: NavColorVariant;
+  /** Nav text color — legacy NavColorVariant preset OR hex string (e.g. "#d4ff00"). */
+  color?: NavColorVariant | string;
   position?: "fixed" | "sticky" | "static";
   hide_on_scroll?: boolean;
   font_size?: number;
@@ -702,6 +706,31 @@ export interface NavDesign {
   entrance_stagger_delay?: number; // ms between items, default 80
 }
 
+// ============================================
+// Mobile Nav Design — independent mobile menu styles (Session 158)
+// ============================================
+// These styles apply ONLY to the hamburger mobile menu.
+// Page-level nav_color and parallax slide color overrides do NOT
+// affect the mobile menu — it always uses these dedicated values
+// (with fallback to desktop NavDesign where noted).
+
+export interface MobileNavDesign {
+  // ── Overlay (expanded fullscreen menu) ──
+  overlay_bg?: string;          // hex color, default "#0a0a0a" (brand-dark)
+  text_color?: string;          // hex color, empty = inherit from desktop design.color
+  font_size?: number;           // px, default 24
+  text_transform?: "none" | "uppercase" | "lowercase" | "capitalize";
+  items_gap?: number;           // px, default 32
+  items_align?: "left" | "center" | "right";
+
+  // ── Navbar bar (logo + hamburger row, visible before menu opens) ──
+  navbar_bg?: string;           // hex color, empty = transparent
+  navbar_bg_opacity?: number;   // 0–100, default 0
+  hamburger_color?: string;     // hex color, empty = inherit from desktop design.color
+  padding_h?: number;           // px, default 24
+  padding_v?: number;           // px, default 27
+}
+
 // ============================================
 // Storage Provider
 // ============================================
@@ -765,6 +794,7 @@ export interface AssetRegistry {
 export interface SiteSettings {
   nav_items?: NavItem[];
   nav_design?: NavDesign;
+  nav_mobile_design?: MobileNavDesign;
   default_title?: string;
   default_description?: string;
   default_og_image?: string;
@@ -811,6 +841,51 @@ export interface ColorSwatch {
   hex: string;
 }
 
+// ─── Color Field (Phase 2 — gradient-ready) ───
+
+/** A stop in a linear or radial gradient */
+export interface GradientStop {
+  color: string; // hex #RRGGBB
+  alpha: number; // 0-1
+  position: number; // 0-100 (%)
+}
+
+/** A point in a mesh gradient */
+export interface MeshPoint {
+  color: string; // hex #RRGGBB
+  x: number; // 0-100 (%)
+  y: number; // 0-100 (%)
+}
+
+export interface LinearGradient {
+  type: "linear";
+  stops: GradientStop[]; // min 2
+  angle: number; // 0-360
+}
+
+export interface RadialGradient {
+  type: "radial";
+  stops: GradientStop[]; // min 2
+  position: { x: number; y: number }; // center, 0-100
+  shape: "circle" | "ellipse";
+}
+
+export interface MeshGradient {
+  type: "mesh";
+  points: MeshPoint[]; // min 2
+  background: string; // hex
+}
+
+/** Gradient value — only for fields that support gradients */
+export type GradientValue = LinearGradient | RadialGradient | MeshGradient;
+
+/**
+ * Color field value in Sanity.
+ * - string: solid hex color (backward compatible with existing data)
+ * - GradientValue: gradient (Phase 3 UI, renderers ready now)
+ */
+export type ColorField = string | GradientValue;
+
 export interface ColorPalette {
   swatches: ColorSwatch[];
   // Legacy fields (backward compat, may be empty)

package/lib/setup/detect.ts

@@ -103,7 +103,7 @@ export async function isSetupMarkedComplete(): Promise<boolean> {
 
   try {
     const result = await client.fetch<{ complete: boolean }>(
-      `*[_type == "siteSettings"][0]{ "complete": setup_complete == true }`
+      `*[_id == "siteSettings"][0]{ "complete": setup_complete == true }`
     );
     return !!result?.complete;
   } catch {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morphika/andami",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "Visual Page Builder — core library. A reusable website builder with visual editing, CMS integration, and asset management.",
   "type": "module",
   "license": "MIT",
@@ -53,14 +53,21 @@
     "./components/builder/editors/*": "./components/builder/editors/*.tsx",
     "./components/builder/settings-panel": "./components/builder/settings-panel/index.ts",
     "./components/builder/settings-panel/*": "./components/builder/settings-panel/*.tsx",
+    "./components/builder/settings-panel/responsive-helpers": "./components/builder/settings-panel/responsive-helpers.ts",
     "./components/builder/asset-browser": "./components/builder/asset-browser/index.ts",
     "./components/builder/asset-browser/*": "./components/builder/asset-browser/*.tsx",
+    "./components/builder/asset-browser/helpers": "./components/builder/asset-browser/helpers.ts",
+    "./components/builder/asset-browser/types": "./components/builder/asset-browser/types.ts",
+    "./components/builder/asset-browser/useAssetBrowser": "./components/builder/asset-browser/useAssetBrowser.ts",
+    "./components/builder/asset-browser/useR2DragDrop": "./components/builder/asset-browser/useR2DragDrop.ts",
+    "./components/builder/asset-browser/useR2Operations": "./components/builder/asset-browser/useR2Operations.ts",
     "./components/builder/live-preview": "./components/builder/live-preview/index.ts",
     "./components/builder/live-preview/*": "./components/builder/live-preview/*.tsx",
     "./components/admin": "./components/admin/index.ts",
     "./components/admin/*": "./components/admin/*.tsx",
     "./components/admin/nav-builder": "./components/admin/nav-builder/index.ts",
     "./components/admin/nav-builder/*": "./components/admin/nav-builder/*.tsx",
+    "./components/admin/nav-builder/nav-builder-utils": "./components/admin/nav-builder/nav-builder-utils.ts",
     "./components/admin/styles": "./components/admin/styles/index.ts",
     "./components/admin/styles/*": "./components/admin/styles/*.tsx",
     "./components/ui/*": "./components/ui/*.tsx",
@@ -173,7 +180,6 @@
     "@aws-sdk/client-s3": "^3.1021.0",
     "@aws-sdk/s3-request-presigner": "^3.1021.0",
     "@dnd-kit/core": "^6.3.1",
-    "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
     "next-sanity": "^12.1.5",

package/sanity/schemas/siteSettings.ts

@@ -213,6 +213,40 @@ export default defineType({
       ],
     }),
 
+    // === MOBILE NAV DESIGN (Session 158) ===
+    defineField({
+      name: "nav_mobile_design",
+      title: "Mobile Navigation Design",
+      type: "object",
+      group: "nav_design",
+      description: "Independent styles for the mobile hamburger menu",
+      fields: [
+        defineField({ name: "overlay_bg", title: "Overlay Background", type: "string", description: "Hex color for fullscreen menu background" }),
+        defineField({ name: "text_color", title: "Text Color", type: "string", description: "Hex color, empty = inherit from desktop" }),
+        defineField({ name: "font_size", title: "Font Size (px)", type: "number", initialValue: 24 }),
+        defineField({
+          name: "text_transform",
+          title: "Text Transform",
+          type: "string",
+          options: { list: [{ title: "None", value: "none" }, { title: "Uppercase", value: "uppercase" }, { title: "Lowercase", value: "lowercase" }, { title: "Capitalize", value: "capitalize" }] },
+          initialValue: "uppercase",
+        }),
+        defineField({ name: "items_gap", title: "Items Gap (px)", type: "number", initialValue: 32 }),
+        defineField({
+          name: "items_align",
+          title: "Items Align",
+          type: "string",
+          options: { list: [{ title: "Left", value: "left" }, { title: "Center", value: "center" }, { title: "Right", value: "right" }] },
+          initialValue: "center",
+        }),
+        defineField({ name: "navbar_bg", title: "Navbar Bar Background", type: "string", description: "Hex color for the logo+hamburger bar" }),
+        defineField({ name: "navbar_bg_opacity", title: "Navbar Bar BG Opacity (%)", type: "number", initialValue: 0 }),
+        defineField({ name: "hamburger_color", title: "Hamburger Icon Color", type: "string", description: "Hex color, empty = inherit from desktop" }),
+        defineField({ name: "padding_h", title: "Horizontal Padding (px)", type: "number", initialValue: 24 }),
+        defineField({ name: "padding_v", title: "Vertical Padding (px)", type: "number", initialValue: 27 }),
+      ],
+    }),
+
     // === METADATA ===
     defineField({ name: "default_title", title: "Default Title", type: "string", group: "meta", initialValue: _cfg.defaults.metaTitle }),
     defineField({ name: "default_description", title: "Default Description", type: "text", rows: 3, group: "meta" }),

package/styles/base.css

@@ -46,7 +46,7 @@ html {
 body {
   background: var(--color-brand-dark);
   color: var(--color-brand-text);
-  font-family: var(--font-mono);
+  font-family: var(--font-sans);
   overflow-x: clip;
   width: 100%;
   transition: background-color 300ms ease;
@@ -91,7 +91,7 @@ img[data-asset-failed]::after {
   align-items: center;
   justify-content: center;
   font-size: 11px;
-  font-family: var(--font-mono);
+  font-family: var(--font-sans);
   letter-spacing: 0.05em;
   text-transform: uppercase;
   color: rgba(255, 255, 255, 0.7);
@@ -101,4 +101,4 @@ img[data-asset-failed]::after {
 video[data-asset-failed] {
   background: #1a1a1a;
   min-height: 60px;
-}
+}

package/app/globals.css

@@ -1,7 +0,0 @@
-/* Morphika instance — imports all core styles.
-   This is the monolith entry point; equivalent to:
-     @import "@morphika/andami/styles/globals.css";
-   but uses relative paths since we're inside the monorepo. */
-@import "../packages/core/styles/base.css";
-@import "../packages/core/styles/animations.css";
-@import "../packages/core/styles/admin.css";