jecs/modules/Jabby/ui/components/interactable/button.luau
2026-02-18 01:39:54 +01:00

160 lines
No EOL
4.4 KiB
Text

local vide = require(script.Parent.Parent.Parent.Parent.vide)
local anim = require(script.Parent.Parent.Parent.util.anim)
local theme = require(script.Parent.Parent.Parent.util.theme)
local typography = require(script.Parent.Parent.display.typography)
local padding = require(script.Parent.Parent.util.padding)
local create = vide.create
local source = vide.source
local changed = vide.changed
local show = vide.show
local read = vide.read
type can<T> = T | () -> T
type props = {
size: can<UDim2>?,
position: can<UDim2>?,
anchorpoint: can<Vector2>?,
automaticsize: can<Enum.AutomaticSize>?,
text: can<string>?,
disabled: can<boolean>?,
activated: () -> ()?,
mouse2: () -> ()?,
down: () -> ()?,
up: () -> ()?,
--- enables the stroke (enabled by default)
stroke: can<boolean>?,
--- enables the corner (enabled by default)
corner: can<boolean>?,
accent: can<boolean>?,
xalignment: can<Enum.TextXAlignment>?,
code: can<boolean>?,
[number]: any
}
return function(props: props)
local guistate = source(Enum.GuiState.Idle)
local function bg()
local accent = read(props.accent)
local guistate = guistate()
return if accent then
if guistate == Enum.GuiState.NonInteractable then theme.acc[-5]()
elseif guistate == Enum.GuiState.Idle then theme.acc[0]()
elseif guistate == Enum.GuiState.Hover then theme.acc[3]()
elseif guistate == Enum.GuiState.Press then theme.acc[-8]()
else theme.acc[0]()
else
if guistate == Enum.GuiState.NonInteractable then theme.bg[-2]()
elseif guistate == Enum.GuiState.Idle then theme.bg[3]()
elseif guistate == Enum.GuiState.Hover then theme.bg[6]()
elseif guistate == Enum.GuiState.Press then theme.bg[0]()
else theme.acc[0]()
end
local function stroke()
local accent = read(props.accent)
local guistate = guistate()
return if accent then
if guistate == Enum.GuiState.NonInteractable then theme.acc[-7]()
else theme.acc[-7]()
else
if guistate == Enum.GuiState.NonInteractable then theme.bg[-3]()
else theme.bg[-3]()
end
return create "TextButton" {
Name = props.text,
AutoLocalize = false,
Size = props.size or UDim2.fromOffset(100, 30),
Position = props.position,
AnchorPoint = props.anchorpoint,
AutomaticSize = props.automaticsize,
Interactable = function()
return not read(props.disabled)
end,
BackgroundColor3 = anim(bg),
Activated = props.activated,
MouseButton2Click = props.mouse2,
MouseButton1Down = props.down,
MouseButton1Up = props.up,
typography {
position = UDim2.fromScale(0.5, 0.5),
anchorpoint = Vector2.new(0.5, 0.5),
size = UDim2.fromScale(1, 1),
automaticsize = Enum.AutomaticSize.Y,
text = props.text,
truncate = Enum.TextTruncate.SplitWord,
xalignment = props.xalignment,
accent = props.accent,
disabled = props.disabled,
visible = function()
return read(props.text) ~= ""
end,
code = props.code,
create "UIFlexItem" {
FlexMode = Enum.UIFlexMode.Fill
}
},
show(
function()
return read(props.stroke) ~= false
end,
source(
create "UIStroke" {
ApplyStrokeMode = Enum.ApplyStrokeMode.Border,
Color = anim(stroke),
Thickness = 1,
Enabled = props.stroke
}
)
),
show(
function()
return read(props.corner) ~= false
end,
source(
create "UICorner" {
CornerRadius = UDim.new(0,4)
}
)
),
padding {
x = UDim.new(0, 8),
y = UDim.new(0, 2)
},
changed("GuiState", guistate),
unpack(props),
}
end