@rbxts/uiblox 0.1.0

package/out/theme/interfaces/typography/FontFamilies.lua

@@ -0,0 +1,11 @@
+-- Compiled with roblox-ts v2.2.0
+local allFontFamilies = {
+	default = Enum.Font.SourceSans,
+	bold = Enum.Font.SourceSansBold,
+	semibold = Enum.Font.SourceSansSemibold,
+	light = Enum.Font.SourceSansLight,
+	italics = Enum.Font.SourceSansItalic,
+}
+return {
+	allFontFamilies = allFontFamilies,
+}

package/out/theme/interfaces/typography/FontFamilyOptions.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="@rbxts/compiler-types" />
+/// <reference types="@rbxts/types" />
+export type FontFamilyVariant = "default" | "bold" | "semibold" | "light" | "italics";
+export interface FontFamilyOptions extends Partial<Record<FontFamilyVariant, Required<Enum.Font>>> {
+}

package/out/theme/interfaces/typography/FontFamilyOptions.lua

@@ -0,0 +1,2 @@
+-- Compiled with roblox-ts v2.2.0
+return nil

package/out/theme/interfaces/typography/FontSizeOptions.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="@rbxts/compiler-types" />
+export type FontSizeVariant = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body" | "caption" | "button" | "overline";
+export interface FontSizeOptions extends Partial<Record<FontSizeVariant, Required<number>>> {
+}

package/out/theme/interfaces/typography/FontSizeOptions.lua

@@ -0,0 +1,2 @@
+-- Compiled with roblox-ts v2.2.0
+return nil

package/out/theme/interfaces/typography/FontSizes.d.ts

@@ -0,0 +1,3 @@
+import { FontSizeOptions } from "./FontSizeOptions";
+export declare const baseFontSize = 16;
+export declare const allFontSizes: FontSizeOptions;

package/out/theme/interfaces/typography/FontSizes.lua

@@ -0,0 +1,15 @@
+-- Compiled with roblox-ts v2.2.0
+local baseFontSize = 16
+local allFontSizes = {
+	h1 = baseFontSize * 2,
+	h2 = baseFontSize * 1.5,
+	h3 = baseFontSize * 1.25,
+	body = baseFontSize,
+	caption = baseFontSize * 0.75,
+	overline = baseFontSize * 0.625,
+	button = baseFontSize * 0.875,
+}
+return {
+	baseFontSize = baseFontSize,
+	allFontSizes = allFontSizes,
+}

package/out/theme/interfaces/typography/ThemeTypography.d.ts

@@ -0,0 +1,7 @@
+import { FontFamilyOptions } from "./FontFamilyOptions";
+import { FontSizeOptions } from "./FontSizeOptions";
+interface ThemeTypography {
+    fontSizes: FontSizeOptions;
+    fontFamilies: FontFamilyOptions;
+}
+export default ThemeTypography;

package/out/theme/interfaces/typography/ThemeTypography.lua

@@ -0,0 +1,2 @@
+-- Compiled with roblox-ts v2.2.0
+return nil

package/out/theme/interfaces/typography/Variants.d.ts

@@ -0,0 +1,18 @@
+import { Tokens } from "../tokens/Tokens";
+export type TypographyTokens = {
+    [key in Tokens]: string;
+};
+export interface TypographyWeights {
+    title: number;
+    heading: number;
+    body: number;
+    xl?: number;
+    lg?: number;
+    md?: number;
+    sm?: number;
+    xs?: number;
+    default?: number;
+}
+export type TypographyVariants = keyof TypographyWeights;
+export declare const TypographyWeights: TypographyWeights;
+export declare const TypographyTokens: TypographyTokens;

package/out/theme/interfaces/typography/Variants.lua

@@ -0,0 +1,24 @@
+-- Compiled with roblox-ts v2.2.0
+local TypographyWeights = {
+	title = 800,
+	heading = 500,
+	body = 300,
+}
+local TypographyTokens = {
+	[120] = "64px",
+	[110] = "48px",
+	[100] = "40px",
+	[90] = "32px",
+	[80] = "28px",
+	[70] = "24px",
+	[60] = "20px",
+	[50] = "18px",
+	[40] = "16px",
+	[30] = "14px",
+	[20] = "12px",
+	[10] = "10px",
+}
+return {
+	TypographyTokens = TypographyTokens,
+	TypographyWeights = TypographyWeights,
+}

package/out/theme/interfaces/typography/index.d.ts

@@ -0,0 +1,8 @@
+export { default as ThemeTypography } from "./ThemeTypography";
+export * from "./FontSizes";
+export * from "./FontFamilies";
+export { FontSizeVariant } from "./FontSizeOptions";
+export { FontSizeOptions } from "./FontSizeOptions";
+export { FontFamilyVariant } from "./FontFamilyOptions";
+export { FontFamilyOptions } from "./FontFamilyOptions";
+export * from "./Variants";

package/out/theme/interfaces/typography/init.lua

@@ -0,0 +1,13 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local exports = {}
+for _k, _v in TS.import(script, script, "FontSizes") or {} do
+	exports[_k] = _v
+end
+for _k, _v in TS.import(script, script, "FontFamilies") or {} do
+	exports[_k] = _v
+end
+for _k, _v in TS.import(script, script, "Variants") or {} do
+	exports[_k] = _v
+end
+return exports

package/out/theme/styles/index.d.ts

@@ -0,0 +1,5 @@
+export { ClassNameMap } from "./types";
+export { WriteableStyle } from "./types";
+export { createStyles } from "./utilities";
+export { makeStyles } from "./utilities";
+export { classNames } from "./utilities";

package/out/theme/styles/init.lua

@@ -0,0 +1,7 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local exports = {}
+exports.createStyles = TS.import(script, script, "utilities").createStyles
+exports.makeStyles = TS.import(script, script, "utilities").makeStyles
+exports.classNames = TS.import(script, script, "utilities").classNames
+return exports

package/out/theme/styles/types/WriteableStyle.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="@rbxts/types" />
+/// <reference types="@rbxts/compiler-types" />
+export type WriteableStyle<T extends Instance> = Partial<WritableInstanceProperties<T>>;

package/out/theme/styles/types/WriteableStyle.lua

@@ -0,0 +1,2 @@
+-- Compiled with roblox-ts v2.2.0
+return nil

package/out/theme/styles/types/index.d.ts

@@ -0,0 +1,2 @@
+export { ClassNameMap } from "./styles";
+export { WriteableStyle } from "./WriteableStyle";

package/out/theme/styles/types/init.lua

@@ -0,0 +1,2 @@
+-- Compiled with roblox-ts v2.2.0
+return nil

package/out/theme/styles/types/styles.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="@rbxts/types" />
+/// <reference types="@rbxts/compiler-types" />
+import { WriteableStyle } from "./WriteableStyle";
+export type ClassNameMap<ClassKey extends string = string, T extends Instance = Instance> = Record<ClassKey, Partial<WriteableStyle<T>>>;

package/out/theme/styles/types/styles.lua

@@ -0,0 +1,2 @@
+-- Compiled with roblox-ts v2.2.0
+return nil

package/out/theme/styles/utilities/classNames.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="@rbxts/compiler-types" />
+import { WriteableStyle } from "../types/WriteableStyle";
+export type GenericStyle = {
+    [property: string]: boolean;
+};
+export type ConditionalStyles = Map<WriteableStyle<any>, boolean>;
+declare const classNames: (styles: ConditionalStyles) => GenericStyle;
+export default classNames;

package/out/theme/styles/utilities/classNames.lua

@@ -0,0 +1,31 @@
+-- Compiled with roblox-ts v2.2.0
+-- eslint-disable-next-line @typescript-eslint/no-explicit-any
+local classNames = function(styles)
+	-- eslint-disable-next-line @typescript-eslint/no-explicit-any
+	local style = {}
+	local _styles = styles
+	local _arg0 = function(value, key)
+		if value then
+			local _object = {}
+			for _k, _v in style do
+				_object[_k] = _v
+			end
+			for _k, _v in key do
+				_object[_k] = _v
+			end
+			style = _object
+		end
+	end
+	for _k, _v in _styles do
+		_arg0(_v, _k, _styles)
+	end
+	local _object = {}
+	for _k, _v in style do
+		_object[_k] = _v
+	end
+	return _object
+end
+local default = classNames
+return {
+	default = default,
+}

package/out/theme/styles/utilities/createStyles.d.ts

@@ -0,0 +1,3 @@
+import { ClassNameMap } from "../types/styles";
+declare const createStyles: <ClassKey extends string = string>(styles: ClassNameMap<ClassKey>) => ClassNameMap<ClassKey>;
+export default createStyles;

package/out/theme/styles/utilities/createStyles.lua

@@ -0,0 +1,8 @@
+-- Compiled with roblox-ts v2.2.0
+local createStyles = function(styles)
+	return styles
+end
+local default = createStyles
+return {
+	default = default,
+}

package/out/theme/styles/utilities/index.d.ts

@@ -0,0 +1,3 @@
+export { default as createStyles } from "./createStyles";
+export { default as makeStyles } from "./makeStyles";
+export { default as classNames } from "./classNames";

package/out/theme/styles/utilities/init.lua

@@ -0,0 +1,7 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local exports = {}
+exports.createStyles = TS.import(script, script, "createStyles").default
+exports.makeStyles = TS.import(script, script, "makeStyles").default
+exports.classNames = TS.import(script, script, "classNames").default
+return exports

package/out/theme/styles/utilities/makeStyles.d.ts

@@ -0,0 +1,7 @@
+import { Theme } from "../../interfaces/theme";
+import { ClassNameMap } from "../types/styles";
+type TMakeStyles<ClassKey extends string = string> = (theme: Theme) => ClassNameMap<ClassKey>;
+type TMakeStylesWithProps<Props, ClassKey extends string = string> = (theme: Theme, props: Props) => ClassNameMap<ClassKey>;
+type TVariantF<Props> = keyof Props extends never ? TMakeStyles : TMakeStylesWithProps<Props>;
+declare const makeStyles: <Props = {}, ClassKey extends string = string>(f: TVariantF<Props>) => keyof Props extends never ? () => ClassNameMap<ClassKey> : (props: Props) => ClassNameMap<ClassKey>;
+export default makeStyles;

package/out/theme/styles/utilities/makeStyles.lua

@@ -0,0 +1,32 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local DefaultTheme = TS.import(script, script.Parent.Parent.Parent, "themes").default
+local themeStore = TS.import(script, script.Parent.Parent.Parent, "components", "ThemeStore").themeStore
+local makeStyles = function(f)
+	return function(props)
+		local _exitType, _returns = TS.try(function()
+			local theme = themeStore:getState().theme
+			local _fn = f
+			local _exp = theme or DefaultTheme
+			local _condition = props
+			if _condition == nil then
+				_condition = {}
+			end
+			return TS.TRY_RETURN, { _fn(_exp, _condition) }
+		end, function(e)
+			local _fn = f
+			local _condition = props
+			if _condition == nil then
+				_condition = {}
+			end
+			return TS.TRY_RETURN, { _fn(DefaultTheme, _condition) }
+		end)
+		if _exitType then
+			return unpack(_returns)
+		end
+	end
+end
+local default = makeStyles
+return {
+	default = default,
+}

package/out/theme/themes/DarkTheme.d.ts

@@ -0,0 +1,3 @@
+import { Theme } from "../interfaces/theme";
+declare const DarkTheme: Theme;
+export default DarkTheme;

package/out/theme/themes/DarkTheme.lua

@@ -0,0 +1,99 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local allFontSizes = TS.import(script, script.Parent.Parent, "interfaces", "typography", "FontSizes").allFontSizes
+local _colors = TS.import(script, script.Parent.Parent, "interfaces", "palette", "colors")
+local Blue = _colors.Blue
+local Gray = _colors.Gray
+local Dark = _colors.Dark
+local Light = _colors.Light
+local Common = _colors.Common
+local Red = _colors.Red
+local Green = _colors.Green
+local Yellow = _colors.Yellow
+local Purple = _colors.Purple
+local Magenta = _colors.Magenta
+local Orange = _colors.Orange
+local Turquoise = _colors.Turquoise
+local _constants = TS.import(script, script.Parent.Parent, "constants")
+local BORDER_RADIUS = _constants.BORDER_RADIUS
+local DARK_THEME_COLORS = _constants.DARK_THEME_COLORS
+local PADDING_BASE = _constants.PADDING_BASE
+local SPACING_BASE = _constants.SPACING_BASE
+local CONTENT_WIDTH = _constants.CONTENT_WIDTH
+local ICON_SIZES = _constants.ICON_SIZES
+local DEFAULT_BORDERS = _constants.DEFAULT_BORDERS
+local allFontFamilies = TS.import(script, script.Parent.Parent, "interfaces", "typography", "FontFamilies").allFontFamilies
+local DarkTheme = {
+	type = "Dark",
+	palette = {
+		error = {
+			main = Red[50],
+		},
+		primary = {
+			main = Green[50],
+		},
+		secondary = {
+			main = Blue[50],
+		},
+		success = {
+			main = Green[50],
+		},
+		text = {
+			primary = Common.White,
+			secondary = Dark[70],
+		},
+		divider = Gray[70],
+		background = {
+			default = Common.Black,
+			paper = Gray[90],
+		},
+		warning = {
+			main = Yellow[50],
+		},
+	},
+	spacing = {
+		default = SPACING_BASE,
+		calc = function(value)
+			return SPACING_BASE * value
+		end,
+	},
+	padding = {
+		default = PADDING_BASE,
+		calc = function(value)
+			return PADDING_BASE * value
+		end,
+	},
+	shape = {
+		borderRadius = BORDER_RADIUS,
+	},
+	typography = {
+		fontSizes = allFontSizes,
+		fontFamilies = allFontFamilies,
+	},
+	options = {
+		constants = {
+			contentWidth = CONTENT_WIDTH,
+			iconSizes = ICON_SIZES,
+			colors = DARK_THEME_COLORS,
+			borders = DEFAULT_BORDERS,
+			extendedPalette = {
+				Blue = Blue,
+				Common = Common,
+				Dark = Dark,
+				Gray = Gray,
+				Green = Green,
+				Light = Light,
+				Magenta = Magenta,
+				Orange = Orange,
+				Purple = Purple,
+				Red = Red,
+				Turquoise = Turquoise,
+				Yellow = Yellow,
+			},
+		},
+	},
+}
+local default = DarkTheme
+return {
+	default = default,
+}

package/out/theme/themes/LightTheme.d.ts

@@ -0,0 +1,3 @@
+import { Theme } from "../interfaces/theme";
+declare const LightTheme: Theme;
+export default LightTheme;

package/out/theme/themes/LightTheme.lua

@@ -0,0 +1,99 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local allFontSizes = TS.import(script, script.Parent.Parent, "interfaces", "typography", "FontSizes").allFontSizes
+local _colors = TS.import(script, script.Parent.Parent, "interfaces", "palette", "colors")
+local Blue = _colors.Blue
+local Gray = _colors.Gray
+local Dark = _colors.Dark
+local Light = _colors.Light
+local Common = _colors.Common
+local Red = _colors.Red
+local Green = _colors.Green
+local Yellow = _colors.Yellow
+local Purple = _colors.Purple
+local Magenta = _colors.Magenta
+local Orange = _colors.Orange
+local Turquoise = _colors.Turquoise
+local _constants = TS.import(script, script.Parent.Parent, "constants")
+local BORDER_RADIUS = _constants.BORDER_RADIUS
+local PADDING_BASE = _constants.PADDING_BASE
+local SPACING_BASE = _constants.SPACING_BASE
+local CONTENT_WIDTH = _constants.CONTENT_WIDTH
+local ICON_SIZES = _constants.ICON_SIZES
+local DEFAULT_BORDERS = _constants.DEFAULT_BORDERS
+local LIGHT_THEME_COLORS = _constants.LIGHT_THEME_COLORS
+local allFontFamilies = TS.import(script, script.Parent.Parent, "interfaces", "typography", "FontFamilies").allFontFamilies
+local LightTheme = {
+	type = "Light",
+	palette = {
+		error = {
+			main = Red[50],
+		},
+		primary = {
+			main = Green[50],
+		},
+		secondary = {
+			main = Blue[50],
+		},
+		success = {
+			main = Green[50],
+		},
+		text = {
+			primary = Common.Black,
+			secondary = Dark[90],
+		},
+		divider = Gray[70],
+		background = {
+			default = Common.White,
+			paper = Gray[10],
+		},
+		warning = {
+			main = Yellow[50],
+		},
+	},
+	spacing = {
+		default = SPACING_BASE,
+		calc = function(value)
+			return SPACING_BASE * value
+		end,
+	},
+	padding = {
+		default = PADDING_BASE,
+		calc = function(value)
+			return PADDING_BASE * value
+		end,
+	},
+	shape = {
+		borderRadius = BORDER_RADIUS,
+	},
+	typography = {
+		fontSizes = allFontSizes,
+		fontFamilies = allFontFamilies,
+	},
+	options = {
+		constants = {
+			contentWidth = CONTENT_WIDTH,
+			iconSizes = ICON_SIZES,
+			colors = LIGHT_THEME_COLORS,
+			borders = DEFAULT_BORDERS,
+			extendedPalette = {
+				Blue = Blue,
+				Common = Common,
+				Dark = Dark,
+				Gray = Gray,
+				Green = Green,
+				Light = Light,
+				Magenta = Magenta,
+				Orange = Orange,
+				Purple = Purple,
+				Red = Red,
+				Turquoise = Turquoise,
+				Yellow = Yellow,
+			},
+		},
+	},
+}
+local default = LightTheme
+return {
+	default = default,
+}

package/out/theme/themes/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from "./DarkTheme";
+export { default as DarkTheme } from "./DarkTheme";
+export { default as LightTheme } from "./LightTheme";

package/out/theme/themes/init.lua

@@ -0,0 +1,7 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local exports = {}
+exports.default = TS.import(script, script, "DarkTheme").default
+exports.DarkTheme = TS.import(script, script, "DarkTheme").default
+exports.LightTheme = TS.import(script, script, "LightTheme").default
+return exports

package/out/theme/types/index.d.ts

@@ -0,0 +1,7 @@
+export { CommonProps } from "./types";
+export { BaseDefaultProps } from "./types";
+export { BaseCustomizedProps } from "./types";
+export { DefaultProps } from "./types";
+export { CustomizedProps } from "./types";
+export { CustomizedRef } from "./types";
+export { CustomizedForwardRefComponent } from "./types";

package/out/theme/types/init.lua

@@ -0,0 +1,2 @@
+-- Compiled with roblox-ts v2.2.0
+return nil

package/out/theme/types/types.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="@rbxts/types" />
+/// <reference types="roact" />
+/// <reference types="@rbxts/compiler-types" />
+import Roact, { Element, PropsWithChildren } from "@rbxts/roact";
+import { WriteableStyle } from "../interfaces";
+export interface CommonProps<T extends Instance> extends PropsWithChildren {
+    className?: WriteableStyle<T>;
+}
+export type BaseDefaultProps<T extends Instance, P> = CommonProps<T> & P;
+export type BaseCustomizedProps<T extends Instance, P> = BaseDefaultProps<T, P> & PropsWithChildren<{
+    component?: T;
+}>;
+export type DefaultProps<T extends Instance, P = {}> = BaseDefaultProps<T, P>;
+export type CustomizedProps<T extends Instance, P = {}> = BaseCustomizedProps<T, P>;
+export type CustomizedRef<T extends Instance> = T extends Instance ? any : T extends keyof Roact.JsxInstance<T> ? WritableInstanceProperties<T> : never;
+export type CustomizedForwardRefComponent<D extends Instance, P = {}> = <T extends Instance = D>(props: PropsWithChildren<CustomizedProps<T, P>> & WritableInstanceProperties<CustomizedRef<T>>) => Element | undefined;

package/out/theme/types/types.lua

@@ -0,0 +1,3 @@
+-- Compiled with roblox-ts v2.2.0
+-- eslint-disable @typescript-eslint/no-explicit-any 
+return nil

package/out/theme/utilites/Color3FromHex.d.ts

@@ -0,0 +1,2 @@
+declare const Color3FromHex: (hex: string) => Color3;
+export default Color3FromHex;

package/out/theme/utilites/Color3FromHex.lua

@@ -0,0 +1,14 @@
+-- Compiled with roblox-ts v2.2.0
+local Color3FromHex = function(hex)
+	local hextStr, _ = string.gsub(hex, "#", "")
+	local bigint = tonumber(hextStr, 16)
+	assert(bigint ~= 0 and (bigint == bigint and bigint), "Color3FromHex: Invalid hex value")
+	local r = bit32.band((bit32.arshift(bigint, 16)), 255)
+	local g = bit32.band((bit32.arshift(bigint, 8)), 255)
+	local b = bit32.band(bigint, 255)
+	return Color3.fromRGB(r, g, b)
+end
+local default = Color3FromHex
+return {
+	default = default,
+}

package/out/theme/utilites/index.d.ts

@@ -0,0 +1 @@
+export { default as Color3FromHex } from "./Color3FromHex";

package/out/theme/utilites/init.lua

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

package/out/ui/constants/ImageConstants.d.ts

@@ -0,0 +1,2 @@
+export declare const PRELOADER_LOGO_IMAGE = "rbxassetid://8972054582";
+export declare const PAGE_NOT_FOUND_IMAGE = "rbxassetid://9058373693";

package/out/ui/constants/ImageConstants.lua

@@ -0,0 +1,7 @@
+-- Compiled with roblox-ts v2.2.0
+local PRELOADER_LOGO_IMAGE = "rbxassetid://8972054582"
+local PAGE_NOT_FOUND_IMAGE = "rbxassetid://9058373693"
+return {
+	PRELOADER_LOGO_IMAGE = PRELOADER_LOGO_IMAGE,
+	PAGE_NOT_FOUND_IMAGE = PAGE_NOT_FOUND_IMAGE,
+}

package/out/ui/constants/LayoutConstants.d.ts

@@ -0,0 +1 @@
+export declare const ROBLOX_UI_OFFSET: number;

package/out/ui/constants/LayoutConstants.lua

@@ -0,0 +1,7 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local DefaultTheme = TS.import(script, script.Parent.Parent.Parent, "theme").DefaultTheme
+local ROBLOX_UI_OFFSET = DefaultTheme.spacing.calc(2) + DefaultTheme.padding.calc(4)
+return {
+	ROBLOX_UI_OFFSET = ROBLOX_UI_OFFSET,
+}

package/out/ui/constants/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./ImageConstants";
+export * from "./LayoutConstants";

package/out/ui/constants/init.lua

@@ -0,0 +1,10 @@
+-- Compiled with roblox-ts v2.2.0
+local TS = _G[script]
+local exports = {}
+for _k, _v in TS.import(script, script, "ImageConstants") or {} do
+	exports[_k] = _v
+end
+for _k, _v in TS.import(script, script, "LayoutConstants") or {} do
+	exports[_k] = _v
+end
+return exports

package/out/ui/enums/Directions.d.ts

@@ -0,0 +1,8 @@
+export declare enum Directions {
+    In = "In",
+    Out = "Out",
+    Left = "Left",
+    Right = "Right",
+    Up = "Up",
+    Down = "Down"
+}