Skip to content

Conversation

@bennypowers
Copy link
Member

What I did

Enhanced inline documentation for rh-button component focus() method to improve developer experience and API understanding, following the documentation standards.

Testing Instructions

⚠️ Important: LLM-Assisted Documentation

This documentation was created with assistance from LLM tools. Reviewers MUST carefully verify the semantic meaning and design system accuracy of all new documentation.

Please check that the enhanced documentation:

  1. Accurately describes the semantic meaning of the focus() method
  2. Provides meaningful guidance on when/why to use programmatic focus
  3. Aligns with accessibility best practices for focus management

Specific sections to review:

focus() method (lines 163-189)

  • Verify the explanation of moving focus to the internal button element is correct
  • Confirm usage guidelines (dynamic content changes, modal closures) are appropriate
  • Check that accessibility notes about user awareness and avoiding unexpected focus movement are accurate
  • Verify the code example demonstrates correct usage

Notes to Reviewers

Documentation Format

Following the project standard:

  • Method uses multi-line JSDoc with usage guidelines and examples
  • Includes accessibility considerations for focus management
  • Provides concrete use cases (modal closures, dynamic content)

Closes #2493

🤖 Generated with Claude Code

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 <[email protected]>
@changeset-bot
Copy link

changeset-bot bot commented Nov 12, 2025

⚠️ No Changeset found

Latest commit: 07b9a17

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@netlify
Copy link

netlify bot commented Nov 12, 2025

Deploy Preview for red-hat-design-system ready!

Name Link
🔨 Latest commit 07b9a17
🔍 Latest deploy log https://app.netlify.com/projects/red-hat-design-system/deploys/6914c9ca5234d300081f038b
😎 Deploy Preview https://deploy-preview-2742--red-hat-design-system.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions
Copy link
Contributor

Size Change: +389 B (+0.15%)

Total Size: 257 kB

Filename Size Change
./elements/rh-button/rh-button.js 3.73 kB +389 B (+11.66%) ⚠️
ℹ️ View Unchanged
Filename Size
./elements.js 611 B
./elements/rh-accordion/context.js 162 B
./elements/rh-accordion/rh-accordion-header.js 2.7 kB
./elements/rh-accordion/rh-accordion-panel.js 1.27 kB
./elements/rh-accordion/rh-accordion.js 3.35 kB
./elements/rh-alert/rh-alert.js 5.06 kB
./elements/rh-announcement/rh-announcement.js 2.17 kB
./elements/rh-audio-player/rh-audio-player-about.js 1.83 kB
./elements/rh-audio-player/rh-audio-player-rate-stepper.js 1.76 kB
./elements/rh-audio-player/rh-audio-player-scrolling-text-overflow.js 1.47 kB
./elements/rh-audio-player/rh-audio-player-subscribe.js 1.41 kB
./elements/rh-audio-player/rh-audio-player.js 12.4 kB
./elements/rh-audio-player/rh-cue.js 1.95 kB
./elements/rh-audio-player/rh-transcript.js 2.68 kB
./elements/rh-avatar/random-pattern-controller.js 2.72 kB
./elements/rh-avatar/rh-avatar.js 2.68 kB
./elements/rh-back-to-top/rh-back-to-top.js 1.98 kB
./elements/rh-badge/rh-badge.js 1.63 kB
./elements/rh-blockquote/rh-blockquote.js 1.38 kB
./elements/rh-breadcrumb/rh-breadcrumb.js 1.67 kB
./elements/rh-card/rh-card.js 3.12 kB
./elements/rh-chip/context.js 165 B
./elements/rh-chip/rh-chip-group.js 1.58 kB
./elements/rh-chip/rh-chip.js 2.06 kB
./elements/rh-code-block/prism.css.js 667 B
./elements/rh-code-block/prism.js 572 B
./elements/rh-code-block/rh-code-block.js 8.38 kB
./elements/rh-cta/rh-cta.js 3.71 kB
./elements/rh-dialog/rh-dialog.js 4.72 kB
./elements/rh-dialog/yt-api.js 617 B
./elements/rh-disclosure/rh-disclosure.js 2.52 kB
./elements/rh-footer/rh-footer-block.js 714 B
./elements/rh-footer/rh-footer-copyright.js 357 B
./elements/rh-footer/rh-footer-links.js 1.1 kB
./elements/rh-footer/rh-footer-social-link.js 1.04 kB
./elements/rh-footer/rh-footer-universal.js 4 kB
./elements/rh-footer/rh-footer.js 4.67 kB
./elements/rh-health-index/rh-health-index.js 2.12 kB
./elements/rh-icon/rh-icon.js 2.49 kB
./elements/rh-icon/ssr.js 181 B
./elements/rh-jump-links/context.js 179 B
./elements/rh-jump-links/rh-jump-link.js 1.49 kB
./elements/rh-jump-links/rh-jump-links-list.js 1.17 kB
./elements/rh-jump-links/rh-jump-links.js 2.37 kB
./elements/rh-menu-dropdown/rh-menu-dropdown.js 4.12 kB
./elements/rh-menu/rh-menu-item-group.js 614 B
./elements/rh-menu/rh-menu-item.js 2.2 kB
./elements/rh-menu/rh-menu.js 1.6 kB
./elements/rh-navigation-link/rh-navigation-link.js 1.87 kB
./elements/rh-navigation-primary/context.js 176 B
./elements/rh-navigation-primary/rh-navigation-primary-item-menu.js 1.03 kB
./elements/rh-navigation-primary/rh-navigation-primary-item.js 3.44 kB
./elements/rh-navigation-primary/rh-navigation-primary-overlay.js 534 B
./elements/rh-navigation-primary/rh-navigation-primary.js 7.63 kB
./elements/rh-navigation-secondary/rh-navigation-secondary-dropdown.js 2.57 kB
./elements/rh-navigation-secondary/rh-navigation-secondary-menu-section.js 1.31 kB
./elements/rh-navigation-secondary/rh-navigation-secondary-menu.js 1.68 kB
./elements/rh-navigation-secondary/rh-navigation-secondary-overlay.js 562 B
./elements/rh-navigation-secondary/rh-navigation-secondary.js 5.23 kB
./elements/rh-navigation-secondary/test/fixtures.js 769 B
./elements/rh-navigation-vertical/rh-navigation-vertical-list.js 2.24 kB
./elements/rh-navigation-vertical/rh-navigation-vertical.js 1.54 kB
./elements/rh-pagination/rh-pagination.js 5.69 kB
./elements/rh-progress-stepper/context.js 187 B
./elements/rh-progress-stepper/rh-progress-step.js 3.02 kB
./elements/rh-progress-stepper/rh-progress-stepper.js 4.78 kB
./elements/rh-scheme-toggle/rh-scheme-toggle.js 1.91 kB
./elements/rh-site-status/rh-site-status.js 2.44 kB
./elements/rh-skeleton/rh-skeleton.js 677 B
./elements/rh-skip-link/rh-skip-link.js 1.33 kB
./elements/rh-spinner/rh-spinner.js 1.31 kB
./elements/rh-stat/rh-stat.js 2.05 kB
./elements/rh-subnav/rh-subnav.js 2.98 kB
./elements/rh-surface/rh-surface.js 911 B
./elements/rh-surface/test/elements.js 763 B
./elements/rh-switch/rh-switch.js 2.89 kB
./elements/rh-table/rh-sort-button.js 1.39 kB
./elements/rh-table/rh-table.js 2.81 kB
./elements/rh-tabs/context.js 226 B
./elements/rh-tabs/rh-tab-panel.js 1 kB
./elements/rh-tabs/rh-tab.js 2.83 kB
./elements/rh-tabs/rh-tabs.js 3.64 kB
./elements/rh-tag/rh-tag.js 2.96 kB
./elements/rh-tile/rh-tile-group.js 1.78 kB
./elements/rh-tile/rh-tile.js 4.7 kB
./elements/rh-timestamp/rh-timestamp.js 991 B
./elements/rh-tooltip/rh-tooltip.js 3.15 kB
./elements/rh-video-embed/rh-video-embed.js 4.64 kB
./lib/color-palettes.js 851 B
./lib/context/headings/consumer.js 593 B
./lib/context/headings/provider.js 1.2 kB
./lib/elements/rh-context-demo/rh-context-demo.js 1.16 kB
./lib/elements/rh-context-picker/rh-context-picker.js 2.18 kB
./lib/environment.js 194 B
./lib/functions.js 175 B
./lib/I18nController.js 1.37 kB
./lib/ScreenSizeController.js 876 B
./lib/ssr-controller.js 201 B
./lib/themable.js 549 B
./react/rh-accordion/rh-accordion-header.js 199 B
./react/rh-accordion/rh-accordion-panel.js 185 B
./react/rh-accordion/rh-accordion.js 202 B
./react/rh-alert/rh-alert.js 184 B
./react/rh-announcement/rh-announcement.js 189 B
./react/rh-audio-player/rh-audio-player-about.js 191 B
./react/rh-audio-player/rh-audio-player-rate-stepper.js 199 B
./react/rh-audio-player/rh-audio-player-scrolling-text-overflow.js 214 B
./react/rh-audio-player/rh-audio-player-subscribe.js 196 B
./react/rh-audio-player/rh-audio-player.js 183 B
./react/rh-audio-player/rh-cue.js 195 B
./react/rh-audio-player/rh-transcript.js 187 B
./react/rh-avatar/rh-avatar.js 173 B
./react/rh-back-to-top/rh-back-to-top.js 183 B
./react/rh-badge/rh-badge.js 174 B
./react/rh-blockquote/rh-blockquote.js 179 B
./react/rh-breadcrumb/rh-breadcrumb.js 179 B
./react/rh-button/rh-button.js 174 B
./react/rh-card/rh-card.js 172 B
./react/rh-chip/rh-chip-group.js 182 B
./react/rh-chip/rh-chip.js 187 B
./react/rh-code-block/rh-code-block.js 193 B
./react/rh-cta/rh-cta.js 170 B
./react/rh-dialog/rh-dialog.js 203 B
./react/rh-disclosure/rh-disclosure.js 192 B
./react/rh-footer/rh-footer-block.js 184 B
./react/rh-footer/rh-footer-copyright.js 187 B
./react/rh-footer/rh-footer-links.js 185 B
./react/rh-footer/rh-footer-social-link.js 193 B
./react/rh-footer/rh-footer-universal.js 188 B
./react/rh-footer/rh-footer.js 174 B
./react/rh-health-index/rh-health-index.js 184 B
./react/rh-icon/rh-icon.js 195 B
./react/rh-jump-links/rh-jump-link.js 183 B
./react/rh-jump-links/rh-jump-links-list.js 189 B
./react/rh-jump-links/rh-jump-links.js 195 B
./react/rh-menu-dropdown/rh-menu-dropdown.js 185 B
./react/rh-menu/rh-menu-item-group.js 190 B
./react/rh-menu/rh-menu-item.js 181 B
./react/rh-menu/rh-menu.js 173 B
./react/rh-navigation-link/rh-navigation-link.js 186 B
./react/rh-navigation-primary/rh-navigation-primary-item-menu.js 205 B
./react/rh-navigation-primary/rh-navigation-primary-item.js 198 B
./react/rh-navigation-primary/rh-navigation-primary-overlay.js 199 B
./react/rh-navigation-primary/rh-navigation-primary.js 189 B
./react/rh-navigation-secondary/rh-navigation-secondary-dropdown.js 217 B
./react/rh-navigation-secondary/rh-navigation-secondary-menu-section.js 205 B
./react/rh-navigation-secondary/rh-navigation-secondary-menu.js 199 B
./react/rh-navigation-secondary/rh-navigation-secondary-overlay.js 201 B
./react/rh-navigation-secondary/rh-navigation-secondary.js 213 B
./react/rh-navigation-vertical/rh-navigation-vertical-list.js 198 B
./react/rh-navigation-vertical/rh-navigation-vertical.js 189 B
./react/rh-pagination/rh-pagination.js 178 B
./react/rh-progress-stepper/rh-progress-step.js 196 B
./react/rh-progress-stepper/rh-progress-stepper.js 186 B
./react/rh-scheme-toggle/rh-scheme-toggle.js 183 B
./react/rh-site-status/rh-site-status.js 181 B
./react/rh-skeleton/rh-skeleton.js 176 B
./react/rh-skip-link/rh-skip-link.js 181 B
./react/rh-spinner/rh-spinner.js 175 B
./react/rh-stat/rh-stat.js 171 B
./react/rh-subnav/rh-subnav.js 175 B
./react/rh-surface/rh-surface.js 175 B
./react/rh-switch/rh-switch.js 174 B
./react/rh-table/rh-sort-button.js 200 B
./react/rh-table/rh-table.js 174 B
./react/rh-tabs/rh-tab-panel.js 181 B
./react/rh-tabs/rh-tab.js 187 B
./react/rh-tabs/rh-tabs.js 174 B
./react/rh-tag/rh-tag.js 182 B
./react/rh-tile/rh-tile-group.js 183 B
./react/rh-tile/rh-tile.js 181 B
./react/rh-timestamp/rh-timestamp.js 176 B
./react/rh-tooltip/rh-tooltip.js 175 B
./react/rh-video-embed/rh-video-embed.js 227 B
./uxdot/ssr-failure-recoverable.js 581 B
./uxdot/uxdot-best-practice.js 812 B
./uxdot/uxdot-copy-button.js 1.24 kB
./uxdot/uxdot-copy-permalink.js 1.14 kB
./uxdot/uxdot-demo.js 2.74 kB
./uxdot/uxdot-example.js 1.14 kB
./uxdot/uxdot-feedback.js 882 B
./uxdot/uxdot-header.js 886 B
./uxdot/uxdot-knob-attribute.js 3.63 kB
./uxdot/uxdot-masthead.js 1.36 kB
./uxdot/uxdot-pattern-ssr-controller-client.js 615 B
./uxdot/uxdot-pattern-ssr-controller-server.js 1.72 kB
./uxdot/uxdot-pattern-ssr-controller.js 213 B
./uxdot/uxdot-pattern.js 2.38 kB
./uxdot/uxdot-repo-status-checklist.js 1.39 kB
./uxdot/uxdot-repo-status-list.js 1.24 kB
./uxdot/uxdot-repo.js 867 B
./uxdot/uxdot-sidenav.js 2.04 kB
./uxdot/uxdot-spacer-tokens-table.js 2.46 kB
./uxdot/uxdot-toc.js 1.8 kB

compressed-size-action

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

Labels

None yet

Projects

Status: No status

Development

Successfully merging this pull request may close these issues.

[docs] <rh-button> missing documentation

2 participants