I’m designing a Navigation Bar component for both mobile and desktop. On Mobile I have many variants like dark/light mode, optional icon, optional avatar, optional title, etc. On desktop I do not need all of these variants, only really need light/dark mode.
I’d like to call them both Navigation Bar, and be able to toggle between mobile/web with variants but I’d love to be able to input “N/A” or something else into the optional icon, avatar, title fields for my desktop version so that those properties do not show up in the side panel.
Essentially it’s like an “if” statement…if Navigation Bar = Desktop, don’t show “X” properties in the side panel.
Does that make sense? The only workaround I can find is to make the mobile and desktop variants separate components so that they have their own property types. If I do this I need to name them different things like “Mobile Navigation Bar” and “Desktop Navigation Bar” which I’d like to avoid.