From 07b9a177877f24a3a4855f8c4042cc3a4f58dad4 Mon Sep 17 00:00:00 2001 From: Benny Powers Date: Wed, 12 Nov 2025 19:53:35 +0200 Subject: [PATCH] docs(button): enhance inline documentation MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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 --- elements/rh-button/rh-button.ts | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/elements/rh-button/rh-button.ts b/elements/rh-button/rh-button.ts index 78f05c5351e..3e0d3c93a4f 100644 --- a/elements/rh-button/rh-button.ts +++ b/elements/rh-button/rh-button.ts @@ -160,6 +160,30 @@ export class RhButton extends LitElement { } } + /** + * Programmatically moves focus to the button element. + * + * This method focuses the internal button element, making it the active element + * on the page. Useful for managing focus flow after dynamic content changes or + * user interactions. + * + * ## Usage guidelines + * - Use to direct user attention after completing an action + * - Helpful for accessibility when managing focus programmatically + * - Called automatically when the button is the target of a focus navigation + * - Can be used after modals close to return focus to a trigger button + * + * ## Accessibility + * - When focus is moved programmatically, ensure users are aware of the change + * - Avoid moving focus unexpectedly as it can disorient users + * - Moving focus to a button should be deliberate and serve user needs + * + * @example + * ```js + * const button = document.querySelector('rh-button'); + * button.focus(); + * ``` + */ focus() { this._button?.focus(); }