From 8ac17604fdb695c27bdf958d0b0e946d74689343 Mon Sep 17 00:00:00 2001 From: Dominik Jain Date: Tue, 10 Feb 2026 22:53:30 +0100 Subject: [PATCH] :sparkles: Improve information on component instances * Add information on detachment * Add information on remove behaviour in component instances --- mcp/packages/server/data/initial_instructions.md | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/mcp/packages/server/data/initial_instructions.md b/mcp/packages/server/data/initial_instructions.md index aa212be1b5..8aa60b1a1b 100644 --- a/mcp/packages/server/data/initial_instructions.md +++ b/mcp/packages/server/data/initial_instructions.md @@ -61,7 +61,8 @@ Actual low-level shape types are `Rectangle`, `Path`, `Text`, `Ellipse`, `Image` **Modification Methods**: * `resize(width, height)` - Change dimensions (required for width/height since they're read-only) * `rotate(angle, center?)` - Rotate shape - * `remove()` - Permanently destroy the shape (use only for deletion, NOT for reparenting) + * `remove()` - Permanently destroy the shape (use only for deletion, NOT for reparenting). + Exception: When the shape is a descendant of a board that is a component (asset), the shape will not be removed but instead be made invisible. **Hierarchical Structure**: * `parent` - The parent shape (null for root shapes) @@ -262,6 +263,10 @@ Adding assets to a library: const newComponent: LibraryComponent = penpot.library.local.createComponent(shapes); newComponent.name = 'My Button'; +Detaching: + * When creating new design elements based on a component instance/copy, use `shape.detach()` to break the link to the main component, allowing independent modification. + * Without detaching, some manipulations will have no effect; e.g. child/descendant removal will not work. + # Design Tokens Design tokens are reusable design values (colors, dimensions, typography, etc.) for consistent styling.