Skip to content

Commit 545cd21

Browse files
Add fabric-ux-devkit plugin
Adds Fabric UX Devkit — an AI-powered agent and skills plugin for repos that consume Fabric UX web components. Provides parity analysis, verified React/Angular component examples, Figma-to-code implementation, and component gap identification. Source: brianchristopherbrady/fabric-ux-copilot-plugins Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
1 parent 6fe19e8 commit 545cd21

File tree

2 files changed

+56
-0
lines changed

2 files changed

+56
-0
lines changed

.github/plugin/marketplace.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,15 @@
3535
"skills": [
3636
"./skills/secret-scanning"
3737
]
38+
},
39+
{
40+
"name": "fabric-ux-devkit",
41+
"source": {
42+
"source": "github",
43+
"repo": "brianchristopherbrady/fabric-ux-copilot-plugins"
44+
},
45+
"description": "Fabric UX developer agent, skills, and MCP server for consumer-repo parity analysis, component catalog lookup, and spec-to-code implementation.",
46+
"version": "0.1.0"
3847
}
3948
]
4049
}

plugins/fabric-ux-devkit/README.md

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
# Fabric UX Devkit
2+
3+
AI-powered tooling for repos that consume [Fabric UX](https://github.com/microsoft/fabric-ux) web components. Includes agents and skills that help LLMs find real Fabric components, assess parity against design specs, and implement UI code — all backed by evidence from installed packages.
4+
5+
> Source: [`brianchristopherbrady/fabric-ux-copilot-plugins`](https://github.com/brianchristopherbrady/fabric-ux-copilot-plugins)
6+
7+
## What it does
8+
9+
Fabric UX Devkit grounds AI assistance in the actual Fabric component catalog, ensuring LLMs use real APIs rather than hallucinated ones. It enables agents to:
10+
11+
| Capability | Description |
12+
| --- | --- |
13+
| **Parity analysis** | Compare a Figma spec or engineering spec against the Fabric component catalog |
14+
| **Component lookup** | Retrieve verified React and Angular usage examples for any Fabric component |
15+
| **Spec-to-code** | Translate an approved design spec into repo-compliant UI code |
16+
| **Gap identification** | Classify component gaps and file feature requests upstream |
17+
18+
## Agent
19+
20+
### `fabric-ux-developer`
21+
22+
Orchestration agent for consumer-repo Fabric UX parity analysis and implementation. Handles design review, parity assessment, report generation, and code implementation across React, Angular, and Web Component framework lanes.
23+
24+
## Skills
25+
26+
| Skill | Description |
27+
| --- | --- |
28+
| **parity-analysis** | Spec-to-catalog parity assessment with environment baseline checks and report generation |
29+
| **react-examples** | Verified React usage examples for every Fabric component |
30+
| **angular-examples** | Verified Angular usage examples for every Fabric component |
31+
| **figma-api** | Figma design extraction for node hierarchy, screenshots, and visual properties |
32+
| **figma-spec-review** | Design-node triage into implement-now, future, and reference-only |
33+
| **figma-to-code** | Translates an approved Figma spec + parity report into repo-compliant UI code |
34+
| **file-fabric-issue** | Files feature requests and bug reports as Azure DevOps work items |
35+
| **feature-switches** | Feature switch discovery and local enablement in PowerBI clients |
36+
37+
## Framework lanes
38+
39+
| Framework | Wrapper package | Evidence source |
40+
| --- | --- | --- |
41+
| React | `@fabric-msft/fabric-react` | + `@fabric-msft/fabric-web` |
42+
| Angular | `@fabric-msft/fabric-angular` | + `@fabric-msft/fabric-web` |
43+
| Web Components || `@fabric-msft/fabric-web` |
44+
45+
## License
46+
47+
[MIT](../../LICENSE)

0 commit comments

Comments
 (0)