[hitsWidget]: Provide an `onClick` handler on the hits

We sometimes need to trigger a specific behavior when people are clicking the hits results displayed. Something like opening more details in a lightbox, or in a side panel. And we usually need context about the specific hit that was clicked. There is currently no built-in way to do that.

For example, on the Marvel demo I open the side panel when you click on a result hit. I managed to do that by listening to the click event on the hits wrapper (and filtering only on event targeting the hits themselves) through and external jQuery binding ($('.hits').on('click', '.hit', (event) => {})). I also put the hits details in a JSON encoded form in an hidden textarea to get it.

This is hacky and maybe we could directly embed this into the widget. I suggest something like:

search.addWidget(
  instantsearch.widgets.hits({
    container: '#hits-container',
    onClick: (event, data) => {
      // event is the usual event, while data is the data passed to the template
    }
  })
);

[bobylito]

JSON.stringify in a single data attribute?

[vvo]

Revisiting this, given our renderers proposal, we might finally implement this in the default hits renderer since this is a common pattern in recent demos. And you don’t want to render the hits yourself for such a simple usecase.

Moved to #1078