Menu
Quick lookup for a Fluent UI package — path, dependencies, owner team, Nx project details, and relevant docs
Review a PR for correctness, pattern compliance, testing, accessibility, and safety. Produces a confidence score for merge readiness.
Triage newly-filed GitHub issues on the Fluent UI repo (microsoft/fluentui) following the Shield triage guidelines. Fetches open issues labeled `Needs: Triage :mag:` via the `gh` CLI, classifies each (bug vs feature, product area, partner ask, repro quality, a11y), recommends label changes and area-owner assignment, and then applies the approved changes. Use this skill whenever the user asks to triage issues, run shield triage, go through the triage queue, process needs-triage, or any variation -- even if they don't mention "Fluent UI" or "GitHub" explicitly, since that's the project context here.
Visually verify a component by launching its Storybook story and taking a screenshot with playwright-cli. Use after making visual changes to a component.
Create a beachball change file for the current changes. Determines change type (patch/minor) and generates a description from the diff.
Run lint on affected packages, parse errors, and auto-fix common issues (design tokens, React.FC, SSR safety, import restrictions)
Find the matching Fluent UI design token for a hardcoded CSS value (color, spacing, font size, border radius, shadow)
| name | package-info |
| description | Quick lookup for a Fluent UI package — path, dependencies, owner team, Nx project details, and relevant docs |
| argument-hint | <package-name> |
| allowed-tools | Bash Read Grep Glob |
Get a comprehensive overview of the package $ARGUMENTS.
Resolve the package path. Map the name to a filesystem path:
react-button or @fluentui/react-button → packages/react-components/react-button/library/ (source) and stories/ (storybook) sub-packagesGet Nx project details:
yarn nx show project @fluentui/$ARGUMENTS --json 2>/dev/null || yarn nx show project $ARGUMENTS --json 2>/dev/null
Read the package.json for version, dependencies, and peer dependencies.
Check ownership by searching CODEOWNERS:
grep -i "$ARGUMENTS" CODEOWNERS
Summarize the component structure — list files under library/src/components/.
Check test coverage — does it have:
*.test.tsx)testing/isConformant.ts)stories/ package)Report in this format:
Package: @fluentui/<name>
Path: packages/react-components/<name>/library/
Version: x.y.z
Tier: 3 (Component) | 2 (Foundation) | 1 (Core)
Owner: <team from CODEOWNERS>
Dependencies: <list relevant @fluentui deps>
Components: <list exported components>
Tests: unit ✓/✗ | conformance ✓/✗ | stories ✓/✗
yarn nx run <project>:build # Build
yarn nx run <project>:test # Unit tests
yarn nx run <project>:lint # Lint
yarn nx run <project>:type-check # Type check
yarn nx run <project>:generate-api # Regenerate API docs (etc/*.api.md)