function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React from 'react';
import styled from 'styled-components';
import { Flexbox, Box, OldIcon } from '../..';
import Button from '../Button';
import PageWrapper from '../PageWrapper';
var tenColumns = "".concat(10 / 12 * 100, "%");
var ForwardButton = styled(Button).withConfig({
  displayName: "BottomWizardBar__ForwardButton",
  componentId: "sc-14yln2k-0"
})(["", "{min-width:", "px;}"], function (p) {
  return p.theme.media.greaterThan(p.theme.breakpoints.sm);
}, function (p) {
  return p.theme.spacing.unit(40);
});
var StyledFooterPageWrapper = styled(PageWrapper).withConfig({
  displayName: "BottomWizardBar__StyledFooterPageWrapper",
  componentId: "sc-14yln2k-1"
})(["position:fixed;bottom:0;left:0;right:0;z-index:", ";border-top:1px solid ", ";"], function (p) {
  return p.theme.zIndex.overlay;
}, function (p) {
  return p.theme.color.divider;
});
var StyledBox = styled(Box).withConfig({
  displayName: "BottomWizardBar__StyledBox",
  componentId: "sc-14yln2k-2"
})(["margin:0 auto;", "{width:", ";}"], function (p) {
  return p.theme.media.greaterThan(p.theme.breakpoints.xl);
}, tenColumns);
var BottomWizardBar = function BottomWizardBar(_ref) {
  var _ref$isLastStep = _ref.isLastStep,
    isLastStep = _ref$isLastStep === void 0 ? false : _ref$isLastStep,
    onCancel = _ref.onCancel,
    onNext = _ref.onNext,
    onPrevious = _ref.onPrevious,
    onSubmit = _ref.onSubmit,
    _ref$isEmbedded = _ref.isEmbedded,
    isEmbedded = _ref$isEmbedded === void 0 ? false : _ref$isEmbedded,
    _ref$isLoading = _ref.isLoading,
    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
    _ref$isNextDisabled = _ref.isNextDisabled,
    isNextDisabled = _ref$isNextDisabled === void 0 ? false : _ref$isNextDisabled,
    _ref$isSubmitDisabled = _ref.isSubmitDisabled,
    isSubmitDisabled = _ref$isSubmitDisabled === void 0 ? false : _ref$isSubmitDisabled,
    titleText = _ref.titleText,
    cancelText = _ref.cancelText,
    previousText = _ref.previousText,
    nextText = _ref.nextText,
    submitText = _ref.submitText,
    _ref$hidePreviousButt = _ref.hidePreviousButton,
    hidePreviousButton = _ref$hidePreviousButt === void 0 ? false : _ref$hidePreviousButt,
    _ref$cancelButtonLink = _ref.cancelButtonLink,
    cancelButtonLink = _ref$cancelButtonLink === void 0 ? '' : _ref$cancelButtonLink,
    _ref$previousButtonLi = _ref.previousButtonLink,
    previousButtonLink = _ref$previousButtonLi === void 0 ? '' : _ref$previousButtonLi,
    _ref$submitButtonLink = _ref.submitButtonLink,
    submitButtonLink = _ref$submitButtonLink === void 0 ? '' : _ref$submitButtonLink,
    _ref$nextButtonLink = _ref.nextButtonLink,
    nextButtonLink = _ref$nextButtonLink === void 0 ? '' : _ref$nextButtonLink;
  return React.createElement(StyledFooterPageWrapper, {
    background: function background(t) {
      return t.color.card;
    }
  }, React.createElement(StyledBox, {
    py: isEmbedded ? 3 : 2,
    px: isEmbedded ? 4 : 3,
    sm: {
      py: 2,
      px: 0
    }
  }, React.createElement("nav", {
    "aria-label": titleText
  }, React.createElement(Flexbox, {
    container: true,
    gap: 4,
    sm: {
      gap: 8
    },
    justifyContent: "space-between",
    alignItems: "center"
  }, !isEmbedded && React.createElement(Flexbox, {
    item: true
  }, React.createElement(Button, _extends({
    delayLoadingSpinnerAnimation: false,
    onClick: onCancel,
    disabled: isLoading,
    size: "l",
    variant: "neutral",
    color: function color(t) {
      return t.color.cta;
    },
    type: "reset"
  }, cancelButtonLink && {
    to: cancelButtonLink
  }), cancelText)), React.createElement(Flexbox, _extends({
    gap: 4,
    sm: {
      gap: 8
    },
    container: true,
    item: true
  }, isEmbedded && {
    flex: '1'
  }, {
    alignItems: "center",
    justifyContent: "space-between"
  }), !hidePreviousButton && React.createElement(Flexbox, _extends({
    item: true
  }, isEmbedded && {
    flex: '1'
  }), React.createElement(Button, _extends({
    delayLoadingSpinnerAnimation: false,
    onClick: onPrevious,
    disabled: isLoading,
    size: "l",
    variant: "neutral",
    fullWidth: isEmbedded,
    color: function color(t) {
      return t.color.cta;
    }
  }, previousButtonLink && {
    to: previousButtonLink
  }), React.createElement(Flexbox, {
    container: true,
    justifyContent: "center",
    alignItems: "center",
    gap: 2
  }, React.createElement(OldIcon.ThinChevron, {
    direction: "left",
    inline: true,
    color: "currentColor",
    size: 4
  }), previousText))), React.createElement(Flexbox, _extends({
    item: true
  }, isEmbedded && {
    flex: '1'
  }), isLastStep ? React.createElement(ForwardButton, _extends({
    delayLoadingSpinnerAnimation: false,
    loading: isLoading,
    type: "submit",
    variant: "primary",
    size: "l",
    fullWidth: isEmbedded,
    onClick: function onClick(e) {
      if (onSubmit && !isLoading) onSubmit(e);
    },
    disabled: isSubmitDisabled
  }, submitButtonLink && {
    to: submitButtonLink
  }), submitText) : React.createElement(ForwardButton, _extends({
    delayLoadingSpinnerAnimation: false,
    loading: isLoading,
    variant: "primary",
    size: "l",
    onClick: function onClick(e) {
      if (onNext && !isLoading) onNext(e);
    },
    fullWidth: isEmbedded,
    disabled: isNextDisabled
  }, nextButtonLink && {
    to: nextButtonLink
  }), nextText)))))));
};
export default BottomWizardBar;