You can add an event name to a Bento guide button instead of a URL, so that your app can take actions when a user clicks an event.

Untitled

To respond to these events, you'll need to add a document listener in your application javascript.

document.addEventListener('bento-buttonClicked', function(e) {
    if (e.detail.message === 'my-event-name') {
         // take action here
    }
});

If you're using react hooks, you'd want to use the normal react useCallback/useEffect paradigm:

const bentoClickHandler = React.useCallback((e) => {
    if (e.detail.message === 'my-event-name') {
         // take action here
    }
}, [ /* any dependencies used in the function */ ]);
useEffect(() => {
    document.addEventListener('bento-buttonClicked', bentoClickHandler);
    return () => {
        document.removeEventListener('bento-buttonClicked', bentoClickHandler);
    }
}, [bentoClickHandler]);