Render prop that tracks elements active status. Attaches to the root element, or provides a binding, if bond prop specified.
Use it as FaCC, attach to root element
import {ActiveSensor} from 'libreact/lib/ActiveSensor';
<ActiveSensor>{({isActive}) =>
<div>{isActive ? 'active' : 'not active'}</div>
}</ActiveSensor>Use bond to bind to any element
import {ActiveSensor} from 'libreact/lib/ActiveSensor';
<ActiveSensor bond>{({bond, isActive}) =>
<div>
<div {...bond}>{isActive ? 'active' : 'not active'}</div>
</div>
}</ActiveSensor>Prop signature
interface IActiveSensorProps {
bond?: boolean | string;
}, where
bond- optional, string, specifies the bond name. If boolean and set totrue, bond with name"bond"is created.
HOC that merges active prop into enhanced component's props. With HOC interface you always have to use bond.
import {withActive} from 'libreact/lib/ActiveSensor';
const MyCompWithHover = withActive(MyComp);React stateful component decorator that adds active prop.
import {withActive} from 'libreact/lib/ActiveSensor';
@withActive
class MyComp extends Component {
}