Skip to main content
Input dialogs provide flexible forms for collecting user data with support for validation, default values, and a wide variety of field types.

​
Quick Start

local result = exports.lation_ui:input({
    title = 'User Registration',
    options = {
        {
            type = 'input',
            label = 'Username',
            placeholder = 'Enter username',
            required = true
        },
        {
            type = 'number',
            label = 'Age',
            min = 18,
            max = 100,
            required = true
        }
    }
})

if result then
    print('Username:', result[1])
    print('Age:', result[2])
end

​
Functions

Opens an input dialog and waits for user submission.Returns:
  • table - Array of values indexed by field order (e.g., result[1], result[2])
  • nil - User cancelled or closed the dialog
local result = exports.lation_ui:input({
    title = 'Enter Details',
    options = { ... }
})

if result then
    -- Process input values
    print('First field:', result[1])
end
Programmatically closes any currently open input dialog.
exports.lation_ui:closeInput()

​
Configuration

​
Dialog Options

​
options
table
required
Array of field objects that define the form inputs. Each field type supports specific configuration options.See Field Types below for available types and their options.
​
title
string
Main dialog title displayed at the top.
​
subtitle
string
Optional subtitle providing additional context or instructions.
​
submitText
string
default:"Submit"
Custom text for the submit button.
​
cancelText
string
default:"Cancel"
Custom text for the cancel button.
​
cancel
boolean
default:"true"
Whether to show the cancel button.
​
type
string
default:"default"
Dialog styling type to indicate context or severity.Options: 'default', 'info', 'success', 'warning', 'error'

​
Field Types

​
input

Standard single-line text input field.
​
type
string
required
Must be 'input'
​
label
string
required
Field label displayed above the input
​
description
string
Helper text displayed below the label
​
placeholder
string
Placeholder text shown when empty
​
icon
string
FontAwesome icon class (e.g., 'fas fa-user')
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
default
string
Default text value
​
required
boolean
default:"false"
Whether the field must be filled
​
disabled
boolean
default:"false"
Whether the field is disabled
​
password
boolean
default:"false"
Enable password field with visibility toggle
​
min
number
Minimum character length
​
max
number
Maximum character length

​
number

Numeric input with increment/decrement controls.
​
type
string
required
Must be 'number'
​
label
string
required
Field label displayed above the input
​
description
string
Helper text displayed below the label
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
default
number
Default numeric value
​
required
boolean
default:"false"
Whether the field must be filled
​
disabled
boolean
default:"false"
Whether the field is disabled
​
min
number
Minimum numeric value
​
max
number
Maximum numeric value
​
step
number
default:1
Step increment (e.g., 0.5, 5, 10)

​
textarea

Multi-line text input for longer content.
​
type
string
required
Must be 'textarea'
​
label
string
required
Field label displayed above the input
​
description
string
Helper text displayed below the label
​
placeholder
string
Placeholder text shown when empty
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
default
string
Default text value
​
required
boolean
default:"false"
Whether the field must be filled
​
disabled
boolean
default:"false"
Whether the field is disabled
​
min
number
Minimum character length
​
max
number
Maximum character length

​
toggle / checkbox

Toggle switch or checkbox for boolean values.
'toggle' and 'checkbox' are aliases - both render the same component.
​
type
string
required
Must be 'toggle' or 'checkbox'
​
label
string
required
Field label displayed next to the toggle
​
description
string
Helper text displayed below the label
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
default
boolean
Default checked state (true or false)
You can also use checked as an alias for default.
​
disabled
boolean
default:"false"
Whether the field is disabled

​
select

Single-select dropdown menu.
​
type
string
required
Must be 'select'
​
label
string
required
Field label displayed above the dropdown
​
description
string
Helper text displayed below the label
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
options
table
required
Array of option objects (see Select Options below)
​
default
any
Default selected value (must match an option’s value)
​
required
boolean
default:"false"
Whether a selection is required
​
disabled
boolean
default:"false"
Whether the field is disabled
​
searchable
boolean
default:"true"
Enable search/filter functionality

​
multi-select

Multi-select dropdown menu allowing multiple selections.
​
type
string
required
Must be 'multi-select'
​
label
string
required
Field label displayed above the dropdown
​
description
string
Helper text displayed below the label
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
options
table
required
Array of option objects (see Select Options below)
​
default
table
Array of default selected values
default = {'option1', 'option2'}
​
required
boolean
default:"false"
Whether at least one selection is required
​
disabled
boolean
default:"false"
Whether the field is disabled
​
searchable
boolean
default:"true"
Enable search/filter functionality
​
max
number
Maximum number of selections allowed

​
slider

Range slider for numeric value selection.
​
type
string
required
Must be 'slider'
​
label
string
required
Field label displayed above the slider
​
description
string
Helper text displayed below the label
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
min
number
required
Minimum slider value
​
max
number
required
Maximum slider value
​
step
number
default:1
Step increment between values
​
unit
string
Unit label displayed next to value (e.g., '%', 'mph', 'px')
​
default
number
Default slider value
​
disabled
boolean
default:"false"
Whether the field is disabled

​
color

Color picker with multiple format support.
​
type
string
required
Must be 'color'
​
label
string
required
Field label displayed above the picker
​
description
string
Helper text displayed below the label
​
placeholder
string
Placeholder text shown when empty
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
format
string
default:"hex"
Color format for the returned valueOptions:
  • 'hex' - #RRGGBB
  • 'hexa' - #RRGGBBAA
  • 'rgb' - rgb(r, g, b)
  • 'rgba' - rgba(r, g, b, a)
  • 'hsl' - hsl(h, s%, l%)
  • 'hsla' - hsla(h, s%, l%, a)
​
default
string
Default color value (must match specified format)
​
required
boolean
default:"false"
Whether a color must be selected
​
disabled
boolean
default:"false"
Whether the field is disabled

​
date

Date picker with customizable format and range constraints.
​
type
string
required
Must be 'date'
​
label
string
required
Field label displayed above the picker
​
description
string
Helper text displayed below the label
​
placeholder
string
Placeholder text shown when empty
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
format
string
default:"MM/dd/yyyy"
Date format for display and return valueOptions:
  • 'MM/dd/yyyy' - 01/15/2025
  • 'dd/MM/yyyy' - 15/01/2025
  • 'yyyy-MM-dd' - 2025-01-15
  • 'dd.MM.yyyy' - 15.01.2025
​
default
string
Default date value (must match specified format)
​
min
string
Earliest selectable date (must match specified format)
​
max
string
Latest selectable date (must match specified format)
​
clearable
boolean
default:"true"
Show clear button to remove selected date
​
required
boolean
default:"false"
Whether a date must be selected
​
disabled
boolean
default:"false"
Whether the field is disabled

​
date-range

Date range picker for selecting start and end dates.
​
type
string
required
Must be 'date-range'
​
label
string
required
Field label displayed above the picker
​
description
string
Helper text displayed below the label
​
placeholder
string
Placeholder text shown when empty
​
icon
string
FontAwesome icon class
​
iconColor
string
default:"#71717A"
Icon color (hex code or CSS color name)
​
format
string
default:"MM/dd/yyyy"
Date format for display and return valuesOptions:
  • 'MM/dd/yyyy' - 01/15/2025
  • 'dd/MM/yyyy' - 15/01/2025
  • 'yyyy-MM-dd' - 2025-01-15
  • 'dd.MM.yyyy' - 15.01.2025
​
default
table
Default date range as array: { startDate, endDate }
default = { '01/01/2025', '01/07/2025' }
​
min
string
Earliest selectable date (must match specified format)
​
max
string
Latest selectable date (must match specified format)
​
clearable
boolean
default:"true"
Show clear button to remove selected range
​
required
boolean
default:"false"
Whether a date range must be selected
​
disabled
boolean
default:"false"
Whether the field is disabled

​
Select Options

For 'select' and 'multi-select' field types, each option in the options array supports:
​
value
any
required
The value returned when this option is selected
value = 'us'
value = 123
value = true
​
label
string
Display text shown to the user (uses value if omitted)
{ label = 'United States', value = 'us' }
​
disable
boolean
default:"false"
Whether the option is disabled and cannot be selected
{ label = 'Coming Soon', value = 'beta', disable = true }

​
Preview

Input dialog example