@nguyentc21/react-native-tooltip/lib/commonjs/Tooltip/usePosition.js

Simple tooltip for React native app

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _functions = require("./functions");
const usePosition = props => {
  const {
    placement,
    forcePlacement,
    targetContentLayout,
    tooltipContentLayout,
    caretSize = 0,
    safeAreaInsets,
    hideCaret
  } = props;
  const [contentState, setContentState] = (0, _react.useState)(undefined);
  const [caretState, setCaretState] = (0, _react.useState)(undefined);
  const dimension = (0, _reactNative.useWindowDimensions)();
  const _checkIsCaretNeedHidden = (caretPosition, tooltipPosition, tooltipContentLayout) => {
    if (!!caretPosition.hidden) return true;
    const caretWidth = (0, _functions.getCaretWidth)(caretSize);
    const padding = caretWidth * 0.05 > _reactNative.StyleSheet.hairlineWidth ? caretWidth * 0.05 : _reactNative.StyleSheet.hairlineWidth;
    return (0, _functions.checkIsXInsideY)({
      pageX: caretPosition.left - (caretWidth - caretSize) * 0.5,
      pageY: caretPosition.top - (caretWidth - caretSize) * 0.5,
      width: caretWidth,
      height: caretWidth,
      x: 0,
      y: 0
    }, {
      pageX: tooltipPosition.left,
      pageY: tooltipPosition.top,
      width: tooltipContentLayout.width,
      height: tooltipContentLayout.height,
      x: 0,
      y: 0
    }, padding);
  };
  (0, _react.useEffect)(() => {
    if (!targetContentLayout || !tooltipContentLayout) return;
    const _finalPlacement = (0, _functions.getTheFinalPlacement)({
      targetContentLayout,
      tooltipContentLayout,
      dimension,
      caretSize,
      placement,
      forcePlacement,
      safeAreaInsets
    });
    const caretPosition = !hideCaret ? (0, _functions.getCaretPosition)({
      dimension,
      targetContentLayout,
      caretSize,
      placement: _finalPlacement,
      safeAreaInsets
    }) : {
      hidden: true,
      top: 0,
      left: 0
    };
    const tooltipPosition = (0, _functions.getTooltipPosition)({
      dimension,
      tooltipContentLayout,
      targetContentLayout,
      caretSize: !!caretPosition.hidden ? 0 : caretSize,
      placement: _finalPlacement,
      safeAreaInsets
    });
    const isCaretNeedHidden = _checkIsCaretNeedHidden(caretPosition, tooltipPosition, tooltipContentLayout);
    setContentState({
      top: tooltipPosition.top,
      left: tooltipPosition.left,
      hidden: !!tooltipPosition.hidden
    });
    setCaretState({
      top: caretPosition.top,
      left: caretPosition.left,
      hidden: !!caretPosition.hidden || isCaretNeedHidden
    });
  }, [hideCaret, caretSize, dimension, safeAreaInsets, placement, forcePlacement, targetContentLayout, tooltipContentLayout]);
  return {
    contentPosition: contentState,
    caretPosition: caretState
  };
};
var _default = exports.default = usePosition;
//# sourceMappingURL=usePosition.js.map