docs(button): enhance inline documentation#2742
Open
bennypowers wants to merge 6 commits intomainfrom
Open
Conversation
Enhanced inline documentation for rh-button component to improve developer experience and API understanding: - Added comprehensive JSDoc for `focus()` method explaining its purpose for programmatically moving focus to the button element - Included usage guidelines for managing focus flow after dynamic content changes, user interactions, and modal closures - Added accessibility notes about ensuring users are aware of focus changes and avoiding unexpected focus movement All documentation includes design system context about accessibility requirements and usage best practices for focus management. Closes #2493 🤖 Generated with [Claude Code](https://claude.com/claude-code) Assisted-By: Claude <noreply@anthropic.com>
|
✅ Deploy Preview for red-hat-design-system ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Contributor
|
Size Change: +775 B (+0.3%) Total Size: 261 kB
ℹ️ View Unchanged
|
Update element, attribute, slot, event, and CSS property documentation. Add demo description .md files. Use RFC 2119 keywords, include ARIA/accessibility notes, and document event detail shapes. Assisted-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Contributor
Documentation Health
|
| Category | Score | |
|---|---|---|
| Element description | 25/25 | ✅ |
| Attribute documentation | 20/20 | ✅ |
| Slot documentation | 12/15 | ✅ |
| CSS documentation | 9/15 | |
| Event documentation | 15/15 | ✅ |
| Demos | 10/10 | ✅ |
Recommendations:
- rh-button: reference design tokens or theme considerations in CSS descriptions (CSS documentation, +4 pts)
- rh-button: describe expected content types for slots (e.g., 'inline text', 'block elements') (Slot documentation, +3 pts)
- rh-button: add descriptions to all CSS custom properties (CSS documentation, +2 pts)
Replace companion .md files with <meta itemprop="description"> tags in demo HTML files per CEM demo documentation guidelines. Assisted-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Fix empty-line-before-comment, max-line-length, and formatting issues in CSS custom property documentation comments. Assisted-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add brief comments explaining what each design token controls within this component's context. Assisted-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What I did
Enhanced inline documentation for
rh-buttoncomponent to improve developer experience and API understanding.👉 Deploy Preview 👈
This documentation was created with assistance from LLM tools. Reviewers MUST carefully verify the semantic meaning and design system accuracy of all new documentation.
dangerboolean combines withvariantbut onlyprimaryandsecondaryhave explicit danger CSS rules. A designer should confirm whetherdanger+tertiaryis an unsupported combination and whether it should produce a console warning.#a30000,#ff7468,#c9190b,#fe5142). A designer should confirm these are intentional or whether design tokens should be created for them.linkvariant is defined in CSS but not included in the TypeScriptvarianttype union. A designer should confirm whetherlinkis a supported variant or deprecated, and update the type accordingly.translate: 10%hack for perceptual centering. A designer should confirm this offset is correct across icon sizes and whether it should be a design token.@firesevent for button clicks. A designer should evaluate whether a custom event (beyond the nativeclick) is needed for framework integrations that want detail about the button's variant, type, or form association.