Log inGet started
World

Builtin Library

Branchmain
Branchesmainpublish
Commitdf78e4f826

README.md

edui.widgets (module)

Editor-chrome primitive builders for edui. Each returns a styled ui.* widget subtree; the common ones are re-exported flat onto edui (edui.panel{...}, edui.text{...}, edui.iconButton{...}, …).

Two things make these "framework" primitives rather than raw ui.*:

  1. They read the active theme's editor tokens (editor-row-height, editor-selection-bg, editor-hover-bg, border, radius-md, …) via ui.getToken, so chrome looks like the editor by default and restyles with the theme. edui.palette() returns the resolved set.
  2. Interactive builders register their closures with the currently-building edui app (edui.current()), so you pass onClick = function() end and never touch a callback id.

Builders

  • Containers: vbox, hbox, spacer, divider, panel, toolbar.
  • Content: text, svgIcon, iconButton, button.
  • panel{ title? | toolbar?, body } is the standard dockable-panel shell (a header over a height-filling body).
  • nodeGraph{ key, nodes, edges, selected?, height?, onSelect?, onMove?, onConnect?, onDisconnect?, onDelete?, onOpen?, onField?, redraw? } — a node graph on one canvas: titled nodes with output and input ports, wires between them, and a value on every input port that has no wire into it. Drag the background to pan, scroll to zoom, drag a node to move it, drag from a port to another port to connect, drag a connected input away to pick its wire up, click a value to edit it where it stands, press Delete to remove the selection. The widget draws and reports; the owner holds the graph and applies what onField, onConnect, onDisconnect, onMove and onDelete report. Nodes with no position are laid out left to right over the wires. edui.nodeGraphView(key) answers where the view stands and, through its locate, where a port or a value is on the canvas.
  • iconButton{ d, tooltip?, active?, onClick, key } — a hoverable/active icon square; d is an SVG path (or full <svg>).

Icons are inline SVG (feather/lucide-style 24-view stroke paths), matching the editor's icon language — pass a path d and it is wrapped for you.