diff --git a/src/AddSelect/List/List.js b/src/AddSelect/List/List.js index dc65286..1ba665e 100644 --- a/src/AddSelect/List/List.js +++ b/src/AddSelect/List/List.js @@ -9,7 +9,11 @@ const List = ({ }) => { const [focus, setFocus] = useFocus(entries.length); return ( -
+
{entries.map((guid, index) => { const entry = data[guid]; return ( @@ -18,6 +22,7 @@ const List = ({ setFocus={setFocus} index={index} focus={focus === index} + setSize={entries.length} {...entry} {...rest} /> diff --git a/src/AddSelect/Row/Row.js b/src/AddSelect/Row/Row.js index 1216602..1e5e54b 100644 --- a/src/AddSelect/Row/Row.js +++ b/src/AddSelect/Row/Row.js @@ -18,6 +18,8 @@ const Row = ({ index, setFocus, parentId, + breadcrumbLevel, + setSize, }) => { const ref = useRef(null); @@ -57,8 +59,16 @@ const Row = ({ onKeyDown={onSelectKeyDown} tabIndex={focus ? 0 : -1} ref={ref} + role="row" + aria-level={breadcrumbLevel} + aria-setsize={setSize} + aria-posinset={index + 1} + aria-selected={isSelected} > -
+
{isSelected ? ( ) : ( @@ -71,6 +81,8 @@ const Row = ({ diff --git a/src/App.js b/src/App.js index a89a050..a3077b9 100644 --- a/src/App.js +++ b/src/App.js @@ -67,6 +67,7 @@ const App = () => { selected={selected} setSelected={setSelected} parentHandler={parentHandler} + breadcrumbLevel={breadcrumbs.length} />