Skip to content

Events

Each widget kind exposes a small set of event hooks. The DX shortcuts surface them as flat camelCase props (no nested on object).

HookAvailable on
onClickgui.actions.button, gui.actions.custom
onChangegui.inputs.*, gui.layouts.tabs, gui.layouts.accordion
onLoadgui.inputs.dropdown, gui.inputs.list, gui.inputs.select
onFiltergui.inputs.dropdown
onBlurgui.inputs.*

Each value is a string — the event name the form will emit through formEvent.

import { gui } from '@golemui/gui-shared';
gui.inputs.dropdown('country', {
items: [/* ... */],
onChange: 'countryChanged',
onFilter: 'countryQuery',
});
gui.actions.button({
label: 'Submit',
onClick: 'submit', // 'submit' is special — triggers form-level validation first
});

The legacy JSON-style on: { click: '...' } still works on shortcuts that accept a Partial<ActionDecorator> (e.g. gui.actions.button). It exists for compatibility with custom event names not yet covered by the typed onClick literal. Prefer the flat onClick whenever the typed surface allows.