Skip to content

chore: Update agent skills - #3400

Open
LinKCoding wants to merge 13 commits into
mainfrom
kl-gmt-1676-gamut-skills
Open

chore: Update agent skills #3400
LinKCoding wants to merge 13 commits into
mainfrom
kl-gmt-1676-gamut-skills

Conversation

@LinKCoding

@LinKCoding LinKCoding commented Jul 22, 2026

Copy link
Copy Markdown
Contributor

Overview

Improves the Gamut agent-tools skills (the SKILL.md guides that drive AI-assisted code review and development against the Gamut design system) — adding new skills, fixing stale documentation, and closing gaps found while eval-testing the existing skills against real PR feedback.

  • Adds Check 3d (styled(GamutComponent) bypassing system props) to gamut-review, including Step 4 (detects padding/margin/etc. used instead of their scale-aware alias like p/m inside css(), which silently skips token/rem conversion) and Step 5 (<Box display="flex">/<Box display="grid"> → recommends FlexBox/GridBox instead)
  • Adds Check 6 (bespoke component duplication) to gamut-review — a heuristic, always-⚠ check for hand-rolled widgets that duplicate an existing Gamut component
  • Adds gamut-component-first/SKILL.md (new) — a decision table and signals for checking existing Gamut components before building bespoke ones
  • Adds gamut-modal/SKILL.md (new) — Modal vs Dialog composition guidance, dismiss/focus-trap patterns, and stacking order
  • Adds gamut-z-index/SKILL.md (new) — z-index token scale and a stacking-component reference, cross-referenced with gamut-modal
  • Updates gamut-system-props/SKILL.md and gamut-style-utilities/SKILL.md with the styled()-wrapper anti-pattern, correct background gradient-prop usage, semantic vs. fixed color-token guidance, and a scale-verification table
  • Adds a Radio/RadioGroup section to gamut-forms/SKILL.md
  • Fixes stale "light mode only" claims in DESIGN.LXStudio.md and DESIGN.Percipio.md — both themes actually inherit dark mode unmodified from Core since their theme definitions only override light
  • Adds cross-references to the new gamut-modal/gamut-z-index skills from gamut-accessibility, gamut-datalist, gamut-datatable, and gamut-menu
  • Adds evals/evals.json test cases for gamut-review, gamut-system-props, gamut-style-utilities, and gamut-component-first used to benchmark these skills

PR Checklist

  • Related to designs:
  • Related to JIRA ticket: GMT-1676
  • Version plan added/updated (or not needed)
  • I have run this code to verify it works
  • This PR includes unit tests for the code change
  • This PR includes testing instructions tests for the code change
  • The alpha package of this PR is passing end-to-end tests in all relevant Codecademy repositories

Testing Instructions

Don't make me tap the sign.

  1. Check over the JIRA ticket
  2. See that the skills have been updated to address the gaps
  3. Check over skill changes in general and see that they make sense
  4. (Optionally) check against the latest iterations and evaluations to see how these skills perform
  5. ...
  6. Finish and do a celebratory dance

PR Links and Envs

N/A

@nx-cloud

nx-cloud Bot commented Jul 22, 2026

Copy link
Copy Markdown

View your CI Pipeline Execution ↗ for commit 4d5968d


☁️ Nx Cloud last updated this comment at 2026-07-28 20:26:27 UTC

@LinKCoding LinKCoding changed the title address gamut-review chore: Update agent skills Jul 24, 2026
@codecov

codecov Bot commented Jul 24, 2026

Copy link
Copy Markdown

⚠️ JUnit XML file not found

The CLI was unable to find any JUnit XML files to upload.
For more help, visit our troubleshooting guide.

@codecademydev

Copy link
Copy Markdown
Collaborator

📬 Published Alpha Packages:

Package Version npm Diff
@codecademy/gamut 72.3.1-alpha.f273fd.0 npm diff
@codecademy/gamut-icons 9.57.11-alpha.f273fd.0 npm diff
@codecademy/gamut-illustrations 0.58.16-alpha.f273fd.0 npm diff
@codecademy/gamut-kit 3.0.11-alpha.f273fd.0 npm diff
@codecademy/gamut-patterns 0.10.35-alpha.f273fd.0 npm diff
@codecademy/gamut-styles 20.0.3-alpha.f273fd.0 npm diff
@codecademy/gamut-tests 6.0.6-alpha.f273fd.0 npm diff
@codecademy/variance 0.26.2-alpha.f273fd.0 npm diff
eslint-plugin-gamut 2.4.4-alpha.f273fd.0 npm diff

@github-actions

Copy link
Copy Markdown
Contributor

Comment thread .eslintignore
**/code-connect/**
packages/code-connect
.nx
packages/gamut/agent-tools/skills/*-workspace

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If this is too broad, and we'd rather add ignore comments for the examples created, I can do that instead.

@LinKCoding
LinKCoding marked this pull request as ready for review July 29, 2026 14:13
@LinKCoding
LinKCoding requested a review from a team as a code owner July 29, 2026 14:13

@dreamwasp dreamwasp left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks awesome minus the tiniest nit, wanna talk more about iteration tracking but we'll do that not on GH 🔥

| Progress bar / radial/circular progress | `ProgressBar`, `RadialProgress` | Storybook — no dedicated skill yet |
| Loading state / skeleton placeholder | `Loading`, `FeatureShimmer` | Storybook — no dedicated skill yet |
| Bulk-comparison table | `DataTable` | [`gamut-datatable`](../gamut-datatable/SKILL.md) |
| Item list with expand/select | `DataList` | [`gamut-datalist`](../gamut-datalist/SKILL.md) |

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this could be list or datalist, bulk comparison i'd say DataTable and DataList

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants