@invisionag/iris-react-drawer

4.4.2 • Public • Published
Drawer from '@invisionag/iris-react-drawer';

Drawer is a generalized sidebar component. It provides functionality to wrap part of the view within a collapsable sidebar. Anything can be rendered within a Drawer component, no props get attached to the elements.

Usage:

<Drawer>
  <div>I am an element in a drawer!</div>
</Drawer>

By default, drawers will get attached to the right side. Positioning can be controlled with the position prop:

<Drawer position="left">
  <div>I am an element in a drawer!</div>
</Drawer>

The collapse button is only visible when the sidebar is hovered over. Hovering out triggers a grace timer before the element is truly hidden. The grace timer can be modified with hoverDelay and defaults to 500(ms).

<Drawer hoverDelay={2000}>
  <div>I am an element in a drawer!</div>
</Drawer>

Keywords

none

Install

npm i @invisionag/iris-react-drawer

DownloadsWeekly Downloads

257

Version

4.4.2

License

MIT

Unpacked Size

42.1 kB

Total Files

7

Last publish

Collaborators

  • pgotthardt-ivx
  • vasilicekaskin
  • hrabe
  • arminlandscheidt_invision
  • plore_ivx
  • patricialieske
  • mister_what
  • j-foley
  • plaudel
  • mblumtritt
  • spaceneedle2019
  • sruehlemann
  • brerx
  • mohamedmmahfouz
  • mbrendler
  • jens.zobel
  • cwaider
  • kattelans
  • ftrautmann
  • lutz.peukert
  • leander-karp
  • fruetel
  • schmitze333
  • csprle
  • beckerei
  • stefan.schiffer
  • ahx
  • cloudwaechter
  • tobias
  • jana_hehr
  • alexmarold
  • t_klepzig
  • joshuajaco
  • susahope
  • mwannewitz
  • drogglbecher
  • ivx-circle-ci
  • yichang
  • ivx-jenkins