Skip to main content

Exports

A series of exports documented and available for our wasabi_uikit resource.

Client Exports​

Action Panel​

ActionPanel
**exports.wasabi_uikit:ActionPanel(title, text, time, onlyAccept, noText, yesText)
**

Opens the action panel UI component. This is used as a confirmation style dialog.

title (string) : The title to display on the action panel.

text (string) : The description area of the action panel.

time (optional, number) : Time before the action panel expires in milliseconds. If not defined will use default of 5 seconds.

onlyAccept (boolean) : Only allow an accept button.

noText (optional, string) : The text to show in place of the no option (Will show default "No" if not defined.

yesText (optional, string) : The text to show in place of the yes option (Will show default "Yes" if not defend.

Context Menu​

RegisterContextMenu
**exports.wasabi_uikit:RegisterContextMenu(menuOptions)
**

Registers a context menu to later be opened. This allows you to call to a specific menu ID to open static menus.

menuOptions (table) :

  • id (string) : Identifier of the menu to call later with OpenContextMenu export.
  • title (string) : The title of the menu.
  • titleIcon (optional, string) : An optional icon to give next to the menu title (Font Awesome).
  • enableWalk (bool, optional) : An optional true can be passed with this field to allow walking within the menu (using arrow keys to navigate).
  • color (optional, string) : A hex, rgb, etc to optionally define for the scrollbar color (if enough options to show scroll).
  • options (table) :
    • title (string) : The title of the menu option.
    • description (optional, string) : The description of the menu option.
    • icon (optional, string) : The icon for the menu option (Font Awesome).
    • img (optional, string) : Direct link to image to show when hovering specific option.
    • menu (optional, string) : A menu ID to open when electing option.
    • event (optional, string) : An event to trigger when this option is selected. Will trigger client-side event if eventSide is not defined.
    • eventSide (optional, string) : Can be "client" or "server". If not defined, will default as client-side event.
    • onSelect (optional, function) : A function to trigger when option is selected. Has args as function parameter(if defined).
    • arrow (optional, boolean) : Show an arrow on the specific menu option.
    • args (optional, table) : A table of potential data to be passed through to events and/or onSelect functions.
UnregisterContextMenu
**exports.wasabi_uikit:UnregisterContextMenu(menuId)
**

Unregisters a context menu if use is obsolete.

menuId (string) : The menu ID of the context menu you wish to unregister.

OpenContextMenu
**exports.wasabi_uikit:OpenContextMenu(menuId)
**

Opens the menu belonging to the defined menuId.

menuId (string) : The menu ID of the context menu you wish to open.

Notifications​

Notification

Method 1:

exports.wasabi_uikit:Notification(title, text, type, time, id, icon, color)

Method 2:

exports.wasabi_uikit:Notification({
    title = title,
    text = text,
    type = type,
    time = time,
    id = id,
    icon = icon,
    color = color
})

Shows notification on local players screen with defined parameters.

Note: the data table shown in "Method 2" is simply a table with fields named after the Method 1 parameter name

title (string) : The notification's title.

text (string, optional) : The description area of the notification.

type (string, optional) : The style type of the notification as defined in Config.Notify (if not defined, will default as 'info' type).

time (number, optional) : The time in milliseconds that the notification should be active (if not defined, will default as 5 seconds).

id (string, optional) : An identifier for the notification so that if present already, it will simply update the parameters of the pre-existing notification rather than spam multiple.

icon (string, optional) : Set a icon for the specific notification. If not defined will use the icon defined in Config.Notify for the specific type.

color (string, optional) : Defined a color in HEX, RGB, etc to define a custom color for the specific notification. If not defined will use the color defined in the respective Config.Notify type defined.

Progress UI​

ProgressBar
exports.wasabi_uikit:ProgressBar(data, type)

Shows progress bar while returning true or false if it completes.

data (table) :

  • label (string) : The label to show when the progress UI is active.
  • duration (number) : The duration time that the progress bar will show for in milliseconds.
  • icon (string) : The icon you want to display along side the label of the UI (Font Awesome).
  • useWhileDead (optional, boolean) : Allow progress to continue while dead or else cancel.
  • allowCuffed (optional, boolean) : Allow progress to continue while handcuffed or else cancel.
  • allowRagdoll (optional, boolean) : Allow progress to continue while in ragdoll state or else cancel.
  • allowFalling (optional, boolean) : Allow falling down while continuing the progress UI or else cancel.
  • disable (optional, table) :
    • move (optional, boolean) : Disable player movement while progress UI is active.
    • car (optional, boolean) : Disable driving while progress UI is active.
    • combat (optional, boolean) : Disable combat while the progress UI is active.
    • mouse (optional, boolean) : Disable mouse usage while the progress UI is active.
  • anim (optional, table) :
    • dict (string) : The animation dictionary of the animation desired to play during the progress UI.
    • clip (string) : The animation clip of the animation desired to play during the progress UI.
  • prop (optional, table) :
    • model (string) : The prop model name or hash desired to show during progress UI.
    • bone (number) : The player ped bone ID you wish the attach the prop model.
    • pos (table, vector3) : The offset position of the prop's attachment to the player ped.
    • rot (table, vector3) : The rotation offset position of the prop's attachment to the player ped.
  • type (string) : 'circle' or 'bar'

Radial Menu​

OpenRadialMenu
exports.wasabi_uikit:OpenRadialMenu()

Opens radial menu.

EnableRadialMenu
exports.wasabi_uikit:EnableRadialMenu(enabled)

Toggles if radial menu is available to the local player.

enabled (boolean) : When passed with true value allows radial menu to be used. Passed with false disables the ability to utilize it. Good for when player is dead, etc.

AddOption
exports.wasabi_uikit:AddOption(option)

Adds option to radial menu system.

option (table) :

  • id (string) : Identifier to set for the respective option.
  • title (string) : The option title.
  • icon (string) : The icon desired to use for the respective option.
  • job (optional, string) : The job name required to see the respective option.
  • submenu (table, array):
    Array Objects
    • id (string) : The identifier of the sub menu.
    • title (string) : The title of the sub menu.
    • icon (string) : The icon of the sub menu option (Font Awesome).
    • event (string) : The event to be triggered when this option is selected.
    • eventSide (optional, string) : 'client' or 'server'. If not defined, will default to 'client'.
RemoveOption
exports.wasabi_uikit:RemoveOption(optionId)

Removes an already defined option from the radial menu system.

optionId (string) : The option ID desired to remove from the radial menu.

Skill Check​

SkillCircle
exports.wasabi_uikit:SkillCircle(difficulties, keys)

Returns true/false for successful completion.

difficulties (optional, array of strings/tables) :
Array :

  • difficulty (string) : A pre-defined difficulty. Options include; 'easy', 'medium', and 'hard'.
  • difficulty (table) : An optional object that can be placed in the difficulties array to define custom difficulty.
    • areasize (number) : The side of the bar that needs to have the key pressed within.
    • speed (number) : The speed that the circle moves (1-10).

keys (optional, array of single character strings) :
Array:

  • key (string/single-character) : Each array object will be a single character string (Ex: 'f', 'b', 'c').

Example:

RegisterCommand('testSkills', function(source, args, rawCommand)
    local success = exports.wasabi_uikit:SkillCircle({'easy', {areasize = 10, speed = 2}, 'medium', 'hard'}, {'w', 'a', 's', 'd'})
    if success then
        print("Success")
    else
        print("Failed")
    end
end, false)

TextUI​

OpenTextUI
exports.wasabi_uikit:OpenTextUI(text, key, position, style)

Displays a textUI on the screen.

text (string) : description of the textUI

key (string, optional) : control key to press

position (string, optional) : position where to display the textUI. Options include; 'bottom', 'top', 'left', 'right'. If nil, it will use the position defined in Config.DrawTextUI

style (string, optional) : style of the textUI. Options include; 'normal', 'keyTop', 'keyBottom', 'keySeparated'

CloseTextUI
exports.wasabi_uikit:CloseTextUI()

Closes the current textUI displayed.

ChangeTextUI
exports.wasabi_uikit:ChangeTextUI(text, key)

Changes the currently displayed textUI

text (string) : description of the textUI to change

key (string, optional) : control key to press

Input Dialog​

InputDialog
exports.wasabi_uikit:InputDialog(heading, rows, color)

Opens the input dialog with the specified parameters

heading (string) : The heading/title of the input dialog form

rows (table) : Either an array of strings (for simple input dialog) or an array of objects (for advanced input dialog)

color (string, optional) : The primary color you want to show for the submit buttons, scroll bars, focus, etc. If left undefined will default to the configuration.

Simple Example​

-- Test simple input dialog
local result = exports.wasabi_uikit:InputDialog('Simple Input Test', {
    'First Name',
    'Last Name',
    'Age'
})

if result then
    -- They clicked submit
    print('First Name: '..result[1]) -- First Name
    print('Last Name: '..result[2]) -- Last Name
    print('Age: '..result[3]) -- Age
else
    print('Input dialog was cancelled')
end

Advanced Example​

-- Test advanced input dialog with different field types
local result = exports.wasabi_uikit:InputDialog('Advanced Input Test', {
    {
        type = 'input',
        label = 'Player Name',
        placeholder = 'Enter player name'
    },
    {
        type = 'select',
        label = 'Player Rank',
        options = {
            { value = 'admin', label = 'Administrator' },
            { value = 'moderator', label = 'Moderator' },
            { value = 'user', label = 'User' },
            { value = 'vip', label = 'VIP' },
            { value = 'superadmin', label = 'Super Administrator' }
        }
    },
    {
        type = 'multi-select',
        label = 'Permissions',
        options = {
            { value = 'kick', label = 'Kick Players' },
            { value = 'ban', label = 'Ban Players' },
            { value = 'teleport', label = 'Teleport' },
            { value = 'freeze', label = 'Freeze Players' },
        }
    },
    {
        type = 'color',
        label = 'Player Color'
    },
    {
        type = 'checkbox',
        label = 'Is VIP Player',
        checked = false
    },
    {
        type = 'slider',
        label = 'Player Level',
        default = 5,
        min = 1,
        max = 100
    }
}, '#29b181')