UI-Library

The UI-Library used by add-ons & plugin to create functional UI

How to use

The ui library can be accessed only in studio plugin context through shared.fx.ui

PropertiesUI.luau

local PropertiesUI = shared.fx.ui.new({
    rangeToNumber = true, -- turns NumberRange to number when Min and Max are equal
    properties = {
        number = 1,
        boolean = false,
        text = "string!!",
        enum = Enum.EasingStyle.Sine, -- dropdown of all EasingStyles, but Sine is default
        color = Color3.fromRGB(255, 255, 255),
        options = {"option1", "option2", "option3"}, -- dropdown
        numberRange = NumberRange.new(1, 10),
        vector2 = Vector2.new(),
        vector3 = Vector3.new()
    },
    categories = {
        {
            "number",
            "vector2",
            "vector3",
            "numberRange",
            name = "Category1" -- category name
        },
        {
            "enum",
            "color",
            "text",
            "options",
            name = "other"
        },
        {
            value1,
            value2,
            value3,
            array = true,
            name = "array"
        }
    },
    tooltips = {
        number = "This is a number!",
        color = "This is a color!!!!"
    },
    placeholders = {
        text = "text placeholder if empty"
    }
})

Properties:set("property", value, type?, ...) -- this (...) is vv
PropertiesUI.changed.OnChange = function(property, value, old, ...) -- connect
PropertiesUI.changed.OnChange = nil -- disconnectco