Hidden components are fully visible in dev mode side panel

Why would you hide a component though? Is it required to be hidden?

If it’s required to be hidden, the dev could code that object initially as display:none . The object would be in the code and can be shown on some conditions. (That is if it’s the initial state of the component)

But if they’re not required to be in the component, it’s better to not put them at all.

Example:

You have a component/object hidden inside, the structure would be something like this (Webapp):

---- Component ----
<div>
  This content is displayed
  <Component2/>
</div>

----- CSS -----

Component2{
    display: none;
}

Thanks for responding.

It’s more about the side panel not showing the same visual representation. Usually hidden objects in the side panel are greyed out, but on dev mode they are not. So there’s possibly confusion of a dev when they find components in the side panel that do not appear visually on the display.

Ohh sorry, you’re right. I believe Figma should refine the UI of the dev mode.
Even in dev mode, Figma should display which layer is hidden or not.