@morphika/webframe 0.1.0

package/sanity/schemas/pageSectionV2.ts

@@ -0,0 +1,269 @@
+import { defineField, defineType } from "sanity";
+
+/**
+ * pageSectionV2 — V2 Grid Section.
+ *
+ * Flat list of columns with explicit grid positions. No "row" objects —
+ * rows are a visual artifact derived from `grid_row` values.
+ * The serializer stores exactly what the builder computes.
+ *
+ * Session 83: V2 Grid System — Phase 1 (Data Layer & Core Engine).
+ */
+export default defineType({
+  name: "pageSectionV2",
+  title: "Page Section V2",
+  type: "object",
+  fields: [
+    defineField({
+      name: "section_type",
+      title: "Section Type",
+      type: "string",
+      options: {
+        list: [{ title: "Empty V2", value: "empty-v2" }],
+      },
+      validation: (Rule) => Rule.required(),
+    }),
+
+    // ---- Columns: flat array with explicit grid positions ----
+    defineField({
+      name: "columns",
+      title: "Columns",
+      type: "array",
+      of: [
+        {
+          type: "object",
+          name: "sectionColumn",
+          fields: [
+            defineField({
+              name: "grid_column",
+              title: "Grid Column",
+              type: "number",
+              description: "1-based start position (1–12)",
+              validation: (Rule) => Rule.required().min(1).max(12),
+            }),
+            defineField({
+              name: "grid_row",
+              title: "Grid Row",
+              type: "number",
+              description: "1-based row (computed by builder)",
+              validation: (Rule) => Rule.required().min(1),
+            }),
+            defineField({
+              name: "span",
+              title: "Column Span",
+              type: "number",
+              description: "How many grid columns (1–12)",
+              validation: (Rule) => Rule.required().min(1).max(12),
+            }),
+            defineField({
+              name: "blocks",
+              title: "Blocks",
+              type: "array",
+              of: [
+                { type: "textBlock" },
+                { type: "imageBlock" },
+                { type: "imageGridBlock" },
+                { type: "videoBlock" },
+                { type: "spacerBlock" },
+                { type: "buttonBlock" },
+                { type: "coverBlock" },
+              ],
+            }),
+            // Column-level enter animation (Session 117)
+            defineField({
+              name: "enter_animation",
+              title: "Enter Animation",
+              type: "enterAnimationConfig",
+            }),
+          ],
+        },
+      ],
+    }),
+
+    // ---- Section Settings ----
+    defineField({
+      name: "settings",
+      title: "Section Settings",
+      type: "object",
+      fields: [
+        // Grid
+        defineField({
+          name: "preset",
+          title: "Layout Preset",
+          type: "string",
+          options: {
+            list: ["full", "halves", "thirds", "quarters", "1/3+2/3", "2/3+1/3", "custom"],
+          },
+        }),
+        defineField({ name: "grid_columns", title: "Grid Columns", type: "number" }),
+        defineField({ name: "col_gap", title: "Column Gap", type: "number" }),
+        defineField({ name: "row_gap", title: "Row Gap", type: "number" }),
+        // Spacing (padding TRBL)
+        defineField({ name: "spacing_top", title: "Spacing Top", type: "string" }),
+        defineField({ name: "spacing_right", title: "Spacing Right", type: "string" }),
+        defineField({ name: "spacing_bottom", title: "Spacing Bottom", type: "string" }),
+        defineField({ name: "spacing_left", title: "Spacing Left", type: "string" }),
+        // Offset (margin TRBL)
+        defineField({ name: "offset_top", title: "Offset Top", type: "string" }),
+        defineField({ name: "offset_right", title: "Offset Right", type: "string" }),
+        defineField({ name: "offset_bottom", title: "Offset Bottom", type: "string" }),
+        defineField({ name: "offset_left", title: "Offset Left", type: "string" }),
+        // Background
+        defineField({ name: "background_color", title: "Background Color", type: "string" }),
+        defineField({ name: "background_opacity", title: "Background Opacity", type: "number" }),
+        defineField({ name: "background_image", title: "Background Image", type: "string" }),
+        defineField({
+          name: "background_size",
+          title: "Background Size",
+          type: "string",
+          options: { list: ["cover", "contain", "auto"] },
+        }),
+        defineField({ name: "background_position", title: "Background Position", type: "string" }),
+        defineField({
+          name: "background_repeat",
+          title: "Background Repeat",
+          type: "string",
+          options: { list: ["no-repeat", "repeat", "repeat-x", "repeat-y"] },
+        }),
+        // Border
+        defineField({ name: "border_color", title: "Border Color", type: "string" }),
+        defineField({ name: "border_width", title: "Border Width", type: "string" }),
+        defineField({
+          name: "border_style",
+          title: "Border Style",
+          type: "string",
+          options: { list: ["none", "solid", "dashed", "dotted"] },
+        }),
+        defineField({
+          name: "border_sides",
+          title: "Border Sides",
+          type: "string",
+          options: { list: ["all", "top", "right", "bottom", "left", "top-bottom", "left-right"] },
+        }),
+        defineField({ name: "border_radius", title: "Border Radius", type: "string" }),
+        // Animation
+        defineField({
+          name: "enter_animation",
+          title: "Enter Animation",
+          type: "enterAnimationConfig",
+        }),
+        // Stagger
+        defineField({
+          name: "stagger",
+          title: "Stagger",
+          type: "object",
+          fields: [
+            defineField({ name: "enabled", title: "Enabled", type: "boolean" }),
+            defineField({ name: "delayPerChild", title: "Delay Per Child", type: "number" }),
+            defineField({
+              name: "direction",
+              title: "Direction",
+              type: "string",
+              options: { list: ["left-to-right", "right-to-left"] },
+            }),
+          ],
+        }),
+      ],
+    }),
+
+    // ---- Responsive Overrides ----
+    defineField({
+      name: "responsive",
+      title: "Responsive Overrides",
+      type: "object",
+      hidden: true, // Managed by the visual builder
+      fields: [
+        defineField({
+          name: "tablet",
+          title: "Tablet",
+          type: "object",
+          fields: [
+            // Column overrides
+            defineField({
+              name: "columns",
+              title: "Column Overrides",
+              type: "array",
+              of: [
+                {
+                  type: "object",
+                  name: "columnOverride",
+                  fields: [
+                    defineField({ name: "grid_column", title: "Grid Column", type: "number" }),
+                    defineField({ name: "grid_row", title: "Grid Row", type: "number" }),
+                    defineField({ name: "span", title: "Span", type: "number" }),
+                  ],
+                },
+              ],
+            }),
+            // Section setting overrides
+            defineField({ name: "col_gap", title: "Column Gap", type: "number" }),
+            defineField({ name: "row_gap", title: "Row Gap", type: "number" }),
+            defineField({ name: "spacing_top", type: "string", title: "Spacing Top" }),
+            defineField({ name: "spacing_right", type: "string", title: "Spacing Right" }),
+            defineField({ name: "spacing_bottom", type: "string", title: "Spacing Bottom" }),
+            defineField({ name: "spacing_left", type: "string", title: "Spacing Left" }),
+            defineField({ name: "offset_top", type: "string", title: "Offset Top" }),
+            defineField({ name: "offset_right", type: "string", title: "Offset Right" }),
+            defineField({ name: "offset_bottom", type: "string", title: "Offset Bottom" }),
+            defineField({ name: "offset_left", type: "string", title: "Offset Left" }),
+            defineField({ name: "background_color", type: "string", title: "Background Color" }),
+            defineField({ name: "background_opacity", type: "number", title: "Background Opacity" }),
+            defineField({ name: "border_color", type: "string", title: "Border Color" }),
+            defineField({ name: "border_width", type: "string", title: "Border Width" }),
+            defineField({ name: "border_style", type: "string", title: "Border Style" }),
+            defineField({ name: "border_sides", type: "string", title: "Border Sides" }),
+            defineField({ name: "border_radius", type: "string", title: "Border Radius" }),
+          ],
+        }),
+        defineField({
+          name: "phone",
+          title: "Phone",
+          type: "object",
+          fields: [
+            // Column overrides
+            defineField({
+              name: "columns",
+              title: "Column Overrides",
+              type: "array",
+              of: [
+                {
+                  type: "object",
+                  name: "columnOverride",
+                  fields: [
+                    defineField({ name: "grid_column", title: "Grid Column", type: "number" }),
+                    defineField({ name: "grid_row", title: "Grid Row", type: "number" }),
+                    defineField({ name: "span", title: "Span", type: "number" }),
+                  ],
+                },
+              ],
+            }),
+            // Section setting overrides
+            defineField({ name: "col_gap", title: "Column Gap", type: "number" }),
+            defineField({ name: "row_gap", title: "Row Gap", type: "number" }),
+            defineField({ name: "spacing_top", type: "string", title: "Spacing Top" }),
+            defineField({ name: "spacing_right", type: "string", title: "Spacing Right" }),
+            defineField({ name: "spacing_bottom", type: "string", title: "Spacing Bottom" }),
+            defineField({ name: "spacing_left", type: "string", title: "Spacing Left" }),
+            defineField({ name: "offset_top", type: "string", title: "Offset Top" }),
+            defineField({ name: "offset_right", type: "string", title: "Offset Right" }),
+            defineField({ name: "offset_bottom", type: "string", title: "Offset Bottom" }),
+            defineField({ name: "offset_left", type: "string", title: "Offset Left" }),
+            defineField({ name: "background_color", type: "string", title: "Background Color" }),
+            defineField({ name: "background_opacity", type: "number", title: "Background Opacity" }),
+            defineField({ name: "border_color", type: "string", title: "Border Color" }),
+            defineField({ name: "border_width", type: "string", title: "Border Width" }),
+            defineField({ name: "border_style", type: "string", title: "Border Style" }),
+            defineField({ name: "border_sides", type: "string", title: "Border Sides" }),
+            defineField({ name: "border_radius", type: "string", title: "Border Radius" }),
+          ],
+        }),
+      ],
+    }),
+  ],
+  preview: {
+    select: { section_type: "section_type" },
+    prepare({ section_type }) {
+      return { title: section_type === "empty-v2" ? "Section V2" : "Section" };
+    },
+  },
+});

package/sanity/schemas/siteSettings.ts

@@ -0,0 +1,256 @@
+import { defineType, defineField } from "sanity";
+import { getSiteConfig } from "../../lib/config";
+
+const _cfg = getSiteConfig();
+
+export default defineType({
+  name: "siteSettings",
+  title: "Site Settings",
+  type: "document",
+  groups: [
+    { name: "nav", title: "Navigation", default: true },
+    { name: "nav_design", title: "Nav Design" },
+    { name: "meta", title: "Metadata" },
+    { name: "assets", title: "Assets" },
+  ],
+  fields: [
+    // === NAVIGATION ===
+    defineField({
+      name: "nav_items",
+      title: "Nav Items",
+      type: "array",
+      group: "nav",
+      of: [
+        {
+          type: "object",
+          fields: [
+            defineField({
+              name: "type",
+              title: "Item Type",
+              type: "string",
+              options: { list: [{ title: "Logo", value: "logo" }, { title: "Menu Item", value: "menu-item" }] },
+              initialValue: "menu-item",
+            }),
+            defineField({ name: "label", title: "Label", type: "string", validation: (Rule) => Rule.required() }),
+            defineField({ name: "logo_image", title: "Logo Image", type: "string", description: "Asset path for logo image (optional)" }),
+            defineField({
+              name: "link_type",
+              title: "Link Type",
+              type: "string",
+              options: {
+                list: [
+                  { title: "Internal Page", value: "internal" },
+                  { title: "External URL", value: "external" },
+                  { title: "Content (Lightbox)", value: "content" },
+                ],
+              },
+              initialValue: "internal",
+            }),
+            defineField({
+              name: "internal_page",
+              title: "Internal Page",
+              type: "reference",
+              to: [{ type: "page" }],
+              hidden: ({ parent }) => parent?.link_type !== "internal",
+            }),
+            defineField({
+              name: "external_url",
+              title: "External URL",
+              type: "url",
+              hidden: ({ parent }) => parent?.link_type !== "external",
+            }),
+            defineField({
+              name: "content_type",
+              title: "Content Type",
+              type: "string",
+              options: {
+                list: [
+                  { title: "Image", value: "image" },
+                  { title: "Video File", value: "video-file" },
+                  { title: "Video Embed", value: "video-embed" },
+                ],
+              },
+              initialValue: "image",
+              hidden: ({ parent }) => parent?.link_type !== "content",
+            }),
+            defineField({
+              name: "content_asset",
+              title: "Content Asset",
+              type: "string",
+              description: "Asset path for image or video file",
+              hidden: ({ parent }) => parent?.link_type !== "content" || parent?.content_type === "video-embed",
+            }),
+            defineField({
+              name: "content_url",
+              title: "Video Embed URL",
+              type: "url",
+              description: "YouTube or Vimeo URL",
+              hidden: ({ parent }) => parent?.link_type !== "content" || parent?.content_type !== "video-embed",
+            }),
+            defineField({ name: "visible", title: "Visible", type: "boolean", initialValue: true }),
+            defineField({ name: "grid_column", title: "Grid Column", type: "number", description: "Which of the 12 grid columns this item sits in (1–12)", initialValue: 1 }),
+            defineField({ name: "column_span", title: "Column Span", type: "number", description: "How many columns this item occupies (1–12)", initialValue: 1 }),
+            defineField({
+              name: "style_overrides",
+              title: "Style Overrides",
+              type: "object",
+              fields: [
+                defineField({ name: "font_size", title: "Font Size (px)", type: "number" }),
+                defineField({ name: "font_weight", title: "Font Weight", type: "string" }),
+                defineField({ name: "font_family", title: "Font Family", type: "string" }),
+                defineField({ name: "color", title: "Color", type: "string" }),
+                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" }] },
+                }),
+                defineField({
+                  name: "vertical_align",
+                  title: "Vertical Align",
+                  type: "string",
+                  options: { list: [{ title: "Top", value: "top" }, { title: "Middle", value: "middle" }, { title: "Bottom", value: "bottom" }] },
+                }),
+              ],
+            }),
+          ],
+          preview: {
+            select: { label: "label", itemType: "type", visible: "visible" },
+            prepare({ label, itemType, visible }: { label?: string; itemType?: string; visible?: boolean }) {
+              return {
+                title: `${label || "Untitled"}${visible === false ? " (hidden)" : ""}`,
+                subtitle: itemType === "logo" ? "Logo" : "Menu Item",
+              };
+            },
+          },
+        },
+      ],
+    }),
+
+    // === NAV DESIGN ===
+    defineField({
+      name: "nav_design",
+      title: "Navigation Design",
+      type: "object",
+      group: "nav_design",
+      fields: [
+        defineField({ name: "logo_text", title: "Logo Text", type: "string", initialValue: _cfg.defaults.logoText }),
+        defineField({
+          name: "color",
+          title: "Nav Color",
+          type: "string",
+          options: {
+            list: [
+              { title: "Yellow-Lime", value: "yellow-lime" },
+              { title: "Yellow", value: "yellow" },
+              { title: "Red / Coral", value: "red-coral" },
+              { title: "Blue", value: "blue" },
+              { title: "Green", value: "green" },
+              { title: "White", value: "white" },
+            ],
+          },
+          initialValue: "yellow-lime",
+        }),
+        defineField({
+          name: "position",
+          title: "Position",
+          type: "string",
+          options: {
+            list: [
+              { title: "Fixed (stays on top)", value: "fixed" },
+              { title: "Sticky", value: "sticky" },
+              { title: "Static (scrolls away)", value: "static" },
+            ],
+          },
+          initialValue: "fixed",
+        }),
+        defineField({ name: "hide_on_scroll", title: "Hide on Scroll Down", type: "boolean", initialValue: true }),
+        defineField({ name: "font_size", title: "Font Size (px)", type: "number", initialValue: 14 }),
+        defineField({ name: "font_weight", title: "Font Weight", type: "string", initialValue: "400" }),
+        defineField({ name: "font_family", title: "Font Family", type: "string" }),
+        defineField({
+          name: "text_align",
+          title: "Text Align",
+          type: "string",
+          options: { list: [{ title: "Left", value: "left" }, { title: "Center", value: "center" }, { title: "Right", value: "right" }] },
+          initialValue: "left",
+        }),
+        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: "padding_h", title: "Horizontal Padding (px)", type: "number", initialValue: 24 }),
+        defineField({ name: "padding_v", title: "Vertical Padding (px)", type: "number", initialValue: 27 }),
+        defineField({ name: "margin_h", title: "Horizontal Margin (px)", type: "number", initialValue: 0 }),
+        defineField({ name: "margin_v", title: "Vertical Margin (px)", type: "number", initialValue: 0 }),
+        defineField({ name: "background_color", title: "Background Color", type: "string" }),
+        defineField({ name: "background_opacity", title: "Background Opacity (%)", type: "number", initialValue: 0 }),
+        defineField({ name: "backdrop_blur", title: "Backdrop Blur", type: "boolean", initialValue: false }),
+        defineField({ name: "items_gap", title: "Items Gap (px)", type: "number", initialValue: 32 }),
+        defineField({ name: "vertical_align", title: "Vertical Align", type: "string", description: "Vertical alignment of nav items", initialValue: "top", options: { list: [{ title: "Top", value: "top" }, { title: "Middle", value: "middle" }, { title: "Bottom", value: "bottom" }] } }),
+        defineField({ name: "logo_columns", title: "Logo Column Span", type: "number", description: "How many grid columns the logo occupies (1–6)", initialValue: 3 }),
+        // ── Entrance Animation ──
+        defineField({
+          name: "entrance_animation",
+          title: "Entrance Animation",
+          type: "string",
+          options: {
+            list: [
+              { title: "None", value: "" },
+              { title: "Fade In", value: "fade-in" },
+              { title: "Slide Down", value: "slide-down" },
+              { title: "Blur In", value: "blur-in" },
+            ],
+          },
+        }),
+        defineField({ name: "entrance_duration", title: "Entrance Duration (ms)", type: "number", description: "Default: 600" }),
+        defineField({ name: "entrance_delay", title: "Entrance Delay (ms)", type: "number", description: "Delay before animation starts. Default: 0" }),
+        defineField({ name: "entrance_stagger", title: "Stagger Items", type: "boolean", description: "Animate items one by one", initialValue: false }),
+        defineField({ name: "entrance_stagger_delay", title: "Stagger Delay (ms)", type: "number", description: "Delay between items. Default: 80" }),
+      ],
+    }),
+
+    // === 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" }),
+    defineField({ name: "default_og_image", title: "Default OG Image Path", type: "string", group: "meta" }),
+    defineField({ name: "favicon_path", title: "Favicon Path", type: "string", group: "meta" }),
+    defineField({ name: "analytics_id", title: "Analytics ID", type: "string", group: "meta" }),
+
+    // === SETUP ===
+    defineField({
+      name: "setup_complete",
+      title: "Setup Complete",
+      type: "boolean",
+      description: "Set to true when the onboarding wizard finishes. Prevents the wizard from re-triggering.",
+      initialValue: false,
+      hidden: true,
+    }),
+
+    // === ASSETS ===
+    defineField({ name: "seed_url", title: "Asset Seed URL", type: "url", group: "assets", description: "Base URL for asset resolution" }),
+    defineField({ name: "last_scanned_at", title: "Last Scanned At", type: "datetime", group: "assets", readOnly: true }),
+    defineField({
+      name: "asset_status",
+      title: "Asset Status",
+      type: "string",
+      group: "assets",
+      options: {
+        list: [
+          { title: "OK", value: "ok" },
+          { title: "Scanning", value: "scanning" },
+          { title: "Error", value: "error" },
+        ],
+      },
+      readOnly: true,
+    }),
+  ],
+  preview: {
+    prepare() {
+      return { title: "Site Settings" };
+    },
+  },
+});