Package org.patternfly.component.drawer


package org.patternfly.component.drawer
Provides the PatternFly drawer component and its subcomponents for displaying a collapsible panel alongside content.

A drawer is a sliding panel that enters from the start, end, or bottom of the viewport. It can be used for task-based information, such as detail panels, help panels, or notification centers. The drawer supports overlay and inline modes, resizable panels, and configurable positions.

Usage

A basic drawer with a toggle button:

 import static org.patternfly.component.button.Button.button;
 import static org.patternfly.component.drawer.Drawer.drawer;
 import static org.patternfly.component.drawer.DrawerBody.drawerBody;
 import static org.patternfly.component.drawer.DrawerCloseButton.drawerCloseButton;
 import static org.patternfly.component.drawer.DrawerContent.drawerContent;
 import static org.patternfly.component.drawer.DrawerPanel.drawerPanel;
 import static org.patternfly.component.drawer.DrawerPanelHead.drawerPanelHead;

 Drawer drawer = drawer();
 button("Toggle drawer").primary()
         .onClick((event, btn) -> drawer.toggle());
 drawer
         .addContent(drawerContent()
                 .addBody(drawerBody().text("Main content")))
         .addPanel(drawerPanel()
                 .addHead(drawerPanelHead()
                         .add(span().text("Panel content"))
                         .addCloseButton(drawerCloseButton())));

A drawer with the panel positioned at the start:

 import static org.patternfly.component.drawer.Drawer.drawer;
 import static org.patternfly.component.drawer.DrawerBody.drawerBody;
 import static org.patternfly.component.drawer.DrawerContent.drawerContent;
 import static org.patternfly.component.drawer.DrawerPanel.drawerPanel;
 import static org.patternfly.component.drawer.Position.start;

 drawer().position(start)
         .addContent(drawerContent()
                 .addBody(drawerBody().text("Main content")))
         .addPanel(drawerPanel());
See Also: