diff --git a/mcp-server/data/prompts.yml b/mcp-server/data/prompts.yml index e57e75d..2896f91 100644 --- a/mcp-server/data/prompts.yml +++ b/mcp-server/data/prompts.yml @@ -87,13 +87,22 @@ initial_instructions: | Boards can have layout systems that automatically control the positioning and spacing of their children: + * If a board has a layout system, then child positions are controlled by the layout system. + For every child, key properties of the child within the layout are stored in `child.layoutChild: LayoutChildProperties`: + - `absolute: boolean` - if true, child position is not controlled by layout system. x/y will set *relative* position within parent! + - margins (`topMargin`, `rightMargin`, `bottomMargin`, `leftMargin` or combined `verticalMargin`, `horizontalMargin`) + - sizing (`verticalSizing`, `horizontalSizing`: "fill" | "auto" | "fix") + - min/max sizes (`minWidth`, `maxWidth`, `minHeight`, `maxHeight`) + - `zIndex: number` (higher numbers on top) + * **Flex Layout**: A flexbox-style layout system - Properties: `dir`, `rowGap`, `columnGap`, `alignItems`, `justifyContent`; - `dir`: "row" | "column" | "row-reverse" | "column-reverse" - Padding: `topPadding`, `rightPadding`, `bottomPadding`, `leftPadding`, or combined `verticalPadding`, `horizontalPadding` - - To modify spacing: adjust `rowGap` and `columnGap` properties, not individual child positions + - To modify spacing: adjust `rowGap` and `columnGap` properties, not individual child positions. + Optionally, adjust indivudual child margins via `child.layoutChild`. - When a board has flex layout, - - child positions are controlled by the layout system, not by individual x/y coordinates; + - child positions are controlled by the layout system, not by individual x/y coordinates (unless `child.layoutChild.absolute` is true); appending or inserting children automatically positions them according to the layout rules. - CRITICAL: For for dir="column" or dir="row", the order of the `children` array is reversed relative to the visual order! Therefore, the element that appears first in the array, appears visually at the end (bottom/right) and vice versa.