Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@uiw/react-overlay-trigger

Package Overview
Dependencies
Maintainers
2
Versions
172
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@uiw/react-overlay-trigger - npm Package Compare versions

Comparing version 5.0.0-bate-5 to 5.0.0-bate-6

57

cjs/getStyle.js
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {

@@ -9,19 +8,13 @@ value: true

exports.getStyle = getStyle;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _utils = require("@uiw/utils");
var _getBoundingClientRect = _interopRequireDefault(require("./util/getBoundingClientRect"));
var _getOuterSizes = _interopRequireDefault(require("./util/getOuterSizes"));
function getStyle(options) {
var _ref = options || {},
triggerDom = _ref.trigger,
popupDom = _ref.popup,
placement = _ref.placement,
usePortal = _ref.usePortal,
autoAdjustOverflow = _ref.autoAdjustOverflow;
triggerDom = _ref.trigger,
popupDom = _ref.popup,
placement = _ref.placement,
usePortal = _ref.usePortal,
autoAdjustOverflow = _ref.autoAdjustOverflow;
var sty = {

@@ -32,7 +25,5 @@ left: 0,

};
if (!triggerDom || !popupDom || !document) {
return sty;
}
var winSizeHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);

@@ -49,3 +40,2 @@ var winSizeWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);

sty.left = trigger.left;
if (!usePortal) {

@@ -55,19 +45,14 @@ sty.top = trigger.offsetTop;

}
if (placement && /^(top)/.test(placement)) {
sty.top -= popup.height;
}
if (placement && /^(right)/.test(placement)) {
sty.left += trigger.width;
}
if (placement && /^(bottom)/.test(placement)) {
sty.top += trigger.height;
}
if (placement && /^(left)/.test(placement)) {
sty.left -= popup.width;
}
switch (sty.placement) {

@@ -77,9 +62,7 @@ case 'bottomLeft':

break;
case 'bottom': // eslint-disable-next-line
case 'bottom':
// eslint-disable-next-line
case 'top':
sty.left = sty.left - (popup.width - trigger.width) / 2;
break;
case 'bottomRight':

@@ -89,13 +72,10 @@ case 'topRight':

break;
case 'rightTop':
case 'leftTop':
break;
case 'right': // eslint-disable-next-line
case 'right':
// eslint-disable-next-line
case 'left':
sty.top = sty.top - (popup.height - trigger.height) / 2;
break;
case 'rightBottom':

@@ -105,7 +85,5 @@ case 'leftBottom':

break;
default:
break;
}
if (autoAdjustOverflow) {

@@ -116,3 +94,2 @@ if (placement && /^(top)/.test(placement) && trigger.top < popup.height && bottom > popup.height) {

}
if (placement && /^(bottom)/.test(placement) && bottom < popup.height && trigger.top > popup.height) {

@@ -122,3 +99,2 @@ sty.placement = placement.replace(/^bottom/, 'top');

}
if (placement && /^(right)/.test(placement) && right < popup.width) {

@@ -128,3 +104,2 @@ sty.placement = placement.replace(/^right/, 'left');

}
if (placement && /^(left)/.test(placement) && trigger.left < popup.width) {

@@ -134,3 +109,2 @@ sty.placement = placement.replace(/^left/, 'right');

}
if (placement && /^(left|right)/.test(placement) && usePortal) {

@@ -146,3 +120,2 @@ // Top

}
if (placement && /(Bottom)$/.test(placement) && trigger.bottom < popup.height) {

@@ -152,9 +125,7 @@ // eslint-disable-next-line

}
if (placement && /(right|left)$/.test(placement) && trigger.bottom - trigger.height / 2 < popup.height / 2) {
sty.top = sty.top + popup.height / 2 - (trigger.bottom - trigger.height / 2);
}
} // Bottom Public Part
}
// Bottom Public Part
if (placement && /^(left|right)/.test(placement)) {

@@ -178,5 +149,4 @@ if (/(Top)$/.test(placement) && bottom + trigger.height < popup.height) {

sty.left = scrollLeft;
} // right
}
// right
if (/(top|bottom)$/.test(placement) && right + trigger.width / 2 < popup.width / 2) {

@@ -193,3 +163,2 @@ sty.left = trigger.left + trigger.width + right - popup.width;

}
if (/(Right)$/.test(placement) && right < 0) {

@@ -196,0 +165,0 @@ sty.left = sty.left + right; // eslint-disable-line

"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
Object.defineProperty(exports, "__esModule", {

@@ -11,27 +9,14 @@ value: true

exports["default"] = void 0;
var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var _react = _interopRequireWildcard(require("react"));
var _utils = require("@uiw/utils");
var _utils2 = _interopRequireDefault(require("./utils"));
var _getStyle = require("./getStyle");
var _style = require("./style");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["className", "prefixCls", "usePortal", "isOutside", "isClickOutside", "disabled", "isOpen", "trigger", "placement", "autoAdjustOverflow", "transitionName", "children", "overlay", "onVisibleChange", "onEnter"];
var normalizeDelay = function normalizeDelay(delay) {

@@ -43,31 +28,29 @@ return delay && (0, _typeof2["default"])(delay) === 'object' ? delay : {

};
var _default = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
var className = props.className,
_props$prefixCls = props.prefixCls,
prefixCls = _props$prefixCls === void 0 ? 'w-overlay-trigger' : _props$prefixCls,
_props$usePortal = props.usePortal,
usePortal = _props$usePortal === void 0 ? true : _props$usePortal,
_props$isOutside = props.isOutside,
isOutside = _props$isOutside === void 0 ? false : _props$isOutside,
_props$isClickOutside = props.isClickOutside,
isClickOutside = _props$isClickOutside === void 0 ? true : _props$isClickOutside,
_props$disabled = props.disabled,
disabled = _props$disabled === void 0 ? false : _props$disabled,
_props$isOpen = props.isOpen,
_ = _props$isOpen === void 0 ? false : _props$isOpen,
_props$trigger = props.trigger,
trigger = _props$trigger === void 0 ? 'hover' : _props$trigger,
_props$placement = props.placement,
placement = _props$placement === void 0 ? 'top' : _props$placement,
autoAdjustOverflow = props.autoAdjustOverflow,
transitionName = props.transitionName,
children = props.children,
overlay = props.overlay,
_props$onVisibleChang = props.onVisibleChange,
onVisibleChange = _props$onVisibleChang === void 0 ? _utils.noop : _props$onVisibleChang,
_props$onEnter = props.onEnter,
onEnter = _props$onEnter === void 0 ? _utils.noop : _props$onEnter,
other = (0, _objectWithoutProperties2["default"])(props, _excluded);
_props$prefixCls = props.prefixCls,
prefixCls = _props$prefixCls === void 0 ? 'w-overlay-trigger' : _props$prefixCls,
_props$usePortal = props.usePortal,
usePortal = _props$usePortal === void 0 ? true : _props$usePortal,
_props$isOutside = props.isOutside,
isOutside = _props$isOutside === void 0 ? false : _props$isOutside,
_props$isClickOutside = props.isClickOutside,
isClickOutside = _props$isClickOutside === void 0 ? true : _props$isClickOutside,
_props$disabled = props.disabled,
disabled = _props$disabled === void 0 ? false : _props$disabled,
_props$isOpen = props.isOpen,
_ = _props$isOpen === void 0 ? false : _props$isOpen,
_props$trigger = props.trigger,
trigger = _props$trigger === void 0 ? 'hover' : _props$trigger,
_props$placement = props.placement,
placement = _props$placement === void 0 ? 'top' : _props$placement,
autoAdjustOverflow = props.autoAdjustOverflow,
transitionName = props.transitionName,
children = props.children,
overlay = props.overlay,
_props$onVisibleChang = props.onVisibleChange,
onVisibleChange = _props$onVisibleChang === void 0 ? _utils.noop : _props$onVisibleChang,
_props$onEnter = props.onEnter,
onEnter = _props$onEnter === void 0 ? _utils.noop : _props$onEnter,
other = (0, _objectWithoutProperties2["default"])(props, _excluded);
var zIndex = (0, _react.useRef)(999);

@@ -78,20 +61,17 @@ var triggerRef = (0, _react.useRef)();

var hoverStateRef = (0, _react.useRef)(null);
var _useState = (0, _react.useState)(!!props.isOpen),
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
isOpen = _useState2[0],
setIsOpen = _useState2[1];
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
isOpen = _useState2[0],
setIsOpen = _useState2[1];
var _useState3 = (0, _react.useState)({
placement: placement,
top: 0,
bottom: 0,
left: 0,
right: 0,
zIndex: zIndex.current
}),
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
overlayStyl = _useState4[0],
setOverlayStyl = _useState4[1];
placement: placement,
top: 0,
bottom: 0,
left: 0,
right: 0,
zIndex: zIndex.current
}),
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
overlayStyl = _useState4[0],
setOverlayStyl = _useState4[1];
(0, _react.useImperativeHandle)(ref, function () {

@@ -108,5 +88,3 @@ return {

});
var child = _react["default"].Children.only(children);
var overlayProps = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, other), {}, {

@@ -118,3 +96,2 @@ placement: placement,

var triggerProps = {};
function getChildProps() {

@@ -124,6 +101,4 @@ if (child && /*#__PURE__*/_react["default"].isValidElement(child)) {

}
return {};
}
(0, _react.useEffect)(function () {

@@ -134,3 +109,2 @@ if (isClickOutside && isOpen) {

}
return function () {

@@ -159,3 +133,2 @@ document && isClickOutside && document.removeEventListener('mousedown', handleClickOutside);

}, [isOpen]);
var handleResize = function handleResize() {

@@ -168,7 +141,5 @@ if (isOpen) {

};
var handleClickOutside = function handleClickOutside(e) {
var popNode = popupRef.current;
var childNode = triggerRef.current;
if (popNode && childNode && e.target && !(0, _utils2["default"])(popNode, e.target) && !(0, _utils2["default"])(childNode, e.target)) {

@@ -180,8 +151,6 @@ zIndex.current -= 1;

};
function clearTimeouts() {
if (timeoutRef.current.length > 0) {
var _iterator = (0, _createForOfIteratorHelper2["default"])(timeoutRef.current),
_step;
_step;
try {

@@ -197,20 +166,14 @@ for (_iterator.s(); !(_step = _iterator.n()).done;) {

}
timeoutRef.current = [];
}
}
function handleShow() {
var _props$children;
clearTimeouts();
hoverStateRef.current = 'show';
var delay = normalizeDelay(props.delay);
if (!delay.show && !((_props$children = props.children) !== null && _props$children !== void 0 && _props$children.props.disabled)) {
_show();
return;
}
var handle = window.setTimeout(function () {

@@ -222,3 +185,2 @@ if (hoverStateRef.current === 'show') _show();

}
function handleHide(isOutside) {

@@ -229,9 +191,6 @@ clearTimeouts();

var delay = normalizeDelay(props.delay);
if (!delay.hide) {
_hide();
return;
}
var handle = window.setTimeout(function () {

@@ -241,8 +200,8 @@ if (hoverStateRef.current === 'hide') _hide();

timeoutRef.current.push(handle);
} // Simple implementation of mouseEnter and mouseLeave.
}
// Simple implementation of mouseEnter and mouseLeave.
// React's built version is broken: https://github.com/facebook/react/issues/4251
// for cases when the trigger is disabled and mouseOut/Over can cause flicker
// moving from one child element to another.
function handleMouseOverOut(handler, e, relatedNative) {

@@ -252,7 +211,5 @@ var target = e.currentTarget;

var isOutside = true;
if (popupRef.current && (0, _utils2["default"])(popupRef.current, related) || triggerRef.current && (0, _utils2["default"])(triggerRef.current, related)) {
isOutside = false;
}
if ((!related || related !== target) && !(0, _utils2["default"])(target, related)) {

@@ -262,3 +219,2 @@ handler(isOutside, e);

}
function _hide() {

@@ -269,3 +225,2 @@ if (!isOpen) return;

}
function _show() {

@@ -276,3 +231,2 @@ if (isOpen) return;

}
function handleEnter(node, isAppearing) {

@@ -291,8 +245,6 @@ onEnter && onEnter(node, isAppearing);

}
if (trigger === 'click' && !disabled) {
triggerProps.onClick = function (e) {
var _ref = getChildProps(),
onClick = _ref.onClick;
onClick = _ref.onClick;
isOpen ? _hide() : _show();

@@ -302,3 +254,2 @@ if (onClick) onClick(e, !isOpen);

}
if (trigger === 'focus' && !disabled) {

@@ -309,3 +260,2 @@ triggerProps.onFocus = function () {

}
if (trigger === 'hover' && !disabled) {

@@ -315,7 +265,5 @@ triggerProps.onMouseOver = triggerProps.onMouseEnter = function (e) {

};
triggerProps.onMouseOut = triggerProps.onMouseLeave = function (e) {
handleMouseOverOut(handleHide, e, 'toElement');
};
if (overlayProps.dialogProps) {

@@ -327,3 +275,2 @@ overlayProps.dialogProps.onMouseLeave = function (e) {

}
overlayProps.style = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, overlayProps.style), overlayStyl);

@@ -352,5 +299,4 @@ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react["default"].Fragment, {

});
exports["default"] = _default;
module.exports = exports.default;
//# sourceMappingURL=index.js.map
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
Object.defineProperty(exports, "__esModule", {

@@ -11,11 +9,6 @@ value: true

exports.TriggerWrap = exports.OverlayTriggerWrap = void 0;
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _reactOverlay = _interopRequireWildcard(require("@uiw/react-overlay"));
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
var OverlayTriggerWrap = (0, _styledComponents["default"])(_reactOverlay["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n"])), function (props) {

@@ -25,8 +18,6 @@ return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n position: absolute !important;\n top: auto;\n left: auto;\n right: auto;\n bottom: auto;\n overflow: inherit;\n width: initial;\n height: initial;\n ", " {\n position: relative;\n overflow: inherit;\n &::before {\n display: none;\n }\n }\n ", " {\n margin: 0;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n }\n "])), _reactOverlay.ContainerWrap, _reactOverlay.ContentWrap, props.placement === 'rightTop' && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: left top;\n "]))), props.placement === 'right' && (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: left center;\n "]))), props.placement === 'rightBottom' && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: left bottom;\n "]))), props.placement === 'topLeft' && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: bottom left;\n "]))), props.placement === 'top' && (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: bottom center;\n "]))), props.placement === 'topRight' && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: bottom right;\n "]))), props.placement === 'left' && (0, _styledComponents.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: right center;\n "]))), props.placement === 'leftBottom' && (0, _styledComponents.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: right bottom;\n "]))), props.placement === 'bottomLeft' && (0, _styledComponents.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: top left;\n "]))), props.placement === 'bottom' && (0, _styledComponents.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: top center;\n "]))), props.placement === 'bottomRight' && (0, _styledComponents.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["\n transform-origin: top right;\n "]))));

exports.OverlayTriggerWrap = OverlayTriggerWrap;
var TriggerWrap = _styledComponents["default"].div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n"])), function (props) {
return (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n "])), props.disabled && (0, _styledComponents.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["\n cursor: not-allowed;\n "]))));
});
exports.TriggerWrap = TriggerWrap;
//# sourceMappingURL=index.js.map

@@ -7,3 +7,2 @@ "use strict";

exports["default"] = getBordersSize;
/*

@@ -18,2 +17,3 @@ * Helper to detect borders of a given element

*/
function getBordersSize(styles, axis) {

@@ -24,4 +24,3 @@ var sideA = axis === 'x' ? 'Left' : 'Top';

}
module.exports = exports.default;
//# sourceMappingURL=getBordersSize.js.map
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {

@@ -9,15 +8,8 @@ value: true

exports["default"] = getBoundingClientRect;
var _utils = require("@uiw/utils");
var _getStyleComputedProperty = _interopRequireDefault(require("./getStyleComputedProperty"));
var _getBordersSize = _interopRequireDefault(require("./getBordersSize"));
var _getWindowSizes = _interopRequireDefault(require("./getWindowSizes"));
var _getClientRect = _interopRequireDefault(require("./getClientRect"));
var _isIE = _interopRequireDefault(require("./isIE"));
/**

@@ -31,6 +23,7 @@ * Get bounding client rect of given element

function getBoundingClientRect(element) {
var rect = {}; // IE10 10 FIX: Please, don't ask, the element isn't
var rect = {};
// IE10 10 FIX: Please, don't ask, the element isn't
// considered in DOM in some circumstances...
// This isn't reproducible in IE10 compatibility mode of IE11
try {

@@ -47,6 +40,5 @@ if ((0, _isIE["default"])(10)) {

rect = element.getBoundingClientRect();
} // eslint-disable-next-line
}
// eslint-disable-next-line
} catch (e) {}
var result = {

@@ -57,4 +49,5 @@ left: rect.left,

height: rect.bottom - rect.top
}; // subtract scrollbar size from sizes
};
// subtract scrollbar size from sizes
var sizes = element.nodeName === 'HTML' ? (0, _getWindowSizes["default"])(element.ownerDocument) : {};

@@ -66,5 +59,6 @@ var width = sizes.width || element.clientWidth || result.right - result.left;

result.offsetLeft = element.offsetLeft || element.scrollLeft || 0;
result.offsetTop = element.offsetTop || element.offsetTop || 0; // if an hypothetical scrollbar is detected, we must be sure it's not a `border`
result.offsetTop = element.offsetTop || element.offsetTop || 0;
// if an hypothetical scrollbar is detected, we must be sure it's not a `border`
// we make this check conditional for performance reasons
if (horizScrollbar || vertScrollbar) {

@@ -77,7 +71,5 @@ var styles = (0, _getStyleComputedProperty["default"])(element);

}
return (0, _getClientRect["default"])(result);
}
module.exports = exports.default;
//# sourceMappingURL=getBoundingClientRect.js.map
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {

@@ -9,5 +8,3 @@ value: true

exports["default"] = getClientRect;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
/**

@@ -26,4 +23,3 @@ * Given element offsets, generate an output similar to getBoundingClientRect

}
module.exports = exports.default;
//# sourceMappingURL=getClientRect.js.map

@@ -7,3 +7,2 @@ "use strict";

exports["default"] = getOuterSizes;
/**

@@ -17,7 +16,7 @@ * Get the outer sizes of the given element (offset size + margins)

function getOuterSizes(element) {
var rect = element.getBoundingClientRect(); // const window = element.ownerDocument.defaultView;
var rect = element.getBoundingClientRect();
// const window = element.ownerDocument.defaultView;
// const styles = window.getComputedStyle(element);
// const x = parseFloat(styles.marginTop || 0) + parseFloat(styles.marginBottom || 0);
// const y = parseFloat(styles.marginLeft || 0) + parseFloat(styles.marginRight || 0);
var result = {

@@ -29,4 +28,3 @@ width: element.offsetWidth || element.scrollWidth || rect.width || 0,

}
module.exports = exports.default;
//# sourceMappingURL=getOuterSizes.js.map

@@ -7,3 +7,2 @@ "use strict";

exports["default"] = getStyleComputedProperty;
/**

@@ -19,5 +18,4 @@ * Get CSS computed property of the given element

return [];
} // NOTE: 1 DOM access here
}
// NOTE: 1 DOM access here
var window = element.ownerDocument.defaultView;

@@ -27,4 +25,3 @@ var css = window.getComputedStyle(element, null);

}
module.exports = exports.default;
//# sourceMappingURL=getStyleComputedProperty.js.map
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {

@@ -9,9 +8,6 @@ value: true

exports["default"] = getWindowSizes;
var _isIE = _interopRequireDefault(require("./isIE"));
function getSize(axis, body, html, computedStyle) {
return Math.max(body["offset".concat(axis)], body["scroll".concat(axis)], html["client".concat(axis)], html["offset".concat(axis)], html["scroll".concat(axis)], (0, _isIE["default"])(10) ? parseInt(html["offset".concat(axis)], 10) + parseInt(computedStyle["margin".concat(axis === 'Height' ? 'Top' : 'Left')], 10) + parseInt(computedStyle["margin".concat(axis === 'Height' ? 'Bottom' : 'Right')], 10) : 0);
}
function getWindowSizes(document) {

@@ -26,4 +22,3 @@ var body = document.body;

}
module.exports = exports.default;
//# sourceMappingURL=getWindowSizes.js.map

@@ -7,7 +7,5 @@ "use strict";

exports["default"] = void 0;
var _default = typeof window !== 'undefined' && typeof document !== 'undefined';
exports["default"] = _default;
module.exports = exports.default;
//# sourceMappingURL=isBrowser.js.map
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {

@@ -9,7 +8,6 @@ value: true

exports["default"] = isIE;
var _isBrowser = _interopRequireDefault(require("./isBrowser"));
var isIE11 = _isBrowser["default"] && !!(window.MSInputMethodContext && document.documentMode);
var isIE10 = _isBrowser["default"] && /MSIE 10/.test(navigator.userAgent);
/**

@@ -22,3 +20,2 @@ * Determines if the browser is Internet Explorer

*/
function isIE(version) {

@@ -28,11 +25,8 @@ if (version === 11) {

}
if (version === 10) {
return isIE10;
}
return isIE11 || isIE10;
}
module.exports = exports.default;
//# sourceMappingURL=isIE.js.map
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {

@@ -9,7 +8,4 @@ value: true

exports["default"] = void 0;
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
function fallback(context, node) {

@@ -21,10 +17,7 @@ if (node) {

}
return false;
}
function isDOM(item) {
return typeof HTMLElement === 'function' ? item instanceof HTMLElement : item && (0, _typeof2["default"])(item) === 'object' && item.nodeType === 1 && typeof item.nodeName === 'string';
}
var contains = function () {

@@ -37,11 +30,8 @@ // HTML DOM and SVG DOM may have different support levels,

}
if (context && context.compareDocumentPosition && isDOM(node)) {
return context === node || !!(context.compareDocumentPosition(node) && 16);
}
return fallback(context, node);
} : fallback;
}();
var _default = contains;

@@ -48,0 +38,0 @@ exports["default"] = _default;

@@ -18,7 +18,5 @@ import _extends from "@babel/runtime/helpers/extends";

};
if (!triggerDom || !popupDom || !document) {
return sty;
}
var winSizeHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);

@@ -29,7 +27,4 @@ var winSizeWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);

var scrollLeft = getScroll(triggerDom.ownerDocument.documentElement);
var trigger = _extends({}, getBoundingClientRect(triggerDom), getOuterSizes(triggerDom));
var popup = _extends({}, getBoundingClientRect(popupDom), getOuterSizes(popupDom));
var bottom = winSizeHeight - trigger.bottom;

@@ -39,3 +34,2 @@ var right = winSizeWidth - trigger.left - trigger.width;

sty.left = trigger.left;
if (!usePortal) {

@@ -45,19 +39,14 @@ sty.top = trigger.offsetTop;

}
if (placement && /^(top)/.test(placement)) {
sty.top -= popup.height;
}
if (placement && /^(right)/.test(placement)) {
sty.left += trigger.width;
}
if (placement && /^(bottom)/.test(placement)) {
sty.top += trigger.height;
}
if (placement && /^(left)/.test(placement)) {
sty.left -= popup.width;
}
switch (sty.placement) {

@@ -67,9 +56,7 @@ case 'bottomLeft':

break;
case 'bottom': // eslint-disable-next-line
case 'bottom':
// eslint-disable-next-line
case 'top':
sty.left = sty.left - (popup.width - trigger.width) / 2;
break;
case 'bottomRight':

@@ -79,13 +66,10 @@ case 'topRight':

break;
case 'rightTop':
case 'leftTop':
break;
case 'right': // eslint-disable-next-line
case 'right':
// eslint-disable-next-line
case 'left':
sty.top = sty.top - (popup.height - trigger.height) / 2;
break;
case 'rightBottom':

@@ -95,7 +79,5 @@ case 'leftBottom':

break;
default:
break;
}
if (autoAdjustOverflow) {

@@ -106,3 +88,2 @@ if (placement && /^(top)/.test(placement) && trigger.top < popup.height && bottom > popup.height) {

}
if (placement && /^(bottom)/.test(placement) && bottom < popup.height && trigger.top > popup.height) {

@@ -112,3 +93,2 @@ sty.placement = placement.replace(/^bottom/, 'top');

}
if (placement && /^(right)/.test(placement) && right < popup.width) {

@@ -118,3 +98,2 @@ sty.placement = placement.replace(/^right/, 'left');

}
if (placement && /^(left)/.test(placement) && trigger.left < popup.width) {

@@ -124,3 +103,2 @@ sty.placement = placement.replace(/^left/, 'right');

}
if (placement && /^(left|right)/.test(placement) && usePortal) {

@@ -136,3 +114,2 @@ // Top

}
if (placement && /(Bottom)$/.test(placement) && trigger.bottom < popup.height) {

@@ -142,9 +119,7 @@ // eslint-disable-next-line

}
if (placement && /(right|left)$/.test(placement) && trigger.bottom - trigger.height / 2 < popup.height / 2) {
sty.top = sty.top + popup.height / 2 - (trigger.bottom - trigger.height / 2);
}
} // Bottom Public Part
}
// Bottom Public Part
if (placement && /^(left|right)/.test(placement)) {

@@ -168,5 +143,4 @@ if (/(Top)$/.test(placement) && bottom + trigger.height < popup.height) {

sty.left = scrollLeft;
} // right
}
// right
if (/(top|bottom)$/.test(placement) && right + trigger.width / 2 < popup.width / 2) {

@@ -183,3 +157,2 @@ sty.left = trigger.left + trigger.width + right - popup.width;

}
if (/(Right)$/.test(placement) && right < 0) {

@@ -186,0 +159,0 @@ sty.left = sty.left + right; // eslint-disable-line

@@ -11,3 +11,2 @@ import _extends from "@babel/runtime/helpers/extends";

import { jsxs as _jsxs } from "react/jsx-runtime";
var normalizeDelay = delay => delay && typeof delay === 'object' ? delay : {

@@ -17,23 +16,21 @@ show: delay,

};
export default /*#__PURE__*/React.forwardRef((props, ref) => {
var {
className,
prefixCls = 'w-overlay-trigger',
usePortal = true,
isOutside = false,
isClickOutside = true,
disabled = false,
isOpen: _ = false,
trigger = 'hover',
placement = 'top',
autoAdjustOverflow,
transitionName,
children,
overlay,
onVisibleChange = noop,
onEnter = noop
} = props,
other = _objectWithoutPropertiesLoose(props, _excluded);
className,
prefixCls = 'w-overlay-trigger',
usePortal = true,
isOutside = false,
isClickOutside = true,
disabled = false,
isOpen: _ = false,
trigger = 'hover',
placement = 'top',
autoAdjustOverflow,
transitionName,
children,
overlay,
onVisibleChange = noop,
onEnter = noop
} = props,
other = _objectWithoutPropertiesLoose(props, _excluded);
var zIndex = useRef(999);

@@ -59,3 +56,2 @@ var triggerRef = useRef();

var child = React.Children.only(children);
var overlayProps = _extends({}, other, {

@@ -66,5 +62,3 @@ placement,

});
var triggerProps = {};
function getChildProps() {

@@ -74,6 +68,4 @@ if (child && /*#__PURE__*/React.isValidElement(child)) {

}
return {};
}
useEffect(() => {

@@ -84,3 +76,2 @@ if (isClickOutside && isOpen) {

}
return () => {

@@ -109,3 +100,2 @@ document && isClickOutside && document.removeEventListener('mousedown', handleClickOutside);

}, [isOpen]);
var handleResize = () => {

@@ -118,7 +108,5 @@ if (isOpen) {

};
var handleClickOutside = e => {
var popNode = popupRef.current;
var childNode = triggerRef.current;
if (popNode && childNode && e.target && !contains(popNode, e.target) && !contains(childNode, e.target)) {

@@ -130,3 +118,2 @@ zIndex.current -= 1;

};
function clearTimeouts() {

@@ -137,20 +124,14 @@ if (timeoutRef.current.length > 0) {

}
timeoutRef.current = [];
}
}
function handleShow() {
var _props$children;
clearTimeouts();
hoverStateRef.current = 'show';
var delay = normalizeDelay(props.delay);
if (!delay.show && !((_props$children = props.children) != null && _props$children.props.disabled)) {
_show();
return;
}
var handle = window.setTimeout(() => {

@@ -162,3 +143,2 @@ if (hoverStateRef.current === 'show') _show();

}
function handleHide(isOutside) {

@@ -169,9 +149,6 @@ clearTimeouts();

var delay = normalizeDelay(props.delay);
if (!delay.hide) {
_hide();
return;
}
var handle = window.setTimeout(() => {

@@ -181,8 +158,8 @@ if (hoverStateRef.current === 'hide') _hide();

timeoutRef.current.push(handle);
} // Simple implementation of mouseEnter and mouseLeave.
}
// Simple implementation of mouseEnter and mouseLeave.
// React's built version is broken: https://github.com/facebook/react/issues/4251
// for cases when the trigger is disabled and mouseOut/Over can cause flicker
// moving from one child element to another.
function handleMouseOverOut(handler, e, relatedNative) {

@@ -192,7 +169,5 @@ var target = e.currentTarget;

var isOutside = true;
if (popupRef.current && contains(popupRef.current, related) || triggerRef.current && contains(triggerRef.current, related)) {
isOutside = false;
}
if ((!related || related !== target) && !contains(target, related)) {

@@ -202,3 +177,2 @@ handler(isOutside, e);

}
function _hide() {

@@ -209,3 +183,2 @@ if (!isOpen) return;

}
function _show() {

@@ -216,3 +189,2 @@ if (isOpen) return;

}
function handleEnter(node, isAppearing) {

@@ -231,3 +203,2 @@ onEnter && onEnter(node, isAppearing);

}
if (trigger === 'click' && !disabled) {

@@ -242,7 +213,5 @@ triggerProps.onClick = e => {

}
if (trigger === 'focus' && !disabled) {
triggerProps.onFocus = () => handleShow();
}
if (trigger === 'hover' && !disabled) {

@@ -252,7 +221,5 @@ triggerProps.onMouseOver = triggerProps.onMouseEnter = e => {

};
triggerProps.onMouseOut = triggerProps.onMouseLeave = e => {
handleMouseOverOut(handleHide, e, 'toElement');
};
if (overlayProps.dialogProps) {

@@ -264,3 +231,2 @@ overlayProps.dialogProps.onMouseLeave = e => {

}
overlayProps.style = _extends({}, overlayProps.style, overlayStyl);

@@ -267,0 +233,0 @@ return /*#__PURE__*/_jsxs(React.Fragment, {

import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/taggedTemplateLiteralLoose";
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
import styled, { css } from 'styled-components';

@@ -6,0 +4,0 @@ import Overlay, { ContainerWrap, ContentWrap } from '@uiw/react-overlay';

@@ -10,2 +10,3 @@ /*

*/
export default function getBordersSize(styles, axis) {

@@ -12,0 +13,0 @@ var sideA = axis === 'x' ? 'Left' : 'Top';

@@ -7,3 +7,2 @@ import { getScroll } from '@uiw/utils';

import isIE from './isIE';
/**

@@ -17,6 +16,7 @@ * Get bounding client rect of given element

export default function getBoundingClientRect(element) {
var rect = {}; // IE10 10 FIX: Please, don't ask, the element isn't
var rect = {};
// IE10 10 FIX: Please, don't ask, the element isn't
// considered in DOM in some circumstances...
// This isn't reproducible in IE10 compatibility mode of IE11
try {

@@ -33,6 +33,5 @@ if (isIE(10)) {

rect = element.getBoundingClientRect();
} // eslint-disable-next-line
}
// eslint-disable-next-line
} catch (e) {}
var result = {

@@ -43,4 +42,5 @@ left: rect.left,

height: rect.bottom - rect.top
}; // subtract scrollbar size from sizes
};
// subtract scrollbar size from sizes
var sizes = element.nodeName === 'HTML' ? getWindowSizes(element.ownerDocument) : {};

@@ -52,5 +52,6 @@ var width = sizes.width || element.clientWidth || result.right - result.left;

result.offsetLeft = element.offsetLeft || element.scrollLeft || 0;
result.offsetTop = element.offsetTop || element.offsetTop || 0; // if an hypothetical scrollbar is detected, we must be sure it's not a `border`
result.offsetTop = element.offsetTop || element.offsetTop || 0;
// if an hypothetical scrollbar is detected, we must be sure it's not a `border`
// we make this check conditional for performance reasons
if (horizScrollbar || vertScrollbar) {

@@ -63,5 +64,4 @@ var styles = getStyleComputedProperty(element);

}
return getClientRect(result);
}
//# sourceMappingURL=getBoundingClientRect.js.map
import _extends from "@babel/runtime/helpers/extends";
/**

@@ -4,0 +3,0 @@ * Given element offsets, generate an output similar to getBoundingClientRect

@@ -9,7 +9,7 @@ /**

export default function getOuterSizes(element) {
var rect = element.getBoundingClientRect(); // const window = element.ownerDocument.defaultView;
var rect = element.getBoundingClientRect();
// const window = element.ownerDocument.defaultView;
// const styles = window.getComputedStyle(element);
// const x = parseFloat(styles.marginTop || 0) + parseFloat(styles.marginBottom || 0);
// const y = parseFloat(styles.marginLeft || 0) + parseFloat(styles.marginRight || 0);
var result = {

@@ -16,0 +16,0 @@ width: element.offsetWidth || element.scrollWidth || rect.width || 0,

@@ -11,5 +11,4 @@ /**

return [];
} // NOTE: 1 DOM access here
}
// NOTE: 1 DOM access here
var window = element.ownerDocument.defaultView;

@@ -16,0 +15,0 @@ var css = window.getComputedStyle(element, null);

import isIE from './isIE';
function getSize(axis, body, html, computedStyle) {
return Math.max(body["offset" + axis], body["scroll" + axis], html["client" + axis], html["offset" + axis], html["scroll" + axis], isIE(10) ? parseInt(html["offset" + axis], 10) + parseInt(computedStyle["margin" + (axis === 'Height' ? 'Top' : 'Left')], 10) + parseInt(computedStyle["margin" + (axis === 'Height' ? 'Bottom' : 'Right')], 10) : 0);
}
export default function getWindowSizes(document) {

@@ -8,0 +6,0 @@ var body = document.body;

import isBrowser from './isBrowser';
var isIE11 = isBrowser && !!(window.MSInputMethodContext && document.documentMode);
var isIE10 = isBrowser && /MSIE 10/.test(navigator.userAgent);
/**

@@ -11,3 +12,2 @@ * Determines if the browser is Internet Explorer

*/
export default function isIE(version) {

@@ -17,9 +17,7 @@ if (version === 11) {

}
if (version === 10) {
return isIE10;
}
return isIE11 || isIE10;
}
//# sourceMappingURL=isIE.js.map
var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
function fallback(context, node) {

@@ -9,10 +8,7 @@ if (node) {

}
return false;
}
function isDOM(item) {
return typeof HTMLElement === 'function' ? item instanceof HTMLElement : item && typeof item === 'object' && item.nodeType === 1 && typeof item.nodeName === 'string';
}
var contains = (() => {

@@ -25,12 +21,9 @@ // HTML DOM and SVG DOM may have different support levels,

}
if (context && context.compareDocumentPosition && isDOM(node)) {
return context === node || !!(context.compareDocumentPosition(node) && 16);
}
return fallback(context, node);
} : fallback;
})();
export default contains;
//# sourceMappingURL=utils.js.map
{
"name": "@uiw/react-overlay-trigger",
"version": "5.0.0-bate-5",
"version": "5.0.0-bate-6",
"description": "OverlayTrigger component",

@@ -48,5 +48,5 @@ "author": "Kenny Wong <wowohoo@qq.com>",

"dependencies": {
"@uiw/react-overlay": "^5.0.0-bate-5",
"@uiw/utils": "^5.0.0-bate-5"
"@uiw/react-overlay": "^5.0.0-bate-6",
"@uiw/utils": "^5.0.0-bate-6"
}
}

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc