text: define(["exports", "../../../../@polymer/polymer/polymer-element.js", "../../../../@polymer/polymer/lib/utils/render-status.js", "../../../../@polymer/polymer/lib/legacy/class.js", "../../../../@polymer/iron-resizable-behavior/iron-resizable-behavior.js", "../../../../@polymer/paper-card/paper-card.js", "../../../../@polymer/paper-button/paper-button.js", "../../../lrn-icon/lrn-icon.js", "../../../../@polymer/polymer/lib/elements/dom-if.js", "../../../lrndesign-avatar/lrndesign-avatar.js"], function (_exports, _polymerElement, _renderStatus, _class, _ironResizableBehavior, _paperCard, _paperButton, _lrnIcon, _domIf, _lrndesignAvatar) {
    "use strict";
  
    Object.defineProperty(_exports, "__esModule", {
      value: true
    });
    _exports.LrnappBlockRecentCommentsComment = void 0;
  
    function _templateObject_40d5e710d1d911ea92952ff2097cf814() {
      var data = babelHelpers.taggedTemplateLiteral(["\n      <style>\n        :host {\n          display: block;\n        }\n\n        paper-card {\n          padding: 2em 2em 0 2em;\n          clear: right;\n        }\n\n        paper-button {\n          background-color: var(--paper-grey-100);\n          margin: 1em;\n        }\n\n        .card-content {\n          padding-left: 2em;\n          padding-right: 2em;\n          width: 100%;\n        }\n\n        .card-actions {\n          width: 100%;\n        }\n\n        .card-actions paper-button {\n          display: flex;\n        }\n\n        lrndesign-avatar {\n          float: left;\n          margin-right: 1em;\n        }\n\n        .flex-wrap {\n          @apply --layout-horizontal;\n          @apply --layout-wrap;\n        }\n\n        .inactive {\n          max-height: 4.6em;\n          overflow: hidden;\n        }\n\n        paper-button {\n          background: white;\n          width: 100%;\n          display: flex;\n        }\n\n        lrn-icon {\n          color: black;\n          width: 100%;\n        }\n\n        .hidden {\n          display: none;\n        }\n      </style>\n      <paper-card elevation=\"3\" class=\"flex-wrap\">\n        <div class=\"card-content\">\n          <lrndesign-avatar\n            label=\"[[commentUser.name]]\"\n            src=\"[[commentUser.avatar]]\"\n          ></lrndesign-avatar>\n          <h3>[[commentUser.display_name]]</h3>\n          <div id=\"wrapper\" class=\"button-wrapper\">\n            <div id=\"comment\" class=\"inactive\"><slot></slot></div>\n            <paper-button id=\"btn\" class=\"hidden\">\n              <lrn-icon icon=\"chevron-down\" id=\"icon\"></lrn-icon>\n            </paper-button>\n          </div>\n        </div>\n        <div class=\"card-actions\">\n          <template is=\"dom-if\" if=\"[[actionView]]\">\n            <a href$=\"[[actionView]]\" tabindex=\"-1\">\n              <paper-button raised=\"\" id=\"view\">View thread</paper-button>\n            </a>\n          </template>\n        </div>\n      </paper-card>\n    "]);
  
      _templateObject_40d5e710d1d911ea92952ff2097cf814 = function _templateObject_40d5e710d1d911ea92952ff2097cf814() {
        return data;
      };
  
      return data;
    }
  
    var LrnappBlockRecentCommentsComment =
    /*#__PURE__*/
    function (_mixinBehaviors) {
      babelHelpers.inherits(LrnappBlockRecentCommentsComment, _mixinBehaviors);
  
      function LrnappBlockRecentCommentsComment() {
        babelHelpers.classCallCheck(this, LrnappBlockRecentCommentsComment);
        return babelHelpers.possibleConstructorReturn(this, babelHelpers.getPrototypeOf(LrnappBlockRecentCommentsComment).apply(this, arguments));
      }
  
      babelHelpers.createClass(LrnappBlockRecentCommentsComment, [{
        key: "onHeightChange",
        value: function onHeightChange() {
          var height = this.$.comment.offsetHeight;
  
          if (height > 80) {
            this.$.btn.classList.toggle("hidden", this.hidden);
          }
        }
      }, {
        key: "connectedCallback",
  
        /**
         * attached life cycle
         */
        value: function connectedCallback() {
          babelHelpers.get(babelHelpers.getPrototypeOf(LrnappBlockRecentCommentsComment.prototype), "connectedCallback", this).call(this);
          (0, _renderStatus.afterNextRender)(this, function () {
            this.$.wrapper.addEventListener("click", function (e) {
              this.$.comment.classList.toggle("inactive", this.inactive);
            });
            this.addEventListener("iron-resize", this.onHeightChange.bind(this));
          });
        }
        /**
         * detached life cycle
         */
  
      }, {
        key: "disconnectedCallback",
        value: function disconnectedCallback() {
          this.$.wrapper.removeEventListener("click", function (e) {
            this.$.comment.classList.toggle("inactive", this.inactive);
          });
          this.removeEventListener("iron-resize", this.onHeightChange.bind(this));
          babelHelpers.get(babelHelpers.getPrototypeOf(LrnappBlockRecentCommentsComment.prototype), "disconnectedCallback", this).call(this);
        }
      }], [{
        key: "template",
        get: function get() {
          return (0, _polymerElement.html)(_templateObject_40d5e710d1d911ea92952ff2097cf814());
        }
      }, {
        key: "tag",
        get: function get() {
          return "lrnapp-block-recent-comments-comment";
        }
      }, {
        key: "properties",
        get: function get() {
          return {
            elmslnCourse: {
              type: String
            },
            elmslnSection: {
              type: String
            },
            basePath: {
              type: String
            },
            csrfToken: {
              type: String
            },
            endPoint: {
              type: String
            },
            commentTitle: {
              type: String,
              value: "Comment title",
              reflectToAttribute: true,
              notify: true
            },
            actionView: {
              type: String,
              reflectToAttribute: true,
              notify: true
            },
            dateUpdated: {
              type: String,
              reflectToAttribute: true,
              notify: true
            },
            commentUser: {
              type: Object,
              value: {},
              reflectToAttribute: true,
              notify: true
            }
          };
        }
      }]);
      return LrnappBlockRecentCommentsComment;
    }((0, _class.mixinBehaviors)([_ironResizableBehavior.IronResizableBehavior], _polymerElement.PolymerElement));
  
    _exports.LrnappBlockRecentCommentsComment = LrnappBlockRecentCommentsComment;
    window.customElements.define(LrnappBlockRecentCommentsComment.tag, LrnappBlockRecentCommentsComment);
  });