"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _clsx = _interopRequireDefault(require("clsx"));
var _styles = require("@material-ui/core/styles");
var _AppBar = _interopRequireDefault(require("@material-ui/core/AppBar"));
var _Toolbar = _interopRequireDefault(require("@material-ui/core/Toolbar"));
var _i18n = require("../../../../Framework/i18n");
var _customClassName = _interopRequireDefault(require("../../../Utils/customClassName"));
var _Stepper = _interopRequireDefault(require("../Stepper"));
var _VariantChooser = _interopRequireDefault(require("../VariantChooser"));
var _ToolbarList = _interopRequireDefault(require("../ToolbarList"));
var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var useStyles = (0, _styles.makeStyles)(function (theme) {
  return {
    root: {
      flexGrow: 1
    },
    grow: {
      flexGrow: 1
    },
    headerRoot: {
      overflow: 'hidden'
    },
    toolbarHeaderWrapper: _defineProperty({
      minHeight: 64,
      padding: '0 20px'
    }, theme.breakpoints.down('xs'), {
      padding: '0 0 0 20px'
    }),
    hiddenEmailShareIframe: {
      visibility: 'hidden',
      position: 'absolute'
    },
    itemIdentifierLabel: _defineProperty({
      fontSize: 15
    }, theme.breakpoints.down('sm'), {
      fontSize: 12
    }),
    itemIdentifier: _defineProperty({
      fontWeight: 'bold',
      fontSize: 15,
      marginLeft: theme.spacing(1)
    }, theme.breakpoints.down('sm'), {
      fontSize: 12
    }),
    itemIdentifierContainer: _defineProperty({
      overflow: 'hidden',
      textOverflow: 'ellipsis',
      display: 'flex',
      flexDirection: 'row',
      marginLeft: theme.spacing(2)
    }, theme.breakpoints.down('xs'), {
      display: 'none'
    })
  };
}, {
  name: 'Header'
});
var Header = function Header(props) {
  var classes = useStyles(props);
  var tools = props.tools,
    steps = props.steps,
    variants = props.variants,
    selectedVariantIdentifier = props.selectedVariantIdentifier,
    title = props.title,
    VariantChooserComponent = props.VariantChooserComponent,
    selectedVariant = props.selectedVariant,
    showItemIdentifier = props.showItemIdentifier;
  var handleVariantChange = function handleVariantChange(e) {
    var switchSelectedAmount = props.switchSelectedAmount,
      selectedVariantIdentifier = props.selectedVariantIdentifier;
    switchSelectedAmount(selectedVariantIdentifier, e.target.value);
  };
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: classes.root
  }, /*#__PURE__*/_react["default"].createElement(_AppBar["default"], {
    position: "static",
    color: "default",
    className: (0, _clsx["default"])(classes.headerRoot, (0, _customClassName["default"])('header'))
  }, /*#__PURE__*/_react["default"].createElement(_Toolbar["default"], {
    classes: {
      regular: classes.toolbarHeaderWrapper
    }
  }, /*#__PURE__*/_react["default"].createElement(VariantChooserComponent, {
    variants: variants,
    value: selectedVariant || '',
    title: title,
    handleChange: handleVariantChange
  }), showItemIdentifier && /*#__PURE__*/_react["default"].createElement("div", {
    className: classes.itemIdentifierContainer
  }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
    component: "div",
    className: classes.itemIdentifierLabel,
    variant: "body2"
  }, (0, _i18n.t)('headerMenu.item_identifier_label') !== 'headerMenu.item_identifier_label' ? (0, _i18n.t)('headerMenu.item_identifier_label') : ''), /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
    component: "div",
    className: classes.itemIdentifier,
    variant: "body2"
  }, selectedVariantIdentifier)), /*#__PURE__*/_react["default"].createElement("div", {
    className: classes.grow
  }, steps && /*#__PURE__*/_react["default"].createElement(_Stepper["default"], {
    tabs: steps
  })), /*#__PURE__*/_react["default"].createElement(_ToolbarList["default"], {
    tools: tools
  }))));
};
Header.defaultProps = {
  variants: [],
  VariantChooserComponent: _VariantChooser["default"]
};
var _default = exports["default"] = Header;