Site icon Hip-Hop Website Design and Development

How to change how WordPress renders navigation menu on Block Themes

With classic templates it was easy to understand how to overwrite how WordPress navigation menu was rendered, but I’m struggling with the new Theme blocks approach.
I know it uses the navigation block and through the Page Editor I’m able to configure several properties, but I actually need to change the generated navigation menu html.

The template I’m using is including the block through:

<!-- wp:navigation {"layout":{"type":"flex","setCascadingProperties":true,"justifyContent":"right"}} -->
<!-- wp:page-list {"isNavigationChild":true,"showSubmenuIcon":true,"openSubmenusOnClick":false} /-->
<!-- /wp:navigation --></div>

And I would like to change the html rendered by WordPress navigation. I think I could use apply_filters(‘render_block’) and then depending on the block return a different html, but is that the best approach?

The reason why I’d like to change how the navigation menu is rendered is because I’m migrating an existing website into WordPress system and the menu render (html structure) is already implemented so I’d like to apply the same but in wordpress.