Widget guide

Every widget in the library, with the description straight from its source. Follow API ↗ for the full member reference.

UIAccordionUIBadgeUIBalloonUIBreadcrumbUIButtonUICheckboxUIChipUIColorPickerUIDataGridUIDateTimePickerUIDockGroupUIDockHostUIDockPanelUIDrawerUIDropdownUIExpanderUIIconUIIconRailUIKeybindUILabelUIListUIMenuBarUIModalUIPanelUIPieMenuUIProgressBarUIRadioGroupUIRatingUIScrollPaneUISegmentedControlUISeparatorUISliderUISpinnerUISplitterUIStackUIStatusBarUIStepperUISwitchUITabsUITextAreaUITextInputUITileGridUIToolbarUITreeViewUIWindowUIContextMenuUIToastUITooltip

Widgets

UIAccordionAPI ↗

A collapsible section header: chevron, all-caps title, underline and an optional right-aligned hint. The owner toggles its section's content visibility from onToggle(expanded) and re-flows the layout.

UIBadgeAPI ↗

A small count/status bubble: a rounded pill sized to its text, meant to overlay a button or icon (position it yourself at the corner). A zero count hides it unless showZero; counts past maxCount show as N+. Set text for a non-numeric label (e.g. "NEW"). Non-interactive.

UIBalloonAPI ↗

A callout / popover: a rounded panel with a directional tail pointing at an anchor point, shown on UIRoot.popupLayer. Add content to body (below the optional title). It prefers to sit below the anchor with the tail pointing up, flips above when it would clip the viewport bottom, and clamps horizontally while keeping the tail aimed at the anchor.

A transparent full-screen blocker sits behind it: a click outside closes it (as do Escape and the host's Back handling via UIRoot.pushOverlayCloser). Unlike UIModal it does not dim the background. Closing disposes the balloon.

UIBreadcrumbAPI ↗

A path/navigation trail: clickable segments separated by chevrons, with the last segment shown as the current (brighter) location. Clicking a segment fires onSelect(index). Set the trail with setPath; the row hit-tests segment x-ranges rather than nesting child widgets.

UIButtonAPI ↗

A clickable button. Variants: default (panel surface), accent (primary action) and danger (destructive). Hover lightens, press dips; the click fires on press-started release (see UIComponent).

A button may show a label, a UIIcon, or both: assign icon (or build an icon-only button with UIButton.icon(...)). The icon may be a built-in glyph (UIIcon.fromGlyph) or an asset — that is up to the caller. The button colours the icon to match its label (contrast against the fill). A toolbar-style toggle is just accent flipped at runtime.

UICheckboxAPI ↗

A labelled checkbox row: label on the left, accent check square on the right (or standalone square when the label is empty). Clicking anywhere on the row toggles; onToggle(checked) fires after the flip.

UIChipAPI ↗

A compact pill chip. With hasDot = true it's a stateful toggle showing a status dot (on flips on click, then onToggle(on) fires); without a dot it's a value chip whose text the owner updates and whose onClick typically cycles the value. Auto-sizes to its label.

UIColorPickerAPI ↗

An inline HSV colour picker: a saturation/value square, a vertical hue strip, a live swatch + hex readout, and a row of preset swatches. Dragging the square sets saturation (x) and value (y); dragging the strip sets hue; clicking a preset jumps to it. onChange fires continuously while dragging with the opaque 0xFFRRGGBB colour.

The square and strip are gradient fills (no bitmaps), so the widget is cheap and repaints only when the selection moves. It reuses UIColor.hsv / UIColor.toHSV.

UIDataGridAPI ↗

A virtualized data table: a fixed header of columns above a UIList of rows, where each row draws one text cell per column. Only on-screen rows exist as display objects (inherited from UIList), so a table of any height stays cheap.

Data is provider-driven (setData(rowCount, cellProvider)): the grid never copies the source, it just asks for cell(row, column) text on demand. Clicking a sortable column header sorts a display-order permutation in place (the source is untouched); selection is reported and kept in SOURCE row indices across sorts.

UIDateTimePickerAPI ↗

A labelled date (and optional time) field: label left, value box right. Clicking the box opens a calendar popup on UIRoot.popupLayer behind a click-blocking backdrop (Escape or an outside click closes it). Navigate months with the header arrows and click a day to pick it; with showTime the popup adds hour/minute steppers and a Set button, otherwise a day click commits immediately.

Values are plain Haxe Dates; the field shows YYYY-MM-DD (plus HH:MM when showTime).

UIDockGroupAPI ↗

A leaf of a UIDockHost: a tabbed group of UIDockPanels, one visible at a time. Clicking a tab activates its panel; dragging a tab hands off to the host to re-dock (split, tab into another group, or move). The host sizes and positions the group; do not use it standalone.

UIDockHostAPI ↗

An editor-style docking region: a tree of resizable splits with tabbed UIDockGroups at the leaves. Add panels with addPanel (a new tab in the primary group) or dock(panel, target, zone) (split a target). Dragging a panel's tab re-docks it live — a drop-zone overlay shows where it will land (CENTER tabs into a group, the edges split it), and emptied groups collapse so the tree stays tidy. Split dividers drag to reproportion.

The layout is a mutable node tree the host lays out to fill its bounds; call invalidate() after a structural change (the dock/undock operations do this for you).

UIDockPanelAPI ↗

One dockable panel: a titled content surface shown in a UIDockGroup tab. Add the panel's widgets to content (origin at the panel's top-left); the hosting group sizes and positions it. The title labels its tab.

Panels are moved between groups (and split into new ones) by dragging their tab in a UIDockHost; a closable panel shows an X on its tab and fires onClosed when removed.

UIDrawerAPI ↗

Which viewport edge a UIDrawer docks to. **/ enum abstract UIDrawerSide(Int) to Int { var LEFT = 0; var RIGHT = 1; }

/** A persistent slide-out panel docked to the left or right viewport edge, for mobile layouts where desktop side panels don't fit. Add widgets to content; the drawer lives on UIRoot.popupLayer above a tap-to-close scrim while open.

Gestures: swiping in from the docked edge (edgeSwipeEnabled, an invisible strip) pulls the drawer open following the finger; a horizontally-dominant drag on the open drawer slides it back out (vertical drags pass through, so scroll panes inside keep working); releasing settles open/closed by velocity, then position. The scrim tap, Escape and the host's Back handling (via UIRoot.pushOverlayCloser) also close it. open()/close() drive it programmatically. Unlike UIModal, closing does NOT dispose the drawer — reuse it across openings and dispose() it with the screen.

UIDropdownAPI ↗

A labelled dropdown row: label left, value box right. Clicking the box opens a scrollable popup list on UIRoot.popupLayer behind a click-blocking backdrop, so nothing underneath can be interacted with while it is open (Escape or an outside click closes it). display entries override row labels while items holds the raw values delivered to onSelect.

Set searchable for combo-box type-ahead: while the popup is open, typing filters the list (case-insensitive substring on the shown labels), Backspace edits the query, and Enter picks the first match. A search header at the top of the popup shows the query.

UIExpanderAPI ↗

A single collapsible section: a clickable header with a rotating chevron over a body you fill via content. Unlike UIAccordion (which only toggles an external body's visibility), the expander owns its body and its own height grows/shrinks with the state, so h reflects headerHeight plus contentHeight while open. onToggle(open) lets a host relayout.

UIIconAPI ↗

A themed icon that can be dropped into any widget or layout. Sources:

- **Glyph** — a built-in UIGlyph drawn as a vector (no asset). Use UIIcon.fromGlyph(...) or assign glyph; takes precedence over asset when set. - **SVG** (preferred) when the optional svg haxelib is present (-lib svg sets the svg define automatically) — rasterized once per (asset, pixel size) into a shared static cache, so N icons of the same glyph cost one texture and batch as bitmaps. - **Bitmap** assets (png etc.) otherwise, scaled into the same cache.

Tinting forces every opaque pixel to a theme colour (tone ramp or colorOverride) via a reused ColorTransform, so monochrome icon sets follow theme swaps with zero extra bitmaps; set tinted = false for full-colour art. Missing assets render a placeholder ring so layouts never break. Non-interactive and pointer-transparent — attach freely to buttons, rows, rails (addChild + position).

UIIconRailAPI ↗

A vertical icon rail (Blender/VSCode-style activity bar): fixed-width column of tabs, one active at a time with an accent indicator. onSelect(index) fires on change.

UIKeybindAPI ↗

A key-binding row: label left, binding box right showing the current key. Clicking the box enters listening mode (UIFocus.typing gates the host's keybinds automatically); the next key pressed becomes the binding and fires onChange(keyCode). Escape cancels; with allowClear on, Backspace/Delete clears the binding (fires onChange(-1)) — disable allowClear to make those keys bindable. Works on mobile only with a hardware keyboard attached; desktop-oriented.

UILabelAPI ↗

A themed, non-interactive text label. tone picks the theme text ramp (PRIMARY/SECONDARY/ TERTIARY) so theme swaps restyle it; colorOverride pins an explicit ARGB color instead. Set key (+ fallback) for localized text, or assign text directly.

UIListAPI ↗

A virtualized, selectable list. Only the visible rows (+2) exist as display objects; they are recycled by modulo slot mapping, so scrolling by one row rebinds exactly one row and a 100k-entry list costs the same as a 20-entry one. Rows are fixed-height (the constraint that keeps the window math O(1)).

Data is provider-driven: setProvider(count, label) for huge/lazy datasets or setItems(array) for convenience. Custom row content subclasses UIListRow and overrides bind(), supplied through rowFactory.

Input: mouse wheel + scrollbar thumb drag everywhere; on mobile (touchScroll) dragging anywhere scrolls with fling momentum — a drag past the threshold steals the press so no row click fires. Clicking focuses the list; Up/Down move the selection, Enter fires onActivate (as does a double click).

UIMenuBarAPI ↗

One top-level menu: a title plus an item factory (evaluated on open, so checkmarks and shortcut labels are always current). **/ typedef UIMenuDef = { var title:String; @:optional var key:String; @:optional var fallback:String; var items:Void->Array<UIMenuItem>; }

/** A desktop menu bar. Clicking a title opens its dropdown (UIContextMenu); while one is open, hovering another title switches to it. An optional brand label renders before the menus and arbitrary widgets can be laid over the right side by the owner.

UIModalAPI ↗

A modal dialog panel centered over a dimmed, click-blocking backdrop on UIRoot.popupLayer. Add content to body (coordinates relative to the panel, below the title). Escape or the backdrop click closes it (unless dismissable = false). Opens/closes with a short fade+scale.

UIPanelAPI ↗

A filled surface: chrome bands, cards, placeholders. Non-interactive but blocking by default (children stay interactive, pointer hits never fall through). corner rounds the fill; the four border* flags draw 1px themed edges and outline draws a full 1px frame.

Themed by default: fill is a UIFill — a theme slot (PANEL unless you pass another) that re-reads the palette every render and follows theme swaps, or any ARGB colour literal (new UIPanel(w, h, 0xFF1E1E21)) for the rare fixed surface that shouldn't.

UIPieMenuAPI ↗

A radial (pie) menu: entries laid out as donut sectors around the open point on UIRoot.popupLayer, behind a click-blocking backdrop. Moving the pointer highlights the sector under it; clicking a sector runs its onSelect and closes. Escape or an outside click closes with no selection. Reuses UIMenuItem (label/key/onSelect/disabled; separators and shortcuts are ignored here).

UIProgressBarAPI ↗

A progress bar for any long-running operation (downloads, uploads, decompression, loading).

Two modes:

- **Determinate** — assign progress (0..1); the fill tweens smoothly to the new value (smoothing = false snaps instead). - **Indeterminate** — set indeterminate = true for unknown-length work; an accent band sweeps the track until turned off.

Layout follows the labelled-row convention (label left, optional percent, bar right); an empty label makes the bar span the full width. Idle-free by construction: a per-frame ticker runs only while the sweep animation or a smoothing tween is active, so a settled bar performs zero work.

UIRadioGroupAPI ↗

An exclusive-choice list of radio options (the vertical counterpart to UISegmentedControl): a stacked column of rows, each a dot on the left and a label on the right, with exactly one selected. Clicking a row selects it and fires onSelect(index); picking another clears the previous one.

The group is a passive container — the interactive rows are its children — so it lays out and re-themes like the rest of the library. Rows are fixed-height (rowHeightBase, taller on mobile for touch); the group's height follows the option count.

UIRatingAPI ↗

A star rating: a row of max stars, filled up to rating. Clicking or dragging sets the rating (with a live hover preview), unless readOnly. onChange fires with the new 1-based rating (0 when cleared by clicking the current single star). Uses the built-in STAR glyph.

UIScrollPaneAPI ↗

A fixed-size, vertically scrollable container. Add children to content; call refreshContent() after (re)filling it. Scrolls by mouse wheel and by dragging the slim scrollbar thumb; on mobile (touchScroll) dragging anywhere scrolls with fling momentum — a drag past the threshold steals the press so no child widget clicks. Clipping uses scrollRect (GPU clip — scrolling never repaints children).

UISegmentedControlAPI ↗

An exclusive-choice segmented control (radio group): label left, equal-width segments in a box on the right. Exactly one segment is selected; picking another slides the accent pill over and fires onSelect(index). Taller by default on mobile for touch.

UISeparatorAPI ↗

A 1px themed divider line (horizontal by default).

UISliderAPI ↗

A labelled horizontal slider: label left, track + knob right, current value drawn beside the knob. Dragging anywhere on the track seeks; onChange(value) fires while dragging.

UISpinnerAPI ↗

An indeterminate busy spinner: a faint full ring with a brighter sweeping arc that rotates while spinning. It steps a UIRoot ticker (only while spinning) and repaints the arc each frame, so an idle spinner costs nothing. Pair it with UIProgressBar for determinate work.

UISplitterAPI ↗

Two resizable panes with a draggable divider: side by side (vertical = false) or stacked (vertical = true). Add each pane's content to first / second (origin at the pane's top-left); the panes are clipped to their region, so overflow is hidden and only in-region content takes the pointer. Dragging the divider moves the split, honouring minFirst / minSecond.

position is the first pane's size along the split axis, in UI pixels; onResized reports the two pane sizes after a drag. Non-interactive except for the divider — pane content keeps its own interactivity.

UIStackAPI ↗

A flow-layout container: stacks its children in a row (vertical = false) or column (vertical = true), spaced by gap with padding around the group. stretch sizes each UIComponent child to fill the cross axis; otherwise align places them (START/CENTER/END). The main axis auto-grows to fit — a vertical stack keeps its given width and computes its height, a horizontal stack keeps its height and computes its width.

gap/padding are base (unscaled) pixels, scaled by UITheme.scale like the rest of the library. Relayout happens on render(), so call invalidate() (or relayout()) after changing a child's size; a theme scale change relayouts automatically. Non-interactive and pointer-transparent — children keep their own interactivity.

UIStatusBarAPI ↗

One UIStatusBar cell. width fixes the cell width (0/omitted auto-sizes to the text); rightAlign packs it from the right edge instead of the left. **/ typedef UIStatusCell = { @:optional var text:String; @:optional var key:String; @:optional var fallback:String; @:optional var width:Float; @:optional var rightAlign:Bool; @:optional var tone:UITone; }

/** A bottom status bar: a themed strip of text cells, left-packed by default with a rightAlign flag to pack from the right (line/column, encoding, clock). Thin separators divide adjacent cells on the same side. Passive but blocking, so it never leaks pointer hits to content behind it; span it across the window and update cells in place with setText.

UIStepperAPI ↗

A labelled numeric - value + row: label left, stepper box right. Clicking -/+ changes by step, clamped to [min, max]; holding repeats after a delay with acceleration. Clicking the value itself types a number directly (Enter/blur commits, Escape cancels). onChange(value) fires on every change; decimals controls display rounding.

UISwitchAPI ↗

A labelled toggle switch row: label left, animated track + knob right. Clicking anywhere on the row flips the state and fires onToggle(on). The track colour and knob position tween between states. Larger track and row height on mobile for touch.

UITabsAPI ↗

One UITabs tab definition. **/ typedef UITabDef = { var label:String; @:optional var key:String; @:optional var fallback:String; }

/** A horizontal tab strip (the horizontal counterpart to UIIconRail): content-width cells, one active at a time with an accent underline that slides between tabs. The owner switches panel content from onSelect(index). Taller by default on mobile for touch.

UITextAreaAPI ↗

A multi-line, scrollable text editor — the note-taking / code surface the single-line UITextInput is not. It owns text editing (caret, selection, scrolling, clipboard, variable line heights) but is deliberately **style-agnostic**: it carries one opaque Int style word per character and defers all meaning to an optional installed styler (smidr.text.UITextStyler).

- With **no styler** it is a plain uniform-format multi-line field (what mobile / plain callers want) — the style words are ignored. - Install styler = new smidr.text.UIRichStyler() for WYSIWYG formatting (bold / italic / underline / colour / size / headings / lists). The editor never interprets the bits; the styler turns them into TextFormat runs, list markers, indentation and outline boxes, and decides how style flows across a line break. Markdown import/export lives in smidr.text.UIMarkdown.

Editing: printable input, Enter for newlines, Tab, Backspace/Delete, Left/Right (Ctrl = word jump), Up/Down with a desired column, Home/End (Ctrl = document ends), PageUp/PageDown, Ctrl+A/C/X/V. Word-wrap by default; vertical scroll via wheel, a draggable thumb and drag-to- scroll on mobile. Set readOnly for a selectable-but-immutable viewer. Implements UIStyledText so styling modules can transform its style words without depending on this widget.

UITextInputAPI ↗

A labelled single-line text field: label left, input box right. Click to focus; while focused it captures the keyboard (UIFocus.typing) — caret, Shift+arrow selection, Home/End, Ctrl+A/C/X/V, Backspace/Delete word-aware basics, Enter commits (onEnter), Escape blurs. onChange(text) fires on every edit.

UITileGridAPI ↗

A virtualized icon/tile grid: fixed-size tiles that reflow into as many columns as the width allows, scrolled vertically. Like UIList only the on-screen tiles (+ two rows) exist as display objects and are recycled by slot mapping, so a grid of any size is cheap.

Data is provider-driven (setProvider / setItems); the default tile draws an optional glyph over a centered label. Custom tiles subclass UITile and override bind(), supplied through tileFactory. Input mirrors UIList: wheel + thumb drag everywhere, touch drag with fling on mobile, arrow-key navigation, Enter/double-click to activate.

UIToolbarAPI ↗

A horizontal button strip: add text or icon buttons, separators, and flexible spacers. The toolbar draws a themed bar (background + bottom border + separator ticks) and lays its items out left to right; spacers absorb the leftover width, so items after a spacer are pushed to the right edge. Buttons are ordinary UIButtons returned for further tweaking (accent, etc.).

UITreeViewAPI ↗

A hierarchical, expandable tree. It reuses UIList's virtualization: the tree keeps a mutable node model and flattens the currently-visible nodes (collapsed subtrees excluded) into a flat array, which feeds the list as its provider. So a 100k-node tree still only instantiates the handful of rows on screen, exactly like UIList.

Rows indent by depth and draw an expand/collapse chevron for parent nodes; clicking the chevron toggles the branch, clicking elsewhere selects the row (Up/Down + Enter work through the underlying list). Build the model with UITreeNodes and hand the roots to setRoots.

UIWindowAPI ↗

A draggable, titled window and the supported way to build movable tool panels. Parent the window's widgets into content (its origin sits just below the title bar) and they move with the window for free: they are plain display-list children, so layouts are written once in window-local coordinates and never touched again on drag.

The window itself is a passive, blocking surface; the interactive title bar is a child, so widgets inside content receive the pointer normally. Pressing anywhere raises the window to the front and makes it the active window (its bar renders brighter). Options: draggable (the bar drags with viewport clamping), resizable (a bottom-right grip, honouring minWidth/minHeight), closable (an X that fires onClose or disposes), and collapsible (a chevron that rolls the body up to just the bar). The body is a UIFill (the PANEL slot by default) with a 1px outline and a PANEL3 title band, so it follows theme swaps like UIPanel.

Overlays & services

UIContextMenuAPI ↗

A popup menu shown on UIRoot.popupLayer behind a click-blocking backdrop. Used by UIMenuBar dropdowns and directly for right-click context menus. Escape or an outside click closes it; selecting an item closes then runs its callback.

UIToastAPI ↗

Transient status messages: slide up near the bottom of the viewport, hold, then fade out. One shared instance; a new message replaces the current one immediately.

UITooltipAPI ↗

The shared hover tooltip. install() hooks it into UIRoot's hover-delay driver; any widget with a tooltip (and optional tooltipShortcut, rendered right-aligned) gets one for free. One instance, idle-free, fades via UITween.