"use strict";

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

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

var _util = require("@enact/core/util");

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

var _I18nDecorator = require("@enact/i18n/I18nDecorator");

var _NumFmt = _interopRequireDefault(require("@enact/i18n/ilib/lib/NumFmt"));

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

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

var _warning = _interopRequireDefault(require("warning"));

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

var _ProgressBarTooltip = _interopRequireDefault(require("./ProgressBarTooltip.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; }

var memoizedPercentFormatter = (0, _util.memoize)(function () {
  return (
    /* locale */
    new _NumFmt.default({
      type: 'percentage',
      useNative: false
    })
  );
});

var getSide = function getSide(orientation, side) {
  var valid = orientation === 'vertical' || orientation === 'horizontal' && (side === 'before' || side === 'after');
  process.env.NODE_ENV !== "production" ? (0, _warning.default)(valid, 'The value of `side` must be either "after" or "before" when `orientation` is "horizontal"') : void 0;
  return valid ? side : 'before';
};
/**
 * A [Tooltip]{@link moonstone/TooltipDecorator.Tooltip} specifically adapted for use with
 * [IncrementSlider]{@link moonstone/IncrementSlider.IncrementSlider},
 * [ProgressBar]{@link moonstone/ProgressBar.ProgressBar}, or
 * [Slider]{@link moonstone/Slider.Slider}.
 *
 * @class ProgressBarTooltip
 * @memberof moonstone/ProgressBar
 * @ui
 * @public
 */


var ProgressBarTooltipBase = (0, _kind.default)({
  name: 'ProgressBarTooltip',
  propTypes:
  /** @lends moonstone/ProgressBar.ProgressBarTooltip.prototype */
  {
    /**
     * Sets the orientation of the tooltip based on the orientation of the bar.
     *
     * 'vertical' sends the tooltip to one of the sides, 'horizontal'  positions it above the bar.
     * * Values: `'horizontal'`, `'vertical'`
     *
     * @type {String}
     * @default 'horizontal'
     * @public
     */
    orientation: _propTypes.default.oneOf(['horizontal', 'vertical']),

    /**
     * Displays the value as a percentage.
     *
     * @type {Boolean}
     * @default false
     * @public
     */
    percent: _propTypes.default.bool,

    /**
     * The proportion of the filled part of the bar.
     *
     * * Should be a number between 0 and 1.
     *
     * @type {Number}
     * @default 0
     * @public
     */
    proportion: _propTypes.default.number,

    /**
     * Sets the text direction to be right-to-left
     *
     * @type {Boolean}
     * @private
     */
    rtl: _propTypes.default.bool,

    /**
     * Specify where the tooltip should appear in relation to the ProgressBar/Slider bar.
     *
     * Allowed values are:
     *
     * * `'after'` renders below a `horizontal` ProgressBar/Slider and after (respecting the
     *   current locale's text direction) a `vertical` ProgressBar/Slider
     * * `'before'` renders above a `horizontal` ProgressBar/Slider and before (respecting the
     *   current locale's text direction) a `vertical` ProgressBar/Slider
     * * `'left'` renders to the left of a `vertical` ProgressBar/Slider regardless of locale
     * * `'right'` renders to the right of a `vertical` ProgressBar/Slider regardless of locale
     *
     * @type {String}
     * @default 'before'
     * @public
     */
    side: _propTypes.default.oneOf(['after', 'before', 'left', 'right']),

    /**
     * Visibility of the tooltip
     *
     * @type {Boolean}
     * @default false
     * @public
     */
    visible: _propTypes.default.bool
  },
  defaultProps: {
    orientation: 'horizontal',
    percent: false,
    proportion: 0,
    side: 'before',
    visible: false
  },
  styles: {
    css: _ProgressBarTooltip.default,
    className: 'tooltip'
  },
  computed: {
    children: function children(_ref) {
      var _children = _ref.children,
          proportion = _ref.proportion,
          percent = _ref.percent;

      if (percent) {
        var formatter = memoizedPercentFormatter(_i18n.default.getLocale());
        return formatter.format(Math.round(proportion * 100));
      }

      return _children;
    },
    className: function className(_ref2) {
      var orientation = _ref2.orientation,
          proportion = _ref2.proportion,
          side = _ref2.side,
          styler = _ref2.styler;
      side = getSide(orientation, side);
      return styler.append(orientation, {
        afterMidpoint: proportion > 0.5,
        ignoreLocale: side === 'left' || side === 'right'
      }, side === 'before' || side === 'left' ? 'before' : 'after');
    },
    arrowAnchor: function arrowAnchor(_ref3) {
      var proportion = _ref3.proportion,
          orientation = _ref3.orientation;
      if (orientation === 'vertical') return 'middle';
      return proportion > 0.5 ? 'left' : 'right';
    },
    direction: function direction(_ref4) {
      var orientation = _ref4.orientation,
          rtl = _ref4.rtl,
          side = _ref4.side;
      side = getSide(orientation, side);
      var dir = 'right';

      if (orientation === 'vertical') {
        if ( // forced to the left
        side === 'left' || // LTR before
        !rtl && side === 'before' || // RTL after
        rtl && side === 'after') {
          dir = 'left';
        }
      } else {
        dir = side === 'before' ? 'above' : 'below';
      }

      return dir;
    },
    style: function style(_ref5) {
      var proportion = _ref5.proportion,
          _style = _ref5.style;
      return _objectSpread({}, _style, {
        '--tooltip-progress-proportion': proportion
      });
    }
  },
  render: function render(_ref6) {
    var children = _ref6.children,
        visible = _ref6.visible,
        rest = _objectWithoutProperties(_ref6, ["children", "visible"]);

    if (!visible) return null;
    delete rest.orientation;
    delete rest.percent;
    delete rest.proportion;
    delete rest.rtl;
    delete rest.side;
    return _react.default.createElement(_Tooltip.default, rest, children);
  }
});
exports.ProgressBarTooltipBase = ProgressBarTooltipBase;
var ProgressBarTooltip = (0, _I18nDecorator.I18nContextDecorator)({
  rtlProp: 'rtl'
}, ProgressBarTooltipBase);
exports.ProgressBarTooltip = ProgressBarTooltip;
ProgressBarTooltip.defaultSlot = 'tooltip';
var _default = ProgressBarTooltip;
exports.default = _default;