@rbxts/centurion-ui 1.0.0-dev-284510d

package/out/components/terminal-window.lua

@@ -0,0 +1,265 @@
+-- Compiled with roblox-ts v2.3.0-dev-26ec859
+local TS = _G[script]
+local _centurion = TS.import(script, TS.getModule(script, "@rbxts", "centurion").out)
+local ImmutableRegistryPath = _centurion.ImmutableRegistryPath
+local RegistryPath = _centurion.RegistryPath
+local ArrayUtil = TS.import(script, TS.getModule(script, "@rbxts", "centurion").out.shared.util.data).ArrayUtil
+local _string = TS.import(script, TS.getModule(script, "@rbxts", "centurion").out.shared.util.string)
+local endsWithSpace = _string.endsWithSpace
+local formatPartsAsPath = _string.formatPartsAsPath
+local splitString = _string.splitString
+local _pretty_react_hooks = TS.import(script, TS.getModule(script, "@rbxts", "pretty-react-hooks").out)
+local useEventListener = _pretty_react_hooks.useEventListener
+local useLatestCallback = _pretty_react_hooks.useLatestCallback
+local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local React = _react
+local useContext = _react.useContext
+local useEffect = _react.useEffect
+local useMemo = _react.useMemo
+local useState = _react.useState
+local TextService = TS.import(script, TS.getModule(script, "@rbxts", "services")).TextService
+local HISTORY_TEXT_SIZE = TS.import(script, script.Parent.Parent, "constants", "text").HISTORY_TEXT_SIZE
+local useMotion = TS.import(script, script.Parent.Parent, "hooks", "use-motion").useMotion
+local usePx = TS.import(script, script.Parent.Parent, "hooks", "use-px").usePx
+local useStore = TS.import(script, script.Parent.Parent, "hooks", "use-store").useStore
+local ApiContext = TS.import(script, script.Parent.Parent, "providers", "api-provider").ApiContext
+local OptionsContext = TS.import(script, script.Parent.Parent, "providers", "options-provider").OptionsContext
+local _suggestion = TS.import(script, script.Parent.Parent, "util", "suggestion")
+local getArgumentSuggestion = _suggestion.getArgumentSuggestion
+local getCommandSuggestion = _suggestion.getCommandSuggestion
+local HistoryList = TS.import(script, script.Parent, "history").HistoryList
+local TerminalTextField = TS.import(script, script.Parent, "terminal-text-field").TerminalTextField
+local Frame = TS.import(script, script.Parent, "ui", "frame").Frame
+local Padding = TS.import(script, script.Parent, "ui", "padding").Padding
+local MAX_HEIGHT = HISTORY_TEXT_SIZE * 10
+local TEXT_FIELD_HEIGHT = 40
+local function TerminalWindow()
+	local px = usePx()
+	local store = useStore()
+	local api = useContext(ApiContext)
+	local options = useContext(OptionsContext)
+	local history, setHistory = useState(api.dispatcher:getHistory())
+	local historyData, setHistoryData = useState({
+		lines = {},
+		height = 0,
+	})
+	local historyHeight, historyHeightMotion = useMotion(0)
+	local textBoundsParams = useMemo(function()
+		local params = Instance.new("GetTextBoundsParams")
+		params.Width = math.huge
+		params.Font = options.font.regular
+		return params
+	end, {})
+	local windowHeightBinding = useMemo(function()
+		return historyHeight:map(function(y)
+			return UDim2.new(1, 0, 0, math.ceil(px(TEXT_FIELD_HEIGHT + 16) + y))
+		end)
+	end, { px })
+	local checkMissingArgs = useLatestCallback(function(path, command)
+		if command.arguments == nil or #command.arguments == 0 then
+			return nil
+		end
+		local storeState = store:getState()
+		local lastPartIndex = #storeState.text.parts - path:size() - 1
+		local missingArgs = {}
+		local index = 0
+		for _, arg in command.arguments do
+			if arg.optional then
+				break
+			end
+			if index > lastPartIndex then
+				local _arg0 = `<b>{arg.name}</b>`
+				table.insert(missingArgs, _arg0)
+			end
+			index += 1
+		end
+		if #missingArgs == 0 then
+			return nil
+		end
+		local text = "Missing required argument"
+		if #missingArgs ~= 1 then
+			text ..= "s"
+		end
+		return `{text}: {table.concat(missingArgs, ", ")}`
+	end)
+	useEventListener(api.dispatcher.historyUpdated, function(entries)
+		local _array = {}
+		local _length = #_array
+		table.move(entries, 1, #entries, _length + 1, _array)
+		setHistory(_array)
+	end)
+	-- Handle history updates
+	useEffect(function()
+		local historySize = #history
+		local totalHeight = if historySize > 0 then px(8) + (historySize - 1) * px(8) else 0
+		textBoundsParams.Size = HISTORY_TEXT_SIZE
+		local historyLines = {}
+		for _, entry in history do
+			textBoundsParams.Text = entry.text
+			local textSize = TextService:GetTextBoundsAsync(textBoundsParams)
+			local lineHeight = px(textSize.Y + 4)
+			totalHeight += lineHeight
+			local _arg0 = {
+				entry = entry,
+				height = lineHeight,
+			}
+			table.insert(historyLines, _arg0)
+		end
+		local isClamped = totalHeight > px(MAX_HEIGHT)
+		local clampedHeight = if isClamped then px(MAX_HEIGHT) else totalHeight
+		historyHeightMotion:spring(clampedHeight, {
+			mass = 0.1,
+			tension = 300,
+			friction = 15,
+		})
+		setHistoryData({
+			lines = historyLines,
+			height = totalHeight,
+		})
+	end, { history, px })
+	return React.createElement(Frame, {
+		size = windowHeightBinding,
+		backgroundColor = options.palette.background,
+		backgroundTransparency = options.backgroundTransparency,
+		cornerRadius = UDim.new(0, px(8)),
+		event = {
+			MouseEnter = function()
+				return options.setMouseOnGUI(true)
+			end,
+			MouseLeave = function()
+				return options.setMouseOnGUI(false)
+			end,
+		},
+	}, React.createElement(Padding, {
+		all = UDim.new(0, px(8)),
+	}), React.createElement(HistoryList, {
+		size = UDim2.new(1, 0, 1, -px(TEXT_FIELD_HEIGHT + 8)),
+		data = historyData,
+		maxHeight = px(MAX_HEIGHT),
+	}), React.createElement(TerminalTextField, {
+		anchorPoint = Vector2.new(0, 1),
+		size = UDim2.new(1, 0, 0, px(TEXT_FIELD_HEIGHT)),
+		position = UDim2.fromScale(0, 1),
+		backgroundTransparency = options.backgroundTransparency,
+		onTextChange = function(text)
+			local parts = splitString(text, " ")
+			store.setText(text, parts)
+			if #parts == 0 then
+				store.setSuggestion(nil)
+				store.setCommand(nil)
+				store.setArgIndex(nil)
+				return nil
+			end
+			store:flush()
+			-- If the text ends in a space, we want to count that as having traversed
+			-- to the next "part" of the text. This means we should include the previous
+			-- text part as part of the parent path.
+			local atNextPart = endsWithSpace(text)
+			local commandPath = store:getState().command.path
+			local atCommand = false
+			if commandPath ~= nil and formatPartsAsPath(ArrayUtil.slice(parts, 0, commandPath:size())) == commandPath:toString() then
+				-- The current path still leads to the command, so it's valid
+				atCommand = true
+			elseif api.registry:getCommandByString(formatPartsAsPath(parts)) ~= nil then
+				atCommand = true
+				commandPath = ImmutableRegistryPath.new(parts)
+			else
+				local currentPath = RegistryPath:empty()
+				for _, part in parts do
+					currentPath:append(part)
+					if api.registry:getCommand(currentPath) ~= nil then
+						atCommand = true
+						break
+					end
+					if #api.registry:getChildPaths(currentPath) == 0 then
+						atCommand = false
+						break
+					end
+				end
+				commandPath = ImmutableRegistryPath:fromPath(currentPath)
+			end
+			if not atCommand and store:getState().command.path ~= nil then
+				store.setCommand(nil)
+				store:flush()
+			elseif atCommand and commandPath ~= store:getState().command.path then
+				store.setCommand(commandPath)
+				store:flush()
+			end
+			local _result
+			if commandPath ~= nil then
+				local _result_1 = api.registry:getCommand(commandPath)
+				if _result_1 ~= nil then
+					_result_1 = _result_1.options
+				end
+				_result = _result_1
+			else
+				_result = nil
+			end
+			local command = _result
+			if commandPath ~= nil and command ~= nil then
+				store.setTextValid(checkMissingArgs(commandPath, command) == nil)
+			else
+				store.setTextValid(false)
+			end
+			-- Update suggestions
+			local showArgs = atCommand and (atNextPart or (commandPath ~= nil and #parts > commandPath:size()))
+			local _result_1
+			if showArgs and command ~= nil then
+				local _result_2 = command.arguments
+				if _result_2 ~= nil then
+					_result_2 = #_result_2
+				end
+				local _condition = _result_2
+				if _condition == nil then
+					_condition = 0
+				end
+				_result_1 = _condition
+			else
+				_result_1 = 0
+			end
+			local argCount = _result_1
+			local currentTextPart = if not atNextPart then parts[#parts] else nil
+			local suggestion
+			if argCount == 0 then
+				local parentPath = if atNextPart then commandPath elseif commandPath:size() ~= 1 then commandPath:parent() else nil
+				suggestion = getCommandSuggestion(api.registry, parentPath, currentTextPart)
+			elseif commandPath ~= nil then
+				-- Handle argument suggestions
+				local argIndex = #parts - commandPath:size() - (if atNextPart then 0 else 1)
+				if argIndex >= argCount then
+					return nil
+				end
+				store.setArgIndex(argIndex)
+				suggestion = getArgumentSuggestion(api.registry, commandPath, argIndex, currentTextPart)
+			end
+			store.setSuggestion(suggestion)
+		end,
+		onSubmit = function(text)
+			local storeState = store:getState()
+			local commandPath = storeState.command.path
+			local command = if commandPath ~= nil then api.registry:getCommand(commandPath) else nil
+			if commandPath == nil or command == nil then
+				api.dispatcher:addHistoryEntry({
+					success = false,
+					text = "Command not found.",
+					sentAt = os.time(),
+				})
+				return nil
+			end
+			local argCheckMessage = checkMissingArgs(commandPath, command.options)
+			if argCheckMessage ~= nil then
+				api.dispatcher:addHistoryEntry({
+					success = false,
+					text = argCheckMessage,
+					sentAt = os.time(),
+				})
+				return nil
+			end
+			local args = ArrayUtil.slice(storeState.text.parts, commandPath:size())
+			api.dispatcher:run(commandPath, args)
+		end,
+	}))
+end
+return {
+	TerminalWindow = TerminalWindow,
+}

package/out/components/terminal.d.ts

@@ -0,0 +1 @@
+export default function Terminal(): JSX.Element;

package/out/components/terminal.lua

@@ -0,0 +1,26 @@
+-- Compiled with roblox-ts v2.3.0-dev-26ec859
+local TS = _G[script]
+local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local React = _react
+local useContext = _react.useContext
+local GuiService = TS.import(script, TS.getModule(script, "@rbxts", "services")).GuiService
+local usePx = TS.import(script, script.Parent.Parent, "hooks", "use-px").usePx
+local OptionsContext = TS.import(script, script.Parent.Parent, "providers", "options-provider").OptionsContext
+local Suggestions = TS.import(script, script.Parent, "suggestions").Suggestions
+local TerminalWindow = TS.import(script, script.Parent, "terminal-window").TerminalWindow
+local Group = TS.import(script, script.Parent, "ui", "group").Group
+local function Terminal()
+	local px = usePx()
+	local options = useContext(OptionsContext)
+	return React.createElement(Group, {
+		anchorPoint = options.anchorPoint or Vector2.new(0, 0),
+		size = options.size or UDim2.new(0, px(1024), 1, 0),
+		position = options.position or UDim2.fromOffset(px(16), px(8) + (GuiService:GetGuiInset()).Y),
+	}, React.createElement(TerminalWindow), React.createElement(Suggestions), React.createElement("uilistlayout", {
+		Padding = UDim.new(0, px(8)),
+		SortOrder = "LayoutOrder",
+	}))
+end
+return {
+	default = Terminal,
+}

package/out/components/ui/frame.d.ts

@@ -0,0 +1,20 @@
+import { BindingOrValue } from "@rbxts/pretty-react-hooks";
+import React, { InferEnumNames } from "@rbxts/react";
+export interface FrameProps<T extends Instance = Frame> extends React.PropsWithChildren {
+    ref?: React.Ref<T>;
+    event?: React.InstanceEvent<T>;
+    change?: React.InstanceChangeEvent<T>;
+    size?: BindingOrValue<UDim2>;
+    position?: BindingOrValue<UDim2>;
+    anchorPoint?: BindingOrValue<Vector2>;
+    rotation?: BindingOrValue<number>;
+    backgroundColor?: BindingOrValue<Color3>;
+    backgroundTransparency?: BindingOrValue<number>;
+    clipsDescendants?: BindingOrValue<boolean>;
+    visible?: BindingOrValue<boolean>;
+    zIndex?: BindingOrValue<number>;
+    layoutOrder?: BindingOrValue<number>;
+    cornerRadius?: BindingOrValue<UDim>;
+    automaticSize?: InferEnumNames<Enum.AutomaticSize>;
+}
+export declare const Frame: React.ForwardRefExoticComponent<Omit<FrameProps<Frame>, "ref"> & React.RefAttributes<Frame>>;

package/out/components/ui/frame.lua

@@ -0,0 +1,29 @@
+-- Compiled with roblox-ts v2.3.0-dev-26ec859
+local TS = _G[script]
+local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local React = _react
+local forwardRef = _react.forwardRef
+local Frame = forwardRef(function(props, ref)
+	return React.createElement("frame", {
+		ref = ref,
+		AutomaticSize = props.automaticSize,
+		Size = props.size,
+		Position = props.position,
+		AnchorPoint = props.anchorPoint,
+		Rotation = props.rotation,
+		BackgroundColor3 = props.backgroundColor,
+		BackgroundTransparency = props.backgroundTransparency,
+		ClipsDescendants = props.clipsDescendants,
+		Visible = props.visible,
+		ZIndex = props.zIndex,
+		LayoutOrder = props.layoutOrder,
+		BorderSizePixel = 0,
+		Event = props.event or {},
+		Change = props.change or {},
+	}, props.cornerRadius and React.createElement("uicorner", {
+		CornerRadius = props.cornerRadius,
+	}), props.children)
+end)
+return {
+	Frame = Frame,
+}

package/out/components/ui/group.d.ts

@@ -0,0 +1,17 @@
+import { BindingOrValue } from "@rbxts/pretty-react-hooks";
+import React from "@rbxts/react";
+interface GroupProps extends React.PropsWithChildren {
+    ref?: React.Ref<Frame>;
+    event?: React.InstanceEvent<Frame>;
+    change?: React.InstanceChangeEvent<Frame>;
+    size?: BindingOrValue<UDim2>;
+    position?: BindingOrValue<UDim2>;
+    anchorPoint?: BindingOrValue<Vector2>;
+    rotation?: BindingOrValue<number>;
+    clipsDescendants?: BindingOrValue<boolean>;
+    layoutOrder?: BindingOrValue<number>;
+    visible?: BindingOrValue<boolean>;
+    zIndex?: BindingOrValue<number>;
+}
+export declare const Group: React.ForwardRefExoticComponent<Omit<GroupProps, "ref"> & React.RefAttributes<Frame>>;
+export {};

package/out/components/ui/group.lua

@@ -0,0 +1,24 @@
+-- Compiled with roblox-ts v2.3.0-dev-26ec859
+local TS = _G[script]
+local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local React = _react
+local forwardRef = _react.forwardRef
+local Group = forwardRef(function(props, ref)
+	return React.createElement("frame", {
+		ref = ref,
+		Size = props.size or UDim2.fromScale(1, 1),
+		Position = props.position,
+		AnchorPoint = props.anchorPoint,
+		Rotation = props.rotation,
+		ClipsDescendants = props.clipsDescendants,
+		LayoutOrder = props.layoutOrder,
+		Visible = props.visible,
+		ZIndex = props.zIndex,
+		BackgroundTransparency = 1,
+		Event = props.event or {},
+		Change = props.change or {},
+	}, props.children)
+end)
+return {
+	Group = Group,
+}

package/out/components/ui/layer.d.ts

@@ -0,0 +1,7 @@
+import React from "@rbxts/react";
+interface LayerProps extends React.PropsWithChildren {
+    visible?: boolean;
+    displayOrder?: number;
+}
+export declare function Layer({ visible, displayOrder, children }: LayerProps): JSX.Element;
+export {};

package/out/components/ui/layer.lua

@@ -0,0 +1,23 @@
+-- Compiled with roblox-ts v2.3.0-dev-26ec859
+local TS = _G[script]
+local React = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local IS_EDIT = TS.import(script, script.Parent.Parent.Parent, "constants", "util").IS_EDIT
+local Group = TS.import(script, script.Parent, "group").Group
+local function Layer(_param)
+	local visible = _param.visible
+	local displayOrder = _param.displayOrder
+	local children = _param.children
+	return if IS_EDIT then (React.createElement(Group, {
+		visible = visible,
+		zIndex = displayOrder,
+	}, children)) else (React.createElement("screengui", {
+		Enabled = visible,
+		ResetOnSpawn = false,
+		DisplayOrder = displayOrder,
+		IgnoreGuiInset = true,
+		ZIndexBehavior = "Sibling",
+	}, children))
+end
+return {
+	Layer = Layer,
+}

package/out/components/ui/outline.d.ts

@@ -0,0 +1,14 @@
+import { BindingOrValue } from "@rbxts/pretty-react-hooks";
+import React from "@rbxts/react";
+interface OutlineProps extends React.PropsWithChildren {
+    readonly outlineTransparency?: BindingOrValue<number>;
+    readonly innerColor?: BindingOrValue<Color3>;
+    readonly outerColor?: BindingOrValue<Color3>;
+    readonly innerTransparency?: BindingOrValue<number>;
+    readonly outerTransparency?: BindingOrValue<number>;
+    readonly innerThickness?: BindingOrValue<number>;
+    readonly outerThickness?: BindingOrValue<number>;
+    readonly cornerRadius?: BindingOrValue<UDim>;
+}
+export declare function Outline({ outlineTransparency, innerColor, outerColor, innerTransparency, outerTransparency, innerThickness, outerThickness, cornerRadius, children, }: OutlineProps): JSX.Element;
+export {};

package/out/components/ui/outline.lua

@@ -0,0 +1,106 @@
+-- Compiled with roblox-ts v2.3.0-dev-26ec859
+local TS = _G[script]
+local _pretty_react_hooks = TS.import(script, TS.getModule(script, "@rbxts", "pretty-react-hooks").out)
+local blend = _pretty_react_hooks.blend
+local composeBindings = _pretty_react_hooks.composeBindings
+local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local React = _react
+local useMemo = _react.useMemo
+local usePx = TS.import(script, script.Parent.Parent.Parent, "hooks", "use-px").usePx
+local Group = TS.import(script, script.Parent, "group").Group
+local function ceilEven(n)
+	return math.ceil(n / 2) * 2
+end
+local DEFAULT_INNER_COLOR = Color3.new(1, 1, 1)
+local DEFAULT_OUTER_COLOR = Color3.new(0, 0, 0)
+local function Outline(_param)
+	local outlineTransparency = _param.outlineTransparency
+	if outlineTransparency == nil then
+		outlineTransparency = 0
+	end
+	local innerColor = _param.innerColor
+	if innerColor == nil then
+		innerColor = DEFAULT_INNER_COLOR
+	end
+	local outerColor = _param.outerColor
+	if outerColor == nil then
+		outerColor = DEFAULT_OUTER_COLOR
+	end
+	local innerTransparency = _param.innerTransparency
+	if innerTransparency == nil then
+		innerTransparency = 0.9
+	end
+	local outerTransparency = _param.outerTransparency
+	if outerTransparency == nil then
+		outerTransparency = 0.85
+	end
+	local innerThickness = _param.innerThickness
+	local outerThickness = _param.outerThickness
+	local cornerRadius = _param.cornerRadius
+	local children = _param.children
+	local px = usePx()
+	local _object = {}
+	local _left = "innerThickness"
+	local _condition = innerThickness
+	if _condition == nil then
+		_condition = px(3)
+	end
+	_object[_left] = _condition
+	local _left_1 = "outerThickness"
+	local _condition_1 = outerThickness
+	if _condition_1 == nil then
+		_condition_1 = px(1.5)
+	end
+	_object[_left_1] = _condition_1
+	_object.cornerRadius = cornerRadius or UDim.new(0, px(8))
+	local properties = _object
+	local innerStyle = useMemo(function()
+		local size = composeBindings(properties.innerThickness, function(thickness)
+			return UDim2.new(1, ceilEven(-2 * thickness), 1, ceilEven(-2 * thickness))
+		end)
+		local position = composeBindings(properties.innerThickness, function(thickness)
+			return UDim2.new(0, thickness, 0, thickness)
+		end)
+		local radius = composeBindings(properties.cornerRadius, properties.innerThickness, function(radius, thickness)
+			local _radius = radius
+			local _uDim = UDim.new(0, thickness)
+			return _radius - _uDim
+		end)
+		local transparency = composeBindings(outlineTransparency, innerTransparency, function(a, b)
+			return math.clamp(blend(a, b), 0, 1)
+		end)
+		return {
+			size = size,
+			position = position,
+			radius = radius,
+			transparency = transparency,
+		}
+	end, { properties.innerThickness, innerTransparency, properties.cornerRadius, outlineTransparency, px })
+	local outerStyle = useMemo(function()
+		local transparency = composeBindings(outlineTransparency, outerTransparency, function(a, b)
+			return math.clamp(blend(a, b), 0, 1)
+		end)
+		return {
+			transparency = transparency,
+		}
+	end, { outlineTransparency, outerTransparency })
+	return React.createElement(React.Fragment, nil, React.createElement(Group, {
+		size = innerStyle.size,
+		position = innerStyle.position,
+	}, React.createElement("uicorner", {
+		CornerRadius = innerStyle.radius,
+	}), React.createElement("uistroke", {
+		Color = innerColor,
+		Transparency = innerStyle.transparency,
+		Thickness = innerThickness,
+	}, children)), React.createElement(Group, nil, React.createElement("uicorner", {
+		CornerRadius = cornerRadius,
+	}), React.createElement("uistroke", {
+		Color = outerColor,
+		Transparency = outerStyle.transparency,
+		Thickness = outerThickness,
+	}, children)))
+end
+return {
+	Outline = Outline,
+}

package/out/components/ui/padding.d.ts

@@ -0,0 +1,10 @@
+import { BindingOrValue } from "@rbxts/pretty-react-hooks";
+interface Props {
+    all?: BindingOrValue<UDim>;
+    left?: BindingOrValue<UDim>;
+    right?: BindingOrValue<UDim>;
+    top?: BindingOrValue<UDim>;
+    bottom?: BindingOrValue<UDim>;
+}
+export declare function Padding({ all, left, right, top, bottom }: Props): JSX.Element;
+export {};

package/out/components/ui/padding.lua

@@ -0,0 +1,19 @@
+-- Compiled with roblox-ts v2.3.0-dev-26ec859
+local TS = _G[script]
+local React = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local function Padding(_param)
+	local all = _param.all
+	local left = _param.left
+	local right = _param.right
+	local top = _param.top
+	local bottom = _param.bottom
+	return React.createElement("uipadding", {
+		PaddingLeft = left or all,
+		PaddingRight = right or all,
+		PaddingTop = top or all,
+		PaddingBottom = bottom or all,
+	})
+end
+return {
+	Padding = Padding,
+}

package/out/components/ui/scrolling-frame.d.ts

@@ -0,0 +1,15 @@
+import { BindingOrValue } from "@rbxts/pretty-react-hooks";
+import React from "@rbxts/react";
+import { FrameProps } from "./frame";
+export interface ScrollingFrameProps extends FrameProps<ScrollingFrame> {
+    automaticSize?: React.InferEnumNames<Enum.AutomaticSize>;
+    automaticCanvasSize?: React.InferEnumNames<Enum.AutomaticSize>;
+    scrollingDirection?: React.InferEnumNames<Enum.ScrollingDirection>;
+    scrollBarThickness?: BindingOrValue<number>;
+    scrollBarColor?: BindingOrValue<Color3>;
+    scrollBarTransparency?: BindingOrValue<number>;
+    scrollingEnabled?: BindingOrValue<boolean>;
+    canvasSize?: BindingOrValue<UDim2>;
+    canvasPosition?: BindingOrValue<Vector2>;
+}
+export declare const ScrollingFrame: React.ForwardRefExoticComponent<Omit<ScrollingFrameProps, "ref"> & React.RefAttributes<ScrollingFrame>>;

package/out/components/ui/scrolling-frame.lua

@@ -0,0 +1,42 @@
+-- Compiled with roblox-ts v2.3.0-dev-26ec859
+local TS = _G[script]
+local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local React = _react
+local forwardRef = _react.forwardRef
+local ScrollingFrame = forwardRef(function(props, ref)
+	local _attributes = {
+		ref = ref,
+		AutomaticSize = props.automaticSize,
+		AutomaticCanvasSize = props.automaticCanvasSize,
+		ScrollingDirection = props.scrollingDirection,
+		ScrollBarThickness = props.scrollBarThickness,
+		ScrollBarImageColor3 = props.scrollBarColor,
+		ScrollBarImageTransparency = props.scrollBarTransparency,
+		ScrollingEnabled = props.scrollingEnabled,
+		CanvasSize = props.canvasSize,
+		CanvasPosition = props.canvasPosition,
+		Size = props.size,
+		Position = props.position,
+		AnchorPoint = props.anchorPoint,
+		Rotation = props.rotation,
+		BackgroundColor3 = props.backgroundColor,
+	}
+	local _condition = props.backgroundTransparency
+	if _condition == nil then
+		_condition = 1
+	end
+	_attributes.BackgroundTransparency = _condition
+	_attributes.ClipsDescendants = props.clipsDescendants
+	_attributes.Visible = props.visible
+	_attributes.ZIndex = props.zIndex
+	_attributes.LayoutOrder = props.layoutOrder
+	_attributes.BorderSizePixel = 0
+	_attributes.Event = props.event or {}
+	_attributes.Change = props.change or {}
+	return React.createElement("scrollingframe", _attributes, props.cornerRadius and React.createElement("uicorner", {
+		CornerRadius = props.cornerRadius,
+	}), props.children)
+end)
+return {
+	ScrollingFrame = ScrollingFrame,
+}

package/out/components/ui/shortcut-group.d.ts

@@ -0,0 +1,6 @@
+import { CommandShortcut } from "@rbxts/centurion";
+interface ShortcutGroupProps {
+    shortcuts?: CommandShortcut[];
+}
+export declare function ShortcutGroup(props: ShortcutGroupProps): JSX.Element;
+export {};