Action Widgets Overview

Action widgets trigger events. They don’t bind to form data and don’t render values — they emit named events that your application code handles via the formEvent callback, or trigger form submission through the formSubmit output.

How to define them

Programmatic

import { gui } from '@golemui/gui-shared';

const formDef = [
  // Validates the form on click, then emits through formSubmit.
  gui.actions.button({ label: 'Submit', actionType: 'submit' }),

  // A free-form button — emits whatever event name you provide via formEvent.
  gui.actions.button({ label: 'Cancel', onClick: () => 'cancelForm' }),

  // Plug in your own action widget.
  gui.actions.custom('productShare', { onClick: () => 'shareEvent' }),
];

Use actionType: 'submit' to validate the form and emit through formSubmit, or onClick: () => 'eventName' for arbitrary events that route through formEvent.

JSON

{
  "form": [
    {
      "kind": "action",
      "type": "button",
      "label": "Submit",
      "actionType": "submit"
    },
    {
      "kind": "action",
      "type": "button",
      "label": "Cancel",
      "on": { "click": "cancelForm" }
    },
    {
      "kind": "action",
      "type": "productShare",
      "on": { "click": "shareEvent" }
    }
  ]
}

Property	Description
uid	Optional unique id; one is generated if absent.
kind	MANDATORY. Always 'action'.
type	MANDATORY. The action type (button is the only built-in).
label	Visible label text. Accepts a Localizable for i18n.
actionType	'submit' — renders as <button type="submit">, validates the form, emits through formSubmit.
on	Event wiring for custom events — { click: '<eventName>' }. Emits through formEvent.
props	Widget-specific configuration (icon, iconPosition, variant, etc.).

Available widgets

Widget	DX shortcut	Reference
Button	gui.actions.button	Button
Custom	gui.actions.custom	Custom Widgets

See also

• gui.actions reference — every action shortcut.
• Form Definition / Events — wiring onClick, actionType: 'submit', and formSubmit.
• Features / Form Events — handling events in your application.
• Extending GolemUI / Action Widget — build your own.