@rbxts/uiblox 0.1.53 → 0.2.0-alpha.0

package/out/ui/packages/colorPicker/components/colorValue.luau

@@ -0,0 +1,157 @@
+-- Compiled with roblox-ts v3.0.0
+local function finite(value)
+	return value == value and value ~= math.huge and value ~= -math.huge
+end
+local function channelToByte(unit)
+	return math.clamp(math.floor(unit * 255 + 0.5), 0, 255)
+end
+local function byteToUnit(byte)
+	return math.clamp(byte, 0, 255) / 255
+end
+local function rgbToHsv(r, g, b)
+	local max = math.max(r, g, b)
+	local min = math.min(r, g, b)
+	local delta = max - min
+	local h = 0
+	if delta ~= 0 then
+		if max == r then
+			h = ((g - b) / delta) % 6
+		elseif max == g then
+			h = (b - r) / delta + 2
+		else
+			h = (r - g) / delta + 4
+		end
+		h /= 6
+		if h < 0 then
+			h += 1
+		end
+	end
+	return {
+		h = h,
+		s = if max == 0 then 0 else delta / max,
+		v = max,
+	}
+end
+local function hsvToRgb(h, s, v)
+	local hue = ((h % 1) + 1) % 1
+	local c = v * s
+	local x = c * (1 - math.abs(((hue * 6) % 2) - 1))
+	local m = v - c
+	local r = 0
+	local g = 0
+	local b = 0
+	local sector = math.floor(hue * 6)
+	if sector == 0 then
+		r = c
+		g = x
+	elseif sector == 1 then
+		r = x
+		g = c
+	elseif sector == 2 then
+		g = c
+		b = x
+	elseif sector == 3 then
+		g = x
+		b = c
+	elseif sector == 4 then
+		r = x
+		b = c
+	else
+		r = c
+		b = x
+	end
+	return {
+		r = r + m,
+		g = g + m,
+		b = b + m,
+	}
+end
+local function hsvToColor3(h, s, v)
+	local rgb = hsvToRgb(h, s, v)
+	return Color3.new(rgb.r, rgb.g, rgb.b)
+end
+local function colorToHex(color)
+	local r = string.format("%02X", channelToByte(color.R))
+	local g = string.format("%02X", channelToByte(color.G))
+	local b = string.format("%02X", channelToByte(color.B))
+	return `#{r}{g}{b}`
+end
+local function parseHex(text)
+	local raw = text
+	if string.sub(raw, 1, 1) == "#" then
+		raw = string.sub(raw, 2)
+	end
+	if #raw == 3 then
+		local r = string.sub(raw, 1, 1)
+		local g = string.sub(raw, 2, 2)
+		local b = string.sub(raw, 3, 3)
+		raw = `{r}{r}{g}{g}{b}{b}`
+	end
+	if #raw ~= 6 then
+		return nil
+	end
+	local value = tonumber(raw, 16)
+	if value == nil or not finite(value) then
+		return nil
+	end
+	local r = math.floor(value / 65536) % 256
+	local g = math.floor(value / 256) % 256
+	local b = value % 256
+	return Color3.new(byteToUnit(r), byteToUnit(g), byteToUnit(b))
+end
+local function parseByte(text)
+	local value = tonumber(text)
+	if value == nil or not finite(value) then
+		return nil
+	end
+	if value < 0 or value > 255 or value % 1 ~= 0 then
+		return nil
+	end
+	return value
+end
+local function sameColor(a, b)
+	return a.R == b.R and a.G == b.G and a.B == b.B
+end
+local function resolveHsv(color, previous)
+	local hsv = rgbToHsv(color.R, color.G, color.B)
+	if hsv.s == 0 and previous ~= nil then
+		return {
+			h = previous.h,
+			s = hsv.s,
+			v = hsv.v,
+		}
+	end
+	return hsv
+end
+local RECENT_CAP = 8
+local recent = {}
+local function rememberColor(color)
+	local remembered = { color }
+	for _, existing in recent do
+		if not sameColor(existing, color) and #remembered < RECENT_CAP then
+			table.insert(remembered, existing)
+		end
+	end
+	recent = remembered
+end
+local function recentColors()
+	return recent
+end
+local function colorBytes(color)
+	return `{channelToByte(color.R)}, {channelToByte(color.G)}, {channelToByte(color.B)}`
+end
+return {
+	channelToByte = channelToByte,
+	byteToUnit = byteToUnit,
+	rgbToHsv = rgbToHsv,
+	hsvToRgb = hsvToRgb,
+	hsvToColor3 = hsvToColor3,
+	colorToHex = colorToHex,
+	parseHex = parseHex,
+	parseByte = parseByte,
+	sameColor = sameColor,
+	resolveHsv = resolveHsv,
+	rememberColor = rememberColor,
+	recentColors = recentColors,
+	colorBytes = colorBytes,
+}

package/out/ui/packages/colorPicker/components/sequenceValue.d.ts

@@ -0,0 +1,26 @@
+export interface ColorStop {
+    t: number;
+    color: Color3;
+}
+export interface NumberStop {
+    t: number;
+    value: number;
+    envelope: number;
+}
+export declare function lerpColor(a: Color3, b: Color3, alpha: number): Color3;
+export declare function readColorStops(sequence: ColorSequence): ColorStop[];
+export declare function writeColorStops(stops: ColorStop[]): ColorSequence;
+export declare function sampleColor(stops: ColorStop[], time: number): Color3;
+export declare function insertColorStop(stops: ColorStop[], time: number): ColorStop[];
+export declare function patchColorStop(stops: ColorStop[], index: number, patch: Partial<ColorStop>): ColorStop[];
+export declare function removeColorStop(stops: ColorStop[], index: number): ColorStop[];
+export declare function readNumberStops(sequence: NumberSequence): NumberStop[];
+export declare function writeNumberStops(stops: NumberStop[]): NumberSequence;
+export declare function sampleNumber(stops: NumberStop[], time: number): {
+    value: number;
+    envelope: number;
+};
+export declare function insertNumberStop(stops: NumberStop[], time: number): NumberStop[];
+export declare function patchNumberStop(stops: NumberStop[], index: number, patch: Partial<NumberStop>): NumberStop[];
+export declare function removeNumberStop(stops: NumberStop[], index: number): NumberStop[];
+export declare function hitStop(times: number[], alpha: number, threshold: number): number;

package/out/ui/packages/colorPicker/components/sequenceValue.luau

@@ -0,0 +1,307 @@
+-- Compiled with roblox-ts v3.0.0
+local function lerp(a, b, alpha)
+	return a + (b - a) * alpha
+end
+local function lerpColor(a, b, alpha)
+	return Color3.new(lerp(a.R, b.R, alpha), lerp(a.G, b.G, alpha), lerp(a.B, b.B, alpha))
+end
+local function insertOrdered(list, item, before)
+	local at = #list
+	for index = 0, #list - 1 do
+		if before(item, list[index + 1]) then
+			at = index
+			break
+		end
+	end
+	local _list = list
+	local _at = at
+	local _item = item
+	table.insert(_list, _at + 1, _item)
+	return list
+end
+local function sortColor(stops)
+	local copy = {}
+	for _, stop in stops do
+		insertOrdered(copy, stop, function(item, existing)
+			return item.t < existing.t
+		end)
+	end
+	return copy
+end
+local function sortNumber(stops)
+	local copy = {}
+	for _, stop in stops do
+		insertOrdered(copy, stop, function(item, existing)
+			return item.t < existing.t
+		end)
+	end
+	return copy
+end
+local function readColorStops(sequence)
+	local stops = {}
+	for _, key in sequence.Keypoints do
+		local _arg0 = {
+			t = key.Time,
+			color = key.Value,
+		}
+		table.insert(stops, _arg0)
+	end
+	return sortColor(stops)
+end
+local function writeColorStops(stops)
+	local ordered = sortColor(stops)
+	-- ▼ ReadonlyArray.map ▼
+	local _newValue = table.create(#ordered)
+	local _callback = function(stop)
+		return ColorSequenceKeypoint.new(stop.t, stop.color)
+	end
+	for _k, _v in ordered do
+		_newValue[_k] = _callback(_v, _k - 1, ordered)
+	end
+	-- ▲ ReadonlyArray.map ▲
+	local keys = _newValue
+	return ColorSequence.new(keys)
+end
+local function sampleColor(stops, time)
+	local ordered = sortColor(stops)
+	if #ordered == 0 then
+		return Color3.new()
+	end
+	local t = math.clamp(time, 0, 1)
+	if t <= ordered[1].t then
+		return ordered[1].color
+	end
+	for index = 1, #ordered - 1 do
+		local left = ordered[index]
+		local right = ordered[index + 1]
+		if t <= right.t then
+			local span = right.t - left.t
+			return lerpColor(left.color, right.color, if span == 0 then 0 else (t - left.t) / span)
+		end
+	end
+	return ordered[#ordered].color
+end
+local function insertColorStop(stops, time)
+	local t = math.clamp(time, 0, 1)
+	local updated = {}
+	for _, stop in stops do
+		table.insert(updated, stop)
+	end
+	local _arg0 = {
+		t = t,
+		color = sampleColor(stops, t),
+	}
+	table.insert(updated, _arg0)
+	return sortColor(updated)
+end
+local function patchColorStop(stops, index, patch)
+	local updated = {}
+	for i = 0, #stops - 1 do
+		local stop = stops[i + 1]
+		if i ~= index then
+			table.insert(updated, stop)
+			continue
+		end
+		local _result
+		if i == 0 then
+			_result = 0
+		else
+			local _result_1
+			if i == #stops - 1 then
+				_result_1 = 1
+			else
+				local _condition = patch.t
+				if _condition == nil then
+					_condition = stop.t
+				end
+				_result_1 = math.clamp(_condition, 0, 1)
+			end
+			_result = _result_1
+		end
+		local pinned = _result
+		local _arg0 = {
+			t = pinned,
+			color = patch.color or stop.color,
+		}
+		table.insert(updated, _arg0)
+	end
+	return sortColor(updated)
+end
+local function removeColorStop(stops, index)
+	if #stops <= 2 then
+		return stops
+	end
+	if index <= 0 or index >= #stops - 1 then
+		return stops
+	end
+	local updated = {}
+	for i = 0, #stops - 1 do
+		if i ~= index then
+			local _arg0 = stops[i + 1]
+			table.insert(updated, _arg0)
+		end
+	end
+	return updated
+end
+local function readNumberStops(sequence)
+	local stops = {}
+	for _, key in sequence.Keypoints do
+		local _arg0 = {
+			t = key.Time,
+			value = key.Value,
+			envelope = key.Envelope,
+		}
+		table.insert(stops, _arg0)
+	end
+	return sortNumber(stops)
+end
+local function writeNumberStops(stops)
+	local ordered = sortNumber(stops)
+	-- ▼ ReadonlyArray.map ▼
+	local _newValue = table.create(#ordered)
+	local _callback = function(stop)
+		return NumberSequenceKeypoint.new(stop.t, stop.value, stop.envelope)
+	end
+	for _k, _v in ordered do
+		_newValue[_k] = _callback(_v, _k - 1, ordered)
+	end
+	-- ▲ ReadonlyArray.map ▲
+	local keys = _newValue
+	return NumberSequence.new(keys)
+end
+local function sampleNumber(stops, time)
+	local ordered = sortNumber(stops)
+	if #ordered == 0 then
+		return {
+			value = 0,
+			envelope = 0,
+		}
+	end
+	local t = math.clamp(time, 0, 1)
+	if t <= ordered[1].t then
+		return {
+			value = ordered[1].value,
+			envelope = ordered[1].envelope,
+		}
+	end
+	for index = 1, #ordered - 1 do
+		local left = ordered[index]
+		local right = ordered[index + 1]
+		if t <= right.t then
+			local span = right.t - left.t
+			local alpha = if span == 0 then 0 else (t - left.t) / span
+			return {
+				value = lerp(left.value, right.value, alpha),
+				envelope = lerp(left.envelope, right.envelope, alpha),
+			}
+		end
+	end
+	local last = ordered[#ordered]
+	return {
+		value = last.value,
+		envelope = last.envelope,
+	}
+end
+local function insertNumberStop(stops, time)
+	local t = math.clamp(time, 0, 1)
+	local sampled = sampleNumber(stops, t)
+	local updated = {}
+	for _, stop in stops do
+		table.insert(updated, stop)
+	end
+	local _arg0 = {
+		t = t,
+		value = sampled.value,
+		envelope = sampled.envelope,
+	}
+	table.insert(updated, _arg0)
+	return sortNumber(updated)
+end
+local function patchNumberStop(stops, index, patch)
+	local updated = {}
+	for i = 0, #stops - 1 do
+		local stop = stops[i + 1]
+		if i ~= index then
+			table.insert(updated, stop)
+			continue
+		end
+		local _result
+		if i == 0 then
+			_result = 0
+		else
+			local _result_1
+			if i == #stops - 1 then
+				_result_1 = 1
+			else
+				local _condition = patch.t
+				if _condition == nil then
+					_condition = stop.t
+				end
+				_result_1 = math.clamp(_condition, 0, 1)
+			end
+			_result = _result_1
+		end
+		local pinned = _result
+		local _object = {
+			t = pinned,
+		}
+		local _left = "value"
+		local _condition = patch.value
+		if _condition == nil then
+			_condition = stop.value
+		end
+		_object[_left] = _condition
+		local _left_1 = "envelope"
+		local _condition_1 = patch.envelope
+		if _condition_1 == nil then
+			_condition_1 = stop.envelope
+		end
+		_object[_left_1] = _condition_1
+		table.insert(updated, _object)
+	end
+	return sortNumber(updated)
+end
+local function removeNumberStop(stops, index)
+	if #stops <= 2 then
+		return stops
+	end
+	if index <= 0 or index >= #stops - 1 then
+		return stops
+	end
+	local updated = {}
+	for i = 0, #stops - 1 do
+		if i ~= index then
+			local _arg0 = stops[i + 1]
+			table.insert(updated, _arg0)
+		end
+	end
+	return updated
+end
+local function hitStop(times, alpha, threshold)
+	local best = -1
+	local distance = threshold
+	for index = 0, #times - 1 do
+		local gap = math.abs(times[index + 1] - alpha)
+		if gap <= distance then
+			best = index
+			distance = gap
+		end
+	end
+	return best
+end
+return {
+	lerpColor = lerpColor,
+	readColorStops = readColorStops,
+	writeColorStops = writeColorStops,
+	sampleColor = sampleColor,
+	insertColorStop = insertColorStop,
+	patchColorStop = patchColorStop,
+	removeColorStop = removeColorStop,
+	readNumberStops = readNumberStops,
+	writeNumberStops = writeNumberStops,
+	sampleNumber = sampleNumber,
+	insertNumberStop = insertNumberStop,
+	patchNumberStop = patchNumberStop,
+	removeNumberStop = removeNumberStop,
+	hitStop = hitStop,
+}

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

@@ -0,0 +1,11 @@
+export { default as ColorPicker } from "./components/ColorPicker";
+export { ColorPickerProps } from "./components/ColorPicker";
+export { default as ColorSequenceEditor } from "./components/ColorSequenceEditor";
+export { ColorSequenceEditorProps } from "./components/ColorSequenceEditor";
+export { default as NumberSequenceEditor } from "./components/NumberSequenceEditor";
+export { NumberSequenceEditorProps } from "./components/NumberSequenceEditor";
+export { byteToUnit, channelToByte, colorToHex, hsvToColor3, hsvToRgb, parseByte, parseHex, resolveHsv, rgbToHsv, sameColor, } from "./components/colorValue";
+export { Hsv } from "./components/colorValue";
+export { hitStop, insertColorStop, insertNumberStop, lerpColor, patchColorStop, patchNumberStop, readColorStops, readNumberStops, removeColorStop, removeNumberStop, sampleColor, sampleNumber, writeColorStops, writeNumberStops, } from "./components/sequenceValue";
+export { ColorStop, NumberStop } from "./components/sequenceValue";
+export { colorBytes, recentColors, rememberColor } from "./components/colorValue";

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

@@ -0,0 +1,37 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local exports = {}
+exports.ColorPicker = TS.import(script, script, "components", "ColorPicker").default
+exports.ColorSequenceEditor = TS.import(script, script, "components", "ColorSequenceEditor").default
+exports.NumberSequenceEditor = TS.import(script, script, "components", "NumberSequenceEditor").default
+local _colorValue = TS.import(script, script, "components", "colorValue")
+exports.byteToUnit = _colorValue.byteToUnit
+exports.channelToByte = _colorValue.channelToByte
+exports.colorToHex = _colorValue.colorToHex
+exports.hsvToColor3 = _colorValue.hsvToColor3
+exports.hsvToRgb = _colorValue.hsvToRgb
+exports.parseByte = _colorValue.parseByte
+exports.parseHex = _colorValue.parseHex
+exports.resolveHsv = _colorValue.resolveHsv
+exports.rgbToHsv = _colorValue.rgbToHsv
+exports.sameColor = _colorValue.sameColor
+local _sequenceValue = TS.import(script, script, "components", "sequenceValue")
+exports.hitStop = _sequenceValue.hitStop
+exports.insertColorStop = _sequenceValue.insertColorStop
+exports.insertNumberStop = _sequenceValue.insertNumberStop
+exports.lerpColor = _sequenceValue.lerpColor
+exports.patchColorStop = _sequenceValue.patchColorStop
+exports.patchNumberStop = _sequenceValue.patchNumberStop
+exports.readColorStops = _sequenceValue.readColorStops
+exports.readNumberStops = _sequenceValue.readNumberStops
+exports.removeColorStop = _sequenceValue.removeColorStop
+exports.removeNumberStop = _sequenceValue.removeNumberStop
+exports.sampleColor = _sequenceValue.sampleColor
+exports.sampleNumber = _sequenceValue.sampleNumber
+exports.writeColorStops = _sequenceValue.writeColorStops
+exports.writeNumberStops = _sequenceValue.writeNumberStops
+local _colorValue_1 = TS.import(script, script, "components", "colorValue")
+exports.colorBytes = _colorValue_1.colorBytes
+exports.recentColors = _colorValue_1.recentColors
+exports.rememberColor = _colorValue_1.rememberColor
+return exports

package/out/ui/packages/dialog/components/Dialog.d.ts

@@ -0,0 +1,11 @@
+import React from "@rbxts/react";
+export interface DialogProps {
+    host?: Instance;
+    open: boolean;
+    title: string;
+    onClose: () => void;
+    children?: React.ReactNode;
+    actions?: React.ReactNode;
+}
+declare function Dialog(props: DialogProps): JSX.Element;
+export default Dialog;

package/out/ui/packages/dialog/components/Dialog.luau

@@ -0,0 +1,56 @@
+-- Compiled with roblox-ts v3.0.0
+local TS = _G[script]
+local React = TS.import(script, TS.getModule(script, "@rbxts", "react"))
+local Modal = TS.import(script, script.Parent.Parent.Parent, "modal").Modal
+local useDialogStyles = TS.import(script, script.Parent, "Dialog.styles").default
+local function Dialog(props)
+	local _binding = props
+	local host = _binding.host
+	local open = _binding.open
+	local title = _binding.title
+	local onClose = _binding.onClose
+	local children = _binding.children
+	local actions = _binding.actions
+	local styles = useDialogStyles()
+	local _attributes = {
+		key = "Column",
+	}
+	for _k, _v in styles.column do
+		_attributes[_k] = _v
+	end
+	local _attributes_1 = table.clone(styles.columnList)
+	setmetatable(_attributes_1, nil)
+	local _exp = React.createElement("uilistlayout", _attributes_1)
+	local _attributes_2 = {
+		key = "Title",
+	}
+	for _k, _v in styles.title do
+		_attributes_2[_k] = _v
+	end
+	_attributes_2.Text = title
+	local _exp_1 = React.createElement("textlabel", _attributes_2)
+	local _attributes_3 = {
+		key = "Body",
+	}
+	for _k, _v in styles.body do
+		_attributes_3[_k] = _v
+	end
+	local _exp_2 = React.createElement("frame", _attributes_3, children)
+	local _attributes_4 = {
+		key = "Actions",
+	}
+	for _k, _v in styles.actions do
+		_attributes_4[_k] = _v
+	end
+	local _attributes_5 = table.clone(styles.actionList)
+	setmetatable(_attributes_5, nil)
+	return React.createElement(Modal, {
+		host = host,
+		open = open,
+		onClose = onClose,
+	}, React.createElement("frame", _attributes, _exp, _exp_1, _exp_2, React.createElement("frame", _attributes_4, React.createElement("uilistlayout", _attributes_5), actions)))
+end
+local default = Dialog
+return {
+	default = default,
+}

package/out/ui/packages/dialog/components/Dialog.styles.d.ts

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

package/out/ui/packages/dialog/components/Dialog.styles.luau

@@ -0,0 +1,55 @@
+-- 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 useDialogStyles = componentStyles("Dialog", function(theme)
+	return createStyles({
+		column = {
+			AutomaticSize = Enum.AutomaticSize.XY,
+			Size = UDim2.fromOffset(theme.padding.calc(36), 0),
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+		},
+		columnList = {
+			FillDirection = Enum.FillDirection.Vertical,
+			Padding = UDim.new(0, theme.padding.calc(1)),
+			SortOrder = Enum.SortOrder.LayoutOrder,
+		},
+		title = {
+			LayoutOrder = 1,
+			AutomaticSize = Enum.AutomaticSize.XY,
+			Size = UDim2.fromScale(0, 0),
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+			Font = theme.typography.fontFamilies.default,
+			TextSize = theme.typography.fontSizes.h6,
+			TextColor3 = theme.palette.text.primary,
+			TextXAlignment = Enum.TextXAlignment.Left,
+		},
+		body = {
+			LayoutOrder = 2,
+			AutomaticSize = Enum.AutomaticSize.Y,
+			Size = UDim2.new(1, 0, 0, 0),
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+		},
+		actions = {
+			LayoutOrder = 3,
+			AutomaticSize = Enum.AutomaticSize.Y,
+			Size = UDim2.new(1, 0, 0, 0),
+			BackgroundTransparency = 1,
+			BorderSizePixel = 0,
+		},
+		actionList = {
+			FillDirection = Enum.FillDirection.Horizontal,
+			HorizontalAlignment = Enum.HorizontalAlignment.Right,
+			Padding = UDim.new(0, theme.padding.calc(1)),
+			SortOrder = Enum.SortOrder.LayoutOrder,
+		},
+	})
+end)
+local default = useDialogStyles
+return {
+	default = default,
+}

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

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

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

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

package/out/ui/packages/divider/components/Divider.luau

@@ -5,6 +5,7 @@ local useDividerStyles = TS.import(script, script.Parent, "Divider.styles").defa
 local function Divider(props)
 	local _binding = props
 	local className = _binding.className
+	local sx = _binding.sx
 	local id = _binding.id
 	local ref = _binding.ref
 	local _binding_1 = useDividerStyles(props)
@@ -25,6 +26,11 @@ local function Divider(props)
 			_attributes[_k] = _v
 		end
 	end
+	if sx ~= 0 and sx == sx and sx ~= "" and sx then
+		for _k, _v in sx do
+			_attributes[_k] = _v
+		end
+	end
 	return React.createElement("frame", _attributes)
 end
 local default = Divider