How can the option be hidden when aria-expand is set to false?

Assuming you’re referring to the HTML aria-expanded attribute and you want to hide an element based on its value, you can use CSS to achieve this. Here’s an example:

HTML:

<button aria-expanded="false">Toggle content</button>
<div class="content">Some content to toggle</div>

CSS:

.content {
  display: none;
}

[aria-expanded="true"] + .content {
  display: block;
}

In this example, the content is initially hidden with the display: none; CSS property. When the button is clicked, the aria-expanded attribute is toggled to "true", which then triggers the CSS selector [aria-expanded="true"] + .content to apply the display: block; property to the content, revealing it.

So, by default, the content is hidden and when aria-expanded="false", it won’t be displayed.