docs: improve S2 agent skill

[reidbarber]

This PR does the following:

1. Adds additional content to the S2 agent skill's SKILL.md for common mistakes observed when agents use the current skill. It is important that these are surfaced up to SKILL.md instead of being only in the reference files.
2. Adds a "Component Decision Tree" reference file that agents can consult when requirements don't mention a specific component by name.

✅ Pull Request Checklist:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
• Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

Install the skill:

npx skills add https://d1pzu54gtk2aed.cloudfront.net/pr/41efdfb5f8076ba700d1fc31482e18e6db8d483f/ --skill react-spectrum-s2

and invoke it when upgrading your project.

🧢 Your Project:

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[rspbot]

Build successful! 🎉

• View the storybook
• View the S2 storybook
• View the S2 docs
• View the React Aria docs

[snowystinger]

heh, this looks like my prompts where the result came out the best in terms of the actual code generated, should help a lot to have this baked in by default

i like the decision tree stuff as well, it mirrors some of the prompt stuff i was trying to do as well, though way more involved and thought through :)

[snowystinger]

one of the rules I had to double down on and keep reminding the agent was, do not concatenate the classnames returned by a style macro call, use the dynamic and nested syntax if runtime decisions need to be in the style

i never got into mergeStyles because nothing i was doing needed it, but that could also be mentioned potentially

[snowystinger]

I'm not sure how to also include that things like ...focusRing inside a style macro call require that the style macro be called with renderProps usually, but that was something it choked on a bunch

[reidbarber]

These are great ideas. I'll make a note to add these as follow-up. I can probably just include them in #9886

[snowystinger]

wonder how well this will work given the token size stuff and it not being able to count r's in strawberry

[reidbarber]

That's a good question. Just gave it a try and it seems to work:

User: What are the render props on @packages/react-aria-components/src/Button.tsx that start with is or allows

Agent: In Button.tsx, render props come from ButtonRenderProps, which is what className / children receive via RenderProps<ButtonRenderProps, 'button'>.

Starting with is

• isHovered
• isPressed
• isFocused
• isFocusVisible
• isDisabled
• isPending

Starting with allows

• None — ButtonRenderProps does not include any allows* fields.
  ...