Skip to main content

Drawer

Displays child widgets in an overlay panel controlled by context.

Example of the Drawer widget in the Sybot Studio demo User View

Recommended configuration

  1. Choose the side and context key for opening.
  2. Add detail or diagnostic widgets.
  3. Verify opening, closing, and keyboard navigation.

Configuration options

AreaOptions
ContainerChild widgets, internal grid, and optional grid visibility in the published view.
DrawerSide, context that determines opening, initial state, and closing by clicking outside.
IdentityTitle, Subtitle, header visibility, type icon, and actions button.
PresentationStandard, Compact, or Dense variant and message to show when no data is available.
AppearanceBackground, background image, border, radius, padding, shadow, and typography for different areas.
PositionCoordinates and dimensions in cells within the page or container grid.

Best practices

  • The Drawer must not hide errors or confirmation requests.
tip

Always verify the widget in Preview, in both light and dark themes, and with an empty data state before publishing the View.