@jswork/react-backdrop NPM

react-backdrop

Backdrop for react.

installation

npm install -S @jswork/react-backdrop

properties

Name	Type	Required	Default	Description
fixed	bool	false	true	If style.position is fixed.
transparent	bool	false	false	If the opacity is 0.

usage

import css

@import "~@jswork/react-backdrop/dist/style.scss";
@import "~@jswork/wsui-backdrop";

// customize your styles:
$react-backdrop-options: ()

import js

import ReactBackdrop from '@jswork/react-backdrop';
import ReactDOM from 'react-dom';
import React from 'react';
import './assets/style.scss';

class App extends React.Component {
  state = {
    visible: false
  };

  handleClick = (e) => {
    this.setState({ visible: !this.state.visible });
  };

  render() {
    const { visible } = this.state;
    return (
      <div className="app-container">
        <button className="button" onClick={this.handleClick}>
          Toggle
        </button>
        <ReactBackdrop destroyable value={visible} />
      </div>
    );
  }
}

ReactDOM.render(<App />, document.getElementById('app'));