Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.sure-developer.com/llms.txt

Use this file to discover all available pages before exploring further.

​
Select

Select renders a dropdown control and sends a payload with value to Lua when the user chooses an option. 
local tone, setTone = track.state('tone', 'success')

lui.page('filters', function(ui)
  ui.select({
    value = tone,
    options = {
      { label = 'Success', value = 'success' },
      { label = 'Warning', value = 'warning' },
      { label = 'Error', value = 'error' }
    },
    onChange = function(payload)
      setTone(payload.value)
    end
  })
end)

​
API

ui.select(props)

​
Props

PropTypeDescription
valuestring | reactive getterSelected value.
optionsstring[] | object option[] | reactive getterOptions. Object options use label and value. Strings become both label and value.
onChangefunction(payload)Receives a payload with value = string.
icon, iconComponenticonDefault open/closed icon.
closedIcon, closedIconComponenticonIcon while closed.
openIcon, openIconComponent, activeIcon, activeIconComponenticonIcon while open.
triggerClassNamestringTrigger button class.
valueClassName, labelClassNamestringSelected value text class.
menuClassName, contentClassNamestringDropdown menu class.
optionClassNamestringEvery option row class.
optionActiveClassName, optionSelectedClassNamestringActive option row classes.
optionLabelClassName, optionActiveLabelClassNamestringOption label classes.
Select keeps a local selected value for immediate UI feedback, then syncs back to reactive Lua state through onChange.