text: "use strict";
  var __extends = (this && this.__extends) || (function () {
      var extendStatics = Object.setPrototypeOf ||
          ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
          function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
      return function (d, b) {
          extendStatics(d, b);
          function __() { this.constructor = d; }
          d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
      };
  })();
  var __assign = (this && this.__assign) || Object.assign || function(t) {
      for (var s, i = 1, n = arguments.length; i < n; i++) {
          s = arguments[i];
          for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
              t[p] = s[p];
      }
      return t;
  };
  var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
      var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
      if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
      else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
      return c > 3 && r && Object.defineProperty(target, key, r), r;
  };
  Object.defineProperty(exports, "__esModule", { value: true });
  /* tslint:disable:no-unused-variable */
  var React = require("react");
  /* tslint:enable:no-unused-variable */
  var Utilities_1 = require("../../Utilities");
  var TooltipHost_Props_1 = require("./TooltipHost.Props");
  var Tooltip_1 = require("./Tooltip");
  var Tooltip_Props_1 = require("./Tooltip.Props");
  var stylesImport = require("./TooltipHost.scss");
  var styles = stylesImport;
  var TooltipHost = (function (_super) {
      __extends(TooltipHost, _super);
      // Constructor
      function TooltipHost(props) {
          var _this = _super.call(this, props) || this;
          _this.state = {
              isTooltipVisible: false
          };
          return _this;
      }
      // Render
      TooltipHost.prototype.render = function () {
          var _a = this.props, calloutProps = _a.calloutProps, tooltipProps = _a.tooltipProps, content = _a.content, children = _a.children, directionalHint = _a.directionalHint, delay = _a.delay, id = _a.id, hostClassName = _a.hostClassName;
          var isTooltipVisible = this.state.isTooltipVisible;
          var tooltipId = id || Utilities_1.getId('tooltip');
          return (React.createElement("div", __assign({ className: Utilities_1.css('ms-TooltipHost', styles.host, hostClassName), ref: this._resolveRef('_tooltipHost') }, { onFocusCapture: this._onTooltipMouseEnter }, { onBlurCapture: this._onTooltipMouseLeave }, { onMouseEnter: this._onTooltipMouseEnter, onMouseLeave: this._onTooltipMouseLeave, "aria-describedby": isTooltipVisible ? tooltipId : undefined }),
              children,
              isTooltipVisible && (React.createElement(Tooltip_1.Tooltip, __assign({}, tooltipProps, { id: tooltipId, delay: delay, content: content, targetElement: this._getTargetElement(), directionalHint: directionalHint, calloutProps: Utilities_1.assign(calloutProps, { onDismiss: this._onTooltipCallOutDismiss }) }, Utilities_1.getNativeProps(this.props, Utilities_1.divProperties))))));
      };
      TooltipHost.prototype._getTargetElement = function () {
          var overflowMode = this.props.overflowMode;
          // Select target element based on overflow mode. For parent mode, you want to position the tooltip relative
          // to the parent element, otherwise it might look off.
          if (overflowMode !== undefined) {
              switch (overflowMode) {
                  case TooltipHost_Props_1.TooltipOverflowMode.Parent:
                      return this._tooltipHost.parentElement;
                  case TooltipHost_Props_1.TooltipOverflowMode.Self:
                      return this._tooltipHost;
              }
          }
          return this._tooltipHost;
      };
      // Show Tooltip
      TooltipHost.prototype._onTooltipMouseEnter = function (ev) {
          var overflowMode = this.props.overflowMode;
          if (overflowMode !== undefined) {
              var overflowElement = this._getTargetElement();
              if (overflowElement && !Utilities_1.hasOverflow(overflowElement)) {
                  return;
              }
          }
          this.setState({
              isTooltipVisible: true
          });
      };
      // Hide Tooltip
      TooltipHost.prototype._onTooltipMouseLeave = function (ev) {
          this.setState({
              isTooltipVisible: false
          });
      };
      // Hide Tooltip
      TooltipHost.prototype._onTooltipCallOutDismiss = function () {
          this.setState({
              isTooltipVisible: false
          });
      };
      return TooltipHost;
  }(Utilities_1.BaseComponent));
  TooltipHost.defaultProps = {
      delay: Tooltip_Props_1.TooltipDelay.medium
  };
  __decorate([
      Utilities_1.autobind
  ], TooltipHost.prototype, "_onTooltipMouseEnter", null);
  __decorate([
      Utilities_1.autobind
  ], TooltipHost.prototype, "_onTooltipMouseLeave", null);
  __decorate([
      Utilities_1.autobind
  ], TooltipHost.prototype, "_onTooltipCallOutDismiss", null);
  exports.TooltipHost = TooltipHost;
  
  //# sourceMappingURL=TooltipHost.js.map
  