text: import React from 'react';
  import EventCell from './EventCell';
  import { isSelected } from './utils/selection';
  import localizer from './localizer';
  import getOffset from 'dom-helpers/query/offset';
  import getScrollTop from 'dom-helpers/query/scrollTop';
  import getScrollLeft from 'dom-helpers/query/scrollLeft';
  
  class Popup extends React.Component {
      componentDidMount() {
          const { popupOffset = 5 } = this.props,
              { top, left, width, height } = getOffset(this.refs.root),
              viewBottom = window.innerHeight + getScrollTop(window),
              viewRight = window.innerWidth + getScrollLeft(window),
              bottom = top + height,
              right = left;
  
          //if (bottom > viewBottom || right > viewRight) {
          let topOffset, leftOffset;
  
          if (bottom > viewBottom) {
              topOffset = bottom - viewBottom + (popupOffset.y || +popupOffset || 0);
          }
          if (right > viewRight) {
              leftOffset = right - viewRight + (popupOffset.x || +popupOffset || 0);
          }
          if (left < 0) {
              leftOffset = -(this.props.position.width * 0.25) | 1;
          }
  
          this.setState({ topOffset, leftOffset }); //eslint-disable-line
          // }
      }
  
      render() {
          let { events, selected, eventComponent, ...props } = this.props;
  
          let { left, width, top, height } = this.props.position,
              topOffset = (this.state || {}).topOffset || 0,
              leftOffset = (this.state || {}).leftOffset || 0;
  
          let style = {
              top: top - topOffset - height * 0.25,
              left: left - leftOffset - width * 0.25,
              minWidth: width + width / 2
          };
  
          return (
              <div ref="root" style={style} className="rbc-overlay">
                  <div className="rbc-overlay-header">
                      {localizer.format(props.slotStart, props.dayHeaderFormat, props.culture)}
                  </div>
                  {events.map((event, idx) => (
                      <EventCell
                          key={idx}
                          {...props}
                          event={event}
                          component={eventComponent}
                          selected={isSelected(event, selected)}
                      />
                  ))}
              </div>
          );
      }
  }
  
  export default Popup;
  