appostle-installer 0.0.18 → 0.0.19

package/dist/appostle.js

@@ -3203,6 +3203,7 @@ var RoleMoveResponseSchema = z10.object({
 var BrandScopeSchema = z10.literal("project");
 var BrandVariableTypeSchema = z10.enum([
   "color",
+  "gradient",
   "font",
   "asset",
   "text",
@@ -35111,6 +35112,7 @@ ${original}`;
 // ../server/src/server/brand/token-generator.ts
 import { z as z37 } from "zod";
 var HEX6 = /^#[0-9a-f]{6}$/i;
+var CSS_GRADIENT = /^(linear|radial|conic)-gradient\(/i;
 var TokensResponseSchema = z37.object({
   tokens: z37.record(z37.string(), z37.string())
 });
@@ -35186,6 +35188,31 @@ function buildPrompt2(args) {
     }
   }
   const tokensToFill = args.unlockedTokens.map((v) => `- ${v.key}`).join("\n");
+  const gradientSection = args.unlockedGradients.length > 0 ? [
+    "",
+    "Gradient tokens to fill (values must be valid CSS gradient strings,",
+    "e.g. linear-gradient(135deg, #c52669 0%, #ff6b35 100%)):",
+    ...args.unlockedGradients.map((v) => `- ${v.key}`),
+    "",
+    "Gradient key glossary:",
+    "- gradient.primary \u2014 the brand's signature gradient, built from the",
+    "  most prominent palette colours. Used for hero backgrounds, feature",
+    "  highlights, and primary decorative surfaces.",
+    "- gradient.accent  \u2014 a secondary gradient for interactive states,",
+    "  hover effects, or accent surfaces. Distinct from primary but",
+    "  harmonious with the palette.",
+    "- gradient.subtle  \u2014 a very soft, low-contrast gradient for subtle",
+    "  background washes \u2014 card backgrounds, section tints. Should feel",
+    "  almost invisible; same hue family as bg-base with minimal shift.",
+    "",
+    "Include gradient values in the same JSON under the 'tokens' key,",
+    "alongside the hex tokens. Gradient values are CSS gradient strings."
+  ].join("\n") : "";
+  const lockedGradientSection = args.lockedGradients.length > 0 ? [
+    "",
+    "Locked gradients \u2014 DO NOT include these in your output:",
+    ...args.lockedGradients.map((v) => `- ${v.key}: ${v.value}`)
+  ].join("\n") : "";
   const lockedSection = args.lockedTokens.length > 0 ? [
     "",
     "Locked tokens \u2014 DO NOT include these in your output. The user has",
@@ -35232,13 +35259,15 @@ function buildPrompt2(args) {
     "Tokens to fill (every value must be a #RRGGBB lowercase hex string):",
     tokensToFill,
     lockedSection,
+    gradientSection,
+    lockedGradientSection,
     directionSection,
     "",
     "Return JSON only with the shape:",
-    '{ "tokens": { "<token-key>": "#rrggbb", ... } }',
+    '{ "tokens": { "<token-key>": "#rrggbb or css-gradient-string", ... } }',
     "",
-    "Output ONLY the unlocked tokens listed above. Do not include the locked",
-    "tokens, do not invent new keys, do not output anything outside the JSON.",
+    "Output ONLY the unlocked tokens and gradients listed above. Do not include",
+    "locked entries, do not invent new keys, do not output anything outside the JSON.",
     "Never use a hex value from a colour marked OFF."
   ].filter((line) => line !== "").join("\n");
 }
@@ -35252,9 +35281,12 @@ async function generateAndApplyBrandTokens(options) {
   const allVars = colorsBrand.variables;
   const paletteVars = allVars.filter((v) => v.key.startsWith("color."));
   const tokenVars = allVars.filter((v) => v.key.startsWith("token."));
+  const gradientVars = allVars.filter((v) => v.type === "gradient");
   const unlockedTokens = tokenVars.filter((v) => !v.locked);
   const lockedTokens = tokenVars.filter((v) => v.locked);
-  if (unlockedTokens.length === 0) {
+  const unlockedGradients = gradientVars.filter((v) => !v.locked);
+  const lockedGradients = gradientVars.filter((v) => v.locked);
+  if (unlockedTokens.length === 0 && unlockedGradients.length === 0) {
     logger.info({ brandPath }, "brand-tokens: nothing to generate (all tokens locked)");
     return { generatedCount: 0 };
   }
@@ -35265,6 +35297,8 @@ async function generateAndApplyBrandTokens(options) {
     paletteVars,
     unlockedTokens,
     lockedTokens,
+    unlockedGradients,
+    lockedGradients,
     mode,
     userPrompt: prompt
   });
@@ -35290,14 +35324,19 @@ async function generateAndApplyBrandTokens(options) {
     }
     throw error;
   }
-  const unlockedKeySet = new Set(unlockedTokens.map((v) => v.key));
+  const unlockedTokenKeySet = new Set(unlockedTokens.map((v) => v.key));
+  const unlockedGradientKeySet = new Set(unlockedGradients.map((v) => v.key));
   const acceptedUpdates = /* @__PURE__ */ new Map();
   for (const [key, value] of Object.entries(response.tokens)) {
-    if (!unlockedKeySet.has(key)) continue;
     if (typeof value !== "string") continue;
     const trimmed = value.trim();
-    if (!HEX6.test(trimmed)) continue;
-    acceptedUpdates.set(key, trimmed.toLowerCase());
+    if (unlockedTokenKeySet.has(key)) {
+      if (!HEX6.test(trimmed)) continue;
+      acceptedUpdates.set(key, trimmed.toLowerCase());
+    } else if (unlockedGradientKeySet.has(key)) {
+      if (!CSS_GRADIENT.test(trimmed)) continue;
+      acceptedUpdates.set(key, trimmed);
+    }
   }
   if (acceptedUpdates.size === 0) {
     logger.warn(
@@ -35334,6 +35373,7 @@ import path20 from "node:path";
 import { fileURLToPath as fileURLToPath2 } from "node:url";
 import { z as z38 } from "zod";
 var QA_FILENAME = "layout-qa.md";
+var PROMPT_FILENAME = "layout-prompt.md";
 var MAX_LOOKUP_LEVELS = 10;
 var ROLE_FILE_RELATIVE = ".appostle/brand/assets/role/brand-layout-role.md";
 async function findFileUpward(filename) {
@@ -35492,61 +35532,90 @@ async function loadQaQuestions(logger) {
   }
   return EMBEDDED_QA_FALLBACK;
 }
-var ROLE_GENERATION_INSTRUCTIONS = `You are an elite art director generating a complete design role document. This document will be injected wholesale into an AI agent's context to give it a dense, opinionated compositional voice \u2014 the way lordesign-brutalist or lordesign-soft gives a builder an entire design philosophy.
+async function loadLayoutPrompt(logger) {
+  const filePath = await findFileUpward(PROMPT_FILENAME);
+  if (filePath) {
+    try {
+      const content = await fs12.readFile(filePath, "utf8");
+      logger.debug({ filePath }, "layout-generator: loaded layout prompt from disk");
+      return content;
+    } catch (err) {
+      logger.warn(
+        { err, filePath },
+        "layout-generator: failed to read layout-prompt file; using embedded fallback"
+      );
+    }
+  }
+  return EMBEDDED_LAYOUT_PROMPT_FALLBACK;
+}
+function interpolateTemplate(template, vars) {
+  let out = template;
+  for (const [key, value] of Object.entries(vars)) {
+    out = out.split(`{{${key}}}`).join(value);
+  }
+  return out;
+}
+var EMBEDDED_LAYOUT_PROMPT_FALLBACK = `You are an elite art director refining the layout and composition rules for a brand. This is ONLY about layout \u2014 structure, zones, grid, density, rhythm, containers, image placement, CTAs. Typography, colors, motion, animations, shadows are handled by separate brand files \u2014 do not duplicate them here.
 
-The output must be a SINGLE cohesive markdown document (NOT JSON, NOT key-value pairs). It reads like a design manifesto \u2014 dense, opinionated, specific enough that two different builders reading it would produce nearly identical structural decisions.
+These rules must work across media \u2014 web pages, print, PDF, presentations. Use proportional language (fractions, ratios, percentages) as the primary system. CSS values are welcome as concrete examples but should not be the only expression of a rule.
 
-## Required sections (use these exact headings)
+Your job: update the design role document based on the user's refinement prompt. This document will be injected wholesale into an AI builder's context. If your rules are vague, the output will be generic. If your rules are specific and opinionated, the output will be distinctive.
 
-# Brand Layout Role
+The document must be a complete markdown document covering:
+- Enemy (a specific design this must NOT resemble, with 2-3 specific layout patterns that make it wrong \u2014 and for each, the exact counter-pattern this brand uses instead)
+- Signature Anomaly (the one structural layout choice that makes this unmistakably distinctive)
+- Compositional Philosophy (one structural law + the structural spine mechanism that enforces it across every zone)
+- Intensity Dials (Density 1-10, Grid Variance 1-10 \u2014 with concrete implications for THIS brand)
+- Opening Zone / Hero Behavior (surface coverage, bleed, content placement, containment)
+- Zone Inventory (ordered list of all major zones: name, layout job, dense/airy, full-bleed/contained \u2014 this is the master reference for the rhythm)
+- Zone Variation & Flow (how zones differ, transition strategy, full-bleed vs contained \u2014 references the Zone Inventory)
+- Density Philosophy (spacing values; the oscillation rhythm derived from the Zone Inventory \u2014 name which zones are dense, which are airy, in sequence)
+- Vertical Rhythm (three values: zone padding, element gap within zones, and the one zone that breaks the rhythm and why)
+- Grid System (exact column structure, asymmetry, proportions)
+- Content Width Strategy (max-width of the primary content area, which zones break it and why)
+- Container & Card Rules (borders, corners, nesting, exact border-radius)
+- Dividers & Graphic Structure (structural vs decorative, background strategy)
+- Image Treatment \u2014 Layout Only (placement, grid relationship, overlap behavior)
+- CTA Strategy (position in layout referencing Zone Inventory, container strategy, frequency)
+- Responsive Behavior (how the layout adapts across sizes \u2014 web: breakpoints and stacking; print: scale and margin strategy)
+- Bans (at least 20 specific layout prohibitions)
 
-## Compositional Philosophy
-The north star. 3-5 sentences describing the fundamental spatial personality.
+## Critical rules
 
-## Hero Behavior
-Exact rules for hero sections \u2014 dimensions, content placement, image treatment, scroll behavior, what's forbidden.
+1. This is a REFINEMENT. The user already has a role document (shown below). Their prompt refines, evolves, or redirects \u2014 it does NOT start from scratch unless they explicitly say so.
 
-## Section Variation & Flow
-How consecutive sections differ. Allowed arrangements. How many types cycle. Full-bleed rules.
+2. SPECIFICITY IS MANDATORY. Every rule must be actionable at the structural level. Generic adjectives ("clean", "minimal", "modern", "elegant") are BANNED from the output.
 
-## Density Philosophy
-Where dense, where airy, specific spacing ratios, padding rules.
+3. THE DOCUMENT MUST BE OPINIONATED, NOT HEDGED. Every sentence must prescribe or ban \u2014 never suggest. Use "Always", "Never", "Must", "Banned", "Required".
 
-## Vertical Rhythm
-Section height strategy, padding patterns, oscillation rules, breathing room logic.
+4. STAY IN YOUR LANE. Do NOT include rules about typography, colors, motion/animation, or shadows \u2014 those belong in their own brand files.
 
-## Grid System
-Column philosophy, alignment rules, breakpoint behavior, visible vs invisible structure.
+5. THE BANS ARE THE MOST IMPORTANT SECTION. At least 20 bans. The 7 universal AI-layout cliches MUST each appear as an explicit named ban: centered headline over full-width image; three equal-width feature cards in a row; alternating left-right image/text rows with identical padding; uniform zone height and padding; every block wrapped in a card with shadow + radius; CTA with gradient fill; full-width "Why Choose Us" icon grid. Plus 3-5 brand-specific AI tells.
 
-## Container & Card Rules
-Borders, shadows, corners, nesting rules, elevation hierarchy.
+6. THE ENEMY IS MANDATORY. Name a specific real design and 2-3 exact layout patterns from it. Vague enemies fail.
 
-## Image Treatment
-Aspect ratios, size constraints, cropping rules, filter/overlay rules, frequency.
+7. THE SIGNATURE ANOMALY IS MANDATORY. One specific structural choice. Apply the removal test: if removing this single decision would make the layout indistinguishable from a generic design \u2014 it qualifies. Must appear as a constraint in at least 2 other sections.
 
-## CTA Strategy
-Frequency per page, hierarchy, styling constraints, placement rules.
+8. USE THE STRUCTURAL CONTEXT. The {{structuralContext}} contains sibling brand files. Do not duplicate their rules \u2014 derive layout implications from them.
 
-## Mobile Behavior
-Breakpoint strategy, what collapses vs stacks, density changes, navigation transformation.
-
-## Bans
-The most powerful section. At least 20 specific prohibitions at EVERY level:
-- CSS-level (specific properties, values, patterns)
-- Component-level (specific UI patterns forbidden)
-- Layout-level (spatial patterns forbidden)
-- Content-level (content patterns forbidden)
-- Interaction-level (motion/animation patterns forbidden)
-
-Each ban on its own line starting with "\u2022". Be ruthlessly specific \u2014 "no gradients" is vague, "no linear-gradient except single-stop overlays on hero images" is useful.
-
-## Critical quality bar
-- Every rule must be specific enough to resolve an ambiguous decision
-- No generic advice ("keep it clean") \u2014 only actionable constraints
-- The bans section alone should have 20+ items
-- Rules should reference specific CSS properties, pixel values, viewport units where applicable
-- The document should be 50-100 rules total across all sections`;
-function buildQaSystemPrompt(questions) {
+## Current role document
+
+{{currentValues}}
+
+## Structural context (sibling brand files)
+
+{{structuralContext}}
+
+## User's refinement prompt
+
+{{userPrompt}}
+
+## Response format
+
+Return ONLY a JSON object: { "roleDocument": "# Brand Layout Role\\n\\n## Enemy\\n..." }
+
+Output ONLY the JSON object. No markdown fences. No explanation.`;
+function buildQaSystemPrompt(questions, layoutPromptSpec) {
   return `You are a chill creative director doing a quick vibe check on someone's layout taste.
 
 CONTEXT:
@@ -35580,10 +35649,11 @@ When done=false, return:
 { "done": false, "question": "Short question?", "options": ["Option A", "Option B", "Option C", "Option D"] }
 
 When done=true, return:
-{ "done": true, "roleDocument": "# Brand Layout Role\\n\\n## Compositional Philosophy\\n..." }
+{ "done": true, "roleDocument": "# Brand Layout Role\\n\\n## Enemy\\n..." }
+
+The roleDocument must be a complete markdown document following the structure and rules below. Treat the Q&A conversation as the user's intent; there is no current role document yet.
 
-The roleDocument must be a complete markdown document following this structure:
-${ROLE_GENERATION_INSTRUCTIONS}`;
+${layoutPromptSpec}`;
 }
 async function layoutQaNext(options) {
   const { agentManager, workspaceRoot, brandPath, conversation, logger } = options;
@@ -35592,7 +35662,13 @@ async function layoutQaNext(options) {
   if (!brand) throw new Error(`Brand file not found at ${brandPath}`);
   const structuralContext = buildStructuralContext(brands);
   const questions = await loadQaQuestions(logger);
-  const qaSystemPrompt = buildQaSystemPrompt(questions);
+  const layoutPromptTemplate = await loadLayoutPrompt(logger);
+  const layoutPromptSpec = interpolateTemplate(layoutPromptTemplate, {
+    structuralContext,
+    currentValues: "(No existing role document \u2014 this is initial generation from a Q&A conversation.)",
+    userPrompt: "(See Q&A conversation below for the user's intent.)"
+  });
+  const qaSystemPrompt = buildQaSystemPrompt(questions, layoutPromptSpec);
   const convLines = conversation.map((m) => `${m.role === "assistant" ? "AI" : "User"}: ${m.content}`).join("\n\n");
   const userAnswerCount = conversation.filter((m) => m.role === "user").length;
   const prompt = [
@@ -35643,24 +35719,12 @@ async function generateAndApplyLayout(options) {
   if (!brand) throw new Error(`Brand file not found at ${brandPath}`);
   const structuralContext = buildStructuralContext(brands);
   const existingRole = await readRoleFile(workspaceRoot);
-  const prompt = [
-    ROLE_GENERATION_INSTRUCTIONS,
-    "",
-    "## Structural context (sibling brand files)",
+  const layoutPromptTemplate = await loadLayoutPrompt(logger);
+  const prompt = interpolateTemplate(layoutPromptTemplate, {
     structuralContext,
-    "",
-    existingRole ? `## Current role document
-
-${existingRole}` : "(No existing role document \u2014 generate from scratch.)",
-    "",
-    "## User's refinement prompt",
-    userPrompt,
-    "",
-    "This is a REFINEMENT. The user already has a role document (shown above). Their prompt refines, evolves, or redirects \u2014 it does NOT start from scratch unless they explicitly say so.",
-    "",
-    'Return ONLY a JSON object: { "roleDocument": "the complete updated markdown document" }',
-    "No markdown fences. No explanation."
-  ].join("\n");
+    currentValues: existingRole ?? "(No existing role document \u2014 generate from scratch.)",
+    userPrompt
+  });
   let response;
   try {
     response = await generateStructuredAgentResponseWithFallback({