How to implement Nav with custom heading group in shiny.fluent

Question

I am trying to use shiny.fluent and implement one of the Nav examples from the Microsoft fluent UI documentation page. The example uses some JavaScript to apply a heading style to the group headings and I'm not sure how do apply the JavaScript in R.

Minimum example below:

library(shiny)
library(shiny.fluent)

navigation_styles <- list(
  root = list(
    height = "100%",
    width = "30%",
    boxSizing = "border-box",
    border = "1px solid #eee",
    overflowY = "auto"
  )
)

link_groups <- list(
  list(name = 'Pages', 
    links = list( 
      list(name = 'Activity'),
      list(name = 'News'))),
  list(name = 'More Pages',
       links = list(
      list(name = 'Settings'),
      list(name = 'Notes')
    )
  )
)

shinyApp(
  ui = fluidPage(
    Nav(
      groups = link_groups,
      selectedKey = "key1",
      styles = navigation_styles
    )
  ),
  server = function(input, output) {
  }
)

And it looks like this. The group headings are collapsible menu items which is not what I want.

the example from Microsoft is the last example on this page. Their example code below:

import * as React from 'react';
import { Nav, INavLinkGroup } from '@fluentui/react/lib/Nav';

const navLinkGroups: INavLinkGroup[] = [
  {
    name: 'Pages',
    links: [
      { name: 'Activity', url: 'http://msn.com', key: 'key1', target: '_blank' },
      { name: 'News', url: 'http://msn.com', key: 'key2', target: '_blank' },
    ],
  },
  {
    name: 'More pages',
    links: [
      { name: 'Settings', url: 'http://msn.com', key: 'key3', target: '_blank' },
      { name: 'Notes', url: 'http://msn.com', key: 'key4', target: '_blank' },
    ],
  },
];

export const NavCustomGroupHeadersExample: React.FunctionComponent = () => {
  return (
    <Nav
      onRenderGroupHeader={_onRenderGroupHeader}
      ariaLabel="Nav example with custom group headers"
      groups={navLinkGroups}
    />
  );
};

function _onRenderGroupHeader(group: INavLinkGroup): JSX.Element {
  return <h3>{group.name}</h3>;
}

It looks like this:

Can anyone help me implement this in shiny.fluent? Thanks.