Kaizendex DocsOpen the app

Events

The `on` block — which gestures a surface can react to, where a handler may sit, and how to opt one element out.

An on block maps an event name to a list of commands:

"on": { "click": [ { "command": "openPeek" } ] }

Event names are DOM event names. It is click, not tap — one word that means a mouse click on a desktop and a finger tap on a phone, exactly as it does on the web.

The events

EventFires onExample
clickA tap or a mouse click on the element (was: tap)"on": { "click": [ { "command": "openEntry" } ] }
longPressA press held long enough to be deliberate — the phone's right-click"on": { "longPress": [ { "command": "openPeek" } ] }

That is the whole list, and it grows only when there is something real to react to. longPress is ours rather than the DOM's because the web has no name for the gesture; if it ever gains one, this list adopts it.

on can sit at any level

A handler may sit on the document, on a group, or on a single element. The nearest one wins: if a card opens a peek when you tap it, and a button inside that card increments a counter, tapping the button increments and does not open the peek.

{
  "on": { "click": [ { "command": "openPeek" } ] },
  "elements": [
    { "type": "text", "text": "Push-ups" },
    { "type": "button", "label": "+1",
      "on": { "click": [ { "command": "incrementValue", "property": "reps", "by": 1 } ] } }
  ]
}

Doing nothing is an answer

To take one element out of a handler it inherited, give it a handler that deliberately does nothing:

{ "type": "icon", "icon": "🔒", "on": { "click": [ { "command": "none" } ] } }

none is a real command, not an empty list and not a missing key. Written this way, "this element ignores taps" is something the document says, so nobody later has to guess whether the silence was intended.

Next