Struct Drawer 

pub struct Drawer { /* private fields */ }

Drawer component

A drawer is a sliding panel that enters from the right edge of the viewport. It can be configured to either overlay content on a page or create a sidebar by pushing that content to the left.

See: https://www.patternfly.org/components/drawer

Properties

Defined by DrawerProperties.

Children

The drawer requires a structure of other drawer elements, which isn’t enforced through types. See the example, the quickstart project, and the PatternFly documentation for guidance.

Example

use yew::prelude::*;
use patternfly_yew::prelude::*;

#[function_component(Example)]
fn example() -> Html {

  let expanded = use_state_eq(|| false);
  let onclick = use_callback(expanded.clone(), |_, expanded| expanded.set(!**expanded));
  let onclose = use_callback( expanded.clone(), |_, expanded| expanded.set(false));

  let panel_content = html!(
    <DrawerPanelContent>
      <DrawerHead>
        <span>
          {"drawer-panel"}
        </span>
        <DrawerActions>
          <DrawerCloseButton onclick={onclose} />
        </DrawerActions>
      </DrawerHead>
    </DrawerPanelContent>
  );

  html!(
    <>
      <Button variant={ButtonVariant::Primary} {onclick}>{"Toggle drawer"}</Button>
      <Drawer expanded={*expanded}>
        <DrawerContent {panel_content}>
          <DrawerContentBody>
            { "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pretium est a porttitor vehicula. Quisque vel commodo urna. Morbi mattis rutrum ante, id vehicula ex accumsan ut. Morbi viverra, eros vel porttitor facilisis, eros purus aliquet erat,nec lobortis felis elit pulvinar sem. Vivamus vulputate, risus eget commodo eleifend, eros nibh porta quam, vitae lacinia leo libero at magna. Maecenas aliquam sagittis orci, et posuere nisi ultrices sit amet. Aliquam ex odio, malesuada sed posuere quis, pellentesque at mauris. Phasellus venenatis massa ex, eget pulvinar libero auctor pretium. Aliquam erat volutpat. Duis euismod justo in quam ullamcorper, in commodo massa vulputate." }
          </DrawerContentBody>
        </DrawerContent>
      </Drawer>
    </>
  )
}

For more examples, see the PatternFly Yew Quickstart project.

Trait Implementations

impl BaseComponent for Drawer

where Self: 'static,

type Message = ()

The Component’s Message.

type Properties = DrawerProperties

The Component’s Properties.

fn create(ctx: &Context<Self>) -> Self

Creates a component.

fn update(&mut self, _ctx: &Context<Self>, _msg: Self::Message) -> bool

Updates component’s internal state.

fn changed( &mut self, _ctx: &Context<Self>, _old_props: &Self::Properties, ) -> bool

React to changes of component properties.

fn view(&self, ctx: &Context<Self>) -> HtmlResult

Returns a component layout to be rendered.

fn rendered(&mut self, _ctx: &Context<Self>, _first_render: bool)

Notified after a layout is rendered.

fn destroy(&mut self, _ctx: &Context<Self>)

Notified before a component is destroyed.

fn prepare_state(&self) -> Option<String>

Prepares the server-side state.

impl Debug for Drawer

fn fmt(&self, f: &mut Formatter<'_>) -> Result

Formats the value using the given formatter.

impl FunctionProvider for Drawer

type Properties = DrawerProperties

Properties for the Function Component.

fn run(ctx: &mut HookContext, props: &Self::Properties) -> HtmlResult

Render the component. This function returns the Html to be rendered for the component.