import React from 'react';
import PropTypes from 'prop-types';
import { componentWithName } from 'airbnb-prop-types';
import './style.css';

var PageFlipper = function PageFlipper(props) {
  var blank = React.createElement(
    'div',
    { className: 'ma__page-flipper__blank' },
    '\xA0'
  );
  var prev = props.previousLink || blank;
  var next = props.nextLink || blank;
  return React.createElement(
    React.Fragment,
    null,
    props.intro && React.createElement(
      'div',
      { className: 'ma__page-flipper__context' },
      props.intro.label && React.createElement(
        'span',
        { className: 'ma__page-flipper__context-label' },
        props.intro.label
      ),
      props.intro.introDecorativeLink && props.intro.introDecorativeLink.props.text && props.intro.introDecorativeLink
    ),
    React.createElement(
      'div',
      { className: 'ma__page-flipper' },
      React.createElement(
        'div',
        { className: 'ma__page-flipper__container' },
        prev,
        next
      )
    )
  );
};

PageFlipper.propTypes = process.env.NODE_ENV !== "production" ? {
  /** Introduction section containing a label and / or a link. */
  intro: PropTypes.shape({
    /** Optional label */
    label: PropTypes.string,
    /** Optional DecorativeLink */
    introDecorativeLink: componentWithName('DecorativeLink')
  }),
  /** Previous Link (or left button) */
  previousLink: componentWithName('ArrowNav'),
  /** Nexxt Link (or right button) */
  nextLink: componentWithName('ArrowNav')
} : {};

export default PageFlipper;