Prepare for switching AccessibleButton and derivatives to forwardRef (#12072)
* Improve AccessibleButton props & docs Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Improve AccessibleTooltipButton props docs Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Simplify roving tab index hook usage Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Ditch RefObject type casts Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Convert AccessibleTooltipButton to a Functional Component Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
parent
2212fbadd0
commit
bf61d93bf4
13 changed files with 140 additions and 103 deletions
|
@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
|
|||
limitations under the License.
|
||||
*/
|
||||
|
||||
import React, { PropsWithChildren, useRef } from "react";
|
||||
import React, { PropsWithChildren } from "react";
|
||||
import { User } from "matrix-js-sdk/src/matrix";
|
||||
|
||||
import ReadReceiptMarker, { IReadReceiptInfo } from "./ReadReceiptMarker";
|
||||
|
@ -284,8 +284,7 @@ interface ISectionHeaderProps {
|
|||
}
|
||||
|
||||
function SectionHeader({ className, children }: PropsWithChildren<ISectionHeaderProps>): JSX.Element {
|
||||
const ref = useRef<HTMLHeadingElement>(null);
|
||||
const [onFocus] = useRovingTabIndex(ref);
|
||||
const [onFocus, , ref] = useRovingTabIndex<HTMLHeadingElement>();
|
||||
|
||||
return (
|
||||
<h3 className={className} role="menuitem" onFocus={onFocus} tabIndex={-1} ref={ref}>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue