Menu
Run lint on affected packages, parse errors, and auto-fix common issues (design tokens, React.FC, SSR safety, import restrictions)
| name | lint-check |
| description | Run lint on affected packages, parse errors, and auto-fix common issues (design tokens, React.FC, SSR safety, import restrictions) |
| disable-model-invocation | true |
| argument-hint | [package-name] |
| allowed-tools | Bash Read Edit Grep Glob |
Run linting and fix common issues for Fluent UI packages.
Determine scope. If $ARGUMENTS is provided, lint that specific package. Otherwise, lint affected packages:
# Specific package
yarn nx run @fluentui/$ARGUMENTS:lint
# Or affected packages
yarn nx affected -t lint
Parse the output and categorize errors by the custom Fluent UI ESLint rules:
| Rule | What it catches | How to fix |
|---|---|---|
@fluentui/ban-context-export | Context exported from wrong layer | Move to react-shared-contexts package |
@fluentui/ban-instanceof-html-element | instanceof HTMLElement (breaks iframes) | Use element.tagName or feature detection |
@fluentui/no-global-react | React.FC, React.useState etc. | Use named imports: import { useState } from 'react' |
@fluentui/no-restricted-imports | Banned import paths | Use the allowed import path from the error message |
@fluentui/no-context-default-value | Context created without undefined default | Use createContext(undefined) and add a guard hook |
Auto-fix any issues found by editing the source files directly. For each fix:
Report a summary of what was found and fixed.
packages/eslint-plugin/src/rules/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.
Quick lookup for a Fluent UI package — path, dependencies, owner team, Nx project details, and relevant docs
Find the matching Fluent UI design token for a hardcoded CSS value (color, spacing, font size, border radius, shadow)