echo_ui

Every HUD widget — notifications, prompts, progress, the eye-target, menus — in one shared resource.

echo_ui is called directly via exports; no import needed. Use it from client scripts.

💡 provide ≠ exports

echo_ui provides ox_target, but FiveM's provide only makes GetResourceState pass — it does NOT reroute exports. Always call exports.echo_ui, never exports.ox_target.

Notifications

exports.echo_ui:Notify({
    type = 'success',          -- 'success' | 'error' | 'info'
    title = 'Job',
    message = 'Clocked in',
    duration = 4000,           -- optional, ms
})

Text prompts

A themed "press [E]" style prompt, middle-left of the screen. Shows until you hide it.

exports.echo_ui:ShowTextUI('Open Garage', { key = 'E' })
exports.echo_ui:ShowTextUI('Hold to search', { icon = 'fas fa-magnifying-glass' })
exports.echo_ui:HideTextUI()

local open, text = exports.echo_ui:IsTextUIOpen()

Progress bars

Blocks until done and returns true if it completed (not cancelled). Can play an animation, attach a prop, and disable controls while it runs.

local ok = exports.echo_ui:Progress({
    label = 'Repairing…',
    duration = 4000,
    disable = { move = true, car = true },
    anim = { dict = 'mini@repair', clip = 'fixing_a_ped' },
    canCancel = true,
})
if ok then ... end

Target (interaction)

The eye-target: hold LAlt to aim, the reticle highlights what you look at, right-click to bring up the option menu, then left-click an option. Register options by zone, model, or entity.

exports.echo_ui:AddBoxZone({
    coords = vec3(-1037.0, -2738.0, 20.0),
    size = vec3(2.0, 2.0, 2.0),
    options = {
        {
            label = 'Open Garage',
            icon = 'fas fa-warehouse',
            onSelect = function(data) ... end,
        },
    },
})

-- by model:
exports.echo_ui:AddModel('prop_atm_01', {
    { label = 'Use ATM', icon = 'fas fa-money-bill', onSelect = function() ... end },
})

Other registrars: AddEntity(entity, options), AddGlobalVehicle(options). Remove with RemoveZone(id), RemoveModel(model), RemoveEntity(entity).

exports.echo_ui:Menu({
    title = 'Garage',
    options = {
        { label = 'Retrieve vehicle', onSelect = function() ... end },
        { label = 'Store vehicle',    onSelect = function() ... end },
    },
})

local values = exports.echo_ui:Input({
    title = 'Set plate',
    fields = {
        { type = 'text', label = 'Plate', required = true },
    },
})