"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.DISPLAY_AS_SUMMARY_LIMIT = void 0;

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _react = _interopRequireWildcard(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));

var _IconTextLeft = _interopRequireDefault(require("@instructure/ui-icons/lib/Line/IconTextLeft"));

var _lib = _interopRequireDefault(require("@instructure/ui-themeable/lib"));

var _Button = _interopRequireDefault(require("@instructure/ui-buttons/lib/components/Button"));

var _Flex = _interopRequireWildcard(require("@instructure/ui-layout/lib/components/Flex"));

var _ScreenReaderContent = _interopRequireDefault(require("@instructure/ui-a11y/lib/components/ScreenReaderContent"));

var _keyboardClickable = _interopRequireDefault(require("../../../../../common/util/keyboardClickable"));

var _Collection = _interopRequireDefault(require("./Collection"));

var _Title = _interopRequireDefault(require("./Title"));

var _Summary = _interopRequireDefault(require("./Summary"));

var _theme = _interopRequireDefault(require("./theme"));

var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/lib/format-message"));

var _dec, _class, _class2, _temp;

var styles = {
  componentId: 'cqghd',
  template: function template(theme) {
    return "\n\n.cqghd_kQJA{border-bottom:".concat(theme.sidebarItemBorderWidth || 'inherit', " solid ").concat(theme.sidebarItemBorderColor || 'inherit', "}\n\n.cqghd_cESm{border-right:").concat(theme.hoverBorderWidth || 'inherit', " solid ").concat(theme.borderColor || 'inherit', ";padding:").concat(theme.sidebarClosedButtonPadding || 'inherit', ";text-align:center}\n\n[dir=ltr] .cqghd_cESm,[dir=rtl] .cqghd_cESm{text-align:center}\n\n.cqghd_cESm:hover{border-right:").concat(theme.hoverBorderWidth || 'inherit', " solid ").concat(theme.hoverBorderColor || 'inherit', "}\n\n.cqghd_faDl{border-right:").concat(theme.hoverBorderWidth || 'inherit', " solid ").concat(theme.borderColor || 'inherit', ";padding:").concat(theme.sidebarHeaderPadding || 'inherit', " 0}\n\n.cqghd_faDl:hover{border-right:").concat(theme.hoverBorderWidth || 'inherit', " solid ").concat(theme.hoverBorderColor || 'inherit', "}\n\n.cqghd_bTns{margin-left:5%}\n\n.cqghd_cdGL{color:").concat(theme.sidebarIsOpenInfoHeaderColor || 'inherit', ";font-size:").concat(theme.sidebarIsOpenInfoHeaderFontSize || 'inherit', ";margin-bottom:").concat(theme.sidebarIsOpenInfoHeaderMargin || 'inherit', ";padding-left:").concat(theme.sidebarIsOpenInfoHeaderPadding || 'inherit', "}");
  },
  'sidebarItem': 'cqghd_kQJA',
  'sidebarItemClosedButton': 'cqghd_cESm',
  'stimulusHeader': 'cqghd_faDl',
  'stimulusBody': 'cqghd_bTns',
  'infoHeader': 'cqghd_cdGL'
};
var DISPLAY_AS_SUMMARY_LIMIT = 5;
exports.DISPLAY_AS_SUMMARY_LIMIT = DISPLAY_AS_SUMMARY_LIMIT;
var SidebarStimulus = (_dec = (0, _lib.default)(_theme.default, styles), _dec(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(SidebarStimulus, _Component);

  function SidebarStimulus() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, SidebarStimulus);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(SidebarStimulus)).call.apply(_getPrototypeOf2, [this].concat(args)));

    _this.scrollToItem = function (e) {
      // this can be a real scroll or a oqaat change
      // depending on whether is is oqaat or not
      _this.props.scrollToItem(_this.props.stimulusParent.id);

      e.stopPropagation();
    };

    return _this;
  }

  (0, _createClass2.default)(SidebarStimulus, [{
    key: "renderCollection",
    value: function renderCollection() {
      if (this.props.isDragging) {
        return;
      }

      var _this$props = this.props,
          displayPosition = _this$props.displayPosition,
          isOver = _this$props.isOver,
          isShowingItems = _this$props.isShowingItems,
          renderSidebarItem = _this$props.renderSidebarItem,
          sidebarOpen = _this$props.sidebarOpen;
      return _react.default.createElement(_Collection.default, {
        firstPosition: displayPosition,
        isOver: isOver,
        isShowingItems: isShowingItems,
        itemCollection: this.props.childEntries,
        renderSidebarItem: renderSidebarItem,
        sidebarOpen: sidebarOpen,
        stimulusId: this.props.stimulus.id
      });
    }
  }, {
    key: "renderButton",
    value: function renderButton() {
      var displayPosition = this.props.displayPosition;
      return _react.default.createElement(_Button.default, {
        icon: _IconTextLeft.default,
        onClick: this.scrollToItem,
        onKeyDown: _keyboardClickable.default,
        variant: "icon"
      }, _react.default.createElement(_ScreenReaderContent.default, null, "Scroll to stimulus at posision " + displayPosition));
    }
  }, {
    key: "renderClosed",
    value: function renderClosed() {
      return _react.default.createElement("div", {
        className: styles.sidebarItem
      }, _react.default.createElement("div", {
        className: styles.sidebarItemClosedButton
      }, this.renderButton()), this.renderCollection());
    }
  }, {
    key: "renderOpen",
    value: function renderOpen() {
      var _this$props2 = this.props,
          children = _this$props2.children,
          displayPosition = _this$props2.displayPosition,
          isDragging = _this$props2.isDragging,
          isShowingItems = _this$props2.isShowingItems,
          sidebarOpen = _this$props2.sidebarOpen,
          stimulus = _this$props2.stimulus;
      return _react.default.createElement("div", {
        className: styles.sidebarItem
      }, _react.default.createElement("div", {
        className: styles.stimulusHeader
      }, _react.default.createElement("div", {
        className: styles.infoHeader
      }, "Stimulus"), _react.default.createElement("div", {
        className: styles.stimulusBody
      }, _react.default.createElement(_Flex.default, {
        justifyItems: "space-between"
      }, _react.default.createElement(_Flex.FlexItem, null, this.renderButton()), _react.default.createElement(_Flex.FlexItem, {
        grow: true,
        shrink: true,
        onClick: this.scrollToItem,
        tabIndex: "-1"
      }, _react.default.createElement(_Title.default, {
        title: stimulus.title
      })), _react.default.createElement(_Flex.FlexItem, null, children)), _react.default.createElement(_Summary.default, {
        startPosition: displayPosition,
        isDragging: isDragging,
        isShowingItems: isShowingItems,
        sidebarOpen: sidebarOpen,
        stimulusId: stimulus.id,
        numberOfItems: this.props.childEntries.size
      }))), this.renderCollection());
    }
  }, {
    key: "render",
    value: function render() {
      return this.props.sidebarOpen ? this.renderOpen() : this.renderClosed();
    }
  }]);
  SidebarStimulus.displayName = "SidebarStimulus";
  return SidebarStimulus;
}(_react.Component), _class2.propTypes = {
  childEntries: _reactImmutableProptypes.default.listOf(_reactImmutableProptypes.default.record).isRequired,
  // Passed in by Sidebar
  children: _propTypes.default.element,
  displayPosition: _propTypes.default.number.isRequired,

  /* This is used for when the stimulus is being dragged in build */
  isDragging: _propTypes.default.bool,
  isOver: _propTypes.default.bool,
  isShowingItems: _propTypes.default.bool,
  renderSidebarItem: _propTypes.default.func.isRequired,
  scrollToItem: _propTypes.default.func.isRequired,
  sidebarOpen: _propTypes.default.bool.isRequired,
  stimulus: _reactImmutableProptypes.default.record.isRequired,
  stimulusParent: _reactImmutableProptypes.default.record.isRequired
}, _class2.defaultProps = {
  children: null,
  isDragging: false,
  isOver: false,
  isShowingItems: false
}, _temp)) || _class);
exports.default = SidebarStimulus;