Glossário

Glossary — Base UI

Anatomy — the standard Root/Trigger/Portal/Positioner/Popup (and sub-part) structure most anchored popups follow; import the parts and compose them. (Ch 2)

render prop — the composition mechanism accepted by nearly every part; pass an element to swap the rendered tag/component, or a function (props, state) => element for full control. Base UI's equivalent of Radix's asChild. (Ch 7)

data-* attributes — per-part state flags (data-open/data-closed, data-checked/data-unchecked, data-highlighted, data-disabled, etc.) used to drive CSS/CSS-in-JS styling without tracking state in JS. (Ch 5)

className/style function form — both props accept (state) => string/(state) => cssObject in addition to plain values, for styling that needs to react to state not exposed as a data-* attribute. (Ch 5)

Shared field-state attributesdata-valid/data-invalid, data-dirty, data-touched, data-filled, data-focused, data-disabled, data-readonly, data-required recur on nearly every form control and Field part. (Ch 23)

Collision handling (collisionBoundary, collisionPadding, collisionAvoidance, sticky, disableAnchorTracking) — props on Positioner parts (Menu, Popover, Select, Combobox, Autocomplete, Tooltip, ContextMenu, NavigationMenu, PreviewCard, Toast) that keep a popup within a boundary as the anchor nears viewport edges. (multiple chapters)

Controlled vs. uncontrolled — most stateful components support both defaultOpen/defaultChecked/defaultValue (uncontrolled) and open/checked/value + matching onXChange (controlled). (Ch 8)

eventDetails — second argument to every Base UI change handler (onOpenChange, onValueChange, ...), carrying reason, the native event, and cancel()/allowPropagation() methods. (Ch 8)

Handle / createHandle() — imperative object connecting a Root to Triggers that aren't its siblings in the tree; created once via Component.createHandle(), passed to the handle prop of the root and any detached triggers. (Ch 12, 21, 27, 33)

Modal (modal prop) — whether outside pointer/focus interaction is blocked while a popup is open. AlertDialog/Dialog default true; Popover defaults false. (Ch 21, 33)

nativeButton — signals whether a render-swapped element is/isn't a real <button>, so the component knows which default behaviors (native click/keyboard handling, type attribute) are safe to apply. (Ch 15)

Portal — renders a subtree into a different DOM location (default document.body) so popup content escapes parent stacking/overflow constraints. (Ch 2)

Roving tabindex — the WAI-ARIA focus pattern where related controls (menu items, radio items, tabs, toolbar items) share one Tab stop with internal arrow-key movement. (Ch 27, 36, 42, 46)

useRender — the hook implementing the render prop pattern for custom, non-Base-UI components; Base UI's direct analog to Radix's Slot. (Ch 51)

mergeProps — utility for combining prop objects (event handlers merged, className concatenated, style shallow-merged); required inside any function-form render prop. (Ch 50)

Viewport (Menu, Popover, NavigationMenu, PreviewCard, Tooltip, Toast) — a shared container that content transitions animate within, instead of independent per-popup animation. (Ch 27, 30)

Field — the accessible-naming/validation wrapper (Label, Control, Description, Error, Item) composed around nearly every form control. (Ch 23)

Fieldset — groups multiple controls under one accessible Legend, typically composed via render onto a group primitive (RadioGroup, CheckboxGroup, Slider). (Ch 24)

Swipe-to-dismiss (swipeDirection, data-base-ui-swipe-ignore) — gesture-dismiss convention shared by Drawer and Toast; mark a descendant data-base-ui-swipe-ignore to exclude it from the gesture. (Ch 22, 43)