dockArea

A docking container backed by egui_dock. Holds a persistent DockState keyed by the widget id, so split/tab arrangements and user drags survive across frames. Children are dockPanels, each supplying a tab id, a title, and a content subtree.

The dockArea must be the root of a registered screen tree. Each frame it reconciles: it adds tabs for newly-present dockPanel ids and removes tabs whose dockPanel disappeared. Closing a tab emits a <panelId>-close interaction so the app can drop the panel from its children.

The module returns the widget builder function directly.

Builder

dockArea(opts?) -> widget node. opts fields:

• id — the widget id the DockState is keyed by.
• layout — a serialized DockState JSON string that seeds the split/tab arrangement on first render. Read the live arrangement back with ui.getDockLayout(id) and pass it here to restore.
• restoreLayout / restoreEpoch — re-apply a saved layout to an already-live dock: pass the JSON in restoreLayout and bump restoreEpoch to a new value; the dock re-deserializes once per new epoch, then stays freely draggable.
• overlayType — "widgets" (icon drop buttons) or "highlightedAreas" (quadrant highlights — edges split, middle ring appends as a tab, dead-center floats the tab into its own window).
• leafCollapseButtons / leafCloseAllButtons — the collapse arrow and close-all button on each leaf's tab bar.
• allowedSplits — how a dragged tab resolves over a drop area: "all", "none", "leftRight", "topBottom".
• children — the dockPanels.
• props, style — the style block carries the standard widget keys (borderWidth, borderRadius, padding) plus the dock-specific chrome keys typed as ZuiDockStyle.

Usage

local dockArea = require("modules.zui.widget.dockArea")
local widget = dockArea({ id = "editor", children = {
    Z.dockPanel({ id = "scene", title = "Scene",
        children = { Z.lbl("Scene body") } }),
    Z.dockPanel({ id = "props", title = "Properties",
        children = { Z.lbl("Inspector body") } }),
}})