Advanced HUD
Features
Integrations
ESX

ESX

Drop-in overrides that route ESX.ShowNotification, ESX.ShowAdvancedNotification, and the optional esx_progressbar resource to the Bablo HUD.

Notifications

Replace ESX.ShowNotification in es_extended/client/functions.lua:

---@param message string
---@param notifyType? 'info' | 'warning' | 'success' | 'error'
---@param length? number
function ESX.ShowNotification(message, notifyType, length)
    -- Map ESX legacy types onto bablo-hud types.
    local mapped = ({
        inform = 'info',
        info = 'info',
        success = 'success',
        error = 'error',
        warning = 'warning',
    })[notifyType or 'info'] or 'info'
 
    exports['bablo-hud']:Notify(
        'Notification',
        message or '',
        mapped,
        length or 5000
    )
end

For the advanced flavor (used for txt-message style toasts) replace ESX.ShowAdvancedNotification:

---@param sender string
---@param subject string
---@param msg string
function ESX.ShowAdvancedNotification(sender, subject, msg)
    exports['bablo-hud']:Notify(
        sender or subject or 'Notification',
        msg or '',
        'info',
        5000
    )
end

Server Notify

ESX server scripts call TriggerClientEvent('esx:showNotification', src, msg, type, length). The handler is registered in es_extended/client/main.lua and forwards to ESX.ShowNotification, so once you've overridden the function above every server-triggered notification flows through the HUD.

If your fork registered the event differently, add this in any client script:

RegisterNetEvent('esx:showNotification', function(message, notifyType, length)
    ESX.ShowNotification(message, notifyType, length)
end)

Progress Bar

ESX itself does not ship a progress bar — most servers use esx_progressbar or a community fork. Override the export in that resource (typically esx_progressbar/client/main.lua):

exports('Progressbar', function(name, duration, options)
    options = options or {}
 
    exports['bablo-hud']:ProgressBar({
        duration = duration,
        label = options.label or name,
        canCancel = options.canCancel,
        disable = options.disableControls,
        anim = options.animation,
        prop = options.prop,
    })
 
    Wait(duration)
 
    if options.onFinish then options.onFinish() end
end)

Newer ESX versions (Legacy 1.10+) use lib.notify and lib.progressBar internally. If your server is on Legacy 1.10+, follow the ox_lib page instead — it covers every notification and progress call ESX makes.

Restart

After editing es_extended, restart the resource and any script that caches a reference to ESX.ShowNotification at startup. A full server restart is the safest option.

QBCoreScript Explorer