The base theme provides a Menu component that allows the creation of a dynamic menu based on the provided menu-id obtained from the Admin Panel. In this base theme, you can take a look at header.tsx file to view a working example of the same. 
<nav className="header-navigation">
  <ExpMenu
    menuLinkObj={pageData.globalSettings?.header_com}
    ulClasses="flex align-center primary-navigation"
    liClasses="nav-item"
    linkNameClasses="nav-link flex align-center"
    keyValueForMenu="primary_navigation_menu_id_et"
    iconForNavChild={ 
      <i className="icon menu-arrow-icon">
        <IconArrowDown />
      </i>
    }
    index={0}
  />
</nav>
Navigation menus are commonly created using an unordered list (<ul>) and list items (<li>). Each list item represents a menu item or a link in the navigation. This structure provides a semantic and accessible way to represent a navigation menu.
PropsDescription
menuLinkObjAn object contains the id of the navigation created in Admin Panel.
e.g. In the Header component, you can see that we are retrieving data from the pageData object, and within that, we access the globalSettings property which contains information about the header. This is where the navigation menu ID is specified.
ulClassesTo style the main <ul> element of the navigation menu, apply a CSS class using the className attribute.
liClassesIt works same way as ulClasses but for the list-item (<li>).
linkNameClassesAccepts the name of class(es) to apply on the <Link /> tag. You can view how <Link> works in base-theme at Link Parser.
childMenuItemThe ExpMenu component works recursively. Whenever a child menu is created, the ExpMenu component is called again, which in turn returns a child <ul> element. This recursive behavior allows for the creation of nested menus or submenus within the navigation menu structure.
keyValueForMenuIn the header menu, the data is being fetched from pageData.globalSettings.header_com. The header_com object contains all the information about the header component, including the menu ID. To access the menu ID, you need to provide the corresponding key. Take a look at Header Menu Object, In our case it will be primary_navigation_id_et.
iconForNavChildYou can provide an icon which you want to show in the menu item.
indexIn the context of recursion, the index parameter refers to the level of recursion being performed. By providing an initial value of zero, it will be incremented by one with each recursive call. This can be useful for tracking the depth or level of the recursion and performing specific actions or applying different styles based on the current recursion level.
globalSettings: {
  header_com :[
    {
      "node_type": "child",
      "id": "ZW3YF6DRwL7E",
      "primary_navigation_id_et": "5fd774b8-15ad-4ac2-960f-7406c6e0df31",
      "created_at": "2023-06-20T08:45:12.325Z",
      "modified_at": "2023-06-20T08:45:12.325Z",
      "_version_": "1769210661176344576"
    }
  ]
}
Refer header.tsx and menu.tsx in the base theme for a detailed understanding of how the index parameter is used in the code.