Navigation Component Orientation: Ability to 'Set Value Dynamically'

Feature Requests
, , , ,
1

It would be great if we had the option to dynamically set the "horizontal" or "vertical" orientation of the navigation component.

Specific case, reusing a navigation component that is a module used as a navbar in one of our apps. I would like to be able to flip the menu items vertically under a condition where the viewport is 500px width or less by dynamically setting it's orientation like so:

{{ viewport.width <= 500 ? "vertical" : "horizontal" }}

2 Likes
2

Hi @AJVancattenburch thank you for sharing this feature request! I can see how this would be helpful to reduce component duplication and have filed this with our team.
​
In the meantime, a workaround to consider is to have two duplicate navigation components and use the Hidden component property to control when to show the appropriate navigation component. To avoid duplicating some of the component configurations, you can use the same query or transformer to define the Data Source of both navigation components.
​
Here's an example GIF of this workaround in action:
gif

1 Like
3

Hey thanks for the reply @Mark_S! Yes haha that is the route I ended up taking in the meantime :slight_smile:

I'm glad that it ended up being the most conventional approach until we are able to toggle a single component :clap:

Thanks again!

1 Like