marigold

Write component documentation for the Marigold Design System in MDX format with interactive demo files and anatomy diagrams. Use when the user asks to: (1) Document a new component, (2) Write or update component docs, (3) Create demo files, (4) Create anatomy diagrams, (5) Add usage examples or guidelines for components.

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.

Create a GitHub pull request for the Marigold Design System repo that follows the project's PR template and Conventional Commits title convention with a DST Jira scope (e.g. `feat(DST-1234): ...`). Use whenever the user asks to "create a PR", "open a pull request", "submit this for review", "ship this branch", or types `/create-pr`. Inspects the branch diff to infer change type, extracts the Jira ticket from the branch name or commit history, auto-fills the PR body, and auto-ticks checklist items it can verify (changeset, stories, tests, docs).

Review a GitHub PR for Marigold Design System code quality, TypeScript standards, React best practices, and accessibility compliance. Optionally links Jira tickets for context. Use when asked to "review PR", "check PR", or "review pull request".

Testing code changes to ensure code quality after implementing changes in Typescript files (*.test.tsx, *.stories.tsx). Use this skill after changing Typescript files, to ensure that your code is well tested and follows the best practices.

Guidance on how to ensure code quality after implementing changes in Typescript files (*.ts, *.tsx). Use this skill after changing Typescript files, to ensure that your code is well formatted and follows the best practices.