@6thquake/react-material/es/DragableLayer/BoxDragPreview.js

React components that implement Google's Material Design.

/**
 * @ignore - do not document.
 */
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import shouldPureComponentUpdate from './shouldPureComponentUpdate';
import Box from './Box';
const styles = {
  display: 'inline-block',
  transform: 'rotate(-7deg)',
  WebkitTransform: 'rotate(-7deg)'
};
export default class BoxDragPreview extends Component {
  constructor(props) {
    super(props);
    this.shouldComponentUpdate = shouldPureComponentUpdate;
    this.tick = this.tick.bind(this);
    this.state = {
      tickTock: false
    };
  }

  componentDidMount() {
    this.interval = setInterval(this.tick, 500);
  }

  componentWillUnmount() {
    clearInterval(this.interval);
  }

  tick() {
    this.setState({
      tickTock: !this.state.tickTock
    });
  }

  render() {
    const {
      title
    } = this.props;
    const {
      tickTock
    } = this.state;
    return React.createElement("div", {
      style: styles
    }, React.createElement(Box, {
      title: title,
      yellow: tickTock
    }));
  }

}
process.env.NODE_ENV !== "production" ? BoxDragPreview.propTypes = {
  title: PropTypes.string.isRequired
} : void 0;