Menu
Quick lookup for a Fluent UI package — path, dependencies, owner team, Nx project details, and relevant docs
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
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)