"use strict";

exports.__esModule = true;
exports.default = exports.TitleItem = exports.SelectItem = exports.MultiSelectItem = exports.LinkItem = exports.InputTextItem = exports.InfoItem = exports.IconLinkItem = exports.ButtonItem = void 0;
var _defaults2 = _interopRequireDefault(require("lodash/fp/defaults"));
var _getOr2 = _interopRequireDefault(require("lodash/fp/getOr"));
var _noop2 = _interopRequireDefault(require("lodash/fp/noop"));
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _novaIcons = require("@coorpacademy/nova-icons");
var _link = _interopRequireDefault(require("../../atom/link"));
var _button = _interopRequireDefault(require("../../atom/button"));
var _provider = _interopRequireWildcard(require("../../atom/provider"));
var _select = _interopRequireDefault(require("../../atom/select"));
var _cta = _interopRequireDefault(require("../../atom/cta"));
var _selectMultiple = _interopRequireDefault(require("../../molecule/select-multiple"));
var _style = _interopRequireDefault(require("./style.css"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
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); }
const NEUTRAL_COLOR = '#607D8B';
const InputTextItem = props => {
  const {
    title,
    placeholder = '',
    value,
    onChange = _noop2.default,
    disabled,
    name,
    index,
    uppercase = true
  } = props;
  const handleOnChange = (0, _react.useMemo)(() => e => onChange(e.target.value), [onChange]);
  return /*#__PURE__*/_react.default.createElement("li", {
    "data-name": name || `inputtext-item-${index}`,
    className: _style.default.selectItem
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)(_style.default.selectTitle, {
      [_style.default.uppercase]: uppercase
    })
  }, title), /*#__PURE__*/_react.default.createElement("input", {
    type: "text",
    name: title,
    className: _style.default.input,
    placeholder: placeholder,
    value: value,
    disabled: disabled,
    onChange: handleOnChange
  }));
};
exports.InputTextItem = InputTextItem;
InputTextItem.propTypes = process.env.NODE_ENV !== "production" ? {
  index: _propTypes.default.number,
  title: _propTypes.default.string.isRequired,
  name: _propTypes.default.string,
  disabled: _propTypes.default.bool,
  value: _propTypes.default.string.isRequired,
  placeholder: _propTypes.default.string,
  onChange: _propTypes.default.func,
  uppercase: _propTypes.default.bool
} : {};
const SelectItem = ({
  name,
  index,
  onChange,
  title,
  options,
  uppercase = true
}) => {
  return /*#__PURE__*/_react.default.createElement("li", {
    "data-name": name || `select-item-${index}`,
    className: _style.default.selectItem
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)(_style.default.selectTitle, {
      [_style.default.uppercase]: uppercase
    })
  }, title), /*#__PURE__*/_react.default.createElement(_select.default, {
    title: title,
    onChange: onChange,
    theme: "header",
    options: options
  }));
};
exports.SelectItem = SelectItem;
SelectItem.propTypes = process.env.NODE_ENV !== "production" ? {
  index: _propTypes.default.number,
  title: _propTypes.default.string.isRequired,
  name: _propTypes.default.string,
  options: _propTypes.default.arrayOf(_propTypes.default.shape({
    name: _propTypes.default.string.isRequired,
    value: _propTypes.default.string.isRequired,
    selected: _propTypes.default.bool.isRequired
  })).isRequired,
  onChange: _propTypes.default.func,
  uppercase: _propTypes.default.bool
} : {};
const MultiSelectItem = ({
  name,
  index,
  onChange,
  title,
  options,
  uppercase = true
}) => {
  return /*#__PURE__*/_react.default.createElement("li", {
    "data-name": name || `select-item-${index}`,
    className: _style.default.selectItem
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: (0, _classnames.default)(_style.default.selectTitle, {
      [_style.default.uppercase]: uppercase
    })
  }, title), /*#__PURE__*/_react.default.createElement(_selectMultiple.default, {
    theme: "sidebar",
    onChange: onChange,
    options: options
  }));
};
exports.MultiSelectItem = MultiSelectItem;
MultiSelectItem.propTypes = process.env.NODE_ENV !== "production" ? SelectItem.propTypes : {};
const LinkItem = ({
  href,
  index,
  name,
  selected,
  color,
  title,
  onClick,
  uppercase = true,
  styles,
  children,
  setChildrenAsHtml = true,
  target = '_self',
  activeIcon = false
}, context) => {
  const skin = (0, _provider.GetSkinFromContext)(context);
  const handleOnClick = (0, _react.useMemo)(() => e => {
    onClick && onClick(e);
  }, [onClick]);
  const classNames = (0, _classnames.default)(_style.default.linkItem, _style.default.innerHTML, {
    [_style.default.uppercase]: uppercase
  }, styles, !activeIcon && setChildrenAsHtml ? _style.default.itemWithoutIcon : null);
  const borderStyle = {
    borderLeftColor: selected ? color : null
  };
  return /*#__PURE__*/_react.default.createElement(_link.default, {
    target: target,
    onClick: handleOnClick,
    hoverColor: (0, _getOr2.default)('#00B0FF', 'common.primary', skin),
    href: href,
    "data-name": name || `link-item-${index}`,
    style: {
      textDecoration: 'none',
      color: selected ? color : NEUTRAL_COLOR
    }
  }, setChildrenAsHtml ? /*#__PURE__*/_react.default.createElement("li", {
    className: classNames,
    style: borderStyle
    // eslint-disable-next-line react/no-danger
    ,
    dangerouslySetInnerHTML: {
      __html: title
    }
  }) : /*#__PURE__*/_react.default.createElement("li", {
    className: classNames,
    style: borderStyle
  }, activeIcon ? /*#__PURE__*/_react.default.createElement(_novaIcons.NovaSolidStatusCheckCircle2, {
    className: _style.default.activeIcon
  }) : null, title, children));
};
exports.LinkItem = LinkItem;
LinkItem.propTypes = process.env.NODE_ENV !== "production" ? {
  index: _propTypes.default.number,
  title: _propTypes.default.string.isRequired,
  selected: _propTypes.default.bool,
  name: _propTypes.default.string,
  href: _propTypes.default.string,
  color: _propTypes.default.string,
  onClick: _propTypes.default.func,
  uppercase: _propTypes.default.bool,
  setChildrenAsHtml: _propTypes.default.bool,
  target: _propTypes.default.string,
  activeIcon: _propTypes.default.bool
} : {};
LinkItem.contextTypes = {
  skin: _provider.default.childContextTypes.skin
};
const IconLinkItem = ({
  index,
  name = `button-link-item-${index}`,
  onClick,
  uppercase = true,
  ...props
}) => {
  const handleOnClick = (0, _react.useMemo)(() => e => {
    onClick && onClick(e);
  }, [onClick]);
  return /*#__PURE__*/_react.default.createElement(LinkItem, _extends({}, props, {
    setChildrenAsHtml: false,
    onClick: handleOnClick,
    name: name,
    uppercase: uppercase,
    index: index
  }), /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyOpenInNewTab, {
    className: _style.default.icon
  }));
};
exports.IconLinkItem = IconLinkItem;
IconLinkItem.propTypes = process.env.NODE_ENV !== "production" ? LinkItem.propTypes : {};
const TitleItem = ({
  name,
  index,
  title,
  uppercase
}) => {
  return /*#__PURE__*/_react.default.createElement("ul", {
    "data-name": name || `item-title-${index}`,
    className: _style.default.titleItem
  }, /*#__PURE__*/_react.default.createElement("li", {
    className: (0, _classnames.default)(_style.default.titleItemTitle, {
      [_style.default.uppercase]: uppercase
    })
  }, title));
};
exports.TitleItem = TitleItem;
TitleItem.propTypes = process.env.NODE_ENV !== "production" ? {
  index: _propTypes.default.number,
  title: _propTypes.default.string.isRequired,
  name: _propTypes.default.string,
  uppercase: _propTypes.default.bool
} : {};
const ButtonItem = ({
  index,
  onClick,
  color,
  neutralColor,
  name,
  href,
  title,
  cta,
  uppercase
}) => {
  const handleOnClick = (0, _react.useMemo)(() => e => {
    onClick && onClick(e);
  }, [onClick]);
  const backgroundColor = neutralColor === true ? NEUTRAL_COLOR : color;
  const button = cta ? /*#__PURE__*/_react.default.createElement(_cta.default, (0, _defaults2.default)({
    onClick: handleOnClick,
    href,
    rectangular: true,
    fullWidth: true,
    secondary: true,
    submitValue: title
  }, cta)) : /*#__PURE__*/_react.default.createElement(_button.default, {
    type: "link",
    href: href,
    onClick: handleOnClick,
    style: {
      backgroundColor
    }
  }, title);
  return /*#__PURE__*/_react.default.createElement("li", {
    "data-name": name || `button-item-${index}`,
    className: (0, _classnames.default)(_style.default.buttonItem, {
      [_style.default.uppercase]: uppercase
    })
  }, button);
};
exports.ButtonItem = ButtonItem;
ButtonItem.propTypes = process.env.NODE_ENV !== "production" ? {
  index: _propTypes.default.number,
  title: _propTypes.default.string.isRequired,
  name: _propTypes.default.string,
  href: _propTypes.default.string,
  color: _propTypes.default.string,
  neutralColor: _propTypes.default.bool,
  onClick: _propTypes.default.func,
  cta: _propTypes.default.oneOfType([_propTypes.default.shape(_cta.default.propTypes), _propTypes.default.bool]),
  uppercase: _propTypes.default.bool
} : {};
const InfoItem = ({
  onClick,
  index,
  name,
  color,
  neutralColor,
  title,
  value,
  uppercase
}) => {
  const handleOnClick = (0, _react.useMemo)(() => e => {
    onClick && onClick(e);
  }, [onClick]);
  const color_ = neutralColor === true ? NEUTRAL_COLOR : color;
  return /*#__PURE__*/_react.default.createElement("ul", {
    "data-name": name || `item-info-${index}`,
    className: _style.default.infoItem
  }, /*#__PURE__*/_react.default.createElement("li", {
    className: _style.default.infoItemTitle
  }, title), /*#__PURE__*/_react.default.createElement("li", {
    className: (0, _classnames.default)(_style.default.infoItemContent, {
      [_style.default.uppercase]: uppercase
    }),
    onClick: handleOnClick,
    style: {
      borderLeftColor: color_,
      color: color_
    }
  }, value));
};
exports.InfoItem = InfoItem;
InfoItem.propTypes = process.env.NODE_ENV !== "production" ? {
  index: _propTypes.default.number,
  title: _propTypes.default.string.isRequired,
  name: _propTypes.default.string,
  color: _propTypes.default.string,
  neutralColor: _propTypes.default.bool,
  value: _propTypes.default.string.isRequired,
  onClick: _propTypes.default.func,
  uppercase: _propTypes.default.bool
} : {};
const SidebarItem = ({
  item,
  color,
  index
}) => {
  switch (item.type) {
    case 'select':
      {
        return /*#__PURE__*/_react.default.createElement(SelectItem, _extends({}, item, {
          color: color,
          index: index
        }));
      }
    case 'multi-select':
      return /*#__PURE__*/_react.default.createElement(MultiSelectItem, _extends({}, item, {
        color: color,
        index: index
      }));
    case 'link':
      return /*#__PURE__*/_react.default.createElement(LinkItem, _extends({}, item, {
        color: color,
        index: index
      }));
    case 'iconLink':
      return /*#__PURE__*/_react.default.createElement(IconLinkItem, _extends({}, item, {
        color: color,
        index: index
      }));
    case 'title':
      return /*#__PURE__*/_react.default.createElement(TitleItem, _extends({}, item, {
        color: color,
        index: index
      }));
    case 'button':
      return /*#__PURE__*/_react.default.createElement(ButtonItem, _extends({}, item, {
        color: color,
        index: index
      }));
    case 'info':
      return /*#__PURE__*/_react.default.createElement(InfoItem, _extends({}, item, {
        color: color,
        index: index
      }));
    case 'inputtext':
      return /*#__PURE__*/_react.default.createElement(InputTextItem, _extends({}, item, {
        color: color,
        index: index
      }));
  }
};
SidebarItem.propTypes = process.env.NODE_ENV !== "production" ? {
  item: _propTypes.default.oneOfType([_propTypes.default.shape({
    ...TitleItem.propTypes,
    type: _propTypes.default.oneOf(['title']).isRequired
  }), _propTypes.default.shape({
    ...IconLinkItem.propTypes,
    type: _propTypes.default.oneOf(['iconLink']).isRequired
  }), _propTypes.default.shape({
    ...ButtonItem.propTypes,
    type: _propTypes.default.oneOf(['button']).isRequired
  }), _propTypes.default.shape({
    ...InfoItem.propTypes,
    type: _propTypes.default.oneOf(['info']).isRequired
  }), _propTypes.default.shape({
    ...LinkItem.propTypes,
    type: _propTypes.default.oneOf(['link']).isRequired
  }), _propTypes.default.shape({
    ...InputTextItem.propTypes,
    type: _propTypes.default.oneOf(['inputtext']).isRequired
  }), _propTypes.default.shape({
    ...SelectItem.propTypes,
    type: _propTypes.default.oneOf(['select']).isRequired
  }), _propTypes.default.shape({
    ...SelectItem.propTypes,
    type: _propTypes.default.oneOf(['multi-select']).isRequired
  })]),
  index: _propTypes.default.number,
  color: _propTypes.default.string,
  uppercase: _propTypes.default.bool
} : {};
const SidebarItems = ({
  items,
  color
}) => {
  return /*#__PURE__*/_react.default.createElement("ul", {
    className: _style.default.sectionItems
  }, items.map((item, index) => /*#__PURE__*/_react.default.createElement(SidebarItem, {
    item: item,
    key: index,
    index: index,
    color: color
  })));
};
SidebarItems.propTypes = process.env.NODE_ENV !== "production" ? {
  color: _propTypes.default.string,
  items: _propTypes.default.arrayOf(_propTypes.default.shape(SidebarItem.propTypes))
} : {};
const Sidebar = ({
  items
}, context) => {
  const sections = Array.isArray(items[0]) ? items : [items];
  const {
    skin
  } = context;
  const defaultColor = (0, _getOr2.default)('#00B0FF', 'common.primary', skin);
  return /*#__PURE__*/_react.default.createElement("div", {
    "data-name": "sidebar",
    className: _style.default.sidebar
  }, sections.map((sidebarSection, idx) => /*#__PURE__*/_react.default.createElement("div", {
    "data-name": `sidebarpart-${idx + 1}`,
    className: _style.default.sidebarPart,
    key: idx
  }, /*#__PURE__*/_react.default.createElement(SidebarItems, {
    items: sidebarSection,
    color: defaultColor
  }))));
};
Sidebar.propTypes = process.env.NODE_ENV !== "production" ? {
  items: _propTypes.default.arrayOf(_propTypes.default.oneOfType([SidebarItem.propTypes.item, _propTypes.default.arrayOf(SidebarItem.propTypes.item).isRequired])).isRequired
} : {};
Sidebar.contextTypes = {
  skin: _provider.default.childContextTypes.skin
};
var _default = exports.default = Sidebar;
//# sourceMappingURL=index.js.map