@clayui/shared
Version:
ClayShared component
83 lines (82 loc) • 2.63 kB
JavaScript
;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var useHover_exports = {};
__export(useHover_exports, {
useHover: () => useHover
});
module.exports = __toCommonJS(useHover_exports);
var import_react = require("react");
function useHover({ disabled, onHover }) {
const state = (0, import_react.useRef)({
isEmulatedMouseEvents: false,
isHovered: false,
pointerType: void 0,
target: null
}).current;
return (0, import_react.useMemo)(() => {
const props = {};
const onStart = (event, pointerType) => {
if (disabled || pointerType === "touch" || state.isHovered || !event.currentTarget.contains(event.target)) {
return;
}
state.isHovered = true;
const target = event.currentTarget;
state.target = target;
onHover({
pointerType,
target,
type: "hoverstart"
});
};
const onEnd = (pointerType) => {
state.pointerType = void 0;
state.target = null;
if (pointerType === "touch" || !state.isHovered) {
return;
}
state.isHovered = false;
};
if (typeof PointerEvent !== "undefined") {
props.onPointerEnter = (event) => {
onStart(event, event.pointerType);
};
props.onPointerLeave = (event) => {
if (!disabled && event.currentTarget.contains(event.target)) {
onEnd(event.pointerType);
}
};
} else {
props.onTouchStart = () => {
state.isEmulatedMouseEvents = true;
};
props.onMouseEnter = (event) => {
if (!state.isEmulatedMouseEvents) {
onStart(event, "mouse");
}
state.isEmulatedMouseEvents = false;
};
props.onMouseLeave = (event) => {
if (!disabled && event.currentTarget.contains(event.target)) {
onEnd("mouse");
}
};
}
return props;
}, [onHover]);
}