pantoken / renderers/web-components/src / drawerLayout

Változó: drawerLayout

const drawerLayout: ElementDefinition

Alfa

<instui-drawer-layout> — egy oldalsó tálca és egy fő tartalomterület. A(z) open attribútum megjeleníti a tálcát; a(z) placement (start|end) választja ki az oldalt. A light DOM-ból vezérelhető az Invoker Commands segítségével: <button command="--toggle|--open|--close" commandfor="drawer-id">. A tartalom az alapértelmezett slotba kerül; a tálca a(z) slot="tray" helyre. Az interakciók viselkedése automatikusan váltja az overlay módot a(z) --pantoken-bp-md küszöbérték alapján.

Akadálymentesség

A tartalompanel a(z) role="region" jelölést hordozza, illeszkedve az InstUI DrawerLayout-jához; lássa el a(z) aria-label/aria-labelledby címkével, ha a környező kontextus még nem nevezi meg.

Példa

<button command="--toggle" commandfor="drawer">Toggle panel</button>
<instui-drawer-layout id="drawer" open placement="start">
  <nav slot="tray">…</nav>
  <article>Main content</article>
</instui-drawer-layout>