@k9kbdev/roblox-css 0.1.0

package/out/types.d.ts

@@ -0,0 +1,4 @@
+/** Recursively marks all properties as readonly. */
+export type DeepReadonly<T> = {
+    readonly [P in keyof T]: T[P] extends object ? DeepReadonly<T[P]> : T[P];
+};

package/out/types.luau

@@ -0,0 +1,3 @@
+-- Compiled with roblox-ts v3.0.0
+--* Recursively marks all properties as readonly. 
+return nil

package/out/utils/parseInlineImages.d.ts

@@ -0,0 +1,20 @@
+/**
+ * parseInlineImages.ts — Parses <img> tags from text strings into structured segments.
+ *
+ * Roblox's built-in RichText does NOT support inline images. This parser extracts
+ * standard HTML-style `<img src="..." width="N" height="N" />` tags so the InlineText
+ * component can render them as separate Image elements.
+ */
+export interface TextSegment {
+    readonly type: "text";
+    readonly content: string;
+}
+export interface ImageSegment {
+    readonly type: "image";
+    readonly src: string;
+    readonly width: number;
+    readonly height: number;
+}
+export type InlineSegment = TextSegment | ImageSegment;
+export declare function parseInlineImages(input: string): InlineSegment[];
+export declare function containsRichTextTags(text: string): boolean;

package/out/utils/parseInlineImages.luau

@@ -0,0 +1,93 @@
+-- Compiled with roblox-ts v3.0.0
+--[[
+	*
+	 * parseInlineImages.ts — Parses <img> tags from text strings into structured segments.
+	 *
+	 * Roblox's built-in RichText does NOT support inline images. This parser extracts
+	 * standard HTML-style `<img src="..." width="N" height="N" />` tags so the InlineText
+	 * component can render them as separate Image elements.
+	 
+]]
+local IMG_PATTERN = '<img%s+src="([^"]*)"%s+width="(%d+)"%s+height="(%d+)"%s*/?>'
+local function parseInlineImages(input)
+	local segments = {}
+	local searchStart = 1
+	while true do
+		local matchStart, matchEnd, src, widthStr, heightStr = string.find(input, IMG_PATTERN, searchStart)
+		if matchStart == nil or matchEnd == nil then
+			local remaining = string.sub(input, searchStart)
+			if remaining ~= "" then
+				local _arg0 = {
+					type = "text",
+					content = remaining,
+				}
+				table.insert(segments, _arg0)
+			end
+			break
+		end
+		if matchStart > searchStart then
+			local before = string.sub(input, searchStart, matchStart - 1)
+			if before ~= "" then
+				local _arg0 = {
+					type = "text",
+					content = before,
+				}
+				table.insert(segments, _arg0)
+			end
+		end
+		local _object = {
+			type = "image",
+			src = tostring(src),
+		}
+		local _left = "width"
+		local _condition = tonumber(widthStr)
+		if _condition == nil then
+			_condition = 20
+		end
+		_object[_left] = _condition
+		local _left_1 = "height"
+		local _condition_1 = tonumber(heightStr)
+		if _condition_1 == nil then
+			_condition_1 = 20
+		end
+		_object[_left_1] = _condition_1
+		table.insert(segments, _object)
+		searchStart = matchEnd + 1
+	end
+	if #segments == 0 then
+		local _arg0 = {
+			type = "text",
+			content = input,
+		}
+		table.insert(segments, _arg0)
+	end
+	return segments
+end
+local RICH_TEXT_TAG_PATTERN = "</?[biusBIUS]>"
+local function containsRichTextTags(text)
+	local simple = string.find(text, RICH_TEXT_TAG_PATTERN)
+	if simple ~= nil then
+		return true
+	end
+	local font = string.find(text, "<font%s")
+	if font ~= nil then
+		return true
+	end
+	local stroke = string.find(text, "<stroke%s")
+	if stroke ~= nil then
+		return true
+	end
+	local sc = string.find(text, "<sc>")
+	if sc ~= nil then
+		return true
+	end
+	local br = string.find(text, "<br%s*/?>")
+	if br ~= nil then
+		return true
+	end
+	return false
+end
+return {
+	parseInlineImages = parseInlineImages,
+	containsRichTextTags = containsRichTextTags,
+}

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "@k9kbdev/roblox-css",
+  "version": "0.1.0",
+  "description": "CSS-to-Roblox UI translation middleware — write web-style props, get native Roblox primitives",
+  "main": "out/init.lua",
+  "files": [
+    "out",
+    "default.project.json"
+  ],
+  "types": "out/index.d.ts",
+  "license": "LGPL-3.0-only",
+  "scripts": {
+    "build": "rbxtsc --type package",
+    "prepack": "mv out/tests .out-tests || true; mv COPYING .COPYING || true; mv COPYING.LESSER .COPYING.LESSER || true",
+    "postpack": "mv .out-tests out/tests || true; mv .COPYING COPYING || true; mv .COPYING.LESSER COPYING.LESSER || true"
+  },
+  "author": "Kaleb Kougl",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Kaleb-kougl/roblox-css.git"
+  },
+  "keywords": [
+    "roblox",
+    "roblox-ts",
+    "rbxts",
+    "css",
+    "ui",
+    "react",
+    "middleware"
+  ],
+  "peerDependencies": {
+    "@rbxts/react": ">=17.0.0",
+    "@rbxts/ripple": ">=0.8.0",
+    "@rbxts/services": "*"
+  },
+  "peerDependenciesMeta": {
+    "@rbxts/ripple": {
+      "optional": true
+    },
+    "@rbxts/services": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@rbxts/compiler-types": "^3.0.0-types.0",
+    "@rbxts/react": "17.3.7-ts.1",
+    "@rbxts/react-roblox": "17.3.7-ts.1",
+    "@rbxts/ripple": "^0.8.0",
+    "@rbxts/services": "^1.6.0",
+    "@rbxts/types": "^1.0.914",
+    "@rbxts/jest": "^3.16.0-ts.1",
+    "@rbxts/jest-globals": "^3.16.0-ts.1",
+    "roblox-ts": "^3.0.0",
+    "typescript": "^5.5.3"
+  }
+}