Behaviors reference

Behaviors are the interaction vocabulary of the Milda Language: a small set of atoms - formal state machines - from which every interactive pattern is composed. This page catalogs all of them, plus the composites built on top and the things that deliberately are not behaviors.

#The atom model, in plain words

An atom is not a widget. It is an abstract interaction state machine: a handful of named states, the events that move between them, and the outputs it emits along the way. A toggle is two states (off, on), one event that flips them, and a change output - nothing about checkboxes, tap targets, or DOM.

Because each atom is defined formally rather than in prose, its behavior cannot drift between implementations: a web generator and a native generator realize the same machine. Three properties make atoms platform-neutral invariants:

• They emit states, not pseudo-classes. Styling keys on behavior-exposed states (checked, open, selected, dragging…), never on :hover-style platform concepts.
• They gate on capabilities, not platforms. An atom that needs a keyboard declares input.keyboard; on a target without that capability it is dropped or substituted automatically. The core never mentions platform names.
• They compose through a small algebra.Machines connect by wiring one machine's output to another's input (wire), listening only under a condition (gate), fanning out to a whole set of machines (broadcast plus aggregates - how a form coordinates its fields), and arbitrating gestures that race for the same input (arena). Three constructs cover everything.

A select is a worked example: activation opens a presentation, browse moves the highlight, selection commits the value, dismiss closes the surface - five stock machines and a few wires. The iOS wheel variant reuses the same machines and changes one wire.

#The atoms

The prelude defines 19 true atoms - indivisible machines. Everything else in the interaction vocabulary is built from them. For each: what it does, the states it exposes for styling, and archetypes that compose it.

#Foundational

• activation - invokes an action and emits an event with a payload on a trigger (press, key, voice, hotkey). Exposes no states - it is a pure transducer. The foundational atom under almost every interactive archetype: Button, Link, FileUpload, and the trigger of every select and menu.
• scheduler - a timed transition: timeout, debounce, or interval. Arms, waits, fires. Exposes no states. Load-bearing: all time-based interaction composes from it - toast auto-dismiss, typeahead debounce, tooltip open-delay, carousel autoplay.

#Disclosure & toggle

• toggle - flips a boolean and reports it. Exposes checked. The core of BooleanInput and ToggleButton; a tristate variant adds indeterminate.

#Selection & collection

• selection - chooses member(s) of a collection, in modes single, multiple, range (anchor + extent: date ranges, shift-click), or none. Exposes selected. Used by SingleSelect, MultiSelect, ChoiceGroup, Rating, List, Table, Tree.
• browse - moves a cursor over a collection, in modes roving (linear), spatial (2D), tree, or scroll-detent (nearest snap point - the iOS wheel). Exposes active (the highlight). Requires input.keyboard or input.remote for roving/tree modes. Used by SingleSelect, Menu, Tabs, List, Carousel, Grid.

#Presentation & layering

• presentation - manages a surface: open/closed, with the surface kind (inline, popover, menu, sheet, dialog, push, wheel) a realization-only concern. Exposes open. Used by Dialog, Popover, Tooltip, Drawer, SingleSelect, Toast.
• dismiss - requests a close when a configured trigger fires: outside interaction, escape, commit, swipe-down, timeout. Exposes no states - it only emits dismissRequested; something else (usually a presentation) decides. Used by Dialog, Popover, Menu, every select.
• focus-scope - traps, contains, and restores focus within a region; the modal accessibility guarantee. Requires input.keyboard or input.remote; on pointer/touch-only targets it realizes as a no-op (the OS owns focus). Exposes no visual states. Used by Dialog and Drawer.

#Input & value

• value-entry - free text/value entry with a staged draft, committing on change, blur, and/or enter. Exposes focused, empty, dirty. Used by TextField, TextArea, SearchField, Combobox, Stepper, TagsInput.
• range - value(s) along a min/max track with one or two thumbs; distinguishes live change while dragging from the final commit on release. Exposes active (per thumb). Used by Slider and ColorPicker.
• stepping - increments/decrements a value within clamped bounds. Exposes atMin, atMax. Used by Stepper and Pagination.
• validation- evaluates a value against rules. Pure: it never listens to input directly; the “validate on change/blur/submit” policy is a wire from value-entry or submission into its check event. Exposes invalid, valid, pristine. Used by Field and TextField.
• submission - form-level orchestration over a dynamic set of validation machines: broadcast a collective check, submit when all valid, focus the first error otherwise, track the async submit. Exposes loading, dirty. Used by Form.

#Gesture & motion

• gesture - recognizes swipe, long-press, pinch, pan, drag, or drop through a track → recognize → update → end lifecycle with thresholds. Exposes dragging. Requires input.touch for touch gestures. Load-bearing: all drag-based interaction composes from it - Slider (pan), Carousel (swipe), FileUpload (drop), Drawer (swipe).

#Status, async & navigation

• async-state - the idle → loading → success/error lifecycle. Exposes loading, success, error. Used by Skeleton, FileUpload, and opt-in on Button (pending UI).
• navigation - switches between destinations and carries a history stack (shared with back-navigation and wizard-back), which makes it richer than selection plus activation. Exposes current. Used by Tabs, NavigationBar, Breadcrumbs, Pagination.
• scroll - observes scroll position: infinite-load, scroll-spy, reveal-on-scroll, parallax. Exposes atStart, atEnd, scrolled. Its atEnd output wired into async-state.start is infinite-load.
• progress - determinate or indeterminate completion. Exposes complete. Used by ProgressBar.
• liveness - announces dynamic changes to assistive technology, polite or assertive. Requires a11y.screenreader. Used by Toast, Alert, ProgressBar.

#Composites

Seven familiar behaviors are not atoms - they are compositions, kept as first-class conveniences that compile down to their canonical form:

• disclosure = toggle + presentation(inline) - expand/collapse a region; exposes expanded. Behind Disclosure, Accordion, Tree.
• typeahead = scheduler(debounce) + browse - jump to a member by typed prefix. Optional on SingleSelect, Menu, MenuButton.
• dnd = gesture + ordering (a non-behavior: the collection mutation) - drag-and-drop move/reorder across containers.
• resize = gesture(drag) - drag-resize a region or panel; optional on Table columns.
• auto-dismiss = scheduler(timeout) wired to a dismiss request - self-close after a delay. Behind Toast.
• stepping-nav = navigation (ordered) + a progression constraint - exposes active and complete. Behind Wizard.
• pressability = tap/hover recognition from gesture - contributes pressed and hovered feedback states only. It never fires the action; that is always activation. On Button, Link, ToggleButton, Rating.

#Decorations

Decorations shape how something happens or is presented without adding any states of their own - they decorate machines and surfaces the way style decorates nodes:

• motion - animates existing transitions (spring on open/close, FLIP on reorder, fade/slide on enter/exit). The state machines give it precise anchors; it adds none.
• masking- formats/constrains entry (date, phone, currency) by decorating a value-entry's draft.
• anchoring - positions a surface relative to a reference (placement, flip, offset, match-size); decorates popover/menu presentations.
• backdrop - the scrim or blur behind a modal layer; painted via the backdrop facet on the backdrop anatomy part.
• momentum-scroll - inertial scrolling with snap/detent; decorates scroll and browse on touch surfaces (the physics of the iOS wheel and of Carousel).

#Non-behaviors

Four things that look like behaviors are deliberately excluded: they transform data or the render, not interaction, so they belong to your data layer or to the generator:

• filter - a derived view over a collection (what a Combobox narrows).
• virtualization - render windowing for large collections.
• ordering - collection mutation: reorder, sort.
• aggregation - grouping and totals (DataGrid math). The atoms cover interaction, not data transformation.

Next: how these atoms bundle into component blueprints - Archetypes reference.