Adding Interactive Elements

Notifying The User (Notifications)

Luna:Notification({ 
    Title = "Luna Notification Example",
    Icon = "notifications_active",
    ImageSource = "Material",
    Content = "This Is A Preview Of Luna's Dynamic Notification System Entailing Estimated/Calculated Wait Times, A Sleek Design, Icons, And A Glassmorphic Look"
})

tip

While You Can Do Element.Callback = function() ... end when creating the element, I Reccomend using :Set() to set the callback after creating Your UI
It is better to seperate Interface and functionallity however it is your opinion
All Elements Except Color Picker And Slider Have Description Options, however overusing them can make your UI look very weird.

Creating A Button

local Button = Tab:CreateButton({
    Name = "Button Example!",
    Description = nil, -- Creates A Description For Users to know what the button does (looks bad if you use it all the time),
    Callback = function()
        -- The function that takes place when the button is pressed
    end
})

Creating A Toggle

local Toggle = Tab:CreateToggle({
    Name = "Toggle Example",
    Description = nil,
    CurrentValue = false,
    Callback = function(Value)
        -- The function that takes place when the toggle is switched
        -- The variable (Value) is a boolean on whether the toggle is true or false
    end
}, "Toggle") -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps

Creating A Color Picker

local ColorPicker = Tab:CreateColorPicker({
    Name = "Color Picker Example",
    Color = Color3.fromRGB(86, 171, 128),
    Flag = "ColorPicker1", -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps
    Callback = function(Value)
        -- The function that takes place every time the color picker is moved/changed
        -- The variable (Value) is a Color3fromRGB value based on which color is selected
    end
}, "ColorPicker") -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps

Creating A Slider

local Slider = Tab:CreateSlider({
    Name = "Slider Example",
    Range = {0, 200}, -- The Minimum And Maximum Values Respectively
    Increment = 5, -- Basically The Changing Value/Rounding Off
    CurrentValue = 100, -- The Starting Value
    Callback = function(Value)
        -- The function that takes place when the slider changes
        -- The variable (Value) is a number which correlates to the value the slider is currently at
    end
}, "Slider") -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps

Creating A Dynamic Input (Textbox)

local Input = Tab:CreateInput({
    Name = "Dynamic Input Example",
    Description = nil,
    PlaceholderText = "Input Placeholder",
    CurrentValue = "", -- the current text
    Numeric = false, -- When true, the user may only type numbers in the box (Example walkspeed)
    MaxCharacters = nil, -- if a number, the textbox length cannot exceed the number
    Enter = false, -- When true, the callback will only be executed when the user presses enter.
    Callback = function(Text)
        -- The function that takes place when the input is changed
        -- The variable (Text) is a string for the value in the text box
    end
}, "Input") -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps

Creating A Dropdown Menu

Currently, The Only Special Type is Player.
If SpecialType equals Player, then the dropdown options will be the list of players

local Dropdown = Tab:CreateDropdown({
    Name = "Dropdown Example",
    Description = nil,
    Options = {"Option 1","Option 2"},
    CurrentOption = {"Option 1"},
    MultipleOptions = false,
    SpecialType = nil,
    Callback = function(Options)
        -- The function that takes place when the selected option is changed
        -- If MultipleOptions is true then The variable (Options) is a table of strings for the current selected options. Else, it is a string of the currentoption
    end
}, "Dropdown") -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps