message: fix(accessibility): add aria-current to active item; fixes
diff: @@ -34,15 +34,19 @@ const TOCDesktop = ({ menuItems, selectedId }) => {
  const renderMenuItems = (items, activeId) => {
  return items.map((item, index) => {
  if (item && item.id !== 'menuLabel') {
  + const isActive = isActiveItem(activeId, item.id);
  return (
  <li
  key={index}
  data-autoid={`${stablePrefix}--tableofcontents__desktop__item-${item.id}`}
  - className={classNames(
  - `${prefix}--tableofcontents__desktop__item`,
  - setActiveClass(activeId, item.id)
  - )}>
  - <a onClick={e => handleOnClick(e, item.id)} href={`#${item.id}`}>
  + className={classNames({
  + [`${prefix}--tableofcontents__desktop__item`]: true,
  + [`${prefix}--tableofcontents__desktop__item--active`]: isActive,
  + })}>
  + <a
  + {...(isActive ? { 'aria-current': 'location' } : {})}
  + onClick={e => handleOnClick(e, item.id)}
  + href={`#${item.id}`}>
  {item.title}
  </a>
  </li>
  @@ -78,18 +82,15 @@ const TOCDesktop = ({ menuItems, selectedId }) => {
  }
  /**
  - * Set class name for active menu item
  + * Get active state for menu item
  *
  * @param {string} activeId selected menu item id
  * @param {string} menuId menu item id
  - * @returns {string} css class name for active menu item
  + * @returns {boolean} boolean for active state
  */
  - const setActiveClass = (activeId, menuId) => {
  - let active;
  - active =
  - activeId === menuId
  - ? `${prefix}--tableofcontents__desktop__item--active`
  - : '';
  + const isActiveItem = (activeId, menuId) => {
  + let active = activeId === menuId ? true : false;
  +
  return active;
  };
  