@morphika/webframe 0.1.0

package/sanity/schemas/objects/parallaxSlide.ts

@@ -0,0 +1,217 @@
+import { defineField, defineType } from "sanity";
+
+/**
+ * parallaxSlide — A single slide in a ParallaxGroup.
+ *
+ * Contains a background (image or video) with overlay controls,
+ * plus full V2 section data (columns + blocks) for content.
+ *
+ * Session 123: Parallax V2 rewrite.
+ */
+export default defineType({
+  name: "parallaxSlide",
+  title: "Parallax Slide",
+  type: "object",
+  fields: [
+    // ---- Background ----
+    defineField({
+      name: "background_type",
+      title: "Background Type",
+      type: "string",
+      options: {
+        list: [
+          { title: "Image", value: "image" },
+          { title: "Video", value: "video" },
+        ],
+      },
+      initialValue: "image",
+    }),
+    defineField({
+      name: "background_image",
+      title: "Background Image",
+      type: "string",
+      description: "Asset path for background image",
+    }),
+    defineField({
+      name: "background_video",
+      title: "Background Video",
+      type: "string",
+      description: "Asset path for background video",
+    }),
+    defineField({
+      name: "background_position",
+      title: "Background Position",
+      type: "string",
+      description: "CSS background-position value",
+      initialValue: "center center",
+    }),
+    defineField({
+      name: "background_overlay_color",
+      title: "Overlay Color",
+      type: "string",
+      description: "Hex color for background overlay",
+      initialValue: "#000000",
+    }),
+    defineField({
+      name: "background_overlay_opacity",
+      title: "Overlay Opacity",
+      type: "number",
+      description: "0–100",
+      initialValue: 0,
+      validation: (Rule) => Rule.min(0).max(100),
+    }),
+
+    // ---- Navbar Color Override ----
+    defineField({
+      name: "nav_color",
+      title: "Navbar Color",
+      type: "string",
+      description: "Hex color for navbar while this slide is active (optional)",
+    }),
+
+    // ---- V2 Section Content (same structure as pageSectionV2 internals) ----
+    defineField({
+      name: "columns",
+      title: "Columns",
+      type: "array",
+      of: [
+        {
+          type: "object",
+          name: "sectionColumn",
+          fields: [
+            defineField({
+              name: "grid_column",
+              title: "Grid Column",
+              type: "number",
+              validation: (Rule) => Rule.required().min(1).max(12),
+            }),
+            defineField({
+              name: "grid_row",
+              title: "Grid Row",
+              type: "number",
+              validation: (Rule) => Rule.required().min(1),
+            }),
+            defineField({
+              name: "span",
+              title: "Column Span",
+              type: "number",
+              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" },
+              ],
+            }),
+            defineField({
+              name: "enter_animation",
+              title: "Enter Animation",
+              type: "enterAnimationConfig",
+            }),
+          ],
+        },
+      ],
+    }),
+
+    // ---- Section Settings ----
+    defineField({
+      name: "section_settings",
+      title: "Section Settings",
+      type: "object",
+      fields: [
+        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
+        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
+        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",
+        }),
+        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"] },
+            }),
+          ],
+        }),
+      ],
+    }),
+  ],
+  preview: {
+    select: { bg_type: "background_type", bg_image: "background_image" },
+    prepare({ bg_type, bg_image }) {
+      return {
+        title: `Slide (${bg_type || "image"})`,
+        subtitle: bg_image || "No background set",
+      };
+    },
+  },
+});

package/sanity/schemas/objects/typewriterConfig.ts

@@ -0,0 +1,38 @@
+import { defineType, defineField } from "sanity";
+
+/**
+ * Typewriter config — extra settings for the "typewriter" enter animation.
+ *
+ * Only relevant for textBlock when enter_animation.preset === "typewriter".
+ *
+ * Session 117 — Animation UX Refactor.
+ */
+const typewriterConfig = defineType({
+  name: "typewriterConfig",
+  title: "Typewriter",
+  type: "object",
+  fields: [
+    defineField({
+      name: "speed",
+      title: "Speed (chars/sec)",
+      type: "number",
+      description: "Characters per second (10–100)",
+      initialValue: 40,
+      validation: (Rule) => Rule.min(10).max(100),
+    }),
+    defineField({
+      name: "mode",
+      title: "Mode",
+      type: "string",
+      options: {
+        list: [
+          { title: "Character", value: "character" },
+          { title: "Word", value: "word" },
+        ],
+      },
+      initialValue: "character",
+    }),
+  ],
+});
+
+export default typewriterConfig;

package/sanity/schemas/page.ts

@@ -0,0 +1,162 @@
+import { defineField, defineType } from "sanity";
+
+export default defineType({
+  name: "page",
+  title: "Page",
+  type: "document",
+  fields: [
+    defineField({
+      name: "title",
+      title: "Title",
+      type: "string",
+      validation: (Rule) => Rule.required(),
+    }),
+    defineField({
+      name: "slug",
+      title: "Slug",
+      type: "slug",
+      options: { source: "title", maxLength: 96 },
+      validation: (Rule) => Rule.required(),
+    }),
+    defineField({
+      name: "page_type",
+      title: "Page Type",
+      type: "string",
+      options: {
+        list: [
+          { title: "Page", value: "page" },
+          { title: "Project", value: "project" },
+        ],
+      },
+      validation: (Rule) => Rule.required(),
+      initialValue: "page",
+    }),
+    defineField({
+      name: "is_home",
+      title: "Is Home Page",
+      type: "boolean",
+      description: "Mark this page as the home page. Only one page can be home at a time.",
+      initialValue: false,
+    }),
+    defineField({
+      name: "content_rows",
+      title: "Content Rows",
+      type: "array",
+      of: [{ type: "pageSection" }, { type: "pageSectionV2" }, { type: "parallaxGroup" }, { type: "customSectionInstance" }],
+    }),
+    defineField({
+      name: "metadata",
+      title: "Metadata",
+      type: "object",
+      fields: [
+        defineField({
+          name: "seo_title",
+          title: "SEO Title",
+          type: "string",
+        }),
+        defineField({
+          name: "seo_description",
+          title: "SEO Description",
+          type: "text",
+          rows: 3,
+        }),
+        defineField({
+          name: "og_image_path",
+          title: "OG Image Path",
+          type: "string",
+          description: "Relative path to the Open Graph image",
+        }),
+      ],
+    }),
+    defineField({
+      name: "page_settings",
+      title: "Page Settings",
+      type: "object",
+      fields: [
+        defineField({
+          name: "background_color",
+          title: "Background Color",
+          type: "string",
+        }),
+        defineField({
+          name: "text_color",
+          title: "Text Color",
+          type: "string",
+        }),
+        defineField({
+          name: "nav_color",
+          title: "Nav Color",
+          type: "string",
+          description: "Override navigation color for this page",
+        }),
+        defineField({
+          name: "enter_animation",
+          title: "Default Enter Animation",
+          type: "enterAnimationConfig",
+          description: "Page-level default enter animation applied to all sections/columns/blocks unless overridden",
+        }),
+        // ── Per-page nav entrance override ──
+        defineField({
+          name: "nav_entrance_animation",
+          title: "Nav Entrance Override",
+          type: "string",
+          description: "Override the global nav entrance animation for this page",
+          options: {
+            list: [
+              { title: "Use Global", value: "" },
+              { title: "Fade In", value: "fade-in" },
+              { title: "Slide Down", value: "slide-down" },
+              { title: "Blur In", value: "blur-in" },
+            ],
+          },
+        }),
+        defineField({ name: "nav_entrance_duration", title: "Nav Entrance Duration (ms)", type: "number" }),
+        defineField({ name: "nav_entrance_delay", title: "Nav Entrance Delay (ms)", type: "number" }),
+        defineField({
+          name: "nav_entrance_disabled",
+          title: "Disable Nav Animation",
+          type: "boolean",
+          description: "Completely disable nav entrance animation on this page",
+          initialValue: false,
+        }),
+      ],
+    }),
+    defineField({
+      name: "thumbnail_path",
+      title: "Thumbnail",
+      type: "string",
+      description: "Asset path for the project card preview image",
+    }),
+    defineField({
+      name: "cover_video",
+      title: "Cover Video",
+      type: "string",
+      description: "Asset path for a cover video shown on hover in project grids",
+    }),
+    defineField({
+      name: "published_at",
+      title: "Published At",
+      type: "datetime",
+    }),
+    defineField({
+      name: "draft_mode",
+      title: "Draft Mode",
+      type: "boolean",
+      initialValue: true,
+    }),
+  ],
+  preview: {
+    select: {
+      title: "title",
+      isHome: "is_home",
+      pageType: "page_type",
+    },
+    prepare({ title, isHome, pageType }) {
+      const label = pageType === "project" ? "Project" : isHome ? "Home" : "Page";
+      return {
+        title: title || "Untitled",
+        subtitle: label,
+      };
+    },
+  },
+});

package/sanity/schemas/pageSection.ts

@@ -0,0 +1,157 @@
+import { defineField, defineType } from "sanity";
+
+/**
+ * pageSection — First-class page section type.
+ *
+ * Unlike regular rows (which contain columns → blocks), page sections are
+ * direct, flat entities in the content_rows array. Each section wraps a single
+ * section-level block (projectGridBlock) with its own
+ * layout settings — no row/column matryoshka.
+ *
+ * Session 76: Refactored from the old "section row" approach where section
+ * blocks were wrapped in row → column → block.
+ */
+export default defineType({
+  name: "pageSection",
+  title: "Page Section",
+  type: "object",
+  fields: [
+    defineField({
+      name: "section_type",
+      title: "Section Type",
+      type: "string",
+      options: {
+        list: [
+          { title: "Project Grid", value: "projectGrid" },
+        ],
+      },
+      validation: (Rule) => Rule.required(),
+    }),
+    defineField({
+      name: "block",
+      title: "Section Content",
+      type: "array",
+      of: [{ type: "projectGridBlock" }],
+      validation: (Rule) => Rule.max(1).required(),
+      description: "The section block content (one block per section)",
+    }),
+    defineField({
+      name: "settings",
+      title: "Section Settings",
+      type: "object",
+      fields: [
+        // 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"] },
+        }),
+        // 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" }),
+        // 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",
+        }),
+      ],
+    }),
+    // BUG-013 fix: Per-viewport responsive overrides for section settings
+    defineField({
+      name: "responsive",
+      title: "Responsive Overrides",
+      type: "object",
+      hidden: true, // Managed by the visual builder
+      fields: [
+        defineField({
+          name: "tablet",
+          title: "Tablet",
+          type: "object",
+          fields: [
+            defineField({ name: "background_color", type: "string", title: "Background Color" }),
+            defineField({ name: "background_opacity", type: "number", title: "Background Opacity" }),
+            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: "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: [
+            defineField({ name: "background_color", type: "string", title: "Background Color" }),
+            defineField({ name: "background_opacity", type: "number", title: "Background Opacity" }),
+            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: "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 }) {
+      const labels: Record<string, string> = {
+        projectGrid: "Project Grid",
+      };
+      return { title: labels[section_type] || "Section" };
+    },
+  },
+});