feat: expose onMouseMove event on <MouseSensor>

docs/en/MouseSensor.md

@@ -50,7 +50,8 @@ interface IMouseSensorProps {
 , where
 
   - `bond` — optional, boolean or string, specifying bondig spread object. If string, it specifies the name of the bonding object injected into state, if boolean and true the bonding object will have its default name `bond`.
-  - `whenHovered` - optional, boolean, when true, will track mouse position only when target element is hovered, defaults to `false`.
+  - `whenHovered` — optional, boolean, when true, will track mouse position only when target element is hovered, defaults to `false`.
+  - `onMouseMove` — optional, callback called on every mouse move, receives state as a single argument.
 
 ### Example
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "libreact",
-  "version": "1.2.1",
+  "version": "1.3.0",
   "description": "React standard library",
   "main": "lib/index.js",
   "repository": {

src/MouseSensor/__story__/story.tsx

@@ -41,7 +41,7 @@ class Decorator extends Component<any, any> {
 
 storiesOf('Sensors/MouseSensor', module)
   .add('Documentation', () => h(ShowDocs, {md: require('../../../docs/en/MouseSensor.md')}))
-  .add('FaCC', () => <MouseSensor>{Demo}</MouseSensor>)
+  .add('FaCC', () => <MouseSensor onMouseMove={action('onMouseMove')}>{Demo}</MouseSensor>)
   .add('FaCC with bond', () => <MouseSensor bond>{DemoWithBond}</MouseSensor>)
   .add('Render prop', () => <MouseSensor render={Demo} />)
   .add('HOC 1', () => <Hoc1 />)

src/MouseSensor/index.ts

@@ -8,6 +8,7 @@ export interface IMouseSensorProps {
   children?: (state: IMouseSensorState) => React.ReactElement<any>;
   render?: (state: IMouseSensorState) => React.ReactElement<any>;
   whenHovered?: boolean;
+  onMouseMove?: (state: IMouseSensorState) => void;
 }
 
 export interface IMouseSensorState {
@@ -71,8 +72,7 @@ export class MouseSensor extends Component<IMouseSensorProps, IMouseSensorState>
       const {left, top} = el.getBoundingClientRect();
       const posX = left + window.scrollX;
       const posY = top + window.scrollY;
-
-      this.setState({
+      const state = {
         docX: event.pageX,
         docY: event.pageY,
         posX,
@@ -81,7 +81,10 @@ export class MouseSensor extends Component<IMouseSensorProps, IMouseSensorState>
         elW: el.offsetWidth,
         elX: event.pageX - posX,
         elY: event.pageY - posY
-      });
+      };
+
+      this.setState(state);
+      (this.props.onMouseMove || noop)(state);
     });
   };