Menu
Promotes UITK design-mirror layout and USS from Assets/UI/Editor/DesignMirror/ into production bindable shells under Assets/UI/Screens/. Use when the user asks to sync design mirror, promote mirror to production, or apply UX UITK changes.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Pick C# type suffix and assembly before creating or renaming classes. Read class-naming-patterns.md via review-config.json. Use when adding new C# types, choosing View vs Presenter vs Coordinator, splitting god classes, or renaming type suffixes in griddungeon-game.
Writes Grid Dungeon GitHub/PR test plans with consistent structure (automated Edit Mode paths, DevBootstrap manual tables, sign-off, N/A deferrals). Use when creating or updating test plans for issues, PRs, handoff, or ticket close-out.
Creates or refreshes UITK design-mirror assets under Assets/UI/Editor/DesignMirror/ from production shells + placeholder fixtures. Use when the user asks to create a mock/mirror, bootstrap design mirror, add a new mirrored component, or regenerate placeholder UXML/USS for UX visual editing.
Selects the next highest-priority open item from a GitHub Project backlog (Ready then Backlog, P0→P1→P2), claims it, and starts implementation. Use when the user asks to pull the next ticket, pick up backlog work, start the top priority issue, or work from a GitHub Project board (e.g. users/OWNER/projects/N).
Builds ASCII UI trees, phase visibility tables, and cross-UIDocument maps for Unity UI Toolkit UXML. Use when the user asks to visualize, diagram, or explain a UXML hierarchy (e.g. CommandRail, HubHud, PartyMenu), trace name hooks to C#, or compare rail vs overlay documents.
Audits Grid Dungeon UI presenters, facades, and phase HUD wiring against centralized-ui-services.md and ICentralizedUiSurface. Auto-enables caveman mode (full) for audit output. Use when auditing a component for centralized UI service compliance, migration readiness, CloneTree embed smells, facade lifecycle vocabulary, presentation bus shells/projectors, or before/after extracting a picker/overlay to GameState.
| name | sync-uitk-design-mirror |
| description | Promotes UITK design-mirror layout and USS from Assets/UI/Editor/DesignMirror/ into production bindable shells under Assets/UI/Screens/. Use when the user asks to sync design mirror, promote mirror to production, or apply UX UITK changes. |
Not this skill: creating mirror assets — use create-uitk-design-mirror.
Task Progress:
- [ ] 1. Read mirror-manifest.yaml; resolve component id from user arg — stop if not registered
- [ ] 2. Read **primary** mirror UXML (`mirror.uxml`) + production shellUxml side by side — skip `states[]` with `syncToProduction: false`
- [ ] 3. UXML shell sync (rules below) — strip stripHosts children
- [ ] 4. USS merge — map mirror selectors → ussTargets files
- [ ] 5. Wrapper UXML — Style src list only if imports changed
- [ ] 6. Prettier on touched .uxml / .uss (prettier-uitk-format)
- [ ] 7. request-compile-status.ps1
- [ ] 8. request-test-status.ps1 -Category UI (if production UITK touched)
- [ ] 9. Emit change report (selectors, stripped nodes, bindable name check)
Run from griddungeon-game root.
State mirrors (states[] with syncToProduction: false, e.g. ItemListPicker.Empty.DesignMirror.uxml) are UX specimens only — do not copy their placeholder hosts into production. USS merge still uses the shared mirror.uss.
Target: production.shellUxml (e.g. ItemListPickerShell.uxml).
shellBindableNames name on production.shellUxml (wrapper-only hooks: wrapperBindableNames).class on non-host nodes (title, detail, scroll bars, body layout).stripHosts entry; leave empty hosts for runtime population.text into production except existing em-dash defaults on labels.Button elements to production unless manifest + ItemListPickerView (or owner) updated.name or non-BEM classes added in mirror — report blockers.For each name in manifest stripHosts: remove all children; keep the empty host VisualElement. See examples.md (ItemListPicker) for a worked table.
Read mirror.uss and each path in production.ussTargets. Map mirror selector prefixes to target files per manifest (see examples.md for ItemListPicker prefix table).
For each selector block in mirror USS (skip @import lines):
block__element--modifier).style="" on mirror UXML — translate to USS before merge; do not copy inline styles to production.Do not open production USS in UI Builder to apply edits — edit files directly, then Prettier.
production.wrapperUxml — update <Style src="..."/> only when mirror added/removed shared imports. Do not expand static tree.
.\tools\request-compile-status.ps1
.\tools\request-test-status.ps1 -Category UI
Manual: DevBootstrap F1 hub shop — picker layout matches synced production after UX mirror edit.
Deliver before handoff:
name hooks verified (list pass/fail)uxml_tree.py