@mindstudio-ai/remy 0.1.107 → 0.1.109

package/dist/automatedActions/buildFromInitialSpec.md

@@ -4,7 +4,7 @@
 
 This is an automated action triggered by the user pressing "Build" in the editor after reviewing the spec.
 
-The user has reviewed the spec and is ready to build. There are four phases to building: planning, coding, polishing, verifying.
+The user has reviewed the spec and is ready to build. There are four phases to building: planning, coding, polishing, verifying. Execute each phase in order in a single turn.
 
 ## Planning
 Think about your approach and then get a quick sanity check from `codeSanityCheck` to make sure you aren't missing anything. 

package/dist/headless.js

@@ -2454,8 +2454,6 @@ async function analyzeImage(params) {
 // src/tools/_helpers/screenshot.ts
 var SCREENSHOT_ANALYSIS_PROMPT = `Describe everything visible on screen from top to bottom \u2014 every element, its position, its size relative to the viewport, its colors, its content. Be comprehensive, thorough, and spatial. After the inventory, note anything that looks visually broken (overlapping elements, clipped text, misaligned components).
 
-Note: ignore text wrapping issues. Screenshots occasionally show text wrapping onto an extra line compared to the live page \u2014 most noticeable in buttons, badges, and headings. This is a known limitation of SVG foreignObject rendering used the DOM-to-image capture library that took the screenshot. The browser's SVG renderer computes slightly wider text metrics than the HTML layout engine, so text that fits on one line in the live DOM can overflow by a fraction of a pixel in the capture - this is not a real issue.
-
 Respond only with your analysis as Markdown and absolutely no other text. Do not use emojis - use unicode if you need symbols.`;
 async function captureAndAnalyzeScreenshot(promptOrOptions) {
   let prompt;
@@ -2489,7 +2487,10 @@ async function captureAndAnalyzeScreenshot(promptOrOptions) {
   if (prompt === false) {
     return url;
   }
-  const analysisPrompt = prompt || SCREENSHOT_ANALYSIS_PROMPT;
+  let analysisPrompt = prompt || SCREENSHOT_ANALYSIS_PROMPT;
+  analysisPrompt += `
+Note: ignore text wrapping issues. Screenshots occasionally show text wrapping onto an extra line compared to the live page \u2014 most noticeable in buttons, badges, and headings. This is a known limitation of SVG foreignObject rendering used the DOM-to-image capture library that took the screenshot. The browser's SVG renderer computes slightly wider text metrics than the HTML layout engine, so text that fits on one line in the live DOM can overflow by a fraction of a pixel in the capture - this is not a real issue.
+`;
   const analysis = await analyzeImage({
     prompt: analysisPrompt,
     imageUrl: url,
@@ -3462,8 +3463,6 @@ __export(analyzeImage_exports, {
 var DEFAULT_PROMPT = `
 Describe everything visible in this image \u2014 every element, its position, its size relative to the frame, its colors, its content. Be comprehensive, thorough and spatial. After the inventory, note anything that looks visually broken (overlapping elements, clipped text, misaligned components).
 
-Note: ignore text wrapping issues. Screenshots occasionally show text wrapping onto an extra line compared to the live page \u2014 most noticeable in buttons, badges, and headings. This is a known limitation of SVG foreignObject rendering used the DOM-to-image capture library that took the screenshot. The browser's SVG renderer computes slightly wider text metrics than the HTML layout engine, so text that fits on one line in the live DOM can overflow by a fraction of a pixel in the capture - this is not a real issue.
-
 Respond only with your analysis as Markdown and absolutely no other text. Do not use emojis - use unicode if you need symbols.`;
 var definition4 = {
   clearable: true,
@@ -3486,7 +3485,11 @@ var definition4 = {
 };
 async function execute4(input, onLog) {
   const imageUrl = input.imageUrl;
-  const prompt = input.prompt || DEFAULT_PROMPT;
+  let prompt = input.prompt || DEFAULT_PROMPT;
+  prompt += `
+
+  Note: ignore text wrapping issues. Screenshots occasionally show text wrapping onto an extra line compared to the live page \u2014 most noticeable in buttons, badges, and headings. This is a known limitation of SVG foreignObject rendering used the DOM-to-image capture library that took the screenshot. The browser's SVG renderer computes slightly wider text metrics than the HTML layout engine, so text that fits on one line in the live DOM can overflow by a fraction of a pixel in the capture - this is not a real issue.
+`;
   const analysis = await analyzeImage({
     prompt,
     imageUrl,
@@ -4576,7 +4579,7 @@ var SANITY_CHECK_TOOLS = [
   },
   {
     name: "askMindStudioSdk",
-    description: "Check if the MindStudio SDK has a managed action for something before writing custom code.",
+    description: "Check if the MindStudio SDK has a managed action for something before writing custom code. Use bullet points to ask many questions at once.",
     inputSchema: {
       type: "object",
       properties: {

package/dist/index.js

@@ -2186,7 +2186,10 @@ async function captureAndAnalyzeScreenshot(promptOrOptions) {
   if (prompt === false) {
     return url;
   }
-  const analysisPrompt = prompt || SCREENSHOT_ANALYSIS_PROMPT;
+  let analysisPrompt = prompt || SCREENSHOT_ANALYSIS_PROMPT;
+  analysisPrompt += `
+Note: ignore text wrapping issues. Screenshots occasionally show text wrapping onto an extra line compared to the live page \u2014 most noticeable in buttons, badges, and headings. This is a known limitation of SVG foreignObject rendering used the DOM-to-image capture library that took the screenshot. The browser's SVG renderer computes slightly wider text metrics than the HTML layout engine, so text that fits on one line in the live DOM can overflow by a fraction of a pixel in the capture - this is not a real issue.
+`;
   const analysis = await analyzeImage({
     prompt: analysisPrompt,
     imageUrl: url,
@@ -2202,8 +2205,6 @@ var init_screenshot = __esm({
     init_analyzeImage();
     SCREENSHOT_ANALYSIS_PROMPT = `Describe everything visible on screen from top to bottom \u2014 every element, its position, its size relative to the viewport, its colors, its content. Be comprehensive, thorough, and spatial. After the inventory, note anything that looks visually broken (overlapping elements, clipped text, misaligned components).
 
-Note: ignore text wrapping issues. Screenshots occasionally show text wrapping onto an extra line compared to the live page \u2014 most noticeable in buttons, badges, and headings. This is a known limitation of SVG foreignObject rendering used the DOM-to-image capture library that took the screenshot. The browser's SVG renderer computes slightly wider text metrics than the HTML layout engine, so text that fits on one line in the live DOM can overflow by a fraction of a pixel in the capture - this is not a real issue.
-
 Respond only with your analysis as Markdown and absolutely no other text. Do not use emojis - use unicode if you need symbols.`;
   }
 });
@@ -3289,7 +3290,11 @@ __export(analyzeImage_exports, {
 });
 async function execute4(input, onLog) {
   const imageUrl = input.imageUrl;
-  const prompt = input.prompt || DEFAULT_PROMPT;
+  let prompt = input.prompt || DEFAULT_PROMPT;
+  prompt += `
+
+  Note: ignore text wrapping issues. Screenshots occasionally show text wrapping onto an extra line compared to the live page \u2014 most noticeable in buttons, badges, and headings. This is a known limitation of SVG foreignObject rendering used the DOM-to-image capture library that took the screenshot. The browser's SVG renderer computes slightly wider text metrics than the HTML layout engine, so text that fits on one line in the live DOM can overflow by a fraction of a pixel in the capture - this is not a real issue.
+`;
   const analysis = await analyzeImage({
     prompt,
     imageUrl,
@@ -3305,8 +3310,6 @@ var init_analyzeImage2 = __esm({
     DEFAULT_PROMPT = `
 Describe everything visible in this image \u2014 every element, its position, its size relative to the frame, its colors, its content. Be comprehensive, thorough and spatial. After the inventory, note anything that looks visually broken (overlapping elements, clipped text, misaligned components).
 
-Note: ignore text wrapping issues. Screenshots occasionally show text wrapping onto an extra line compared to the live page \u2014 most noticeable in buttons, badges, and headings. This is a known limitation of SVG foreignObject rendering used the DOM-to-image capture library that took the screenshot. The browser's SVG renderer computes slightly wider text metrics than the HTML layout engine, so text that fits on one line in the live DOM can overflow by a fraction of a pixel in the capture - this is not a real issue.
-
 Respond only with your analysis as Markdown and absolutely no other text. Do not use emojis - use unicode if you need symbols.`;
     definition4 = {
       clearable: true,
@@ -4562,7 +4565,7 @@ var init_tools4 = __esm({
       },
       {
         name: "askMindStudioSdk",
-        description: "Check if the MindStudio SDK has a managed action for something before writing custom code.",
+        description: "Check if the MindStudio SDK has a managed action for something before writing custom code. Use bullet points to ask many questions at once.",
         inputSchema: {
           type: "object",
           properties: {

package/dist/prompt/compiled/design.md

@@ -35,7 +35,7 @@ Layout shift is never acceptable. Elements jumping around as content loads or st
 - Loading-to-loaded transitions should swap content in-place without changing container size.
 - Buttons must not change size during loading states. Use a fixed width or `min-width`, and swap the label for a spinner or short text that fits the same space. "Submit" becoming "Submitting..." should not make the button wider and push adjacent elements around.
 - Conditional UI should use opacity/overlay transitions, not insertion into flow that displaces existing content.
-- This is especially important to keep in mind when building things that display AI generated text, especially if the text streams in. Make sure to never shift layout because of streaming AI text.
+- This is especially important to keep in mind when building things that display AI generated text, especially if the text streams in. Make sure to never shift layout because of streaming AI text. If an element changes height or width, it must be fixed size or a smooth transition - never snap or jump to different dimensions.
 
 ## Responsive Design
 

package/dist/prompt/static/instructions.md

@@ -17,7 +17,7 @@
 - Pushing to main branch will trigger a deploy. The user presses the publish button in the interface to request publishing.
 
 ### Build Notes
-For complex tasks — especially an initial buildout from a spec or making multiple changes in a single turn — write a `.remy-notes.md` scratchpad in the project root. Use it to track progress: a checklist of what's been built and what's remaining. Do not include implementation details in th notes. Read the spec files directly when you need reference data. Delete the notes file when your work is done.
+For complex tasks — especially an initial buildout from a spec or making multiple changes in a single turn — write a `.remy-notes.md` scratchpad in the project root. Use it to track progress: a checklist of what's been built and what's remaining. Never include implementation details or other decisions in the notes - it is solely for keeping track of tasks. Read the spec files directly when you need design details, implementation decisions, or other reference materials. Delete the notes file when your work is done.
 
 ## Communication
 The user can already see your tool calls, so most of your work is visible without narration. Focus text output on three things:

package/dist/prompt/static/intake.md

@@ -25,7 +25,7 @@ Don't recite this list to users. Use it to calibrate your sense of what's possib
 - **Automations** — cron jobs that monitor competitors and send alerts, webhook handlers that sync data between services, email processors that triage support requests — no UI needed
 - **Conversational AI agents** — custom chat UIs backed by any model, with tool access to the app's methods. Full control over what the agent can do and who can use it
 - **Bots & agent tools** — Discord slash-command bots, Telegram bots, MCP tool servers for AI assistants
-- **Creative projects** — browser games with p5.js or Three.js, interactive visualizations, generative art, portfolio sites with dynamic backends
+- **Creative projects** — browser games with p5.js or Three.js, interactive visualizations, 3D things, generative art, portfolio sites with dynamic backends
 - **Marketing & launch pages** — landing pages, waitlist pages with referral mechanics, product sites with scroll animations — visual polish is a strength here
 - **API services** — backend logic exposed as REST endpoints
 - **Simple static sites** — no backend needed, just a web interface with a build step

package/dist/subagents/codeSanityCheck/prompt.md

@@ -53,6 +53,8 @@ When a plan includes multiple screens/API calls, always note this item for the d
 
 - **Image preloading for detail views.** If the plan has a grid/list of thumbnails that link to detail views with full-size images, flag it if there's no preloading strategy. The fix: preload full-size images in the background (`new Image().src = url`) so they're in the browser cache by the time the user taps. This makes transitions feel instant.
 
+- **Layout shift with dynamic data or AI generatd text** If the plan includes dynamically-sized data (e.g., a wizard form with questions of differing lengths) or AI generated text (where text stream length is unpredictable), make sure to flag concerns about layout stability. Everything must either be a fixed size or smoothly animate between sizes. Text can never be clipped by a container or cause layout to jump around or grow in snappy/janky ways. Make sure to remind the developer that this is important to pay attention to.
+
 ## When to stay quiet
 
 Nits, style preferences, missing edge cases, things the agent will figure out as it goes, patterns that are "not ideal but fine," minor code smells. Let them slide. The agent is busy.

package/dist/subagents/designExpert/prompts/instructions.md

@@ -12,7 +12,7 @@ Think about the ways you can truly elevate the design. Use image generation to c
 
 ## Tool Usage
 - When multiple tool calls are independent, make them all in a single turn. Searching for three different products, or fetching two reference sites: batch them instead of doing one per turn.
-- The screenshot tool supports an `instructions` parameter for taking screenshots that require interaction first. If you need to screenshot a state that's behind a modal, a specific tab, or a multi-step flow, pass `instructions` describing how to get there (e.g., "dismiss the welcome modal, then click XYZ"). A browser automation agent will follow your instructions and capture the screenshot for you.
+- The screenshot tool supports an `instructions` parameter for taking screenshots that require interaction first. If you need to screenshot a state that's behind a modal, a specific tab, or a multi-step flow, pass `instructions` describing how to get there (e.g., "dismiss the welcome modal, then click XYZ"). A browser automation agent will follow your instructions and capture the screenshot for you. You can not use this to scroll - you will always receive a full page screenshot. Only use this if you need to trigger stateful changes within the app to get the full-page screenshot.
 - After you've taken a screenshot, use analyze image to ask different questions about it - don't re-screenshot the page unnecessarily.
 
 ## Voice

package/dist/subagents/designExpert/prompts/layout.md

@@ -22,7 +22,7 @@ With the spatial architecture established, make it visually compelling. This is
 
 Layout is where interfaces fail most visibly. Generic patterns like centered content, three equal columns, card grids, symmetric everything feel tired and bland. Fight the use of generic layouts actively. Source layout inspiration from <visual_design_references> — these sites were hand-picked because they are doing something compelling.
 
-If the design calls for it, take risks and be bold. It might not always work out and that's okay — the user always has the opportunity to refine.
+If the design calls for it, take risks and be bold. It might not always work out and that's okay — the user always has the opportunity to refine and will be impressed and pleased with your having taken risks.
 
 #### Things that make layouts interesting
 - Asymmetry — varied column widths, off-center compositions
@@ -42,7 +42,7 @@ If the design calls for it, take risks and be bold. It might not always work out
 
 ### Backgrounds
 
-Backgrounds create atmosphere. Solid white or solid gray is the safe default and the enemy of distinctiveness. Layer subtle gradients, use warm or cool tints, add geometric patterns or contextual textures. The background sets the mood before the user reads a single word. If a background uses images, it must scale to fill and blend nicely. It can never cut off abruptly or be overly visible. Use blend modes, masks,  and other effects.
+Backgrounds create atmosphere. Avoid boring solid-color backgrounds and instead layer subtle gradients, use warm or cool tints, add geometric patterns or contextual textures. The background sets the mood before the user reads a single word. Do not use images as backgrounds.
 
 ### Output
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindstudio-ai/remy",
-  "version": "0.1.107",
+  "version": "0.1.109",
   "description": "MindStudio coding agent",
   "repository": {
     "type": "git",