azure-devops-ui/Components/FocusOrMouseWithin/FocusOrMouseWithin.js

React components for building web UI in Azure DevOps

import "../../CommonImports";
import "../../Core/core.css";
import * as React from "react";
import { FocusWithin } from '../../FocusWithin';
import { MouseWithin } from '../../MouseWithin';
export class FocusOrMouseWithin extends React.Component {
    constructor() {
        super(...arguments);
        this.mouseWithinRef = React.createRef();
        this.focusWithinRef = React.createRef();
        this.hasFocus = () => {
            return !!this.focusWithinRef.current && this.focusWithinRef.current.hasFocus();
        };
        this.hasMouse = () => {
            return !!this.mouseWithinRef.current && this.mouseWithinRef.current.hasMouse();
        };
    }
    render() {
        const { onMouseEnter, onMouseLeave, onFocus, onBlur } = this.props;
        let children;
        return (React.createElement(MouseWithin, { ref: this.mouseWithinRef, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, (mouseWithinStatus) => {
            if (typeof this.props.children === "function") {
                children = (props) => {
                    return this.props.children(Object.assign(Object.assign({}, props), mouseWithinStatus));
                };
            }
            else {
                const child = React.Children.only(this.props.children);
                children = React.cloneElement(child, Object.assign(Object.assign({}, child.props), mouseWithinStatus), child.props.children);
            }
            return (React.createElement(FocusWithin, { onFocus: onFocus, onBlur: onBlur, ref: this.focusWithinRef }, children));
        }));
    }
}