text: define(["exports", "require", "../../@polymer/polymer/polymer-element.js", "../simple-icon/lib/simple-icon-lite.js", "../simple-icon/lib/simple-icons.js", "../hax-iconset/lib/simple-hax-iconset.js"], function (_exports, _require, _polymerElement, _simpleIconLite, _simpleIcons, _simpleHaxIconset) {
    "use strict";
  
    Object.defineProperty(_exports, "__esModule", {
      value: true
    });
    _exports.LrndesignContactcard = void 0;
    _require = babelHelpers.interopRequireWildcard(_require);
  
    function _templateObject_0359742099b011eb851ed31c596cbbd8() {
      var data = babelHelpers.taggedTemplateLiteral(["\n      <style>\n        :host {\n          display: block;\n          --contactcard-icons-hover-color: gray;\n          --contactcard-icons-fill-color: #aeaeae;\n        }\n\n        .name {\n          text-align: center;\n          min-height: 16px;\n        }\n        .name div {\n          font-size: 24px;\n          margin-bottom: 12px;\n        }\n\n        #img_wrap {\n          display: flex;\n          justify-content: center;\n          align-items: flex-start;\n        }\n\n        .profile-image {\n          background-color: #aeaeae;\n          padding: 4px;\n          border-radius: 50%;\n          width: 50%;\n          min-height: 160px;\n          margin-top: 25px;\n        }\n\n        .position {\n          text-align: center;\n          font-style: italic;\n          font-size: 16px;\n          margin: -10px 0 10px;\n        }\n\n        .organization {\n          text-align: center;\n          font-size: 14px;\n          margin: -8px 0 10px;\n        }\n\n        #mail {\n          width: 35px;\n          height: 35px;\n          color: var(--contactcard-icons-fill-color);\n        }\n\n        #mail:hover,\n        #mail:focus {\n          color: var(--contactcard-icons-hover-color);\n        }\n\n        #phone {\n          width: 35px;\n          height: 35px;\n          color: var(--contactcard-icons-fill-color);\n        }\n\n        #phone:hover,\n        #phone:focus {\n          color: var(--contactcard-icons-hover-color);\n        }\n\n        #twitter {\n          width: 35px;\n          height: 35px;\n          color: var(--contactcard-icons-fill-color);\n        }\n        #twitter:hover,\n        #twitter:focus {\n          color: var(--contactcard-icons-hover-color);\n        }\n\n        #website {\n          width: 35px;\n          height: 35px;\n          color: var(--contactcard-icons-fill-color);\n        }\n        #website:hover,\n        #website:focus {\n          color: var(--contactcard-icons-hover-color);\n        }\n\n        #group_icons {\n          width: 70%;\n          margin-left: auto;\n          margin-right: auto;\n          margin-bottom: 10px;\n          border-top: 2px #aeaeae solid;\n          padding-top: 5px;\n        }\n\n        .icons {\n          display: flex;\n          justify-content: center;\n          align-items: flext-start;\n          padding-top: 5px;\n        }\n\n        button {\n          padding: 0;\n          margin: 0 8px;\n          display: block;\n          min-width: 16px;\n          background-color: transparent;\n          border: 0px solid transparent;\n        }\n      </style>\n      <div class=\"card\">\n        <div id=\"img_wrap\">\n          <img loading=\"lazy\" class=\"profile-image\" src=\"[[image]]\" />\n        </div>\n        <div class=\"name\">\n          <template is=\"dom-if\" if=\"[[name]]\">\n            <div>[[name]]</div>\n          </template>\n        </div>\n        <div class=\"position\">[[position]]</div>\n        <div class=\"organization\">[[organization]]</div>\n        <div id=\"group_icons\">\n          <div class=\"icons\">\n            <template is=\"dom-if\" if=\"[[email]]\">\n              <a tabindex=\"-1\" href$=\"mailto:[[email]]\">\n                <button id=\"mail\" title$=\"Email address [[email]]\">\n                  <simple-icon-lite\n                    icon=\"mail\"\n                    class=\"mail_icon\"\n                  ></simple-icon-lite>\n                </button>\n              </a>\n              <simple-tooltip for=\"mail\" position=\"bottom\"\n                >Email</simple-tooltip\n              >\n            </template>\n            <template is=\"dom-if\" if=\"[[phone]]\">\n              <a tabindex=\"-1\" href$=\"tel:[[phone]]\">\n                <button id=\"phone\" title$=\"Phone number [[phone]]\">\n                  <simple-icon-lite\n                    icon=\"maps:local-phone\"\n                    class=\"phone_icon\"\n                  ></simple-icon-lite>\n                </button>\n              </a>\n              <simple-tooltip for=\"phone\" position=\"bottom\"\n                >Call</simple-tooltip\n              >\n            </template>\n            <template is=\"dom-if\" if=\"[[website]]\">\n              <a tabindex=\"-1\" href$=\"[[website]]\">\n                <button id=\"website\" title$=\"Website address [[website]]\">\n                  <simple-icon-lite\n                    icon=\"hardware:desktop-windows\"\n                    class=\"computer_icon\"\n                  ></simple-icon-lite>\n                </button>\n              </a>\n              <simple-tooltip for=\"website\" position=\"bottom\"\n                >Visit</simple-tooltip\n              >\n            </template>\n            <template is=\"dom-if\" if=\"[[twitter]]\">\n              <a tabindex=\"-1\" href$=\"[[twitter]]\">\n                <button id=\"twitter\" title$=\"Twitter name [[twitter]]\">\n                  <simple-icon-lite\n                    icon=\"twitter\"\n                    color=\"#aeaeae\"\n                    size=\"35\"\n                    class=\"twitter_icon\"\n                  ></simple-icon-lite>\n                </button>\n              </a>\n              <simple-tooltip for=\"twitter\" position=\"bottom\"\n                >Connect</simple-tooltip\n              >\n            </template>\n          </div>\n        </div>\n      </div>\n    "]);
  
      _templateObject_0359742099b011eb851ed31c596cbbd8 = function _templateObject_0359742099b011eb851ed31c596cbbd8() {
        return data;
      };
  
      return data;
    }
  
    function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = babelHelpers.getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = babelHelpers.getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return babelHelpers.possibleConstructorReturn(this, result); }; }
  
    function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
  
    /**
    `lrndesign-contactcard`
    lrndesign-contactcard
    
    * @demo demo/index.html
    */
    var LrndesignContactcard = /*#__PURE__*/function (_PolymerElement) {
      babelHelpers.inherits(LrndesignContactcard, _PolymerElement);
  
      var _super = _createSuper(LrndesignContactcard);
  
      function LrndesignContactcard() {
        var _this;
  
        babelHelpers.classCallCheck(this, LrndesignContactcard);
        _this = _super.call(this);
        new Promise(function (res, rej) {
          return _require.default(["../simple-tooltip/simple-tooltip.js"], res, rej);
        });
        return _this;
      }
  
      babelHelpers.createClass(LrndesignContactcard, null, [{
        key: "template",
        get: function get() {
          return (0, _polymerElement.html)(_templateObject_0359742099b011eb851ed31c596cbbd8());
        }
      }, {
        key: "tag",
        get: function get() {
          return "lrndesign-contactcard";
        }
      }, {
        key: "properties",
        get: function get() {
          return {
            /**
             * A url to the image in question.
             */
            image: {
              type: String
            },
  
            /**
             * The email address of the user.
             */
            email: {
              type: String
            },
  
            /**
             * The name of the user.
             */
            name: {
              type: String
            },
  
            /**
             * The job-title / position of the user.
             */
            position: {
              type: String
            },
  
            /**
             * The employer / organization of the user.
             */
            organization: {
              type: String
            },
  
            /**
             * The phone number of the user.
             */
            phone: {
              type: String
            },
  
            /**
             * The associated website of the user.
             */
            website: {
              type: String
            },
  
            /**
             * Twitter account of the user.
             */
            twitter: {
              type: String
            }
          };
        }
      }]);
      return LrndesignContactcard;
    }(_polymerElement.PolymerElement);
  
    _exports.LrndesignContactcard = LrndesignContactcard;
    window.customElements.define(LrndesignContactcard.tag, LrndesignContactcard);
  });