@rbxts/uiblox 0.1.53 → 0.2.0-alpha.0

package/out/ui/packages/slider/components/Slider.luau

@@ -0,0 +1,204 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local React = _react
+local useRef = _react.useRef
+local useState = _react.useState
+local cx = TS.import(script, script.Parent.Parent.Parent.Parent.Parent, "theme").cx
+local canActivate = TS.import(script, script.Parent.Parent.Parent, "button", "components", "activation").canActivate
+local commitNumber = TS.import(script, script.Parent.Parent.Parent, "numberInput", "components", "numberValue").commitNumber
+local useSliderStyles = TS.import(script, script.Parent, "Slider.styles").default
+local _sliderNudge = TS.import(script, script.Parent, "sliderNudge")
+local isSliderDrag = _sliderNudge.isSliderDrag
+local isSliderMove = _sliderNudge.isSliderMove
+local nudgeDelta = _sliderNudge.nudgeDelta
+local nudgeValue = _sliderNudge.nudgeValue
+local function Slider(props)
+	local _binding = props
+	local value = _binding.value
+	local onChange = _binding.onChange
+	local onCommit = _binding.onCommit
+	local min = _binding.min
+	local max = _binding.max
+	local step = _binding.step
+	local disabled = _binding.disabled
+	local size = _binding.size
+	local className = _binding.className
+	local sx = _binding.sx
+	local id = _binding.id
+	local ref = _binding.ref
+	local _binding_1 = useSliderStyles({
+		size = size,
+	})
+	local root = _binding_1.root
+	local track = _binding_1.track
+	local fill = _binding_1.fill
+	local knob = _binding_1.knob
+	local corner = _binding_1.corner
+	local stroke = _binding_1.stroke
+	local active = canActivate(disabled)
+	local focused, setFocused = useState(false)
+	local hovering, setHovering = useState(false)
+	local pressed, setPressed = useState(false)
+	local dragging = useRef(false)
+	local latest = useRef(value)
+	local ratio = if max > min then (math.clamp(value, min, max) - min) / (max - min) else 0
+	local faded = disabled == true
+	local showFocus = focused and active
+	local update = function(rbx, x)
+		local width = rbx.AbsoluteSize.X
+		if width <= 0 then
+			return nil
+		end
+		local committed = commitNumber(min + ((x - rbx.AbsolutePosition.X) / width) * (max - min), min, max, step)
+		if committed == nil or committed == latest.current then
+			return nil
+		end
+		latest.current = committed
+		onChange(committed)
+	end
+	local finish = function()
+		if not dragging.current then
+			return nil
+		end
+		dragging.current = false
+		setPressed(false)
+		if onCommit then
+			onCommit(latest.current)
+		end
+	end
+	local nudge = function(direction)
+		if not active then
+			return nil
+		end
+		local nudged = nudgeValue(value, min, max, step, direction)
+		if nudged == nil or nudged == value then
+			return nil
+		end
+		latest.current = nudged
+		onChange(nudged)
+		if onCommit then
+			onCommit(nudged)
+		end
+	end
+	local _attributes = {}
+	local _condition = id
+	if not (_condition ~= 0 and _condition == _condition and _condition ~= "" and _condition) then
+		_condition = "Slider"
+	end
+	_attributes.key = _condition
+	_attributes.ref = ref
+	for _k, _v in root do
+		_attributes[_k] = _v
+	end
+	if className then
+		for _k, _v in className do
+			_attributes[_k] = _v
+		end
+	end
+	if sx then
+		for _k, _v in sx do
+			_attributes[_k] = _v
+		end
+	end
+	_attributes.Active = active
+	_attributes.Selectable = active
+	_attributes.BackgroundTransparency = if showFocus then 0.85 else 1
+	_attributes.Event = {
+		InputBegan = function(rbx, input)
+			if not active then
+				return nil
+			end
+			local direction = nudgeDelta(input.KeyCode.Name)
+			if direction ~= nil then
+				nudge(direction)
+				return nil
+			end
+			if not isSliderDrag(input.UserInputType.Name) then
+				return nil
+			end
+			dragging.current = true
+			setPressed(true)
+			latest.current = value
+			update(rbx, input.Position.X)
+		end,
+		InputChanged = function(rbx, input)
+			if dragging.current and isSliderMove(input.UserInputType.Name) then
+				update(rbx, input.Position.X)
+			end
+		end,
+		InputEnded = function(_, input)
+			if isSliderDrag(input.UserInputType.Name) then
+				finish()
+			end
+		end,
+		MouseEnter = function()
+			if active then
+				setHovering(true)
+			end
+		end,
+		MouseLeave = function()
+			setHovering(false)
+			finish()
+		end,
+		SelectionGained = function()
+			return setFocused(true)
+		end,
+		SelectionLost = function()
+			return setFocused(false)
+		end,
+	}
+	local _attributes_1 = {
+		key = "Track",
+	}
+	for _k, _v in cx(track, {
+		BackgroundTransparency = if faded then 0.55 elseif hovering and active then 0.2 else 0.35,
+	}) do
+		_attributes_1[_k] = _v
+	end
+	local _attributes_2 = table.clone(corner)
+	setmetatable(_attributes_2, nil)
+	local _exp = React.createElement("uicorner", _attributes_2)
+	local _condition_1 = showFocus
+	if _condition_1 then
+		local _attributes_3 = table.clone(stroke)
+		setmetatable(_attributes_3, nil)
+		_condition_1 = React.createElement("uistroke", _attributes_3)
+	end
+	local _attributes_3 = {
+		key = "Fill",
+	}
+	for _k, _v in cx(fill, {
+		BackgroundTransparency = if faded then 0.55 elseif pressed then 0.1 else 0,
+	}) do
+		_attributes_3[_k] = _v
+	end
+	_attributes_3.Size = UDim2.fromScale(ratio, 1)
+	local _attributes_4 = table.clone(corner)
+	setmetatable(_attributes_4, nil)
+	local _exp_1 = React.createElement("frame", _attributes_3, React.createElement("uicorner", _attributes_4))
+	local _attributes_5 = {
+		key = "Knob",
+	}
+	for _k, _v in cx(knob, {
+		BackgroundTransparency = if faded then 0.45 else 0,
+	}) do
+		_attributes_5[_k] = _v
+	end
+	_attributes_5.Position = UDim2.fromScale(ratio, 0.5)
+	local _attributes_6 = table.clone(corner)
+	setmetatable(_attributes_6, nil)
+	local _exp_2 = React.createElement("uicorner", _attributes_6)
+	local _condition_2 = showFocus
+	if _condition_2 then
+		local _attributes_7 = table.clone(stroke)
+		setmetatable(_attributes_7, nil)
+		_attributes_7.Thickness = 1
+		_condition_2 = React.createElement("uistroke", _attributes_7)
+	end
+	return React.createElement("frame", _attributes, React.createElement("frame", _attributes_1, _exp, _condition_1, _exp_1, React.createElement("frame", _attributes_5, _exp_2, _condition_2)))
+end
+local default = Slider
+return {
+	default = default,
+}

package/out/ui/packages/slider/components/Slider.styles.d.ts

@@ -0,0 +1,6 @@
+import { ControlSize } from "../../../../theme/index";
+export interface SliderStyleProps {
+    size?: ControlSize;
+}
+declare const useSliderStyles: (props: SliderStyleProps) => import("../../../../theme/index").ClassNameMap<string>;
+export default useSliderStyles;

package/out/ui/packages/slider/components/Slider.styles.luau

@@ -0,0 +1,47 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local _theme = TS.import(script, script.Parent.Parent.Parent.Parent.Parent, "theme")
+local controlMetrics = _theme.controlMetrics
+local createStyles = _theme.createStyles
+local componentStyles = _theme.componentStyles
+local useSliderStyles = componentStyles("Slider", function(theme, _param)
+	local size = _param.size
+	local metrics = controlMetrics(theme.density, size)
+	return createStyles({
+		root = {
+			Size = UDim2.new(1, 0, 0, metrics.sliderHeight),
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+		},
+		track = {
+			Size = UDim2.new(1, 0, 0, metrics.sliderTrack),
+			Position = UDim2.fromScale(0, 0.5),
+			AnchorPoint = Vector2.new(0, 0.5),
+			BackgroundColor3 = theme.palette.action.disabled,
+			BorderSizePixel = 0,
+		},
+		fill = {
+			BackgroundColor3 = theme.palette.primary.main,
+			BorderSizePixel = 0,
+		},
+		knob = {
+			Size = UDim2.fromOffset(metrics.sliderKnob, metrics.sliderKnob),
+			AnchorPoint = Vector2.new(0.5, 0.5),
+			BackgroundColor3 = theme.palette.text.primary,
+			BorderSizePixel = 0,
+			ZIndex = 2,
+		},
+		corner = {
+			CornerRadius = UDim.new(1, 0),
+		},
+		stroke = {
+			Color = theme.palette.focus,
+			Thickness = 2,
+			ApplyStrokeMode = Enum.ApplyStrokeMode.Border,
+		},
+	})
+end)
+local default = useSliderStyles
+return {
+	default = default,
+}

package/out/ui/packages/slider/components/sliderNudge.d.ts

@@ -0,0 +1,4 @@
+export declare function nudgeDelta(key: string): number | undefined;
+export declare function nudgeValue(value: number, min: number, max: number, step: number | undefined, direction: number): number | undefined;
+export declare function isSliderDrag(kind: string): kind is "MouseButton1" | "Touch";
+export declare function isSliderMove(kind: string): kind is "MouseMovement" | "Touch";

package/out/ui/packages/slider/components/sliderNudge.luau

@@ -0,0 +1,39 @@
+-- Compiled with roblox-ts v3.0.0
+local function nudgeDelta(key)
+	if key == "Left" or key == "DPadLeft" or key == "ButtonL" then
+		return -1
+	end
+	if key == "Right" or key == "DPadRight" or key == "ButtonR" then
+		return 1
+	end
+	return nil
+end
+local function nudgeValue(value, min, max, step, direction)
+	local delta = if step ~= nil and step > 0 then step else (max - min) / 10
+	local result = value + direction * delta
+	if step ~= nil and step > 0 then
+		result = min + math.floor((result - min) / step + 0.5) * step
+	end
+	if result < min then
+		result = min
+	end
+	if result > max then
+		result = max
+	end
+	if result ~= result or result == math.huge or result == -math.huge then
+		return nil
+	end
+	return result
+end
+local function isSliderDrag(kind)
+	return kind == "MouseButton1" or kind == "Touch"
+end
+local function isSliderMove(kind)
+	return kind == "MouseMovement" or kind == "Touch"
+end
+return {
+	nudgeDelta = nudgeDelta,
+	nudgeValue = nudgeValue,
+	isSliderDrag = isSliderDrag,
+	isSliderMove = isSliderMove,
+}

package/out/ui/packages/slider/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Slider } from "./components/Slider";
+export { SliderProps } from "./components/Slider";

package/out/ui/packages/slider/init.luau

@@ -0,0 +1,5 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local exports = {}
+exports.Slider = TS.import(script, script, "components", "Slider").default
+return exports

package/out/ui/packages/snackbar/components/Snackbar.d.ts

@@ -0,0 +1,11 @@
+import { CustomizedProps } from "../../../../theme/index";
+import ToastVariants from "../../toast/enums/ToastVariants";
+export interface SnackbarProps {
+    message: string;
+    onDismiss: () => void;
+    duration?: number;
+    variant?: ToastVariants;
+    open?: boolean;
+}
+declare function Snackbar(props: CustomizedProps<Frame, SnackbarProps>): JSX.Element | undefined;
+export default Snackbar;

package/out/ui/packages/snackbar/components/Snackbar.luau

@@ -0,0 +1,41 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local React = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local Toast = TS.import(script, script.Parent.Parent.Parent, "toast").Toast
+local function Snackbar(props)
+	local _binding = props
+	local message = _binding.message
+	local onDismiss = _binding.onDismiss
+	local duration = _binding.duration
+	local variant = _binding.variant
+	local open = _binding.open
+	if open == nil then
+		open = true
+	end
+	local className = _binding.className
+	local sx = _binding.sx
+	local id = _binding.id
+	local ref = _binding.ref
+	if not open then
+		return nil
+	end
+	local _attributes = {
+		text = message,
+		onDismiss = onDismiss,
+		duration = duration,
+		variant = variant,
+		className = className,
+		sx = sx,
+	}
+	local _condition = id
+	if not (_condition ~= 0 and _condition == _condition and _condition ~= "" and _condition) then
+		_condition = "Snackbar"
+	end
+	_attributes.id = _condition
+	_attributes.ref = ref
+	return React.createElement(Toast, _attributes)
+end
+local default = Snackbar
+return {
+	default = default,
+}

package/out/ui/packages/snackbar/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Snackbar } from "./components/Snackbar";
+export { SnackbarProps } from "./components/Snackbar";

package/out/ui/packages/snackbar/init.luau

@@ -0,0 +1,5 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local exports = {}
+exports.Snackbar = TS.import(script, script, "components", "Snackbar").default
+return exports

package/out/ui/packages/splitPane/components/SplitPane.d.ts

@@ -0,0 +1,14 @@
+import React from "@rbxts/react";
+import { CustomizedProps } from "../../../../theme/index";
+export interface SplitPaneProps {
+    value: number;
+    onChange: (value: number) => void;
+    min?: number;
+    max?: number;
+    vertical?: boolean;
+    disabled?: boolean;
+    first?: React.ReactNode;
+    second?: React.ReactNode;
+}
+declare function SplitPane(props: CustomizedProps<Frame, SplitPaneProps>): JSX.Element;
+export default SplitPane;

package/out/ui/packages/splitPane/components/SplitPane.luau

@@ -0,0 +1,241 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local _react = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local React = _react
+local useEffect = _react.useEffect
+local useRef = _react.useRef
+local useState = _react.useState
+local useTheme = TS.import(script, script.Parent.Parent.Parent.Parent.Parent, "theme").useTheme
+local canActivate = TS.import(script, script.Parent.Parent.Parent, "button", "components", "activation").canActivate
+local useSplitPaneStyles = TS.import(script, script.Parent, "SplitPane.styles").default
+local _splitLook = TS.import(script, script.Parent, "splitLook")
+local splitHitTransparency = _splitLook.splitHitTransparency
+local splitMarkTransparency = _splitLook.splitMarkTransparency
+local splitPointer = _splitLook.splitPointer
+local splitRuleTransparency = _splitLook.splitRuleTransparency
+local _splitSize = TS.import(script, script.Parent, "splitSize")
+local clampSplit = _splitSize.clampSplit
+local splitBoxDims = _splitSize.splitBoxDims
+local splitRuleDims = _splitSize.splitRuleDims
+local toUDim2 = _splitSize.toUDim2
+local function SplitPane(props)
+	local _binding = props
+	local value = _binding.value
+	local onChange = _binding.onChange
+	local min = _binding.min
+	local max = _binding.max
+	local vertical = _binding.vertical
+	if vertical == nil then
+		vertical = false
+	end
+	local disabled = _binding.disabled
+	local first = _binding.first
+	local second = _binding.second
+	local className = _binding.className
+	local sx = _binding.sx
+	local id = _binding.id
+	local ref = _binding.ref
+	local styles = useSplitPaneStyles()
+	local _binding_1 = useTheme()
+	local theme = _binding_1.theme
+	local thickness = theme.padding.calc(3)
+	local active = canActivate(disabled)
+	local body, setBody = useState()
+	local total, setTotal = useState(0)
+	local dragging, setDragging = useState(false)
+	local hovering, setHovering = useState(false)
+	local start = useRef(value)
+	local axis = function(vector)
+		return if vertical then vector.Y else vector.X
+	end
+	local size = clampSplit(value, total - thickness, min, max)
+	local at = function(offset)
+		return if vertical then UDim2.fromOffset(0, offset) else UDim2.fromOffset(offset, 0)
+	end
+	local along = function(offset, scale)
+		if scale == nil then
+			scale = 0
+		end
+		return if vertical then UDim2.new(1, 0, scale, offset) else UDim2.new(scale, offset, 1, 0)
+	end
+	local pointer = splitPointer(hovering, dragging)
+	local markTransparency = splitMarkTransparency(pointer, disabled)
+	local ruleTransparency = splitRuleTransparency(pointer, disabled)
+	local markLen = theme.spacing.calc(2) + theme.padding.default
+	local markGap = theme.padding.default / 2
+	local markThick = theme.options.constants.borders.divider
+	local ruleThick = theme.options.constants.borders.default
+	local gripAcross = markThick * 3 + markGap * 2
+	useEffect(function()
+		if not body then
+			return nil
+		end
+		local measure = function()
+			return setTotal(axis(body.AbsoluteSize))
+		end
+		measure()
+		local connection = body:GetPropertyChangedSignal("AbsoluteSize"):Connect(measure)
+		return function()
+			return connection:Disconnect()
+		end
+	end, { body, vertical })
+	local _attributes = {}
+	local _condition = id
+	if not (_condition ~= 0 and _condition == _condition and _condition ~= "" and _condition) then
+		_condition = "SplitPane"
+	end
+	_attributes.key = _condition
+	_attributes.ref = ref
+	for _k, _v in styles.root do
+		_attributes[_k] = _v
+	end
+	if className then
+		for _k, _v in className do
+			_attributes[_k] = _v
+		end
+	end
+	if sx then
+		for _k, _v in sx do
+			_attributes[_k] = _v
+		end
+	end
+	local _attributes_1 = {
+		key = "Body",
+		ref = setBody,
+	}
+	for _k, _v in styles.body do
+		_attributes_1[_k] = _v
+	end
+	local _attributes_2 = {
+		key = "First",
+	}
+	for _k, _v in styles.pane do
+		_attributes_2[_k] = _v
+	end
+	_attributes_2.Size = along(size)
+	local _exp = React.createElement("frame", _attributes_2, first)
+	local _attributes_3 = {
+		key = "Divider",
+	}
+	for _k, _v in styles.divider do
+		_attributes_3[_k] = _v
+	end
+	_attributes_3.Position = at(size)
+	_attributes_3.Size = along(thickness)
+	_attributes_3.BackgroundTransparency = splitHitTransparency(pointer, disabled)
+	_attributes_3.Active = active
+	_attributes_3.Event = {
+		InputBegan = function(_, input)
+			if not active or input.UserInputType ~= Enum.UserInputType.MouseButton1 then
+				return nil
+			end
+			start.current = size
+			setDragging(true)
+		end,
+		MouseEnter = function()
+			if active then
+				setHovering(true)
+			end
+		end,
+		MouseLeave = function()
+			return setHovering(false)
+		end,
+	}
+	local _attributes_4 = {
+		key = "Rule",
+	}
+	for _k, _v in styles.rule do
+		_attributes_4[_k] = _v
+	end
+	_attributes_4.Size = toUDim2(splitRuleDims(vertical, ruleThick))
+	_attributes_4.BackgroundTransparency = ruleTransparency
+	local _exp_1 = React.createElement("frame", _attributes_4)
+	local _attributes_5 = {
+		key = "Grip",
+	}
+	for _k, _v in styles.grip do
+		_attributes_5[_k] = _v
+	end
+	_attributes_5.Size = toUDim2(splitBoxDims(vertical, markLen, gripAcross))
+	local _exp_2 = React.createElement("uilistlayout", {
+		key = "GripLayout",
+		FillDirection = if vertical then Enum.FillDirection.Vertical else Enum.FillDirection.Horizontal,
+		HorizontalAlignment = Enum.HorizontalAlignment.Center,
+		VerticalAlignment = Enum.VerticalAlignment.Center,
+		Padding = UDim.new(0, markGap),
+		SortOrder = Enum.SortOrder.LayoutOrder,
+	})
+	local _exp_3 = { 1, 2, 3 }
+	-- ▼ ReadonlyArray.map ▼
+	local _newValue = table.create(#_exp_3)
+	local _callback = function(index)
+		local _attributes_6 = {
+			key = `Mark{index}`,
+		}
+		for _k, _v in styles.mark do
+			_attributes_6[_k] = _v
+		end
+		_attributes_6.LayoutOrder = index
+		_attributes_6.Size = toUDim2(splitBoxDims(vertical, markLen, markThick))
+		_attributes_6.BackgroundTransparency = markTransparency
+		return React.createElement("frame", _attributes_6)
+	end
+	for _k, _v in _exp_3 do
+		_newValue[_k] = _callback(_v, _k - 1, _exp_3)
+	end
+	-- ▲ ReadonlyArray.map ▲
+	local _exp_4 = React.createElement("frame", _attributes_3, _exp_1, React.createElement("frame", _attributes_5, _exp_2, _newValue))
+	local _attributes_6 = {
+		key = "Second",
+	}
+	for _k, _v in styles.pane do
+		_attributes_6[_k] = _v
+	end
+	_attributes_6.Position = at(size + thickness)
+	_attributes_6.Size = along(-size - thickness, 1)
+	local _exp_5 = React.createElement("frame", _attributes_6, second)
+	local _condition_1 = dragging and active
+	if _condition_1 then
+		local _attributes_7 = {
+			key = "Overlay",
+		}
+		for _k, _v in styles.overlay do
+			_attributes_7[_k] = _v
+		end
+		_attributes_7.Event = {
+			InputChanged = function(rbx, input)
+				if input.UserInputType ~= Enum.UserInputType.MouseMovement then
+					return nil
+				end
+				local alongPointer = axis(input.Position) - axis(rbx.AbsolutePosition) - thickness / 2
+				local resized = clampSplit(alongPointer, total - thickness, min, max)
+				if resized ~= value then
+					onChange(resized)
+				end
+			end,
+			InputBegan = function(_, input)
+				if input.KeyCode ~= Enum.KeyCode.Escape then
+					return nil
+				end
+				setDragging(false)
+				if start.current ~= value then
+					onChange(start.current)
+				end
+			end,
+			InputEnded = function(_, input)
+				if input.UserInputType == Enum.UserInputType.MouseButton1 then
+					setDragging(false)
+				end
+			end,
+			MouseLeave = function()
+				return setDragging(false)
+			end,
+		}
+		_condition_1 = (React.createElement("frame", _attributes_7))
+	end
+	return React.createElement("frame", _attributes, React.createElement("frame", _attributes_1, _exp, _exp_4, _exp_5, _condition_1))
+end
+local default = SplitPane
+return {
+	default = default,
+}

package/out/ui/packages/splitPane/components/SplitPane.styles.d.ts

@@ -0,0 +1,2 @@
+declare const useSplitPaneStyles: () => import("../../../../theme/index").ClassNameMap<string>;
+export default useSplitPaneStyles;

package/out/ui/packages/splitPane/components/SplitPane.styles.luau

@@ -0,0 +1,59 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local _theme = TS.import(script, script.Parent.Parent.Parent.Parent.Parent, "theme")
+local createStyles = _theme.createStyles
+local componentStyles = _theme.componentStyles
+local useSplitPaneStyles = componentStyles("SplitPane", function(theme)
+	return createStyles({
+		root = {
+			Size = UDim2.fromScale(1, 1),
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+		},
+		body = {
+			Size = UDim2.fromScale(1, 1),
+			BackgroundColor3 = theme.palette.surface.paper,
+			BackgroundTransparency = 0,
+			BorderSizePixel = 0,
+		},
+		pane = {
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+			ClipsDescendants = true,
+		},
+		divider = {
+			BackgroundColor3 = theme.palette.text.primary,
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+			Active = true,
+			ZIndex = 5,
+		},
+		rule = {
+			BackgroundColor3 = theme.palette.divider,
+			BorderSizePixel = 0,
+			AnchorPoint = Vector2.new(0.5, 0.5),
+			Position = UDim2.fromScale(0.5, 0.5),
+		},
+		grip = {
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+			AnchorPoint = Vector2.new(0.5, 0.5),
+			Position = UDim2.fromScale(0.5, 0.5),
+		},
+		mark = {
+			BackgroundColor3 = theme.palette.text.secondary,
+			BorderSizePixel = 0,
+		},
+		overlay = {
+			Size = UDim2.fromScale(1, 1),
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+			Active = true,
+			ZIndex = 20000,
+		},
+	})
+end)
+local default = useSplitPaneStyles
+return {
+	default = default,
+}