Fabric UX Devkit — VS Code Extension

A GitHub Copilot Chat extension for VS Code with two delivery modes:

@fabric chat participant for direct component lookup and guidance
workspace installer for Fabric UX Copilot agents and skills so Copilot Chat can discover them from the active repo

Commands

Command	Description
`@fabric <component>`	Look up Angular directive usage (default)
`@fabric react <component>`	Look up React wrapper usage — props, events, refs, slots, JSX examples
`@fabric angular <component>`	Look up Angular directive usage — imports, CVA forms, slots, template examples
`@fabric /react <component>`	Look up React wrapper usage (slash-command form)
`@fabric /angular <component>`	Look up Angular directive usage (slash-command form)
`Fabric UX: Install Copilot Chat Assets To Workspace`	Copies Fabric UX agents and skills into the active workspace so Copilot Chat can discover them

Examples

@fabric button
@fabric accordion-item
@fabric react button
@fabric angular dropdown
@fabric /react dialog
@fabric /angular text-input

How It Works

Installing the extension gives you the @fabric participant immediately.

If you also want Fabric UX agents and skills to appear in Copilot Chat, run the command palette action Fabric UX: Install Copilot Chat Assets To Workspace. That copies the packaged assets into:

.github/agents/
.github/skills/

Those workspace files are the surface Copilot Chat can discover from the active repository. The extension packages and installs them for you.

Local Development

cd fabric-ux-devkit/vscode-extension
npm install
npm run build
npm run install:local

Packaging

npm run package
# Creates fabric-ux-vscode-devkit-0.2.0.vsix

The package step bundles the Fabric UX skills, agent files, and LICENSE into the .vsix.