@imenam/mcp-design 1.0.7 → 1.0.9

package/dist/shared/node-defaults.d.ts

@@ -1,4 +1,4 @@
-import type { RenderNode } from "./render.js";
+import { type RenderNode } from "./render.js";
 /**
  * Valeurs par défaut et champs autorisés par type de noeud.
  *

package/dist/shared/node-defaults.js

@@ -1,3 +1,4 @@
+import { defaultLineHeight } from "./render.js";
 import { DEFAULT_ICON_STROKE_WIDTH, ICON_GRID } from "./icons/index.js";
 export const NODE_KINDS = ["rect", "ellipse", "line", "text", "icon", "group", "instance"];
 /** Types que l'utilisateur peut dessiner directement ; un groupe se cree a partir d'une selection. */
@@ -8,7 +9,11 @@ export const NODE_DEFAULTS = {
     line: { width: 200, height: 0, stroke: "#1a1a18", strokeWidth: 2 },
     text: {
         width: 260,
-        height: 40,
+        // Une ligne : la boîte par défaut épouse le texte par défaut. Toute autre
+        // hauteur ferait descendre la première ligne sous le point posé, puisque le
+        // bloc de lignes est centré dans sa boîte. Un texte créé sans hauteur la
+        // recalcule de toute façon sur son propre contenu.
+        height: defaultLineHeight(24),
         text: "Texte",
         color: "#1a1a18",
         fontSize: 24,
@@ -16,8 +21,9 @@ export const NODE_DEFAULTS = {
         fontWeight: 400,
         fontStyle: "normal",
         textAlign: "left",
-        // En pixels, comme x/y/fontSize — jamais un multiplicateur.
-        lineHeight: 32,
+        // `lineHeight` n'a volontairement pas de valeur par défaut : figée, elle
+        // rendrait un texte de 64px sur un interligne de 32. Absente, elle suit la
+        // taille de police (fontSize x 1.35), comme l'annonce sa documentation.
     },
     // Taille de la grille de Lucide : une icone posee sans consigne rend au
     // format pour lequel son trace a ete dessine.

package/dist/shared/node-fields.js

@@ -22,7 +22,10 @@ export const NODE_FIELD_DOCS = {
     width: "Width of the bounding box, in pixels. On a line, the horizontal delta from start to end — it may be negative. " +
         "On a group, derived from the content and read-only.",
     height: "Height of the bounding box, in pixels. On a line, the vertical delta from start to end — it may be negative. " +
-        "On a group, derived from the content and read-only.",
+        "On a group, derived from the content and read-only. " +
+        "On a TEXT node, leave it out: the box then takes the exact height of the text (lines x lineHeight), " +
+        "so the first line starts at y. Set it only to centre a label inside a container — give the text node " +
+        "the container's y and height, and the block of lines is centred in it.",
     rotation: "Rotation in degrees, clockwise, around the centre of the bounding box. 0 = upright.",
     opacity: "Opacity, from 0 (fully transparent) to 1 (fully opaque).",
     fill: 'CSS colour filling the interior, e.g. "#ffffff" or "rgba(0,0,0,0.4)". rect, ellipse and icon. On an icon it is "none" by default — the shape is drawn by its stroke.',
@@ -42,7 +45,8 @@ export const NODE_FIELD_DOCS = {
         "node to read and to change. Whenever the same block appears more than once (cards, list rows, menu items, " +
         "buttons), build it once as a group and add instances of it instead of duplicating it. " +
         "Change this field to swap an instance over to another group; use detach_instances when one copy must diverge.",
-    text: "Text content. It is NEVER auto-wrapped: only explicit \\n characters start a new line.",
+    text: "Text content. It is NEVER auto-wrapped: only explicit \\n characters start a new line. " +
+        "A box that hugs its text keeps hugging it: adding a line grows the box instead of overflowing it.",
     color: "CSS colour of the text.",
     fontSize: "Font size, in pixels (same meaning as the CSS font-size property).",
     fontFamily: 'CSS font stack, e.g. "Inter, system-ui, sans-serif".',

package/dist/shared/render.d.ts

@@ -81,6 +81,24 @@ export declare function textMetrics(node: RenderNode): {
 };
 /** Hauteur minimale nécessaire pour afficher tout le texte du noeud. */
 export declare function measuredTextHeight(node: RenderNode): number;
+/**
+ * Vrai quand la boîte épouse déjà exactement son texte.
+ *
+ * C'est le signe qu'aucune hauteur n'a été voulue pour elle-même : la boîte
+ * suit son contenu, et doit continuer à le suivre quand le texte change. Une
+ * hauteur choisie (un libellé calé sur la hauteur de son bouton) ne vérifie pas
+ * cette égalité et n'est donc jamais réajustée.
+ */
+export declare function hugsText(node: RenderNode): boolean;
+/**
+ * Le noeud, avec la hauteur qui épouse son texte.
+ *
+ * Une boîte à la taille de son texte le place de fait en haut à gauche : le
+ * centrage vertical n'a plus rien à décaler. C'est ce qu'attend qui pose un
+ * texte sans penser à sa boîte ; un conteneur qui veut centrer son libellé,
+ * lui, donne une hauteur explicite.
+ */
+export declare function withFittedTextHeight<T extends RenderNode>(node: T): T;
 /**
  * Transform SVG d'un groupe : translation vers son origine, puis rotation
  * autour du centre de son contenu (exprime dans l'espace local du groupe).

package/dist/shared/render.js

@@ -98,6 +98,28 @@ export function measuredTextHeight(node) {
     const { lineStep } = textMetrics(node);
     return Math.max(lineStep, textLines(node).length * lineStep);
 }
+/**
+ * Vrai quand la boîte épouse déjà exactement son texte.
+ *
+ * C'est le signe qu'aucune hauteur n'a été voulue pour elle-même : la boîte
+ * suit son contenu, et doit continuer à le suivre quand le texte change. Une
+ * hauteur choisie (un libellé calé sur la hauteur de son bouton) ne vérifie pas
+ * cette égalité et n'est donc jamais réajustée.
+ */
+export function hugsText(node) {
+    return Math.abs(Math.abs(node.height) - measuredTextHeight(node)) < 0.5;
+}
+/**
+ * Le noeud, avec la hauteur qui épouse son texte.
+ *
+ * Une boîte à la taille de son texte le place de fait en haut à gauche : le
+ * centrage vertical n'a plus rien à décaler. C'est ce qu'attend qui pose un
+ * texte sans penser à sa boîte ; un conteneur qui veut centrer son libellé,
+ * lui, donne une hauteur explicite.
+ */
+export function withFittedTextHeight(node) {
+    return { ...node, height: measuredTextHeight(node) };
+}
 function shapeAttributes(node) {
     const parts = [];
     if (node.type !== "line" && node.type !== "text") {

package/dist/src/core/clone.d.ts

@@ -14,6 +14,8 @@ export interface CloneResult {
     copies: DesignNode[];
     /** Ids des copies correspondant aux racines demandees. */
     rootIds: string[];
+    /** Id d'origine -> id de la copie, pour chaque noeud copie. */
+    idMap: Map<string, string>;
 }
 /**
  * Copie les sous-arbres donnes. Les liens parent/enfant sont recables sur les

package/dist/src/core/clone.js

@@ -30,5 +30,5 @@ export function cloneSubtrees(nodes, rootIds) {
         id: idMap.get(node.id),
         parentId: roots.has(node.id) ? node.parentId : (idMap.get(node.parentId ?? "") ?? node.parentId),
     }));
-    return { copies, rootIds: rootIds.map((id) => idMap.get(id)) };
+    return { copies, rootIds: rootIds.map((id) => idMap.get(id)), idMap };
 }

package/dist/src/core/design-store.d.ts

@@ -50,6 +50,15 @@ export declare class DesignStore {
     has(id: string): boolean;
     get(id: string): Design;
     create(input: CreateDesignInput): Design;
+    /**
+     * Nouveau design reprenant la planche et tous les éléments d'un design
+     * existant, identifiants compris. La copie part synchronisée : sa référence
+     * de comparaison est son propre contenu.
+     */
+    duplicate(sourceId: string, input?: {
+        name?: string;
+        group?: string | null;
+    }): Design;
     /**
      * Applique une mutation et incrémente la révision. `editor` distingue une
      * modification de l'agent d'une modification faite à la main dans la GUI —

package/dist/src/core/design-store.js

@@ -240,6 +240,32 @@ export class DesignStore {
         this.write(design);
         return design;
     }
+    /**
+     * Nouveau design reprenant la planche et tous les éléments d'un design
+     * existant, identifiants compris. La copie part synchronisée : sa référence
+     * de comparaison est son propre contenu.
+     */
+    duplicate(sourceId, input = {}) {
+        const source = this.get(sourceId);
+        const name = input.name?.trim() || `${source.name} (copy)`;
+        const now = new Date().toISOString();
+        const design = {
+            id: this.allocateId(name),
+            name,
+            group: input.group === undefined ? source.group : normalizeDesignGroup(input.group),
+            width: source.width,
+            height: source.height,
+            background: source.background,
+            nodes: structuredClone(source.nodes),
+            createdAt: now,
+            updatedAt: now,
+            revision: 0,
+            lastEditor: "agent",
+            baseline: { revision: 0, at: now, nodes: structuredClone(source.nodes) },
+        };
+        this.write(design);
+        return design;
+    }
     /**
      * Applique une mutation et incrémente la révision. `editor` distingue une
      * modification de l'agent d'une modification faite à la main dans la GUI —

package/dist/src/core/node-factory.js

@@ -1,5 +1,6 @@
 import { DesignNodeSchema } from "../../shared/schemas/design.schema.js";
 import { GROUP_DERIVED_FIELDS, NODE_DEFAULTS, NODE_GEOMETRY_FIELDS, NODE_STYLE_FIELDS, SIZE_DERIVED_KINDS, clampNodeSize, defaultNodeName, } from "../../shared/node-defaults.js";
+import { hugsText, measuredTextHeight } from "../../shared/render.js";
 import { CORE_ICONS, hasIcon, iconCount } from "../../shared/icons/index.js";
 import { suggestIcons } from "../../shared/icons/search.js";
 import { shortId } from "./ids.js";
@@ -106,6 +107,14 @@ export function buildNode(input, existingIds, index) {
     const size = clampNodeSize(type, Number(draft.width), Number(draft.height));
     draft.width = size.width;
     draft.height = size.height;
+    // Sans hauteur demandée, la boîte d'un texte est celle de son texte : le bloc
+    // de lignes, centré dans une boîte à sa taille, se pose alors exactement au
+    // point donné — ce que l'appelant attend quand il n'a parlé que de x et y.
+    // Après le clamp, donc : ce plancher garde une boîte dessinée sélectionnable,
+    // il n'a pas à gonfler une boîte qui n'a jamais été dimensionnée à la souris.
+    if (type === "text" && input.height === undefined) {
+        draft.height = measuredTextHeight(draft);
+    }
     const parsed = DesignNodeSchema.safeParse(draft);
     if (!parsed.success) {
         throw new DesignError(`Invalid node: ${parsed.error.issues.map((i) => `${i.path.join(".")} ${i.message}`).join("; ")}`);
@@ -131,6 +140,12 @@ export function applyPatch(node, patch) {
         if (patch[field] !== undefined)
             next[field] = patch[field];
     }
+    // Une boîte qui épousait son texte continue de l'épouser : rallonger le texte
+    // d'une ligne agrandit la boîte au lieu de la faire déborder. Une hauteur
+    // choisie — ou redonnée dans ce patch — reste intacte.
+    if (node.type === "text" && patch.height === undefined && hugsText(node)) {
+        next.height = measuredTextHeight(next);
+    }
     if (node.type === "icon" && patch.icon !== undefined)
         next.icon = requireIconName(patch.icon);
     // Changer le lien echange l'instance de composant, comme un "swap instance".

package/dist/src/index.js

@@ -19,6 +19,7 @@ import { REORDER_DIRECTIONS } from "../shared/tree.js";
 import { normalizeDesignGroup } from "../shared/schemas/design.schema.js";
 import { listDesigns } from "./tools/list-designs.js";
 import { createDesign } from "./tools/create-design.js";
+import { duplicateDesign } from "./tools/duplicate-design.js";
 import { getDesign } from "./tools/get-design.js";
 import { updateDesign } from "./tools/update-design.js";
 import { deleteDesign } from "./tools/delete-design.js";
@@ -34,6 +35,7 @@ import { getChanges } from "./tools/get-changes.js";
 import { markSynced } from "./tools/mark-synced.js";
 import { exportDesignTool } from "./tools/export-design.js";
 import { screenshotDesignTool } from "./tools/screenshot-design.js";
+import { RELAY_SHAPE_DESCRIPTIONS } from "./tools/relay.js";
 import { reorderNodesTool } from "./tools/reorder-nodes.js";
 import { searchIconsTool, DEFAULT_ICON_RESULTS, MAX_ICON_RESULTS } from "./tools/search-icons.js";
 const __filename = fileURLToPath(import.meta.url);
@@ -335,6 +337,8 @@ const NODE_FIELDS_DOC = "Every length is in PIXELS (x, y, width, height, strokeW
     "Fields accepted per type — rect: fill, stroke, strokeWidth, radius; ellipse: fill, stroke, strokeWidth; " +
     "line: stroke, strokeWidth (the line goes from (x, y) to (x + width, y + height)); " +
     "text: text, color, fontSize, fontFamily, fontWeight, fontStyle, textAlign, lineHeight; " +
+    "a text node given no height takes the exact height of its text, so its first line starts at y — " +
+    "pass a height only to centre a label inside a container (same y and height as the container); " +
     "icon: icon (required — the name of the drawing), fill, stroke, strokeWidth; " +
     "instance: componentId (required — the id of the group it mirrors); nothing else, its look comes from that group. " +
     "Any field left out falls back to a sensible default, so a node can be created from its type alone.";
@@ -430,6 +434,21 @@ server.setRequestHandler(ListToolsRequestSchema, async () => ({
                 required: ["name"],
             },
         },
+        {
+            name: "duplicate_design",
+            description: "Copy a whole design into a new one: artboard size, background, every node, group and instance. " +
+                "Node ids are kept, so ids read from the original apply to the copy. Use it to start a variant of a page, " +
+                "or a new page that reuses an existing layout. The copy starts with no pending changes.",
+            inputSchema: {
+                type: "object",
+                properties: {
+                    design_id: { type: "string", description: "Id of the design to copy." },
+                    name: { type: "string", description: "Name of the copy (default: the original name followed by \"(copy)\")." },
+                    group: { type: ["string", "null"], description: `Page group of the copy (default: the original's group). ${GROUP_PATH_DOC}` },
+                },
+                required: ["design_id"],
+            },
+        },
         {
             name: "get_design",
             description: "Read a design. format=summary (default) gives a compact inventory of the nodes; format=json gives the exact values needed to build an update_nodes patch. Never acknowledges pending user edits — use get_changes for that.",
@@ -549,7 +568,10 @@ server.setRequestHandler(ListToolsRequestSchema, async () => ({
             description: "Copy elements or whole groups. A group is copied with everything inside it, and every copy gets fresh ids. " +
                 "Use it for a one-off copy that is MEANT TO DIVERGE. For a block repeated identically, do not copy it: " +
                 "instantiate it instead (add_nodes with type \"instance\"), so a single edit updates every occurrence. " +
-                "Copies land next to the originals by default; use offset_x/offset_y to place them, count to lay out a series, and parent_id to drop them into another group.",
+                "Copies land next to the originals by default; use offset_x/offset_y to place them, count to lay out a series, and parent_id to drop them into another group. " +
+                "Pass target_design_id to copy into ANOTHER design: the copies keep their on-screen position (at the target's root, " +
+                "or in parent_id), and any component mirrored by a copied instance is copied along once, at the target's root, " +
+                "with the copied instances pointed at it. To copy a whole page, use duplicate_design instead.",
             inputSchema: {
                 type: "object",
                 properties: {
@@ -560,12 +582,16 @@ server.setRequestHandler(ListToolsRequestSchema, async () => ({
                         description: "Ids of the elements or groups to copy. A node whose ancestor is also listed is ignored: the ancestor already carries it.",
                         minItems: 1,
                     },
-                    offset_x: { type: "number", description: "Horizontal shift of each copy, in pixels (default 20). Use the element width plus a gutter to lay copies out in a row." },
-                    offset_y: { type: "number", description: "Vertical shift of each copy, in pixels (default 20). Use the element height plus a gutter to stack copies in a column." },
+                    target_design_id: {
+                        type: "string",
+                        description: "Design the copies are written into. Omit to copy within design_id.",
+                    },
+                    offset_x: { type: "number", description: "Horizontal shift of each copy, in pixels (default 20, 0 into another design). Use the element width plus a gutter to lay copies out in a row." },
+                    offset_y: { type: "number", description: "Vertical shift of each copy, in pixels (default 20, 0 into another design). Use the element height plus a gutter to stack copies in a column." },
                     count: { type: "number", description: `How many copies to make (default 1, max ${MAX_DUPLICATE_COPIES}). Copy n is shifted by n times the offset, which lays out a regular series in one call.` },
                     parent_id: {
                         type: ["string", "null"],
-                        description: "Group the copies are dropped into. Their x/y are then read in that group's space. Omit to keep the original's parent, or pass null to place the copies at the root.",
+                        description: "Group the copies are dropped into, in the target design. Their x/y are then read in that group's space. Omit to keep the original's parent (the root, into another design), or pass null to place the copies at the root.",
                     },
                 },
                 required: ["design_id", "node_ids"],
@@ -688,13 +714,19 @@ server.setRequestHandler(ListToolsRequestSchema, async () => ({
         },
         {
             name: "export_design",
-            description: "Render a design for integration. html = absolutely positioned divs + CSS (best starting point for real code), jsx = the same as a React component, svg = faithful preview, json = raw nodes, summary = textual inventory. Provide output_path to write to a file instead of returning the content.",
+            description: "Render a design for integration. html = absolutely positioned divs + CSS (best starting point for real code), jsx = the same as a React component, svg = faithful preview, json = raw nodes, summary = textual inventory. Provide destination_path and filename to write a file on the agent machine instead of returning the content.",
             inputSchema: {
                 type: "object",
                 properties: {
                     design_id: { type: "string", description: DESIGN_ID_DOC },
                     format: { type: "string", enum: [...EXPORT_FORMATS], description: "Output format (default html)." },
-                    output_path: { type: "string", description: "Absolute path to write the export to. When omitted, the content is returned directly." },
+                    destination_path: {
+                        type: "string",
+                        description: `${RELAY_SHAPE_DESCRIPTIONS.destination_path}. When omitted, the content is returned directly instead of being written.`,
+                    },
+                    filename: { type: "string", description: `${RELAY_SHAPE_DESCRIPTIONS.filename}. Required when destination_path is provided.` },
+                    destination_overwrite: { type: "boolean", description: RELAY_SHAPE_DESCRIPTIONS.destination_overwrite },
+                    destination_relay: { type: "boolean", description: RELAY_SHAPE_DESCRIPTIONS.destination_relay },
                 },
                 required: ["design_id"],
             },
@@ -703,7 +735,7 @@ server.setRequestHandler(ListToolsRequestSchema, async () => ({
             name: "screenshot_design",
             description: "Render a design to a PNG image and look at it. Use it to check what the design actually looks like — proportions, overlaps, contrast, alignment — instead of inferring it from coordinates. " +
                 "Pass node_id to frame the capture on a single group (or any element) rather than the whole artboard. " +
-                "The image is returned inline; provide output_path to write a .png file instead.",
+                "The image is returned inline; provide destination_path and filename to write a .png file on the agent machine instead.",
             inputSchema: {
                 type: "object",
                 properties: {
@@ -720,10 +752,13 @@ server.setRequestHandler(ListToolsRequestSchema, async () => ({
                         type: "number",
                         description: "Margin in design pixels around the captured node (default 16, ignored for a full-artboard capture).",
                     },
-                    output_path: {
+                    destination_path: {
                         type: "string",
-                        description: "Absolute path of a .png file to write. When omitted, the image is returned inline.",
+                        description: `${RELAY_SHAPE_DESCRIPTIONS.destination_path}. When omitted, the image is returned inline instead of being written.`,
                     },
+                    filename: { type: "string", description: "Name of the .png file to create. Required when destination_path is provided. Must not contain path separators." },
+                    destination_overwrite: { type: "boolean", description: RELAY_SHAPE_DESCRIPTIONS.destination_overwrite },
+                    destination_relay: { type: "boolean", description: RELAY_SHAPE_DESCRIPTIONS.destination_relay },
                 },
                 required: ["design_id"],
             },
@@ -771,6 +806,11 @@ server.setRequestHandler(CallToolRequestSchema, async (request) => {
                 broadcastToGUI({ type: "DESIGNS_UPDATED", data: { designs: store.list() }, timestamp: new Date().toISOString() });
                 return { ...result, content: [{ type: "text", text: result.content[0].text + guiHint(result.design.id) }] };
             }
+            case "duplicate_design": {
+                const result = duplicateDesign(store, params);
+                broadcastToGUI({ type: "DESIGNS_UPDATED", data: { designs: store.list() }, timestamp: new Date().toISOString() });
+                return { ...result, content: [{ type: "text", text: result.content[0].text + guiHint(result.design.id) }] };
+            }
             case "get_design":
                 return getDesign(store, params);
             case "update_design": {

package/dist/src/tools/duplicate-design.d.ts

@@ -0,0 +1,4 @@
+import type { DesignStore } from "../core/design-store.js";
+import type { CreateDesignResult } from "./create-design.js";
+/** Copie complète d'un design : planche, éléments, groupes et instances. */
+export declare function duplicateDesign(store: DesignStore, args: Record<string, unknown> | undefined): CreateDesignResult;

package/dist/src/tools/duplicate-design.js

@@ -0,0 +1,18 @@
+import { requireString, textResult } from "./types.js";
+/** Copie complète d'un design : planche, éléments, groupes et instances. */
+export function duplicateDesign(store, args) {
+    const id = requireString(args, "design_id");
+    if (args?.name !== undefined && (typeof args.name !== "string" || args.name.trim() === "")) {
+        throw new Error(`"name" must be a non-empty string.`);
+    }
+    const design = store.duplicate(id, {
+        name: args?.name,
+        group: args?.group === undefined ? undefined : args.group,
+    });
+    return {
+        ...textResult(`Design "${id}" copied to "${design.name}" with id "${design.id}" (${design.width}x${design.height}, ` +
+            `${design.nodes.length} node(s))${design.group === null ? "" : ` in page group "${design.group}"`}. ` +
+            `Node ids are the same as in the original, so ids read from it apply to the copy.`),
+        design,
+    };
+}

package/dist/src/tools/duplicate-nodes.d.ts

@@ -2,10 +2,12 @@ import type { DesignStore } from "../core/design-store.js";
 import type { MutationResult } from "./add-nodes.js";
 export declare const MAX_DUPLICATE_COPIES = 50;
 /**
- * Copie des éléments — un groupe emporte tout son contenu.
+ * Copie des éléments — un groupe emporte tout son contenu — dans le même design
+ * ou dans un autre.
  *
  * Les identifiants sont réattribués et les liens parent/enfant recâblés sur les
- * copies : sans cela, deux noeuds partageraient un id, ce qui casserait aussi
- * bien le rendu que le diff relu par l'agent.
+ * copies. Vers un autre design, les copies arrivent à la racine à leur position
+ * absolue d'origine (ou dans `parent_id`), et les composants reproduits par les
+ * instances copiées sont copiés avec elles, une seule fois, à la racine.
  */
 export declare function duplicateNodes(store: DesignStore, args: Record<string, unknown> | undefined): MutationResult;

package/dist/src/tools/duplicate-nodes.js

@@ -1,8 +1,9 @@
-import { withoutRedundantDescendants } from "../../shared/tree.js";
-import { cloneSubtrees } from "../core/clone.js";
+import { computeLayout, spaceOriginOf, withoutRedundantDescendants } from "../../shared/tree.js";
+import { expandInstances } from "../../shared/instances.js";
+import { cloneSubtrees, subtreeNodes } from "../core/clone.js";
 import { DesignError } from "../core/node-factory.js";
 import { requireString, textResult } from "./types.js";
-/** Décalage par défaut d'une copie, en pixels : assez pour la voir, assez peu pour la retrouver. */
+/** Décalage par défaut d'une copie dans le même design, en pixels : assez pour la voir, assez peu pour la retrouver. */
 const DEFAULT_OFFSET = 20;
 export const MAX_DUPLICATE_COPIES = 50;
 function readNumber(args, field, fallback) {
@@ -14,11 +15,43 @@ function readNumber(args, field, fallback) {
     return value;
 }
 /**
- * Copie des éléments — un groupe emporte tout son contenu.
+ * Composants à copier en plus des sous-arbres demandés : ceux que reproduit une
+ * instance copiée alors qu'ils n'ont pas de copie à portée, y compris ceux dont
+ * dépendent les composants ainsi ajoutés. Les instances des sous-arbres demandés
+ * voient les composants copiés avec elles ; celles d'un composant ajouté ne
+ * voient que les autres composants ajoutés.
+ */
+function missingComponents(nodes, roots) {
+    const inRoots = new Set(subtreeNodes(nodes, roots).map((node) => node.id));
+    const referenced = (scope, reachable) => subtreeNodes(nodes, scope)
+        .filter((node) => node.type === "instance" && node.componentId !== undefined && !reachable.has(node.componentId))
+        .map((node) => node.componentId);
+    const missing = [...new Set(referenced(roots, inRoots))];
+    for (;;) {
+        const inMissing = new Set(subtreeNodes(nodes, missing).map((node) => node.id));
+        const fresh = [...new Set(referenced(missing, inMissing))].filter((id) => !missing.includes(id));
+        if (fresh.length === 0)
+            return missing;
+        missing.push(...fresh);
+    }
+}
+/** Pointe chaque instance copiée vers la copie de son composant quand elle existe. */
+function remapComponents(copies, ...idMaps) {
+    return copies.map((node) => {
+        if (node.type !== "instance" || node.componentId === undefined)
+            return node;
+        const target = idMaps.map((map) => map.get(node.componentId)).find((id) => id !== undefined);
+        return target === undefined ? node : { ...node, componentId: target };
+    });
+}
+/**
+ * Copie des éléments — un groupe emporte tout son contenu — dans le même design
+ * ou dans un autre.
  *
  * Les identifiants sont réattribués et les liens parent/enfant recâblés sur les
- * copies : sans cela, deux noeuds partageraient un id, ce qui casserait aussi
- * bien le rendu que le diff relu par l'agent.
+ * copies. Vers un autre design, les copies arrivent à la racine à leur position
+ * absolue d'origine (ou dans `parent_id`), et les composants reproduits par les
+ * instances copiées sont copiés avec elles, une seule fois, à la racine.
  */
 export function duplicateNodes(store, args) {
     const id = requireString(args, "design_id");
@@ -26,17 +59,21 @@ export function duplicateNodes(store, args) {
     if (!Array.isArray(nodeIds) || nodeIds.length === 0) {
         throw new Error(`"node_ids" is required and must be a non-empty array of node ids.`);
     }
-    const current = store.get(id);
-    const byId = new Map(current.nodes.map((node) => [node.id, node]));
+    const targetId = args?.target_design_id === undefined ? id : requireString(args, "target_design_id");
+    const crossDesign = targetId !== id;
+    const source = store.get(id);
+    const target = crossDesign ? store.get(targetId) : source;
+    const byId = new Map(source.nodes.map((node) => [node.id, node]));
     for (const raw of nodeIds) {
         if (!byId.has(String(raw)))
             throw new DesignError(`Node "${String(raw)}" not found in design "${id}".`);
     }
     // Un élément dont le groupe est aussi listé serait copié deux fois : une fois
     // pour lui-même, une fois avec son groupe.
-    const roots = withoutRedundantDescendants(current.nodes, nodeIds.map((raw) => String(raw)));
-    const offsetX = readNumber(args, "offset_x", DEFAULT_OFFSET);
-    const offsetY = readNumber(args, "offset_y", DEFAULT_OFFSET);
+    const roots = withoutRedundantDescendants(source.nodes, nodeIds.map((raw) => String(raw)));
+    const defaultOffset = crossDesign ? 0 : DEFAULT_OFFSET;
+    const offsetX = readNumber(args, "offset_x", defaultOffset);
+    const offsetY = readNumber(args, "offset_y", defaultOffset);
     const count = readNumber(args, "count", 1);
     if (!Number.isInteger(count) || count < 1 || count > MAX_DUPLICATE_COPIES) {
         throw new DesignError(`"count" must be an integer between 1 and ${MAX_DUPLICATE_COPIES}.`);
@@ -47,49 +84,69 @@ export function duplicateNodes(store, args) {
             parentId = null;
         }
         else {
-            const parent = byId.get(String(args.parent_id));
+            const parent = target.nodes.find((node) => node.id === String(args.parent_id));
             if (!parent)
-                throw new DesignError(`Group "${String(args.parent_id)}" not found in design "${id}".`);
+                throw new DesignError(`Group "${String(args.parent_id)}" not found in design "${targetId}".`);
             if (parent.type !== "group") {
                 throw new DesignError(`"parent_id" must reference a group, but "${parent.id}" is a "${parent.type}".`);
             }
             parentId = parent.id;
         }
     }
+    // Vers un autre design, un noeud posé à la racine garde sa position à l'écran :
+    // ses coordonnées locales sont ramenées dans l'espace de la planche.
+    const layout = crossDesign ? computeLayout(expandInstances(source.nodes)) : undefined;
+    const placeAtRoot = (node) => {
+        const origin = spaceOriginOf(layout, node.parentId);
+        return { ...node, parentId: null, x: node.x + origin.x, y: node.y + origin.y };
+    };
     const copies = [];
     const createdRootIds = [];
+    const components = crossDesign ? withoutRedundantDescendants(source.nodes, missingComponents(source.nodes, roots)) : [];
+    const componentClone = cloneSubtrees(source.nodes, components);
+    const componentRoots = new Set(componentClone.rootIds);
+    copies.push(...remapComponents(componentClone.copies, componentClone.idMap).map((copy) => componentRoots.has(copy.id) ? placeAtRoot(copy) : copy));
     for (let copyIndex = 1; copyIndex <= count; copyIndex++) {
         // Un sous-arbre complet par copie : les ids sont neufs et les liens
         // parent/enfant recables (cf. src/core/clone.ts).
-        const clone = cloneSubtrees(current.nodes, roots);
+        const clone = cloneSubtrees(source.nodes, roots);
         const rootSet = new Set(clone.rootIds);
-        for (const copy of clone.copies) {
+        const cloned = crossDesign ? remapComponents(clone.copies, clone.idMap, componentClone.idMap) : clone.copies;
+        for (const copy of cloned) {
             // Seules les racines sont decalees et reparentees : les descendants sont
             // exprimes dans l'espace de leur parent et suivent donc tout seuls.
             if (!rootSet.has(copy.id)) {
                 copies.push(copy);
                 continue;
             }
+            const placed = crossDesign && (parentId === undefined || parentId === null) ? placeAtRoot(copy) : copy;
             copies.push({
-                ...copy,
-                parentId: parentId === undefined ? copy.parentId : parentId,
-                x: copy.x + offsetX * copyIndex,
-                y: copy.y + offsetY * copyIndex,
+                ...placed,
+                parentId: parentId === undefined ? placed.parentId : parentId,
+                x: placed.x + offsetX * copyIndex,
+                y: placed.y + offsetY * copyIndex,
             });
         }
         createdRootIds.push(...clone.rootIds);
     }
-    const design = store.mutate(id, "agent", (draft) => {
+    const design = store.mutate(targetId, "agent", (draft) => {
         draft.nodes.push(...copies);
     });
-    const lines = copies
-        .filter((node) => createdRootIds.includes(node.id))
-        .map((node) => `- ${node.id} — "${node.name}" (${node.type}) at ${Math.round(node.x)},${Math.round(node.y)}`);
+    const describe = (node) => `- ${node.id} — "${node.name}" (${node.type}) at ${Math.round(node.x)},${Math.round(node.y)}`;
+    const lines = copies.filter((node) => createdRootIds.includes(node.id)).map(describe);
+    const componentLines = copies.filter((node) => componentRoots.has(node.id)).map(describe);
+    const from = crossDesign ? ` from "${source.name}" into "${design.name}"` : ` in "${design.name}"`;
     return {
         ...textResult([
-            `Copied ${roots.length} node(s)${count > 1 ? ` ${count} times` : ""} in "${design.name}" ` +
+            `Copied ${roots.length} node(s)${count > 1 ? ` ${count} times` : ""}${from} ` +
                 `(${copies.length} node(s) created, content included). New top-level copies:`,
             ...lines,
+            ...(componentLines.length > 0
+                ? [
+                    `Also copied ${componentLines.length} component(s) the copied instances mirror, now pointed at by those instances:`,
+                    ...componentLines,
+                ]
+                : []),
         ].join("\n")),
         design,
     };

package/dist/src/tools/export-design.d.ts

@@ -1,3 +1,3 @@
 import type { DesignStore } from "../core/design-store.js";
-import { type ToolResult } from "./types.js";
-export declare function exportDesignTool(store: DesignStore, args: Record<string, unknown> | undefined): ToolResult;
+import { type FileToolResult } from "./types.js";
+export declare function exportDesignTool(store: DesignStore, args: Record<string, unknown> | undefined): FileToolResult;

package/dist/src/tools/export-design.js

@@ -1,7 +1,13 @@
-import fs from "fs";
-import path from "path";
 import { EXPORT_FORMATS, exportDesign as render } from "../core/export.js";
+import { deliverFile } from "./relay.js";
 import { requireString, textResult } from "./types.js";
+const MIME_BY_FORMAT = {
+    html: "text/html",
+    jsx: "text/jsx",
+    svg: "image/svg+xml",
+    json: "application/json",
+    summary: "text/plain",
+};
 export function exportDesignTool(store, args) {
     const id = requireString(args, "design_id");
     const format = (args?.format ?? "html");
@@ -10,12 +16,25 @@ export function exportDesignTool(store, args) {
     }
     const design = store.get(id);
     const content = render(design, format);
-    const outputPath = typeof args?.output_path === "string" ? args.output_path.trim() : "";
-    if (outputPath) {
-        const target = path.resolve(outputPath);
-        fs.mkdirSync(path.dirname(target), { recursive: true });
-        fs.writeFileSync(target, content, "utf-8");
-        return textResult(`Design "${design.name}" exported as ${format} to ${target} (${content.length} characters).`);
+    const destination = typeof args?.destination_path === "string" ? args.destination_path.trim() : "";
+    if (!destination) {
+        return textResult(content);
     }
-    return textResult(content);
+    // Le fichier part vers la machine de l'agent : ici on ne fait que produire les octets,
+    // `deliverFile` décide s'ils s'écrivent sur ce disque ou voyagent jusqu'au relais.
+    const blocks = deliverFile(Buffer.from(content, "utf-8"), MIME_BY_FORMAT[format] ?? "text/plain", {
+        destination_path: destination,
+        filename: requireString(args, "filename"),
+        destination_overwrite: args?.destination_overwrite === true,
+        destination_relay: args?.destination_relay === true,
+    });
+    return {
+        content: [
+            {
+                type: "text",
+                text: `Design "${design.name}" exported as ${format} (${content.length} characters).`,
+            },
+            ...blocks,
+        ],
+    };
 }