design_block
Create detailed designs for specific blocks in a component-based system using natural language prompts. Supports Vue, React, and Angular for precise frontend development.
Instructions
Design a specific block. This is the second-stage tool in the block-based design strategy for detailed component design.
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| blockId | Yes | ID of the design block to design | |
| blockInfo | No | Detailed information of the block (optional) | |
| integratedContext | No | Integration context (optional): contains the overall strategy and completed block designs to return an updated integrated design snapshot | |
| prompt | Yes | Specific requirement description for the block |
Input Schema (JSON Schema)
{
"properties": {
"blockId": {
"description": "ID of the design block to design",
"type": "string"
},
"blockInfo": {
"description": "Detailed information of the block (optional)",
"properties": {
"blockId": {
"type": "string"
},
"blockType": {
"enum": [
"layout",
"component",
"logic"
],
"type": "string"
},
"description": {
"type": "string"
},
"priority": {
"enum": [
"high",
"medium",
"low"
],
"type": "string"
},
"title": {
"type": "string"
}
},
"type": "object"
},
"integratedContext": {
"description": "Integration context (optional): contains the overall strategy and completed block designs to return an updated integrated design snapshot",
"properties": {
"blockDesigns": {
"type": "array"
},
"strategy": {
"type": "object"
}
},
"type": "object"
},
"prompt": {
"description": "Specific requirement description for the block",
"items": {
"properties": {
"image": {
"type": "string"
},
"text": {
"type": "string"
},
"type": {
"enum": [
"text",
"image"
],
"type": "string"
}
},
"required": [
"type"
],
"type": "object"
},
"type": "array"
}
},
"required": [
"blockId",
"prompt"
],
"type": "object"
}