Adding new step props: observables + highlight selectors

[qboot]

hey! 😊

I recently needed some improvements around the svg mask shape.

Basically, I wanted 3 new features:

• allow svg mask to highlight multiple elements with different data-* attributes
  (at the moment we can only highlight one element)
• redraw svg mask when a node is added to DOM (or removed)
  (at the moment the svg mask do not redraw on DOM node changes so node can be hidden)
• redraw svg mask when a node is resized
  (at the moment the svg mask do not redraw when DOM node is resized so node can be hidden)

So I suggest adding three new step properties:

• highlightedSelectors: Array of selectors, each selected node will be included (by union) in the highlighted region of the mask ;
• mutationObservables: Array of selectors, each selected node DOM addition/removal will triggered a rerender of the mask shape ;
• resizeObservables: Array of selectors, each selected node resize will triggered a rerender of the mask shape.

This PR targets the v1 branch but I saw the work on master with the react hooks refacto so I tried to make the integration in master in the future as easy as possible.

Also, I've updated the README and provided a new step in the demo to demonstrate how we can use these 3 new properties.

Hope you will find this PR useful.
Let me know your feedback. Thanks!

[elrumordelaluz]

Hi @qboot! This PR seems absolutely awesome.
Let me check it out and merge asap.

Thanks in advace,

[elrumordelaluz]

Should be available on v1.18.0. Thanks again for the cool and useful additions.

[tillkolter]

Dang it. I need this right now :)