import React from 'react';
import { Component } from 'react';
import CrossIcon from '@atlaskit/icon/core/migration/cross';
import { MediaButton, hideControlsClassName, InactivityDetector } from '@atlaskit/media-ui';
import { CloseButtonWrapper, ContentWrapper } from './styleWrappers';
export class Content extends Component {
  /*
   * Here we get called by InactivityDetector and given a function we
   * pass down as "showControls" to out children.
   */
  render() {
    const {
      onClose,
      isSidebarVisible
    } = this.props;
    return /*#__PURE__*/React.createElement(ContentWrapper, {
      isSidebarVisible: isSidebarVisible
    }, /*#__PURE__*/React.createElement(InactivityDetector, null, triggerActivityCallback => {
      const children = /*#__PURE__*/React.cloneElement(this.props.children, {
        showControls: triggerActivityCallback
      });
      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CloseButtonWrapper, {
        className: hideControlsClassName
      }, /*#__PURE__*/React.createElement(MediaButton, {
        testId: "media-viewer-close-button",
        onClick: onClose,
        iconBefore: /*#__PURE__*/React.createElement(CrossIcon, {
          color: "currentColor",
          spacing: "spacious",
          label: "Close"
        })
      })), children);
    }));
  }
}