canopy-react-overlay

Creates a full page overlay modal thingy for AppStateESS/Canopy. The parent class determines its viewable status. Use the close function prop to hide it.

Install

npm install --save-dev @essappstate/canopy-react-overlay

Example

import Overlay from '@essappstate/canopy-react-overlay'

<Overlay
  show={this.state.show}
  close={this.toggleTheShowVariable}
  width="500px"
  title="My Overlay">
  <p>The content goes here.</p>
</Overlay>

Props

|Name|Type|Desc.| |----|----|----| |close|function|Required. Function to run upon closing overlay| |title|string|Text to appear in header of overlay| |width|string|Width of content area. The default is 100% width and height. If width is set, the height will be adaptive and the content area will be place near the top of the screen.| |show|boolean|If true, show the overlay. False (hidden) by default. |overflow|string|By default, the overflow is auto on the y axis and hidden on the x axis.| |children|node|The content of the overlay.|