"use strict";

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

var _kind = _interopRequireDefault(require("@enact/core/kind"));

var _Uppercase = _interopRequireDefault(require("@enact/i18n/Uppercase"));

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

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

var _Skinnable = _interopRequireDefault(require("../Skinnable"));

var _TooltipLabel = _interopRequireDefault(require("./TooltipLabel"));

var _Tooltip = _interopRequireDefault(require("./Tooltip.less"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

/**
 * A stateless tooltip component with Moonstone styling applied.
 *
 * @class TooltipBase
 * @memberof moonstone/TooltipDecorator
 * @ui
 * @public
 */
var TooltipBase = (0, _kind.default)({
  name: 'Tooltip',
  propTypes:
  /** @lends moonstone/TooltipDecorator.TooltipBase.prototype */
  {
    /**
     * The node to be displayed as the main content of the tooltip.
     *
     * @type {Node}
     * @required
     */
    children: _propTypes.default.node.isRequired,

    /**
     * Position of tooltip arrow in relation to the activator.
     *
     * * Values: `'left'`, `'center'`, `'right'`, `'top'`, `'middle'`, `'bottom'`
     *
     * Note that `'left'`, `'center'`, `'right'` are applicable when direction is in vertical
     * orientation (i.e. `'above'`, `'below'`), and `'top'`, `'middle'`, and `'bottom'` are
     * applicable when direction is in horizontal orientation (i.e. `'left'`, `'right'`)
     *
     * @type {String}
     * @default 'right'
     * @public
     */
    arrowAnchor: _propTypes.default.oneOf(['left', 'center', 'right', 'top', 'middle', 'bottom']),

    /**
     * Direction of label in relation to the activator.
     *
     * * Values: `'above'`, `'below'`, `'left'`, and `'right'`
     *
     * @type {String}
     * @default 'above'
     * @public
     */
    direction: _propTypes.default.oneOf(['above', 'below', 'left', 'right']),

    /**
     * Style object for tooltip position.
     *
     * @type {Object}
     * @public
     */
    position: _propTypes.default.shape({
      bottom: _propTypes.default.number,
      left: _propTypes.default.number,
      right: _propTypes.default.number,
      top: _propTypes.default.number
    }),

    /**
     * Called when the tooltip mounts/unmounts, giving a reference to the DOM.
     *
     * @type {Function}
     * @public
     */
    tooltipRef: _propTypes.default.func,

    /**
     * The width of tooltip content in pixels (px).
     *
     * If the content goes over the given width, then it will automatically wrap. When `null`,
     * content does not wrap.
     *
     * @type {Number|null}
     * @public
     */
    width: _propTypes.default.number
  },
  defaultProps: {
    arrowAnchor: 'right',
    direction: 'above'
  },
  styles: {
    css: _Tooltip.default,
    className: 'tooltip'
  },
  computed: {
    arrowType: function arrowType(_ref) {
      var arrowAnchor = _ref.arrowAnchor;
      return arrowAnchor === 'center' || arrowAnchor === 'middle' ? 'M0,5C0,4,1,3,3,2.5C1,2,0,1,0,0V5Z' : 'M0,5C0,3,1,0,3,0H0V5Z';
    },
    className: function className(_ref2) {
      var direction = _ref2.direction,
          arrowAnchor = _ref2.arrowAnchor,
          styler = _ref2.styler;
      return styler.append(direction, "".concat(arrowAnchor, "Arrow"));
    },
    style: function style(_ref3) {
      var position = _ref3.position,
          _style = _ref3.style;
      return _objectSpread({}, _style, position);
    }
  },
  render: function render(_ref4) {
    var children = _ref4.children,
        tooltipRef = _ref4.tooltipRef,
        arrowType = _ref4.arrowType,
        width = _ref4.width,
        rest = _objectWithoutProperties(_ref4, ["children", "tooltipRef", "arrowType", "width"]);

    delete rest.arrowAnchor;
    delete rest.direction;
    delete rest.position;
    return _react.default.createElement("div", rest, _react.default.createElement("svg", {
      className: _Tooltip.default.tooltipArrow,
      viewBox: "0 0 3 5"
    }, _react.default.createElement("path", {
      d: arrowType
    })), _react.default.createElement(_TooltipLabel.default, {
      tooltipRef: tooltipRef,
      width: width
    }, children));
  }
});
/**
 * A tooltip component with Moonstone styling applied. If the Tooltip's child component is text, it
 * will be uppercased unless `casing` is set.
 *
 * @class Tooltip
 * @memberof moonstone/TooltipDecorator
 * @mixes i18n/Uppercase.Uppercase
 * @ui
 * @public
 */

exports.TooltipBase = TooltipBase;
var Tooltip = (0, _Skinnable.default)((0, _Uppercase.default)(TooltipBase));
exports.Tooltip = Tooltip;
var _default = Tooltip;
exports.default = _default;