Why is menuButton prop not optional?

[mmkiir]

I'm dealing with some modals in my app that are opened programmatically and hence don't have a menu button. When closing these modals I get 'Uncaught TypeError: state.menuBtnEls is undefined'

[Hentioe]

In my case, I open another Dismiss dialog via a button in a Dismiss-made menu (which only shows up when clicked). Since the button in Dismiss is created dynamically, passing it to menuButton is useless. But fortunately, controlling open and setOpen from the outside still works.

[aquaductape]

I'm dealing with some modals in my app that are opened programmatically and hence don't have a menu button. When closing these modals I get 'Uncaught TypeError: state.menuBtnEls is undefined'

I'm really sorry for replying late. I tried reproducing the error by passing null to menuButton,

<Dismiss
  menuButton={null}
  // ...

or removing the menu button from the DOM and then reassigning to variable to nullish value.

// runs before the modal is closed
btnEl.remove()
btnEl = undefined

I wasn't able to succeed, the modal closes without causing errors. Are you using the latest version of this library, if so and issue still persists, could provide minimal reproducible example, such as a stackblitz playground.

[aquaductape]

In my case, I open another Dismiss dialog via a button in a Dismiss-made menu (which only shows up when clicked). Since the button in Dismiss is created dynamically, passing it to menuButton is useless. But fortunately, controlling open and setOpen from the outside still works.

Passing null to menuButton prop works. When modal closes, it checks if menuButton exists and if so sets keyboard focus back to that element, if menuButton is nullish, then it's ignored and no errors are caused. But since your button is dynamic, you could pass a signal to menuButton that holds reference to the button, and if the button mounts, the Dismiss Component now holds a reference to that button and refocuses on it automatically after modal closes.

const [buttonEl, setButtonEl] = createSignal(null)

<Show when={dynamic}>
  <button ref={setButtonEl} />
</Show>
<Dismiss
  menuButton={buttonEl}
// ...

[Hentioe]

@aquaductape Your method is effective 👍. I don’t have much experience with Solid. Thank you for letting me know that setter can also be assigned to ref.

[aquaductape]

Closing it since the poster hasn't responded and I wasn't able to reproduce it.