mooff
mooff
PostsComments
SSolidJS
Created by mooff on 7/27/2023 in #support
Container onFocus to observe to subelement focus?
Trying the following, but the handler doesn't seem to be fired when a sidebar item is tab focused using the keyboard: 
return <>
  <app-sidebar onFocus={() => setSidebarVisible(true)} hidden={!sidebarVisible()}>
    <ul>
      <li tabIndex={0}>Foo</li>
      <li tabIndex={0}>Foo</li>
    </ul>
  </app-sidebar>

  <app-main></app-main>
</>
return <>
  <app-sidebar onFocus={() => setSidebarVisible(true)} hidden={!sidebarVisible()}>
    <ul>
      <li tabIndex={0}>Foo</li>
      <li tabIndex={0}>Foo</li>
    </ul>
  </app-sidebar>

  <app-main></app-main>
</>
The idea is that the sidebar will become visible when shift-tabbing into it. But - onFocus doesn't seem to handle focus events from child elements. - on:focus seems to be disallowed by TypeScript - oncapture:focus might be what I want, but it's also disallowed by TypeScript What can I do?
2 replies