Actions are essentially element-level lifecycle functions. They're useful for things like:
interfacing with third-party libraries
adding custom event handlers
In this app, we want to make the orange modal close when the user clicks outside it. It has an event handler for the outclick event, but it isn't a native DOM event. We have to dispatch it ourselves. First, import the clickOutside function...
Open the click_outside.js file. Like transition functions, an action function receives a node (which is the element that the action is applied to) and some optional parameters, and returns an action object. That object can have a destroy function, which is called when the element is unmounted.
We want to fire the outclick event when the user clicks outside the orange box. One possible implementation looks like this: