makepad-dsl_skill
- Shell
715
GitHub Stars
1
Bundled Files
2 months ago
Catalog Refreshed
4 months ago
First Indexed
Readme & install
Copy the install command, review bundled files from the catalogue, and read any extended description pulled from the listing source.
Installation
Preview and clipboard use veilstrat where the catalogue uses aiagentskills.
npx veilstrat add skill zhanghandong/makepad-skills --skill makepad-dsl- SKILL.md4.1 KB
Overview
This skill provides expert guidance and code generation for the Makepad DSL used with the makepad-widgets crate. It focuses on DSL syntax, prototype definition, inheritance (eager copy), widget instantiation, and linking DSL objects to Rust types. Use it to write correct, idiomatic Makepad DSL fragments and to explain inheritance and live-reload behavior.
How this skill works
The skill inspects DSL patterns and generates code that follows the makepad-widgets conventions: anonymous objects, named prototypes, <Prototype> inheritance, and {{RustType}} bindings. It explains how properties are eagerly copied from parent prototypes, how nested overrides work, and how to structure reusable styles and widget trees for live_design. If local reference files are missing, it will inform you to refresh the local docs and still answer based on built-in patterns.
When to use it
- Creating reusable visual styles or component prototypes (Name = { ... }).
- Composing widget trees with child widgets and named child references (<Widget> or name = <Widget>).
- Overriding or extending prototype properties and nested objects.
- Linking a DSL prototype to a Rust struct with {{RustType}} for live_design integration.
- Explaining inheritance semantics (eager copy, partial nested override).
Best practices
- Define reusable styles as named prototypes and keep names meaningful for reuse.
- Use <Widget> syntax to inherit built-in widgets and override only what changes.
- Prefer partial nested overrides rather than duplicating full nested objects.
- Link DSL objects to Rust structs via {{RustType}} inside live_design! for live reload and clear ownership.
- Keep numeric sizes explicit and use Fit/Fill enums for layout intent.
Example use cases
- Define a primary button style and derive variants with color overrides using <PrimaryButton>.
- Create a complex view with named child widgets: header = <Header> { } body = <Body> { } footer = <Footer> { }.
- Bind a custom Rust widget to DSL: MyWidget = {{MyWidget}} { width: 100.0 } and implement its fields in Rust with #[live] attributes.
- Compose nested property overrides when adjusting padding or colors without copying the entire object.
- Quickly prototype UI changes and see them live-reloaded via makepad's live_design system.
FAQ
Eager copy means all parent properties are copied into the child at definition time; the child can then override or extend those properties independently.
How do I link a DSL prototype to my Rust struct?
Use the {{RustType}} syntax inside the prototype in live_design!, then implement the struct in Rust with #[derive(Live, LiveHook, Widget)] and #[live] fields.
