imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix issues with the new topic dialog (#8608)

Browse source
This commit is contained in:
Šimon Brandner 2022-05-16 14:10:00 +02:00 • committed by GitHub
parent e1d11db256
commit fb30b67b14
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 112 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

31
src/hooks/useHover.ts
View file

@ -14,29 +14,20 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { useEffect, useState } from "react";
import { useState } from "react";
export default function useHover(ref: React.MutableRefObject<HTMLElement>) {
export default function useHover(
ignoreHover?: (ev: React.MouseEvent) => boolean,
): [boolean, { onMouseOver: () => void, onMouseLeave: () => void, onMouseMove: (ev: React.MouseEvent) => void }] {
const [hovered, setHoverState] = useState(false);
const handleMouseOver = () => setHoverState(true);
const handleMouseOut = () => setHoverState(false);
useEffect(
() => {
const node = ref.current;
if (node) {
node.addEventListener("mouseover", handleMouseOver);
node.addEventListener("mouseout", handleMouseOut);
return () => {
node.removeEventListener("mouseover", handleMouseOver);
node.removeEventListener("mouseout", handleMouseOut);
};
}
const props = {
onMouseOver: () => setHoverState(true),
onMouseLeave: () => setHoverState(false),
onMouseMove: (ev: React.MouseEvent): void => {
setHoverState(!ignoreHover(ev));
},
[ref],
);
};
return hovered;
return [hovered, props];
}