JmodsLib - Guía

📥 Instalación y Configuración

Paso 1: Cargar la Librería

Para comenzar a usar JmodsLib, carga la librería desde nuestro repositorio:

--- Esto carga la interfaz/JmodsLib puede ser remplazado por el nombre que deseen
local JmodsLib = loadstring(game:HttpGet('https://raw.githubusercontent.com/pruebasjoao/test/refs/heads/main/JmodsLibV1.0'))()

💡 Consejo

Puedes cambiar "JmodsLib" por cualquier nombre que prefieras, pero recuerda usar el mismo nombre en todo tu código.

Paso 2: Crear una Ventana

Crea la ventana principal de tu interfaz con todas las opciones personalizables:

--- En JmodsLib ponemos exactamente el mismo nombre que hayamos puesto si es que lo cambiamos anteriormente
local Window = JmodsLib:CreateWindow({
    Name = "Mi primera Interfaz",
    Icon = 90692784970350, --- Cambiar por el ícono que prefieras
    LoadingTitle = "Cargando... espera...", --- Cambiar si quieres algo personalizado
    LoadingSubtitle = "ya casi está", --- Cambiar si quieres algo personalizado
    Theme = "Rojo", --- Este tema es el tema por defecto que la gente verá al ejecutar tu script
                    OpenButtomImage = 127271155083726, --- Esto es e boton para abrir en movil, pero es opcional
    Intro = true, --- Esto activa la intro pero es opcional
    IntroIcon = 90692784970350, --- Esto es el ícono de la intro
    AnimationIntro = 5, --- Acá puedes poner del 0 al 6, el 0 siendo random
    DragImage = 127271155083726 --- esta es el ícono de abajo a la derecha
})

⚠️ Opciones de la Intro

Si no activas Intro = true, no es necesario lo siguiente y lo puedes eliminar:

LoadingTitle
LoadingSubtitle
IntroIcon
AnimationIntro

Animaciones de Intro Disponibles

Puedes elegir entre 6 animaciones diferentes para la intro:

0 - Animación aleatoria (una diferente cada vez)
1 - Entrada con escala y rotación
2 - Entrada deslizante con rebote
3 - Entrada en espiral
4 - Entrada tipo "drop"
5 - Fade-In con Zoom
6 - Rebote desde las esquinas

🎨 Temas Disponibles

JmodsLib incluye 24 temas diferentes que se guardan automáticamente. Puedes usar nombres en español o inglés:

Español	Inglés	Descripción
negro	black	Tema por defecto
azul	Azul	Azul clásico
oscuro	dark	Gris oscuro moderno
rojo	red	Rojo intenso
verde	green	Verde natural
morado	purple	Morado elegante
naranja	orange	Naranja vibrante
rosa	pink	Rosa moderno
gris	gray	Gris neutro
cian	cyan	Cian fresco
amarillo	yellow	Amarillo dorado
turquesa	turquoise	Turquesa tropical
marron	brown	Marrón tierra
dorado	gold	Oro brillante
plateado	silver	Plata metálica
🌈 Temas Neón
neon	neon	Neón estándar
oscuro neon	dark_neon	Neón púrpura
neon azul	neon_blue	Neón azul eléctrico
neon rojo	neon_red	Neón rojo intenso
neon verde	neon_green	Neón verde brillante
neon amarillo	neon_yellow	Neón amarillo
neon rosa	neon_pink	Neón rosa
neon naranja	neon_orange	Neón naranja
neon violeta	neon_violet	Neón violeta
neon blanco	neon_white	Neón blanco puro

✅ Auto-Guardado de Temas

Los temas se guardan automáticamente y se cargan la próxima vez que ejecutes el script. Los usuarios pueden cambiar el tema usando el selector integrado en la interfaz.

🔔 Sistema de Notificaciones Avanzado

Crea notificaciones atractivas con soporte para links clickeables y detección automática de URLs:

--- Creación de notificaciones
JmodsLib:Notify({
    Title = "Bienvenido", --- Título
    Content = "joao_mods te espera en https://youtube.com", --- Sí acá se puede poner links, esto es el contenido
    Duration = 15, --- Esta es la duración
    Image = 13458017478 --- Esta imagen se mostrará a la esquina derecha de la notificación
})

🔗 Características de las Notificaciones

Links automáticos: Detecta automáticamente URLs y las hace clickeables
Dominio inteligente: Muestra nombres cortos (YouTube, Discord, GitHub, etc.)
Copia automática: Al hacer clic se copia el link al portapapeles
Sin solapamiento: Solo una notificación visible a la vez
Responsive: Se adapta a dispositivos móviles

Ejemplos de Notificaciones

Notificación Simple

JmodsLib:Notify({
    Title = "Script Cargado",
    Content = "¡Todo listo para usar!",
    Duration = 3
})

Notificación con Links

JmodsLib:Notify({
    Title = "Únete al Discord",
    Content = "Discord: https://discord.gg/ZTVC94ZmVZ",
    Duration = 10,
    Image = 13458017478
})

📑 Creación de Tabs

Los tabs te permiten organizar tu interfaz en diferentes páginas. Cada tab puede contener múltiples elementos:

--- Creación de tabs:
MainTab = Window:CreateTab("Principal")

--- Crear un segundo tab
SettingsTab = Window:CreateTab("Configuración")

--- Crear un tercer tab
ScriptsTab = Window:CreateTab("Scripts")

💡 Importante sobre los Tabs

El nombre que le pongas a la variable (ej. MainTab, SettingsTab) será lo que uses para referenciar ese tab cuando agregues elementos. Puedes crear tantos tabs como necesites.

📋 Creación de Secciones

Las secciones actúan como separadores visuales y organizadores dentro de los tabs:

--- Sección con título
Section1 = MainTab:CreateSection("Funciones Principales")

--- Sección vacía como separador
Separator = MainTab:CreateSection("")

--- Otra sección
Section2 = MainTab:CreateSection("Configuración Avanzada")

✅ Tips para Secciones

Las secciones con texto actúan como títulos o separadores con nombre
Las secciones vacías ("") crean un espacio visual entre elementos
Usa secciones para organizar mejor tu interfaz
Siempre haz referencia al tab correcto donde quieres que aparezca

🔧 Elementos de Interfaz

🔘 Botones

Los botones ejecutan funciones cuando son presionados:

--- Botón básico
Button1 = MainTab:CreateButton({
    Name = "Saludar",
    Callback = function()
        print("¡Hola mundo!")
        JmodsLib:Notify({
            Title = "Saludos",
            Content = "¡Hola desde el botón!",
            Duration = 3
        })
    end
})

--- Botón que ejecuta script externo
Button2 = MainTab:CreateButton({
    Name = "Cargar Script",
    Callback = function()
        loadstring(game:HttpGet("https://example.com/script.lua"))()
    end
})

🎛️ Toggle (Interruptor)

Los toggles permiten activar/desactivar funciones:

MainTab:CreateToggle({
    Name = "Auto Farm",
    CurrentValue = false, --- Valor inicial
    Callback = function(state)
        if state then
            print("Auto Farm activado")
            -- Aquí iría la lógica del auto farm
        else
            print("Auto Farm desactivado")
            -- Aquí iría la lógica para detener el auto farm
        end
    end
})

📊 Slider (Barra Deslizante)

Los sliders controlan valores numéricos dentro de un rango:

MainTab:CreateSlider({
    Name = "Velocidad de Caminata",
    Range = {16, 100}, --- Mínimo y máximo
    Increment = 1, --- De cuánto en cuánto cambia
    Suffix = "studs/s", --- Texto después del valor
    CurrentValue = 16, --- Valor inicial
    Callback = function(value)
        print("Velocidad cambiada a:", value)
        if game.Players.LocalPlayer.Character and game.Players.LocalPlayer.Character:FindFirstChild("Humanoid") then
            game.Players.LocalPlayer.Character.Humanoid.WalkSpeed = value
        end
    end
})

⌨️ Input (Campo de Texto)

Los inputs permiten al usuario escribir texto:

MainTab:CreateInput({
    Name = "Nombre del Jugador",
    PlaceholderText = "Escribe un nombre...",
    Callback = function(text)
        print("Texto ingresado:", text)
        -- Ejemplo: buscar jugador por nombre
        local player = game.Players:FindFirstChild(text)
        if player then
            JmodsLib:Notify({
                Title = "Jugador encontrado",
                Content = "Encontrado: " .. player.Name,
                Duration = 3
            })
        end
    end
})

Los dropdowns permiten seleccionar entre múltiples opciones predefinidas:

MainTab:CreateDropdown({
    Name = "Seleccionar Arma",
    Options = {"Espada", "Arco", "Hacha", "Lanza"},
    Callback = function(option)
        print("Arma seleccionada:", option)
        -- Aquí podrías equipar el arma seleccionada
    end
})

🎨 ColorPicker (Selector de Color)

Los colorpickers permiten seleccionar colores con una interfaz visual:

MainTab:CreateColorPicker({
    Name = "Color del Aura",
    Color = Color3.fromRGB(255, 0, 0), --- Color inicial
    Callback = function(color)
        print(string.format("Color seleccionado: RGB(%d, %d, %d)", 
            color.R*255, color.G*255, color.B*255))
        -- Aquí podrías aplicar el color a algún efecto visual
    end
})

⌨️ Keybind (Asignar Tecla)

Los keybinds permiten asignar teclas para activar funciones rápidamente:

MainTab:CreateKeybind({
    Name = "Toggle Fly",
    CurrentKeybind = "F", --- Tecla inicial
    Callback = function(key)
        print("Tecla presionada:", key)
        -- Aquí iría la lógica para activar/desactivar fly
        JmodsLib:Notify({
            Title = "Fly Toggle",
            Content = "Fly activado/desactivado",
            Duration = 2
        })
    end
})

📄 Paragraph (Información)

Los paragraphs muestran información, créditos o instrucciones:

--- Información básica
MainTab:CreateParagraph({
    Title = "Información",
    Content = "Este script fue creado por joao_mods. Versión 1.0"
})

--- Instrucciones de uso
MainTab:CreateParagraph({
    Title = "Instrucciones",
    Content = "1. Activa Auto Farm\n2. Ajusta la velocidad\n3. Presiona F para volar"
})

📄 Paragraph — Guía Detallada

El Paragraph es un componente de JmodsLib usado para mostrar texto dinámico como estado, estadísticas, listas o información en tiempo real. A diferencia de un texto estático, puede actualizarse desde el código en cualquier momento.

🧠 Crear un Paragraph

Guarda la referencia en una variable para poder actualizarlo después:

local info = Tab:CreateParagraph({
    Title = "Estado",
    Content = "Esperando..."
})

⚙️ Métodos Disponibles

🔹 UpdateTitle

Cambia el título del Paragraph en tiempo real.

info:UpdateTitle("Nuevo título")

🔹 UpdateContent

Cambia el contenido del Paragraph en tiempo real.

info:UpdateContent("Nuevo contenido")

🚀 Ejemplo Completo

Paragraph que muestra la hora actual, actualizándose cada segundo:

-- Cargar librería
local JmodsLib = loadstring(game:HttpGet("https://raw.githubusercontent.com/pruebasjoao/test/main/JmodsLibV1.0"))()

local Window = JmodsLib:CreateWindow({ Title = "Demo Paragraph" })
local Tab = Window:CreateTab("Main")

local info = Tab:CreateParagraph({
    Title = "Estado",
    Content = "Esperando..."
})

task.spawn(function()
    while true do
        info:UpdateTitle("Estado actualizado")
        info:UpdateContent("Hora: " .. os.date("%X"))
        task.wait(1)
    end
end)

📊 Ejemplo: Lista de Jugadores en Tiempo Real

local Players = game:GetService("Players")

local lista = Tab:CreateParagraph({
    Title = "Jugadores",
    Content = "..."
})

task.spawn(function()
    while true do
        local text = ""
        for _, plr in ipairs(Players:GetPlayers()) do
            text ..= plr.Name .. "\n"
        end
        lista:UpdateTitle("Jugadores (" .. #Players:GetPlayers() .. ")")
        lista:UpdateContent(text)
        task.wait(1)
    end
end)

⚠️ Limitaciones del Paragraph

No permite cambiar color
No permite cambiar tipografía
No tiene interacción (no es botón ni toggle)
Solo muestra información

💡 Tips

Usa task.wait() para evitar lag
Puedes actualizarlo en loops o eventos

⚡ Funciones Avanzadas de JmodsLib

🎨 Control Programático de Temas

Puedes cambiar temas desde tu código y obtener información sobre el tema actual:

--- Cambiar tema programáticamente
Window:SetTheme("neon_blue")

--- Obtener el tema actual
local currentTheme = Window:GetCurrentTheme()
print("Tema actual:", currentTheme)

--- Obtener información completa del sistema de temas
local themeInfo = JmodsLib:GetThemeInfo()
print("Información de temas:", themeInfo)

🔧 Configuración de Teclas de Minimizado

Puedes cambiar la tecla que minimiza/restaura la interfaz:

--- Cambiar la tecla de minimizado a M
Window:SetRestoreKey(Enum.KeyCode.M)

--- Cambiar a Insert
Window:SetRestoreKey(Enum.KeyCode.Insert)

🔄 Reset de Temas

Resetea el sistema de temas al valor por defecto:

--- Resetear tema al por defecto (negro)
JmodsLib:ResetTheme()

📱 Características Móviles

Interfaz redimensionada automáticamente
Controles optimizados para dedos
Botón flotante para restaurar la UI
Scroll vertical únicamente

🔄 Métodos Dinámicos del Dropdown

El Dropdown de JmodsLib incluye métodos avanzados para actualizar las opciones de forma dinámica durante la ejecución del script:

📋 Crear un Dropdown Base

Primero, crea el dropdown y guarda su referencia en una variable:

--- Crear dropdown y guardar referencia
local MiDropdown = MainTab:CreateDropdown({
    Name = "Seleccionar Jugador",
    Options = {"Jugador1", "Jugador2", "Jugador3"},
    Callback = function(selected)
        print("Jugador seleccionado:", selected)
    end
})

💡 Importante

Debes guardar el dropdown en una variable (ej. MiDropdown) para poder usar sus métodos posteriormente.

⚡ UpdateOptions() - Actualización Inmediata

Este método actualiza las opciones del dropdown inmediatamente, incluso si el dropdown está abierto:

--- Actualización inmediata de opciones
MiDropdown:UpdateOptions({"NuevaOpcion1", "NuevaOpcion2", "NuevaOpcion3"})

--- Ejemplo práctico: Actualizar lista de jugadores en tiempo real
local function actualizarJugadores()
    local jugadores = {}
    for _, player in pairs(game.Players:GetPlayers()) do
        table.insert(jugadores, player.Name)
    end
    MiDropdown:UpdateOptions(jugadores)
end

--- Actualizar cada 5 segundos
spawn(function()
    while true do
        wait(5)
        actualizarJugadores()
    end
end)

✅ Características de UpdateOptions()

Actualización instantánea: Las opciones cambian inmediatamente
Cierra el dropdown: Si está abierto, se cierra automáticamente
Limpia opciones anteriores: Elimina todas las opciones previas
Resetea selección: Si la opción actual ya no existe, selecciona la primera nueva
Uso típico: Actualizaciones frecuentes o en tiempo real

🕐 UpdateOnClose() - Actualización Diferida

Este método programa una actualización que solo se aplicará cuando el usuario cierre el dropdown:

--- Actualización diferida (cuando se cierre el dropdown)
MiDropdown:UpdateOnClose({"Opcion1", "Opcion2", "Opcion3"})

--- Ejemplo práctico: Escaneo de NPCs sin interrumpir al usuario
local NPCDropdown = MainTab:CreateDropdown({
    Name = "Seleccionar NPC",
    Options = {"Escaneando..."},
    Callback = function(npc)
        print("NPC seleccionado:", npc)
    end
})

--- Función que escanea NPCs constantemente
spawn(function()
    while true do
        wait(2)
        
        --- Buscar todos los NPCs en el Workspace
        local npcs = {}
        for _, npc in pairs(workspace.NPCs:GetChildren()) do
            if npc:FindFirstChild("Humanoid") then
                table.insert(npcs, npc.Name)
            end
        end
        
        --- Programar actualización (no interrumpe si está abierto)
        NPCDropdown:UpdateOnClose(npcs)
    end
end)

✅ Características de UpdateOnClose()

No interrumpe: Si el usuario tiene el dropdown abierto, no lo cierra
Se aplica al cerrar: Los cambios se ven cuando el usuario cierra manualmente
Múltiples llamadas: Solo se guarda la última actualización programada
Mejor UX: No molesta al usuario mientras está seleccionando
Uso típico: Actualizaciones en segundo plano o escaneos continuos

🆚 Comparación: UpdateOptions() vs UpdateOnClose()

Característica	UpdateOptions()	UpdateOnClose()
Momento de aplicación	Inmediato	Al cerrar dropdown
Cierra el dropdown?	Sí, siempre	No, respeta la interacción
Interrumpe al usuario?	Sí, si está seleccionando	No, espera a que termine
Mejor para...	Botones, eventos únicos	Loops, escaneos continuos
Ejemplo de uso	Cambiar mapa actual	Lista de jugadores en vivo

📝 Set() - Cambiar Selección

Cambia la opción seleccionada actualmente (no modifica la lista de opciones):

--- Cambiar la selección actual
MiDropdown:Set("Jugador2")

--- Ejemplo: Seleccionar automáticamente al jugador más cercano
local function seleccionarMasCercano()
    local player = game.Players.LocalPlayer
    local char = player.Character
    if not char or not char:FindFirstChild("HumanoidRootPart") then return end
    
    local pos = char.HumanoidRootPart.Position
    local closest = nil
    local minDist = math.huge
    
    for _, p in pairs(game.Players:GetPlayers()) do
        if p ~= player and p.Character and p.Character:FindFirstChild("HumanoidRootPart") then
            local dist = (p.Character.HumanoidRootPart.Position - pos).Magnitude
            if dist < minDist then
                minDist = dist
                closest = p.Name
            end
        end
    end
    
    if closest then
        MiDropdown:Set(closest)
        JmodsLib:Notify({
            Title = "Jugador Más Cercano",
            Content = "Seleccionado: " .. closest,
            Duration = 3
        })
    end
end

📥 Get() - Obtener Selección Actual

Obtiene el valor actualmente seleccionado en el dropdown:

--- Obtener la opción seleccionada
local seleccion = MiDropdown:Get()
print("Opción actual:", seleccion)

--- Ejemplo: Botón que usa la selección actual
MainTab:CreateButton({
    Name = "Teleport al Jugador",
    Callback = function()
        local targetName = MiDropdown:Get()
        local target = game.Players:FindFirstChild(targetName)
        
        if target and target.Character then
            local myChar = game.Players.LocalPlayer.Character
            if myChar and myChar:FindFirstChild("HumanoidRootPart") then
                myChar.HumanoidRootPart.CFrame = target.Character.HumanoidRootPart.CFrame
            end
        end
    end
})

🎯 Ejemplos Prácticos Completos

Ejemplo 1: Lista de Jugadores en Tiempo Real

--- Dropdown con actualización continua
local JugadorDropdown = MainTab:CreateDropdown({
    Name = "Jugadores (Auto-actualiza)",
    Options = {"Cargando..."},
    Callback = function(jugador)
        print("Seleccionado:", jugador)
    end
})

--- Loop de actualización cada 3 segundos
spawn(function()
    while true do
        wait(3)
        
        local jugadores = {}
        for _, p in pairs(game.Players:GetPlayers()) do
            table.insert(jugadores, p.Name)
        end
        
        --- Usar UpdateOnClose para no interrumpir
        JugadorDropdown:UpdateOnClose(jugadores)
    end
end)

Ejemplo 2: Cambio Manual con Botón

--- Dropdown de armas
local ArmaDropdown = MainTab:CreateDropdown({
    Name = "Seleccionar Arma",
    Options = {"Espada", "Arco"},
    Callback = function(arma)
        print("Arma:", arma)
    end
})

--- Botón para actualizar armas disponibles
MainTab:CreateButton({
    Name = "Escanear Armas",
    Callback = function()
        local armas = {}
        
        --- Buscar armas en el inventario
        local backpack = game.Players.LocalPlayer.Backpack
        for _, tool in pairs(backpack:GetChildren()) do
            table.insert(armas, tool.Name)
        end
        
        --- Actualizar inmediatamente
        ArmaDropdown:UpdateOptions(armas)
        
        JmodsLib:Notify({
            Title = "Escaneo Completo",
            Content = "Encontradas " .. #armas .. " armas",
            Duration = 3
        })
    end
})

Ejemplo 3: Filtrado Dinámico

--- Dropdown principal
local TipoDropdown = MainTab:CreateDropdown({
    Name = "Tipo de Mob",
    Options = {"Todos", "Jefes", "Normales"},
    Callback = function(tipo)
        --- Actualizar el segundo dropdown según el tipo
        local mobs = {}
        
        if tipo == "Jefes" then
            mobs = {"Boss1", "Boss2", "Boss3"}
        elseif tipo == "Normales" then
            mobs = {"Mob1", "Mob2", "Mob3"}
        else
            mobs = {"Todos los mobs..."}
        end
        
        MobDropdown:UpdateOptions(mobs)
    end
})

--- Dropdown secundario (se actualiza según el primero)
local MobDropdown = MainTab:CreateDropdown({
    Name = "Seleccionar Mob",
    Options = {"Selecciona un tipo primero"},
    Callback = function(mob)
        print("Mob objetivo:", mob)
    end
})

⚠️ Consejos Importantes

Siempre valida: Verifica que las opciones no estén vacías antes de actualizar
Usa UpdateOnClose para loops: Evita interrumpir al usuario con actualizaciones constantes
Usa UpdateOptions para eventos: Cuando el usuario hace clic en un botón o cambia algo
Guarda la referencia: Sin guardar el dropdown en una variable, no podrás usar estos métodos
Maneja errores: Usa pcall() si los datos pueden fallar

🔄 Resumen de Métodos

--- RESUMEN DE TODOS LOS MÉTODOS DEL DROPDOWN

--- 1. Crear dropdown (guardar referencia)
local dropdown = Tab:CreateDropdown({...})

--- 2. Actualizar opciones inmediatamente
dropdown:UpdateOptions({"op1", "op2", "op3"})

--- 3. Programar actualización al cerrar
dropdown:UpdateOnClose({"op1", "op2", "op3"})

--- 4. Cambiar la selección actual
dropdown:Set("op2")

--- 5. Obtener la selección actual
local actual = dropdown:Get()
print(actual) --- Imprime: "op2"

🖼️ Sistema de Imágenes

JmodsLib incluye dos componentes especiales para mostrar imágenes dentro de tus tabs: CreateImage para mostrar una imagen sola con alineación libre, y CreateImageRow para combinar una imagen con texto informativo al lado derecho. Ambos son totalmente dinámicos y reaccionan al sistema de temas.

💡 ¿Cuándo usar cada uno?

CreateImage: Cuando quieres mostrar un logo, ícono o avatar de jugador de forma destacada y centrada
CreateImageRow: Cuando quieres mostrar una imagen con información al lado, como una tarjeta de jugador (avatar + nombre + stats)

🔳 CreateImage — Imagen Individual

Muestra una imagen cuadrada dentro del tab. Tiene fondo con el color del tema, alineación configurable y se puede actualizar en cualquier momento desde el código.

Opciones disponibles:

Opción	Tipo	Default	Descripción
`Image`	número / string	0	AssetId de Roblox (`6031071057`) o string (`"rbxassetid://..."`)
`PlayerImage`	true / false	false	Si es `true`, carga el thumbnail del jugador usando `Image` como UserId
`Size`	número	64	Tamaño en píxeles del cuadrado de la imagen
`Align`	string	"Center"	Alineación horizontal: `"Left"`, `"Center"` o `"Right"`
`CornerRadius`	número	8	Redondeo de esquinas. Usa la mitad del Size para un círculo perfecto
`Background`	true / false	true	Muestra un fondo con el color del tema detrás de la imagen

Métodos del objeto devuelto:

Método	Parámetro	Qué hace
`:SetImage(id)`	AssetId o string	Cambia la imagen a cualquier AssetId de Roblox en tiempo real
`:SetPlayerThumbnail(userId)`	UserId numérico	Carga el avatar (headshot) del jugador con ese UserId de forma asíncrona
`:GetFrame()`	—	Devuelve el Frame contenedor por si necesitas referenciarlo

--- Ejemplo 1: Imagen con AssetId fijo, centrada
local Logo = MainTab:CreateImage({
    Image      = 6031071057,  --- AssetId de Roblox
    Size       = 80,           --- 80x80 píxeles
    Align      = "Center",    --- centrada horizontalmente
    Background = true,         --- fondo con el color del tema
    CornerRadius = 10          --- esquinas redondeadas
})

--- Ejemplo 2: Avatar del jugador actual, circular
local MiAvatar = MainTab:CreateImage({
    Image       = game.Players.LocalPlayer.UserId, --- UserId del jugador
    PlayerImage = true,    --- activa carga de thumbnail automáticamente
    Size        = 80,
    Align       = "Center",
    CornerRadius = 40       --- 40 = mitad de 80 → círculo perfecto
})

--- Cambiar imagen dinámicamente con un botón
MainTab:CreateButton({
    Name = "Cambiar logo",
    Callback = function()
        Logo:SetImage(48965502)  --- cambia a otro AssetId
    end
})

--- Cambiar a avatar de otro jugador dinámicamente
MainTab:CreateButton({
    Name = "Ver avatar de Roblox oficial",
    Callback = function()
        MiAvatar:SetPlayerThumbnail(156)  --- UserId 156 = cuenta Roblox oficial
    end
})

✅ Truco: Círculo perfecto

Para hacer que la imagen sea un círculo, pon CornerRadius igual a la mitad del Size. Por ejemplo: Size = 80 → CornerRadius = 40.

🪪 CreateImageRow — Imagen + Información

Crea una tarjeta horizontal con una imagen a la izquierda y un bloque de título + descripción a la derecha. Perfecto para mostrar información de jugadores, personajes, items o cualquier cosa que combina visual con datos.

Opciones disponibles:

Opción	Tipo	Default	Descripción
`Image`	número / string	0	AssetId de Roblox o UserId (si usas PlayerImage)
`PlayerImage`	true / false	false	Carga automáticamente el thumbnail del jugador
`ImgSize`	número	56	Tamaño en píxeles de la imagen cuadrada
`Height`	número	ImgSize+18	Altura total de la tarjeta en píxeles
`Spacing`	número	10	Espacio en px entre la imagen y el texto
`CornerRadius`	número	8	Redondeo de la imagen
`Title`	string	""	Título en negrita que aparece a la derecha de la imagen
`Content`	string	""	Descripción o información debajo del título

Métodos del objeto devuelto:

Método	Parámetro	Qué hace
`:SetImage(id)`	AssetId	Cambia la imagen del lado izquierdo
`:SetPlayerThumbnail(userId)`	UserId	Carga el avatar del jugador con ese UserId
`:UpdateTitle(texto)`	string	Cambia el título en tiempo real
`:UpdateContent(texto)`	string	Cambia la descripción en tiempo real
`:GetFrame()`	—	Devuelve el Frame contenedor
`:GetContentArea()`	—	Devuelve la zona derecha para insertar elementos extra

--- Tarjeta de jugador básica
local TarjetaJugador = MainTab:CreateImageRow({
    Image       = game.Players.LocalPlayer.UserId,
    PlayerImage = true,    --- carga el headshot automáticamente al crear
    ImgSize     = 56,        --- imagen de 56x56 px
    Height      = 74,        --- altura total de la tarjeta
    Title       = game.Players.LocalPlayer.Name,
    Content     = "Nivel 42 · Rank: Pro · Kills: 120"
})

--- Actualizar la tarjeta con otro jugador
MainTab:CreateButton({
    Name = "Ver cuenta Roblox",
    Callback = function()
        TarjetaJugador:SetPlayerThumbnail(156)       --- cambia avatar
        TarjetaJugador:UpdateTitle("Roblox")             --- cambia título
        TarjetaJugador:UpdateContent("El creador · ID: 156") --- cambia descripción
    end
})

👥 Selector de Jugadores con Imagen

Una de las combinaciones más potentes: un Dropdown de jugadores conectado a un CreateImage o CreateImageRow. Al seleccionar un jugador en el dropdown, la imagen y la información se actualizan automáticamente.

Funciona igual con CreateImage (solo avatar) y con CreateImageRow (avatar + info). El truco es guardar el objeto en una variable y llamar a sus métodos dentro del Callback del Dropdown.

--- SELECTOR DE JUGADOR CON IMAGEN — funciona con CreateImage

--- 1. Crear la imagen (empieza con tu propio avatar)
local AvatarDisplay = MainTab:CreateImage({
    Image       = game.Players.LocalPlayer.UserId,
    PlayerImage = true,
    Size        = 80,
    Align       = "Center",
    CornerRadius = 40  --- círculo
})

--- 2. Crear el dropdown con los jugadores actuales
local playerNames = {}
for _, p in ipairs(game.Players:GetPlayers()) do
    table.insert(playerNames, p.Name)
end

local SelectorJugador = MainTab:CreateDropdown({
    Name    = "Seleccionar jugador",
    Options = playerNames,
    Default = game.Players.LocalPlayer.Name,
    Callback = function(nombre)
        local jugador = game.Players:FindFirstChild(nombre)
        if jugador then
            --- Actualizar la imagen con el avatar del jugador elegido
            AvatarDisplay:SetPlayerThumbnail(jugador.UserId)
        end
    end
})

--- 3. Actualizar el dropdown cuando entren/salgan jugadores
game.Players.PlayerAdded:Connect(function()
    local lista = {}
    for _, p in ipairs(game.Players:GetPlayers()) do
        table.insert(lista, p.Name)
    end
    SelectorJugador:UpdateOptions(lista)
end)

game.Players.PlayerRemoving:Connect(function(p)
    local lista = {}
    for _, pl in ipairs(game.Players:GetPlayers()) do
        if pl ~= p then table.insert(lista, pl.Name) end
    end
    SelectorJugador:UpdateOptions(lista)
end)

--- LO MISMO PERO CON CreateImageRow (avatar + nombre + stats)

local TarjetaRow = MainTab:CreateImageRow({
    Image       = game.Players.LocalPlayer.UserId,
    PlayerImage = true,
    ImgSize     = 56,
    Height      = 74,
    Title       = "Selecciona un jugador",
    Content     = "Usa el dropdown de abajo"
})

local SelectorRow = MainTab:CreateDropdown({
    Name    = "Jugador a inspeccionar",
    Options = playerNames,
    Callback = function(nombre)
        local jugador = game.Players:FindFirstChild(nombre)
        if jugador then
            TarjetaRow:SetPlayerThumbnail(jugador.UserId)
            TarjetaRow:UpdateTitle(jugador.Name)
            TarjetaRow:UpdateContent("UserId: " .. jugador.UserId)
        end
    end
})

🔄 Actualización Dinámica de Imágenes

Tanto CreateImage como CreateImageRow pueden actualizarse en cualquier momento desde el código, sin necesidad de recrearlos. La imagen carga de forma asíncrona (no bloquea el juego) y el texto cambia instantáneamente.

--- Actualización desde un loop en tiempo real
local InfoRow = MainTab:CreateImageRow({
    Image       = game.Players.LocalPlayer.UserId,
    PlayerImage = true,
    ImgSize     = 56,
    Height      = 74,
    Title       = game.Players.LocalPlayer.Name,
    Content     = "Cargando estadísticas..."
})

--- Actualizar el contenido cada segundo con datos reales
task.spawn(function()
    while true do
        local char = game.Players.LocalPlayer.Character
        if char and char:FindFirstChild("Humanoid") then
            local hp = math.floor(char.Humanoid.Health)
            local maxHp = math.floor(char.Humanoid.MaxHealth)
            InfoRow:UpdateContent("❤️ HP: " .. hp .. "/" .. maxHp)
        end
        task.wait(1)
    end
end)

⚠️ Diferencia importante: AssetId vs UserId

AssetId → cualquier imagen subida a Roblox. Úsalo con :SetImage(id) o directamente en Image = 6031071057
UserId → el ID numérico del jugador. Úsalo con PlayerImage = true + Image = UserId, o con :SetPlayerThumbnail(userId)
No mezcles los dos: un UserId no es un AssetId válido y viceversa

📋 Resumen de todos los métodos

--- ── CreateImage ──────────────────────────────────────────────
local img = Tab:CreateImage({
    Image = 6031071057, Size = 80, Align = "Center",
    PlayerImage = false, Background = true, CornerRadius = 8
})
img:SetImage(48965502)               --- cambiar a otro AssetId
img:SetPlayerThumbnail(156)           --- cambiar a avatar del jugador con UserId 156

--- ── CreateImageRow ────────────────────────────────────────────
local row = Tab:CreateImageRow({
    Image = 0, PlayerImage = true, ImgSize = 56, Height = 74,
    Title = "Nombre", Content = "Descripción"
})
row:SetImage(6031071057)             --- cambiar imagen (AssetId)
row:SetPlayerThumbnail(156)          --- cambiar imagen (avatar de jugador)
row:UpdateTitle("Nuevo título")       --- cambiar título en tiempo real
row:UpdateContent("Nueva descripción") --- cambiar descripción en tiempo real

🎮 Botones Flotantes — CreateButtonFloat

Los botones flotantes son botones independientes que aparecen sobre el juego, fuera del panel principal de la interfaz. Puedes posicionarlos en cualquier lugar de la pantalla, hacerlos arrastrables, mostrarlos solo en móvil o solo en PC, darles un color fijo o que reaccionen al tema, y activarlos/desactivarlos desde el código.

Son perfectos para controles que necesitas acceder rápido sin abrir la interfaz, como botones de acción en un fly, auto-farm, o cualquier función que se usa constantemente.

💡 ¿Cómo funciona internamente?

El botón se crea directamente en el ScreenGui principal, por encima de todo. No ocupa espacio en el tab ni en la lista de elementos — vive libre en la pantalla. Su posición se define en coordenadas de escala (0 a 1) donde X=0 es el borde izquierdo y X=1 el borde derecho, igual en Y.

⚙️ Opciones de Creación

Opción	Tipo	Default	Descripción
`Name`	string	"Botón"	Texto del botón (solo si no tiene imagen)
`Image`	número	nil	AssetId de imagen. Si se pone, el botón muestra imagen en vez de texto
`Width`	número	100	Ancho en píxeles
`Height`	número	40	Alto en píxeles
`X`	0.0 – 1.0	0.5	Posición horizontal en pantalla. 0 = izquierda, 1 = derecha, 0.5 = centro
`Y`	0.0 – 1.0	0.8	Posición vertical en pantalla. 0 = arriba, 1 = abajo
`OffsetX`	número	0	Ajuste fino en píxeles sobre la posición X
`OffsetY`	número	0	Ajuste fino en píxeles sobre la posición Y
`Draggable`	true / false	false	Si es `true`, el usuario puede arrastrarlo con el ratón o dedo
`MobileOnly`	true / false	false	Si es `true`, solo aparece en dispositivos táctiles (móvil/tablet)
`PCOnly`	true / false	false	Si es `true`, solo aparece en PC (no en móvil)
`CustomColor`	{R,G,B} o false	nil	Color fijo RGB que NO cambia con el tema. Si es `false` o nil, sigue el tema
`CornerRadius`	número	8	Redondeo. Usa la mitad de Width/Height para un círculo
`Callback`	function	nil	Función que se ejecuta al hacer clic

🔧 Métodos del objeto devuelto

Método	Parámetro	Qué hace
`:Show()`	—	Hace visible el botón (respeta la plataforma: si es MobileOnly y estás en PC, no aparece)
`:Hide()`	—	Oculta el botón completamente
`:SetVisible(bool)`	true / false	Muestra u oculta según el valor booleano
`:Destroy()`	—	Elimina el botón permanentemente de la pantalla
`:SetText(string)`	string	Cambia el texto (solo en botones de texto, no de imagen)
`:SetImage(id)`	AssetId	Cambia la imagen (solo en botones de imagen)
`:SetColor(r, g, b)`	tres números	Cambia el color de fondo manualmente en tiempo real

📐 Entendiendo el Posicionamiento

La posición se define con X e Y en escala de 0 a 1, donde el punto de anclaje es el centro del botón. Aquí los valores más útiles:

Zona de pantalla	X	Y	Descripción
Centro arriba	0.5	0.1	Arriba centrado
Centro pantalla	0.5	0.5	Centro exacto
Centro abajo	0.5	0.9	Abajo centrado (lo más común)
Izquierda medio	0.05	0.5	Borde izquierdo, centrado verticalmente
Derecha medio	0.95	0.5	Borde derecho, centrado verticalmente
Esquina superior derecha	0.95	0.1	Arriba a la derecha
Esquina inferior izquierda	0.05	0.9	Abajo a la izquierda

🧪 Ejemplos Completos

Ejemplo 1 — Siempre visible al cargar el script

El botón más simple posible. Aparece en cuanto se ejecuta el script, sin necesidad de activarlo con nada.

local BtnAccion = MainTab:CreateButtonFloat({
    Name     = "⚡ Acción",
    Width    = 110,
    Height   = 42,
    X        = 0.5,    --- centro horizontal
    Y        = 0.9,    --- abajo
    Draggable = true,  --- el usuario puede moverlo
    Callback = function()
        print("¡Botón flotante presionado!")
    end
})
--- No necesitas llamar a :Show() — aparece automáticamente al crearlo

Ejemplo 2 — Activar y desactivar con un Toggle

El botón empieza oculto. El Toggle lo muestra u oculta. Úsalo para botones que solo tienen sentido cuando una función está activa.

--- Crear el botón YA OCULTO
local BtnFuncion = MainTab:CreateButtonFloat({
    Name        = "🔥 Ejecutar",
    Width       = 110,
    Height      = 42,
    X           = 0.85,
    Y           = 0.7,
    CustomColor = {80, 200, 120},  --- verde fijo, no cambia con el tema
    Callback = function()
        print("Función ejecutada")
    end
})
BtnFuncion:Hide()  --- ocultar al inicio

--- El Toggle lo muestra/oculta
MainTab:CreateToggle({
    Name         = "Mostrar botón flotante",
    CurrentValue = false,
    Callback = function(estado)
        BtnFuncion:SetVisible(estado)
    end
})

Ejemplo 3 — Activar con un Botón normal

Un botón dentro de la interfaz que activa/desactiva otro botón flotante. Aquí necesitas manejar el estado tú mismo.

local BtnManual = MainTab:CreateButtonFloat({
    Name      = "✅ Activo",
    Width     = 100,
    Height    = 40,
    X         = 0.15,
    Y         = 0.5,
    Draggable = true,
    Callback  = function()
        print("¡Presionado!")
    end
})
BtnManual:Hide()

--- Variable local para trackear el estado
local flotanteVisible = false

MainTab:CreateButton({
    Name = "Mostrar / Ocultar botón manual",
    Callback = function()
        flotanteVisible = not flotanteVisible
        BtnManual:SetVisible(flotanteVisible)
    end
})

Ejemplo 4 — Solo en móvil, con color personalizado

Botón que solo aparece en dispositivos táctiles y mantiene un color fijo sin importar qué tema uses.

local BtnMobile = MainTab:CreateButtonFloat({
    Name        = "📱 Solo Móvil",
    Width       = 90,
    Height      = 38,
    X           = 0.05,   --- borde izquierdo
    Y           = 0.5,    --- centro vertical
    MobileOnly  = true,   --- INVISIBLE en PC automáticamente
    CustomColor = {255, 100, 0},  --- naranja siempre, no sigue el tema
    Draggable   = true,
    Callback    = function()
        print("Solo en móvil")
    end
})

Ejemplo 5 — Botón con imagen (icono)

Cuando pones Image, el botón muestra una imagen de Roblox en vez de texto. Ideal para botones circulares tipo joystick o iconos de acción.

local BtnIcono = MainTab:CreateButtonFloat({
    Image        = 6031071057,  --- AssetId de la imagen
    Width        = 55,
    Height       = 55,
    X            = 0.95,
    Y            = 0.5,
    CornerRadius = 27,  --- círculo (mitad de 55)
    PCOnly       = true,  --- solo en PC
    Callback     = function()
        print("Icono presionado")
    end
})

--- Cambiar la imagen dinámicamente
BtnIcono:SetImage(48965502)

Ejemplo 6 — Fly completo con botones flotantes arriba/abajo

El caso de uso más avanzado: un Toggle que activa el modo vuelo y crea dos botones flotantes para subir y bajar. Los botones aparecen solo cuando el fly está activo y desaparecen al desactivarlo.

local flyActivo    = false
local flyConexion  = nil
local subiendoActivo  = false
local bajandoActivo   = false
local RunService = game:GetService("RunService")
local UIS        = game:GetService("UserInputService")

--- Botón SUBIR (empieza oculto)
local BtnSubir = PlayerTab:CreateButtonFloat({
    Name        = "▲",
    Width       = 60,
    Height      = 60,
    X           = 0.9,
    Y           = 0.58,
    CornerRadius = 30,
    CustomColor = {60, 140, 255},
    Callback    = function() end  --- el movimiento se hace en el loop
})
BtnSubir:Hide()

--- Botón BAJAR (empieza oculto)
local BtnBajar = PlayerTab:CreateButtonFloat({
    Name        = "▼",
    Width       = 60,
    Height      = 60,
    X           = 0.9,
    Y           = 0.74,
    CornerRadius = 30,
    CustomColor = {60, 140, 255},
    Callback    = function() end
})
BtnBajar:Hide()

--- Toggle que activa/desactiva el fly y los botones
PlayerTab:CreateToggle({
    Name         = "✈️ Activar Fly",
    CurrentValue = false,
    Callback = function(estado)
        flyActivo = estado
        local char = game.Players.LocalPlayer.Character
        local hrp  = char and char:FindFirstChild("HumanoidRootPart")
        local hum  = char and char:FindFirstChild("Humanoid")

        if estado then
            --- Mostrar botones flotantes
            BtnSubir:Show()
            BtnBajar:Show()
            if hum then hum.PlatformStand = true end

            --- Loop de vuelo
            flyConexion = RunService.Heartbeat:Connect(function()
                if not flyActivo or not hrp or not hrp.Parent then
                    flyConexion:Disconnect()
                    return
                end
                local vel = hrp.Velocity
                --- PC: Space=subir, C=bajar
                if UIS:IsKeyDown(Enum.KeyCode.Space) then
                    hrp.Velocity = Vector3.new(vel.X, 40, vel.Z)
                elseif UIS:IsKeyDown(Enum.KeyCode.C) then
                    hrp.Velocity = Vector3.new(vel.X, -40, vel.Z)
                end
            end)

        else
            --- Ocultar botones y desactivar fly
            BtnSubir:Hide()
            BtnBajar:Hide()
            if flyConexion then flyConexion:Disconnect() end
            if hum then hum.PlatformStand = false end
        end
    end
})

Ejemplo 7 — Cambiar texto y color dinámicamente

Los botones flotantes pueden cambiar su apariencia en cualquier momento sin recrearlos.

local BtnDinamico = MainTab:CreateButtonFloat({
    Name   = "Texto original",
    Width  = 130,
    Height = 40,
    X      = 0.5,
    Y      = 0.85,
    Callback = function()
        print("Clic")
    end
})

--- Cambiar apariencia desde un botón de la interfaz
MainTab:CreateButton({
    Name = "Modificar botón flotante",
    Callback = function()
        BtnDinamico:SetText("✨ Cambiado")         --- nuevo texto
        BtnDinamico:SetColor(200, 80, 255)          --- nuevo color (morado)
    end
})

🎨 Color del tema vs Color personalizado

Aquí la diferencia entre poner CustomColor o no:

Sin CustomColor → sigue el tema

El botón siempre tiene el color de acento del tema activo. Si el usuario cambia el tema, el botón también cambia de color automáticamente.

local BtnTema = Tab:CreateButtonFloat({
    Name   = "Sigo el tema",
    Width  = 120,
    Height = 40,
    X      = 0.5,
    Y      = 0.9,
    --- SIN CustomColor
    Callback = function() end
})

Con CustomColor → color fijo siempre

El botón mantiene ese color RGB sin importar qué tema elija el usuario. Ideal para botones de peligro (rojo), confirmación (verde), etc.

local BtnFijo = Tab:CreateButtonFloat({
    Name        = "Color fijo",
    Width       = 120,
    Height      = 40,
    X           = 0.5,
    Y           = 0.9,
    CustomColor = {220, 50, 50},  --- rojo
    Callback    = function() end
})

📦 Varios botones flotantes a la vez

Puedes crear todos los botones que necesites, cada uno con su propia posición, color y comportamiento. Solo asegúrate de que no se sobrepongan entre sí ajustando los valores de X e Y.

--- Conjunto de 3 botones flotantes en la esquina inferior derecha
local Btn1 = MainTab:CreateButtonFloat({
    Name        = "A",
    Width       = 48,
    Height      = 48,
    X           = 0.88,
    Y           = 0.72,
    CornerRadius = 24,
    CustomColor = {0, 180, 100},
    Callback    = function() print("A") end
})

local Btn2 = MainTab:CreateButtonFloat({
    Name        = "B",
    Width       = 48,
    Height      = 48,
    X           = 0.95,
    Y           = 0.82,
    CornerRadius = 24,
    CustomColor = {60, 120, 255},
    Callback    = function() print("B") end
})

local Btn3 = MainTab:CreateButtonFloat({
    Name        = "X",
    Width       = 48,
    Height      = 48,
    X           = 0.81,
    Y           = 0.82,
    CornerRadius = 24,
    CustomColor = {220, 60, 60},
    Callback    = function() print("X") end
})

--- Eliminar todos al mismo tiempo si se necesita
MainTab:CreateButton({
    Name = "Eliminar los 3 botones",
    Callback = function()
        Btn1:Destroy()
        Btn2:Destroy()
        Btn3:Destroy()
    end
})

✅ Puntos clave para recordar

El botón aparece visible por defecto al crearlo. Llama a :Hide() justo después si quieres que empiece oculto.
Puedes crearlo desde cualquier tab — el botón no pertenece al tab, vive en la pantalla directamente. Usar MainTab o SettingsTab da el mismo resultado.
MobileOnly y PCOnly se detectan automáticamente al crear. Si estás en PC y pones MobileOnly = true, el botón no aparece nunca aunque llames a :Show().
El arrastre es compatible con móvil y PC al mismo tiempo cuando Draggable = true.
Sin CustomColor, el botón cambia de color automáticamente cuando el usuario cambia el tema desde el panel de la interfaz.

📋 Ejemplo Completo

Aquí tienes un script completo que demuestra todas las funcionalidades de JmodsLib:

--- JmodsLib
--- Cargar la librería
local JmodsLib = loadstring(game:HttpGet('https://raw.githubusercontent.com/pruebasjoao/test/refs/heads/main/JmodsLibV1.0'))()

--- Crear la ventana principal
local Window = JmodsLib:CreateWindow({
    Name = "Mi Script Completo",
    Icon = 90692784970350,
    LoadingTitle = "Cargando Script...",
    LoadingSubtitle = "Inicializando componentes...",
    Theme = "neon_blue",
    Intro = true,
    IntroIcon = 90692784970350,
    AnimationIntro = 0, --- Animación aleatoria
    DragImage = 127271155083726
})

--- Notificación de bienvenida
JmodsLib:Notify({
    Title = "¡Bienvenido!",
    Content = "Script cargado correctamente. Discord: https://discord.gg/ZTVC94ZmVZ",
    Duration = 8,
    Image = 13458017478
})

--- 📑 CREAR TABS
local MainTab = Window:CreateTab("Principal")
local PlayerTab = Window:CreateTab("Jugador")
local ScriptsTab = Window:CreateTab("Scripts")
local SettingsTab = Window:CreateTab("Configuración")

--- 📋 TAB PRINCIPAL
MainTab:CreateSection("Información del Script")

MainTab:CreateParagraph({
    Title = "Script Universal",
    Content = "Este es un ejemplo completo de JmodsLib. Incluye todas las funcionalidades disponibles."
})

MainTab:CreateButton({
    Name = "Mostrar Información",
    Callback = function()
        local player = game.Players.LocalPlayer
        JmodsLib:Notify({
            Title = "Tu Información",
            Content = string.format("Jugador: %s\nUserID: %d\nCuenta creada: %s",
                player.Name,
                player.UserId,
                os.date("%Y-%m-%d", player.AccountAge * 86400)
            ),
            Duration = 6
        })
    end
})

MainTab:CreateSection("") --- Separador

--- 🎮 TAB JUGADOR
PlayerTab:CreateSection("Modificadores del Jugador")

--- Variables para estados
local flyEnabled = false
local noClipEnabled = false

--- Slider de velocidad de caminata
PlayerTab:CreateSlider({
    Name = "Velocidad de Caminata",
    Range = {16, 200},
    Increment = 1,
    Suffix = " studs/s",
    CurrentValue = 16,
    Callback = function(value)
        local char = game.Players.LocalPlayer.Character
        if char and char:FindFirstChild("Humanoid") then
            char.Humanoid.WalkSpeed = value
        end
    end
})

--- Slider de poder de salto
PlayerTab:CreateSlider({
    Name = "Poder de Salto",
    Range = {50, 500},
    Increment = 5,
    Suffix = " poder",
    CurrentValue = 50,
    Callback = function(value)
        local char = game.Players.LocalPlayer.Character
        if char and char:FindFirstChild("Humanoid") then
            char.Humanoid.JumpPower = value
        end
    end
})

--- Toggle para Fly
PlayerTab:CreateToggle({
    Name = "Fly Mode",
    CurrentValue = false,
    Callback = function(state)
        flyEnabled = state
        if state then
            JmodsLib:Notify({
                Title = "Fly Activado",
                Content = "Usa WASD para volar, Space/Shift para subir/bajar",
                Duration = 4
            })
            --- Aquí iría la lógica del fly
        else
            JmodsLib:Notify({
                Title = "Fly Desactivado",
                Content = "Modo vuelo deshabilitado",
                Duration = 2
            })
        end
    end
})

--- Input para teletransporte
PlayerTab:CreateInput({
    Name = "Teleport a Jugador",
    PlaceholderText = "Nombre del jugador...",
    Callback = function(playerName)
        local targetPlayer = game.Players:FindFirstChild(playerName)
        if targetPlayer and targetPlayer.Character and targetPlayer.Character:FindFirstChild("HumanoidRootPart") then
            local myChar = game.Players.LocalPlayer.Character
            if myChar and myChar:FindFirstChild("HumanoidRootPart") then
                myChar.HumanoidRootPart.CFrame = targetPlayer.Character.HumanoidRootPart.CFrame
                JmodsLib:Notify({
                    Title = "Teleport Exitoso",
                    Content = "Te teletransportaste a " .. targetPlayer.Name,
                    Duration = 3
                })
            end
        else
            JmodsLib:Notify({
                Title = "Error",
                Content = "Jugador no encontrado: " .. playerName,
                Duration = 3
            })
        end
    end
})

--- 🛠️ TAB SCRIPTS
ScriptsTab:CreateSection("Scripts Externos")

ScriptsTab:CreateButton({
    Name = "Infinite Yield",
    Callback = function()
        loadstring(game:HttpGet('https://raw.githubusercontent.com/EdgeIY/infiniteyield/master/source'))()
        JmodsLib:Notify({
            Title = "Script Cargado",
            Content = "Infinite Yield cargado exitosamente",
            Duration = 3
        })
    end
})

ScriptsTab:CreateButton({
    Name = "Dex Explorer",
    Callback = function()
        loadstring(game:HttpGet("https://raw.githubusercontent.com/infyiff/backup/main/dex.lua"))()
    end
})

ScriptsTab:CreateDropdown({
    Name = "Scripts de Juegos",
    Options = {"Arsenal", "Adopt Me", "Blox Fruits", "Tower Defense Simulator"},
    Callback = function(game)
        JmodsLib:Notify({
            Title = "Script de Juego",
            Content = "Cargando script para: " .. game,
            Duration = 3
        })
        --- Aquí cargarías el script específico del juego
    end
})

--- ⚙️ TAB CONFIGURACIÓN
SettingsTab:CreateSection("Configuración de la Interfaz")

SettingsTab:CreateParagraph({
    Title = "Control de Temas",
    Content = "Los temas se guardan automáticamente. Usa el botón de paleta en la barra superior para cambiar temas."
})

SettingsTab:CreateButton({
    Name = "Cambiar a Tema Aleatorio",
    Callback = function()
        local themes = {"red", "green", "blue", "purple", "neon", "neon_blue", "neon_pink"}
        local randomTheme = themes[math.random(1, #themes)]
        Window:SetTheme(randomTheme)
        JmodsLib:Notify({
            Title = "Tema Cambiado",
            Content = "Nuevo tema aplicado: " .. randomTheme,
            Duration = 4
        })
    end
})

SettingsTab:CreateColorPicker({
    Name = "Color de Ejemplo",
    Color = Color3.fromRGB(255, 100, 100),
    Callback = function(color)
        print(string.format("Color RGB: %d, %d, %d", 
            color.R*255, color.G*255, color.B*255))
    end
})

SettingsTab:CreateKeybind({
    Name = "Hotkey de Ejemplo",
    CurrentKeybind = "G",
    Callback = function(key)
        JmodsLib:Notify({
            Title = "Hotkey Activado",
            Content = "Presionaste: " .. key.Name,
            Duration = 2
        })
    end
})

SettingsTab:CreateSection("Créditos")

SettingsTab:CreateParagraph({
    Title = "Desarrollado por",
    Content = "joao_mods - JmodsLib v1.0\nGracias por usar nuestro script!"
})

--- 📱 CONFIGURACIONES FINALES
--- Cambiar la tecla de minimizado (opcional)
Window:SetRestoreKey(Enum.KeyCode.Insert)

--- Notificación final
wait(2)
JmodsLib:Notify({
    Title = "¡Script Listo!",
    Content = "Todas las funciones cargadas. Presiona INSERT para minimizar.",
    Duration = 5
})

✅ Características del Ejemplo

4 tabs diferentes con funciones organizadas
Modificadores de jugador (velocidad, salto, fly)
Scripts externos populares integrados
Sistema de notificaciones con links
Control de temas programático
Keybinds personalizados
Todos los elementos de UI demostrados

🎮 Scripts para Juegos Específicos

Ejemplos de cómo adaptar JmodsLib para juegos específicos de Roblox:

Arsenal Script

--- Script específico para Arsenal
local ArsenalTab = Window:CreateTab("Arsenal")

ArsenalTab:CreateToggle({
    Name = "Aimbot",
    CurrentValue = false,
    Callback = function(state)
        print("Aimbot:", state)
        --- Lógica del aimbot aquí
    end
})

ArsenalTab:CreateSlider({
    Name = "FOV del Aimbot",
    Range = {50, 360},
    CurrentValue = 120,
    Suffix = "°",
    Callback = function(value)
        print("FOV cambiado a:", value)
    end
})

Blox Fruits Script

--- Script específico para Blox Fruits
local BloxTab = Window:CreateTab("Blox Fruits")

BloxTab:CreateToggle({
    Name = "Auto Farm",
    CurrentValue = false,
    Callback = function(state)
        if state then
            JmodsLib:Notify({
                Title = "Auto Farm",
                Content = "Auto Farm activado para Blox Fruits",
                Duration = 3
            })
        end
    end
})

BloxTab:CreateDropdown({
    Name = "Seleccionar Fruta",
    Options = {"Rubber", "Fire", "Ice", "Dark", "Light"},
    Callback = function(fruit)
        print("Fruta seleccionada:", fruit)
    end
})

💡 Consejos y Mejores Prácticas

🎯 Mejores Prácticas de Desarrollo

Nombres únicos: Usa nombres diferentes para cada elemento para evitar conflictos
Organización: Usa secciones para separar grupos de elementos relacionados
Comentarios: Comenta tu código para recordar qué hace cada elemento
Manejo de errores: Usa pcall() para evitar crashes en funciones críticas
Feedback al usuario: Usa notificaciones para informar sobre acciones

⚡ Características Automáticas

Auto-guardado de temas: Los usuarios pueden cambiar temas y se guardan automáticamente
Responsive design: La interfaz se adapta a dispositivos móviles y PC
Arrastrable y redimensionable: Los usuarios pueden personalizar el tamaño y posición
Minimizable: Bind personalizable para mostrar/ocultar la GUI
Links inteligentes: Las notificaciones detectan y procesan URLs automáticamente
Scroll optimizado: Solo vertical en móvil para mejor experiencia

⚠️ Cosas Importantes a Recordar

Si Intro = false, puedes eliminar: LoadingTitle, LoadingSubtitle, IntroIcon, AnimationIntro
Los temas se pueden escribir en español e inglés indistintamente
Siempre haz referencia al tab correcto al agregar elementos
Los Callbacks se ejecutan cuando el usuario interactúa con el elemento
Usa variables globales para controlar estados (como flyEnabled, farmEnabled, etc.)
Las notificaciones solo muestran una a la vez para evitar spam

🔧 Solución de Problemas Comunes

Error: "attempt to index nil"

Siempre verifica que los objetos existan antes de usarlos:

                        local char = game.Players.LocalPlayer.Character
if char and char:FindFirstChild("Humanoid") then
    char.Humanoid.WalkSpeed = 50
end
                    

Elementos no aparecen

Verifica que estés referenciando el tab correcto:

                        --- ❌ Incorrecto
WrongTab:CreateButton({...})

--- ✅ Correcto
MainTab:CreateButton({...})
                    

Callback no funciona

Asegúrate de que la sintaxis del callback sea correcta:

                        --- ✅ Correcto
Callback = function(value)
    print(value)
end
                    

📚 Recursos Adicionales

Enlaces Útiles

Discord de Soporte: https://discord.gg/ZTVC94ZmVZ
Canal de YouTube: https://youtube.com/@joao_mods0
Documentación de Roblox: https://developer.roblox.com/
Actualizaciones: Síguenos en redes sociales para las últimas novedades

Contenidos

JmodsLib Tutorial

📥 Instalación y Configuración

Paso 1: Cargar la Librería

💡 Consejo

Paso 2: Crear una Ventana

⚠️ Opciones de la Intro

Animaciones de Intro Disponibles

🎨 Temas Disponibles

✅ Auto-Guardado de Temas

🔔 Sistema de Notificaciones Avanzado

🔗 Características de las Notificaciones

Ejemplos de Notificaciones

Notificación Simple

Notificación con Links

📑 Creación de Tabs

💡 Importante sobre los Tabs

📋 Creación de Secciones

✅ Tips para Secciones

🔧 Elementos de Interfaz

🔘 Botones

🎛️ Toggle (Interruptor)

📊 Slider (Barra Deslizante)

⌨️ Input (Campo de Texto)

📋 Dropdown (Menú Desplegable)

🎨 ColorPicker (Selector de Color)

⌨️ Keybind (Asignar Tecla)

📄 Paragraph (Información)

📄 Paragraph — Guía Detallada

🧠 Crear un Paragraph

⚙️ Métodos Disponibles

🔹 UpdateTitle

🔹 UpdateContent

🚀 Ejemplo Completo

📊 Ejemplo: Lista de Jugadores en Tiempo Real

⚠️ Limitaciones del Paragraph

💡 Tips

⚡ Funciones Avanzadas de JmodsLib

🎨 Control Programático de Temas

🔧 Configuración de Teclas de Minimizado

🔄 Reset de Temas

📱 Características Móviles

🔄 Métodos Dinámicos del Dropdown

📋 Crear un Dropdown Base

💡 Importante

⚡ UpdateOptions() - Actualización Inmediata

✅ Características de UpdateOptions()

🕐 UpdateOnClose() - Actualización Diferida

✅ Características de UpdateOnClose()

🆚 Comparación: UpdateOptions() vs UpdateOnClose()

📝 Set() - Cambiar Selección

📥 Get() - Obtener Selección Actual

🎯 Ejemplos Prácticos Completos

Ejemplo 1: Lista de Jugadores en Tiempo Real

Ejemplo 2: Cambio Manual con Botón

Ejemplo 3: Filtrado Dinámico

⚠️ Consejos Importantes

🔄 Resumen de Métodos

🖼️ Sistema de Imágenes

💡 ¿Cuándo usar cada uno?

🔳 CreateImage — Imagen Individual

Opciones disponibles:

Métodos del objeto devuelto:

✅ Truco: Círculo perfecto

🪪 CreateImageRow — Imagen + Información

Opciones disponibles:

Métodos del objeto devuelto:

👥 Selector de Jugadores con Imagen

🔄 Actualización Dinámica de Imágenes

⚠️ Diferencia importante: AssetId vs UserId

📋 Resumen de todos los métodos

🎮 Botones Flotantes — CreateButtonFloat

💡 ¿Cómo funciona internamente?

⚙️ Opciones de Creación

🔧 Métodos del objeto devuelto

📐 Entendiendo el Posicionamiento

🧪 Ejemplos Completos

Ejemplo 1 — Siempre visible al cargar el script

Ejemplo 2 — Activar y desactivar con un Toggle

Ejemplo 3 — Activar con un Botón normal