Made trackHover less intrusive
This commit is contained in:
parent
0c3ce6af45
commit
39c62f3b9c
1 changed files with 3 additions and 29 deletions
|
@ -214,39 +214,13 @@ export function processedPropType<T>(...types: PropTypes[]): PropType<ProcessedC
|
|||
}
|
||||
|
||||
export function trackHover(element: VueFeature): Ref<boolean> {
|
||||
const elementComponent = element[ComponentKey];
|
||||
const isHovered = ref(false);
|
||||
|
||||
element[ComponentKey] = defineComponent({
|
||||
props: {
|
||||
element: {
|
||||
type: Object as PropType<VueFeature>,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
setup: function (props) {
|
||||
const element = toRef(props, "element");
|
||||
|
||||
onUnmounted(() => (isHovered.value = false));
|
||||
return () => (
|
||||
<div
|
||||
style="display: inline-block"
|
||||
onPointerenter={() => (isHovered.value = true)}
|
||||
onPointerleave={() => (isHovered.value = false)}
|
||||
>
|
||||
{/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}
|
||||
{unwrapRef(element) == null ? "" : renderJSX(unwrapRef(element)!)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}) as GenericComponent;
|
||||
|
||||
const elementGatherProps = element[GatherProps].bind(element);
|
||||
element[GatherProps] = () => ({
|
||||
element: {
|
||||
[ComponentKey]: elementComponent,
|
||||
[GatherProps]: elementGatherProps
|
||||
}
|
||||
...elementGatherProps(),
|
||||
onPointerenter: () => (isHovered.value = true),
|
||||
onPointerleave: () => (isHovered.value = false)
|
||||
});
|
||||
|
||||
return isHovered;
|
||||
|
|
Loading…
Reference in a new issue