Skip to content

Commit

Permalink
style: rename
Browse files Browse the repository at this point in the history
  • Loading branch information
bvandercar-vt committed Sep 11, 2024
1 parent 44f15ee commit c5acb3e
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 6 deletions.
6 changes: 3 additions & 3 deletions src/DataRenderer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ export function getButtonElements(outerElement: HTMLDivElement) {
return Array.from(outerElement.querySelectorAll<HTMLElement>('[role=button]'));
}

export function setButtonTabIndex(buttonElements: HTMLElement[], index: number) {
export function setTabbableButton(buttonElements: HTMLElement[], index: number) {
buttonElements.forEach((buttonElement, i) => {
buttonElement.tabIndex = i === index ? 0 : -1;
});
Expand Down Expand Up @@ -116,7 +116,7 @@ function ExpandableObject({
if (currentIndex < 0) return;

const nextIndex = (currentIndex + direction + buttonElements.length) % buttonElements.length; // auto-wrap
setButtonTabIndex(buttonElements, nextIndex);
setTabbableButton(buttonElements, nextIndex);
buttonElements[nextIndex].focus();
}
};
Expand All @@ -129,7 +129,7 @@ function ExpandableObject({
if (!buttonElement) return;
const buttonElements = getButtonElements(outerElement);
const currentIndex = buttonElements.indexOf(buttonElement);
setButtonTabIndex(buttonElements, currentIndex);
setTabbableButton(buttonElements, currentIndex);
};

return (
Expand Down
6 changes: 3 additions & 3 deletions src/index.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import * as React from 'react';
import DataRender, { getButtonElements, setButtonTabIndex, StyleProps } from './DataRenderer';
import DataRender, { getButtonElements, setTabbableButton, StyleProps } from './DataRenderer';
import styles from './styles.module.css';

export interface Props extends React.AriaAttributes {
Expand Down Expand Up @@ -59,12 +59,12 @@ export const JsonView = ({
}: Props) => {
const outerRef = React.useRef<HTMLDivElement>(null);

// on first render, set first button to tabIndex=0.
React.useEffect(() => {
const outerElement = outerRef.current;
if (!outerElement) return;
const buttonElements = getButtonElements(outerElement);
// on first render, set first button to tabIndex=0.
setButtonTabIndex(buttonElements, 0);
setTabbableButton(buttonElements, 0);
}, [outerRef]);

return (
Expand Down

0 comments on commit c5acb3e

Please sign in to comment.