Events

Event categories

Events fall under the following categories.

• App lifecycle events
• Page lifecycle events
• Component events
• Variable events
• Other events
• Custom events

Event schema

Currently, events do not expose their schema to Composer fully, so while there's a definite schema to the data available in the eventValue output of an event node, you need to manually utilize it via formulas, e.g. writing outputs[:id].eventValue.params to access the parsed parameters of the App brought to foreground via URL event.

App lifecycle events

App lifecycle events have to deal with the running application as a whole.

App loaded

Available on the global canvas. Executed when the app has started and is ready to start executing logic.

App brought to foreground via URL

Mobile-only. Executed when the app was brought to the foreground via a custom URL scheme link. For the default AppGyver Preview app, the URL scheme is sapappgyver://. You can define a custom scheme for your app binary in the Build Service.

Event schema

The examples below assume the app was brought to foreground via the URL sapappgyver://auth?token=abc123.

Page lifecycle events

The following events happen in the context of a single page.

Page mounted

Executed once when the page is added to the navigation stack, either by being the root page or via the Open page flow function.

Refreshing a page in the browser or navigating directly to a route also causes the Page mounted event to be fired.

Page focused

Executed when the page becomes focused, including the following conditions:

• The page is pushed to navigation stack with Open page
• The page is the topmost in the navigation stack of a tab the user switches back to
• A page above the page is popped from the navigation stack (via e.g. Navigate back or native back button)

Page blurred

Executed when the page becomes blurred, i.e. loses focus.

Page nav bar item clicked

Executed when an item in the navigation header bar is clicked. The event value contains the clicked button's index.

Component events

The following events happen in the context of a single component.

Component tap

Executed when the component is tapped/clicked by the user.

If there are logic nodes attached to the tap event, a tap animation is played when the component is tapped.

This event is available for all view components.

Component onChange

Executed when the component's input value changes, e.g. the user finishes typing a new value in an Input field or a new option is selected in a dropdown.

Event value contains the new input value.

Component onFocus

Executed when an input component becomes focused, e.g. the user selects an Input field.

Component onBlur

Executed when an input component is blurred, i.e. loses focus.

Custom events for composite components

Composite components can define custom events.

Custom events should always map to actual primitive component events inside the composite, linked via the Trigger event node.

For example, a product card composite with Add to cart and Change variant buttons could have events Add to cart button tap and Change variant button tap, allowing whoever's using the composite to wire the desired logic correctly without having to edit the composite component itself.