Context Menu

Nested context menus with icons, metadata, progress bars, and submenu navigation.

Client Exports

registerContext


exports['trinity-ui']:registerContext(context)

Parameters:

Property	Type	Required	Description
`id`	`string`	Yes	Unique menu identifier
`title`	`string`	Yes	Menu title
`menu`	`string`	—	Parent menu ID (enables back navigation)
`canClose`	`boolean`	—	Whether the menu can be closed (default `true`)
`onExit`	`function`	—	Called when the menu is closed
`onBack`	`function`	—	Called when the back button is pressed
`options`	`table[]`	Yes	Array of menu items (see below)

Option Properties:

Property	Type	Description
`title`	`string`	Item label (required)
`description`	`string`	Secondary text
`icon`	`string`	Iconify icon name
`iconColor`	`string`	Icon color (hex)
`image`	`string`	Image URL
`progress`	`number`	Progress bar percentage (0-100)
`menu`	`string`	Submenu ID to navigate to
`arrow`	`boolean`	Show submenu arrow indicator
`onSelect`	`function`	Callback when selected
`event`	`string`	Client event to trigger
`serverEvent`	`string`	Server event to trigger
`args`	`any`	Data passed to callback/event
`metadata`	`string \| table \| table[]`	Metadata displayed on the item
`disabled`	`boolean`	Grey out the item
`readOnly`	`boolean`	Non-interactive item
`expandable`	`boolean`	Expandable details section
`closeOnClick`	`boolean`	Close menu on click (default `true`)

showContext

Open a previously registered context menu by its ID.


exports['trinity-ui']:showContext(id)

hideContext

Close the currently open context menu.


exports['trinity-ui']:hideContext()

getOpenContextMenu

Returns the ID of the currently open context menu, or nil.


local id = exports['trinity-ui']:getOpenContextMenu()

Example


-- Register menus
exports['trinity-ui']:registerContext({
    {
        id = 'main_menu',
        title = 'Main Menu',
        options = {
            {
                title = 'Vehicle Options',
                icon = 'fa6-solid:car',
                description = 'Manage your vehicle',
                menu = 'vehicle_menu',
                arrow = true
            },
            {
                title = 'Player Info',
                icon = 'fa6-solid:user',
                metadata = {
                    { label = 'Job', value = 'Police Officer' },
                    { label = 'Rank', value = 'Sergeant' }
                }
            },
            {
                title = 'Heal Player',
                icon = 'fa6-solid:heart',
                iconColor = '#ff0000',
                progress = 75,
                onSelect = function()
                    print('Healing!')
                end
            }
        }
    },
    {
        id = 'vehicle_menu',
        title = 'Vehicle Options',
        menu = 'main_menu', -- enables back button
        options = {
            {
                title = 'Lock Vehicle',
                icon = 'fa6-solid:lock',
                onSelect = function()
                    print('Vehicle locked')
                end
            },
            {
                title = 'Engine Toggle',
                icon = 'fa6-solid:power-off',
                event = 'vehicle:toggleEngine'
            }
        }
    }
})
 
-- Open the menu
exports['trinity-ui']:showContext('main_menu')