[georgewrmarshall]

Description

Context Forge is down, and Storybook MCP goes down with it. The Extension ui-development overlay made Storybook MCP its required first step, so it is broken right now. This PR makes the Extension skill and the agentic design system strategy work with no MCP server, and keeps Storybook MCP as an optional extra for when it comes back.

Mobile is handled in #212, which also removes the Storybook MCP pointer from content-guidelines. The two PRs are independent and merge cleanly in either order.

Synced to

Package	Version	Extension main pin
@metamask/design-system-react	0.49.0	^0.47.0 (0.47.x)
@metamask/design-system-tailwind-preset	0.15.0	^0.15.0
@metamask/design-tokens	12.0.0	^12.0.0
@metamask/design-system-shared	0.43.0	^0.41.0

MMDS release/tag: v77.0.0 (2026-10-28). I checked against the published tarballs and the source at that tag. I also diffed 0.47.0 against 0.49.0: the exported components are identical. The only API change Extension code would hit is the breaking TextFieldSearch.inputAriaLabel in 0.49.0, which the reference calls out.

Changes per file

ui/ui-development, repos/metamask-extension.md

• Replaces "Required Storybook MCP Workflow" and the separate fallback section with one ordered "Where current guidance comes from" list. The order is: installed package types, then the README at the release tag (stable blob/v77.0.0 URL pattern), then the pinned reference, then the Extension Tailwind config, then Extension usage. Storybook MCP (storybook-broker-mcp) comes last, as optional: use it if it responds, never block on it, and don't configure it.
• Create and Review workflows now read installed types and the release-tag README instead of querying Storybook.
• Names the current deprecations (ButtonHero → Button, ButtonFilter, FontFamily.Accent) and the legacy ui/components/component-library → MMDS direction, with a link to the React MIGRATION.md.
• Adds durable constraints for typography (Text variants, Hero only for the primary amount or through MarketingMomentTitle) and accessible names (ButtonIcon ariaLabel, TextFieldSearch inputAriaLabel from 0.49.0).

ui/ui-development, new references/mmds-react.md

• A pinned quick reference: synced versions and the 0.47 → 0.49 differences, export inventory by area, deprecations, key props for the ~20 most-used components (Box, Text, Button, ButtonIcon, the Modal family, Popover, TextField/FormTextField/TextFieldSearch, BannerAlert, Toast, ...), and Tailwind preset usage (token class names, paired s-/md:l- typography classes, no default palette). It also covers the full web type scale (HTML tag, both breakpoints, weight), web hero typography (Bold-only @font-face, no locale gate in Extension so the browser falls back per character, AmountDisplayLg at 60px for 768px and up, skeleton h-14 md:h-[75px]), and a do/don't table.

ui/knowledge/agentic-design-system-strategy.md

• The baseline delivery is now the installed package plus release-tag READMEs plus the consumer Tailwind config, with no MCP needed. Storybook MCP is described as optional, because it depends on Context Forge.
• Updates the principles: skills must work with no MCP server, and they may carry a small release-pinned reference (versions, inventory, key props, deprecations) that names its versions and defers to the installed package. Full READMEs still are not copied. When a README and the types disagree, the types win.

CHANGELOG.md: one entry under Unreleased / Changed. It sits at the end of the list so it doesn't conflict with #212.

Other skills that pointed at Storybook MCP or Context Forge: ui/content-guidelines is fixed in #212. A repo-wide search found no other skill that requires Storybook MCP or Context Forge. testing/mobile-testing says "check Storybook" for local stories, which doesn't involve MCP, so I left it alone.

Things I wasn't sure about

1. ButtonFilter has no React replacement. The React 0.49.0 JSDoc says "Use FilterButton instead", but @metamask/design-system-react doesn't export FilterButton; only React Native has it. The skill says to keep existing usage and record a gap for new UI. This probably needs an MMDS fix.
2. FontFamily.Accent / font-accent are still exported in 0.49.0 and preset 0.15.0, but removed on main (#1645). The skill says not to use them.
3. The Extension pin lags (^0.47.0 vs 0.49.0). The reference is written for 0.49.0 and lists the deltas. On 0.47.x, TextFieldSearch has no inputAriaLabel, so the skill says to use inputProps['aria-label'] there.
4. The 60px AmountDisplayLg on full-screen web (768px and up) is what the tokens produce. The attached draft guideline lists it as an open design question, so the skill says to confirm it with design.
5. Hosted Storybook (metamask.github.io/metamask-design-system) is public and doesn't depend on Context Forge, but it builds from main. I listed it only as optional, with that caveat.
6. Strategy change: moving from "no static inventories in skills" to "small release-pinned reference" means someone has to refresh references/mmds-*.md on each MMDS release. An owner or automation for that is worth agreeing on.
7. The preset README's example (font-s-heading-lg sm:font-l-heading-lg) doesn't match what the preset generates (text-s-heading-lg ... md:text-l-heading-lg). The skill uses the generated names.

Type of Change

• New skill
• Skill improvement/update
• Bug fix
• Documentation update
• Other (please describe):

Skill Details (if adding a new skill)

N/A. This updates the existing ui/ui-development Extension overlay and the ui domain knowledge file.

Provider Name: N/A
Skill Name: N/A
Brief Description: N/A

Checklist

• I have read the CONTRIBUTING.md guidelines
• My skill follows the SKILL_TEMPLATE.md format
• I have tested this skill with an AI agent
• My skill does not contain any secrets, private keys, or sensitive data
• I have added appropriate documentation
• My changes don't break existing skills

Testing

• yarn test: 73/73 pass
• yarn lint (changelog): passes
• node .github/scripts/lint-skill-entry.mjs <changed files> (what CI runs): 0 errors, 1 knowledge file checked. The 2 "missing recommended section" warnings on ui-development were already on main. A full yarn audit:skills still reports 1 error in the unrelated typescript/tsc-blindspots skill, which is also on main.
• ./tools/install --repo metamask-extension --domain ui into a scratch repo installs mms-ui-development with references/mmds-react.md. The merged SKILL.md mentions Storybook MCP only as optional.
• Every non-template URL returns 200, except npmjs.com, which returns 403 to scripted requests.
• I merged this branch with docs(ui): sync Mobile UI skills to MMDS RN 0.54.0 and drop the Storybook MCP dependency #212 locally: no conflicts, and lint passes.
• I have not run a live agent session against Extension with these skills.

Additional Context

Extension facts were checked against MetaMask/metamask-extension main: package.json pins, tailwind.config.js, ui/css/utilities/fonts.scss (the Grotzec @font-face), and ui/components/ui/marketing-moment-title.