function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
import React from 'react';
import getOr from 'lodash/fp/getOr';
import PropTypes from 'prop-types';
import ButtonLink from '../../atom/button-link';
import ButtonLinkIcon from '../../atom/button-link-icon';
import WizardSteps from '../../atom/wizard-steps';
import WizardSummary from '../../molecule/wizard-summary';
import BrandForm from '../brand-form';
import ContentTranslate from '../content-translation';
import OrganismSearchAndChipsResults from '../search-and-chips-results';
import CourseSelection from '../course-selection';
import CourseSections from '../../molecule/course-sections';
import BrandTabs from '../../molecule/brand-tabs';
import BulletPointMenuButton from '../../molecule/bullet-point-menu-button';
import RewardsForm from '../rewards-form';
import ExpandibleActionableErrorsTable from '../../molecule/expandible-actionable-table';
import BulkInfos from '../../molecule/bulk-infos';
import style from './style.css';
const buildHeader = (wizardHeader, actions, steps, tabs) => {
  const {
    title,
    onClick
  } = wizardHeader;
  const buttonCloseIcon = {
    size: 'small',
    'data-name': 'close-button',
    'aria-label': 'close button',
    icon: 'close',
    onClick
  };
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
    className: style.header
  }, /*#__PURE__*/React.createElement("div", {
    className: style.titleWrapper
  }, /*#__PURE__*/React.createElement(ButtonLinkIcon, buttonCloseIcon), /*#__PURE__*/React.createElement("div", {
    className: style.headerTitle,
    "data-name": 'content-title'
  }, title)), actions ? /*#__PURE__*/React.createElement("div", {
    className: style.actionsWrapper
  }, actions.bulletPointMenuButton ? /*#__PURE__*/React.createElement(BulletPointMenuButton, actions.bulletPointMenuButton) : null, /*#__PURE__*/React.createElement("div", {
    className: style.buttonLink
  }, /*#__PURE__*/React.createElement(ButtonLink, actions.firstButtonLink)), /*#__PURE__*/React.createElement("div", {
    className: style.buttonLink
  }, /*#__PURE__*/React.createElement(ButtonLink, actions.secondButtonLink))) : null), steps ? /*#__PURE__*/React.createElement(WizardSteps, {
    steps: steps
  }) : null, tabs ? /*#__PURE__*/React.createElement("div", {
    className: style.tabs
  }, /*#__PURE__*/React.createElement(BrandTabs, {
    type: "light",
    tabs: tabs
  })) : null);
};
const buildView = content => {
  const {
    type
  } = content;
  switch (type) {
    case 'form':
      return /*#__PURE__*/React.createElement(BrandForm, content);
    case 'translate':
      return /*#__PURE__*/React.createElement(ContentTranslate, content);
    case 'populations':
      return /*#__PURE__*/React.createElement(OrganismSearchAndChipsResults, content);
    case 'courses':
      return /*#__PURE__*/React.createElement(CourseSelection, content);
    case 'organize-courses':
      return /*#__PURE__*/React.createElement(CourseSections, content);
    case 'rewards':
      return /*#__PURE__*/React.createElement(RewardsForm, content);
    case 'expandible-table':
      return /*#__PURE__*/React.createElement(ExpandibleActionableErrorsTable, content);
    case 'upload-progression':
      return /*#__PURE__*/React.createElement(BulkInfos, content);
  }
};
const buildButton = (type, step, side) => {
  const ICONS = {
    previous: {
      position: 'left',
      type: 'chevron-left'
    },
    next: {
      position: 'right',
      type: 'chevron-right'
    },
    publish: {
      position: 'left',
      type: 'publish'
    }
  };
  const {
    label,
    onClick
  } = step;
  const buttonProps = {
    type: type === 'previous' ? 'secondary' : 'primary',
    'aria-label': `${type} step button`,
    'data-name': `${type}-step-button-${side}`,
    icon: ICONS[type],
    label,
    onClick
  };
  return /*#__PURE__*/React.createElement(ButtonLink, buttonProps);
};
const buildActionZone = (previousStep, nextStep, side) => {
  const previousButton = previousStep ? buildButton('previous', previousStep, side) : null;
  const nextStepType = getOr('next', 'type', nextStep);
  const nextButton = nextStep ? buildButton(nextStepType, nextStep, side) : null;
  return /*#__PURE__*/React.createElement("div", {
    className: style.actionZone
  }, /*#__PURE__*/React.createElement("div", {
    className: style.button
  }, previousButton), /*#__PURE__*/React.createElement("div", {
    className: style.button
  }, nextButton));
};
const THEMES = {
  'no-summary': {
    container: style.containerWithoutSummary,
    footer: style.footerWithoutSummary,
    actionFooter: style.actionFooterWithoutSummary,
    leftSection: style.leftSectionWithoutSummary
  },
  summary: {
    container: style.container,
    footer: style.footer,
    actionFooter: style.actionFooter,
    leftSection: style.leftSection
  }
};
const getTheme = summary => summary ? 'summary' : 'no-summary';
const WizardContents = props => {
  const {
    isLoading,
    wizardHeader,
    actions,
    steps,
    tabs,
    summary,
    content,
    nextStep,
    previousStep
  } = props;
  const headerView = buildHeader(wizardHeader, actions, steps, tabs);
  const view = buildView({
    ...content,
    isLoading
  });
  const rightActionView = buildActionZone(previousStep, nextStep, 'right');
  const footerActionView = buildActionZone(previousStep, nextStep, 'footer');
  const currentStyle = THEMES[getTheme(summary)];
  const summaryWrapper = /*#__PURE__*/React.createElement("div", {
    className: style.rightSection,
    "data-name": "summary-right-section"
  }, /*#__PURE__*/React.createElement("div", {
    className: style.stickySection
  }, /*#__PURE__*/React.createElement("div", {
    className: style.summaryZone,
    "data-name": "summary-zone"
  }, /*#__PURE__*/React.createElement(WizardSummary, _extends({}, summary, {
    side: 'right'
  }))), rightActionView));
  return /*#__PURE__*/React.createElement("div", {
    className: currentStyle.container,
    "data-name": "content-summary"
  }, /*#__PURE__*/React.createElement("div", {
    className: currentStyle.leftSection
  }, headerView, /*#__PURE__*/React.createElement("div", {
    className: style.form
  }, view)), summary ? summaryWrapper : null, /*#__PURE__*/React.createElement("div", {
    className: currentStyle.footer,
    "data-name": "footer-section"
  }, summary ? /*#__PURE__*/React.createElement("div", {
    className: style.summaryFooter
  }, /*#__PURE__*/React.createElement(WizardSummary, _extends({}, summary, {
    side: 'footer'
  }))) : null, /*#__PURE__*/React.createElement("div", {
    className: currentStyle.actionFooter
  }, footerActionView)));
};
WizardContents.propTypes = process.env.NODE_ENV !== "production" ? {
  isLoading: PropTypes.bool,
  wizardHeader: PropTypes.shape({
    title: PropTypes.string,
    onClick: PropTypes.func
  }).isRequired,
  actions: PropTypes.shape({
    bulletPointMenuButton: PropTypes.shape({
      buttonAriaLabel: PropTypes.string,
      menuAriaLabel: PropTypes.string,
      buttons: PropTypes.arrayOf(PropTypes.shape({
        'data-name': PropTypes.string,
        label: PropTypes.string,
        type: PropTypes.string,
        onClick: PropTypes.func
      })),
      onClick: PropTypes.func
    }),
    firstButtonLink: PropTypes.shape(ButtonLink.propTypes),
    secondButtonLink: PropTypes.shape(ButtonLink.propTypes)
  }),
  steps: WizardSteps.propTypes.steps,
  tabs: BrandTabs.propTypes.tabs,
  summary: PropTypes.shape({
    ...WizardSummary.propTypes
  }),
  content: PropTypes.oneOfType([PropTypes.shape({
    ...BrandForm.propTypes,
    type: PropTypes.oneOf(['form'])
  }), PropTypes.shape({
    ...ContentTranslate.propTypes,
    type: PropTypes.oneOf(['translate'])
  }), PropTypes.shape({
    ...OrganismSearchAndChipsResults.propTypes,
    type: PropTypes.oneOf(['populations'])
  }), PropTypes.shape({
    ...CourseSelection.propTypes,
    type: PropTypes.oneOf(['courses'])
  }), PropTypes.shape({
    ...CourseSections.propTypes,
    type: PropTypes.oneOf(['organize-courses'])
  }), PropTypes.shape({
    ...RewardsForm.propTypes,
    type: PropTypes.oneOf(['rewards'])
  }), PropTypes.shape({
    ...ExpandibleActionableErrorsTable.propTypes,
    type: PropTypes.oneOf(['expandible-table'])
  }), PropTypes.shape({
    ...BulkInfos.propTypes,
    type: PropTypes.oneOf(['upload-progression'])
  })]),
  previousStep: PropTypes.shape({
    label: PropTypes.string,
    onClick: PropTypes.func
  }),
  nextStep: PropTypes.shape({
    type: PropTypes.oneOf(['next', 'publish']),
    label: PropTypes.string,
    onClick: PropTypes.func
  })
} : {};
export default WizardContents;
//# sourceMappingURL=index.js.map