Codify - Convert to TypeScript, Fusion, React, Luau, Vide, Rojo

[ThePyooterMallard (SirMallard)]

Great plugin, I had developed a smaller similar version for Fusion, but this does everything I need and better.

Personally, I like my code to in a certain order, so I have to rearrage the properties when creating components (ie Name, break, AnchorPoint, Size, Position, break, Background). Somthing like a hirearchy module passed into the plugin which would determine order and add line breaks would be a nice optional addition.

The other idea I had with Fusion would be to pass in the ‘defaultProps’ module found in the Fusion code, which means that default properties don’t get generated. Having the code set the BorderSizePixel and BorderColor3 for every element is a slight pain, which I why I have a macro to fix this when building the UI by hand, so being able to omit this when generating code would be nice.

Apart from these two critiques, which are mostly down to my personal preference, it’s a really helpful plugin. Thanks

[TheH0meLands]

amazing plugin, i love it!

But I have a suggestion. Would it be possible to add Roact JSX support? An example would be an option where it’s called “Roact JSX” and it’ll convert the instance to Roact JSX instead of default roact. This would greatly benefit my workflow as I mainly use roblox-ts for all my projects. And i’m sure it’ll benefit other devs too!

[cxmeels]

Version 2.2.3

What’s Changed

• Fixed issue #22: TextLabel, TextBox and TextButton now have a FontFace property which is currently not usable in Studio, but has not been hidden by Roblox which caused it to be added to the properties for those classes. This hotfix adds the ability to filter out properties from classes internally so they are not serialised by Codify.

Full Changelog: 2.2.1…2.2.3

[cxmeels]

@PysephDEV

FontFace property on TextLabel objects generates the following code:

Sorry for the delay. I’ve issued a hotfix to address this issue (v2.2.3).

@ThePyooterMallard

Somthing like a hirearchy module passed into the plugin which would determine order and add line breaks would be a nice optional addition.

I’ll have a think about this. It doesn’t seem like a high-priority addition, and I’d need to explore the best way to implement it. If you’re using vscode you can use ALT+Up/Down to move lines up/down in the code editor. You can do this in the Roblox script editor too.

@ThePyooterMallard

The other idea I had with Fusion would be to pass in the ‘defaultProps’ module found in the Fusion code

I’ll look into this one. Codify shouldn’t be serialising properties that are already at their default values. I don’t personally use Fusion, but I’m sure if it’s necessary to implement, I can do that.

@TheH0meLands

Would it be possible to add Roact JSX support?

JSX support was planned originally, back when it was Roactify. I’m still not adverse to exploring JSX at some point, but it’s not a high priority at this time. Keep your eyes peeled though.

[cxmeels]

Version 2.2.4

What’s Changed

• Further bug patches by @csqrl in #25

Fixed

• Issue #21: Previously, Instances whose name contained exclusively unsafe characters would cause an error. Unsafe names are now mapped to a safe character; e.g. "123" will now become "w23".
• Issue #18: Properties which accepted an Instance as a value would cause Codify to generate their values as “some.Property = Instance.new("Thing")”. Instance-based properties are now omitted from the output. In future, I’d like Instances that are present in the tree (when using the “Regular” framework) to be referenced within the output.
• Issue #20: As Instance properties are now omitted, a notice is now displayed on the home tab to ensure users are aware that properties, such as Adornee or PrimaryPart, will be excluded from the output.
• Issue #23: When using the “Regular” or “Fusion” frameworks, the “Name” property of Instances would be converted to their safe name. Codify will now respect the original name of the Instance.

Changed

• [Internal] The GetIgnoredPropertyNames method of Lib/Properties.lua will now include globally ignored properties in its resulting array.
• [Internal] Codify now uses Sift instead of Llama for table operations, as Llama is now deprecated.

Full Changelog: 2.2.3...2.2.4

[savio14562 (savio14563)]

Will there be an option for a “create” type of generation (or whatever its called)
Sometimes people use a function that works like this

create "ScreenGui" {
	create "Frame" {
		Size = UDim2.fromScale(.2,.1),
		BackgroundColor3 = Color3.new(1,.25,.25),
		create "TextLabel" {
			Size = UDim2.fromScale(.5,.5),
			Position = UDim2.fromScale(.25,.25),
			Text = "hello!",
			TextScaled = true,
		},
	},
	create "TextLabel" {
		Size = UDim2.fromScale(.5,.5),
		Position = UDim2.fromScale(.25,.25),
		Text = "hello!",
		TextScaled = true,
	},
	IgnoreGuiInset = true,
}

The frame and textlabel are parented to the ScreenGui, and the text label (not the one parented to screengui) is parented to the frame. Would really like this as sometimes I make small UI components like this and its much more readable than Instance.new

[cxmeels]

I’m going to look into reworking the way snippets are generated internally to make adding new frameworks easier to potentially allow for TypeScript and RbxUtil (the create method you mentioned)

no ETA on this right now, but I’ll add it to the GitHub project as a feature request

for the time being I’d suggest using Fusion to generate those snippets. you can change the creator method to “Create” in the settings, and just remove the [Fusion.Children] = { line and it’s matching closing bracket

example:

return Create "Frame" {
  BackgroundColor3 = Color3.new(),

  [Fusion.Children] = { -- remove this
    Create "TextLabel" {
      Text = "Hello, world!",
    },
  }, -- remove this
}

[hghguy]

It would be cool if this plugin supported roblox-ts as well. Ie, converting the output of fusion to something for RBXTS.

[PysephDEV (Pyseph)]

Heyo! Reporting some bugs:

• Multiline strings in TextLabels (or any textholder objects) break down:
  

• Objects with exclusively numbers in them get renamed to x, y, w etc. You mentioned above that this is expected behavior, but it becomes an issue when relying on UIListLayout.SortOrder = Name. You can detect all ‘illegal’ characters (excluding keywords, since that’d be more than 1-line) through this if-statement:

if not string.match(String, "^[_%a][_%w]*$") then
    String = "[\"" .. String .. "\"]"
end

[PysephDEV (Pyseph)]

For the latter bug, here’s a more ‘complete’ solution:

local specialCharacters = {["\a"] = "\\a", ["\b"] = "\\b", ["\f"] = "\\f", ["\n"] = "\\n", ["\r"] = "\\r", ["\t"] = "\\t", ["\v"] = "\\v", ["\0"] = "\\0"}
local keywords = { ["and"] = true, ["break"] = true, ["do"] = true, ["else"] = true, ["elseif"] = true, ["end"] = true, ["false"] = true, ["for"] = true, ["function"] = true, ["if"] = true, ["in"] = true, ["local"] = true, ["nil"] = true, ["not"] = true, ["or"] = true, ["repeat"] = true, ["return"] = true, ["then"] = true, ["true"] = true, ["until"] = true, ["while"] = true, ["continue"] = true}

local function GetSafeName(instance: Instance)
	local name = string.gsub(instance.Name, "[%c%z]", specialCharacters)
	if keywords[name] or not string.match(name, "^[_%a][_%w]*$") then
		name = string.format("[\"%s\"]", name)
	end

	return name
end

GetSafeName({Name="break"}) --> ["break"]
GetSafeName({Name="1var"}) --> ["1var"]
GetSafeName({Name="v1ar"}) --> v1ar
GetSafeName({Name="\n"}) --> ["\n"]
GetSafeName({Name="1"}) --> ["1"]
GetSafeName({Name="h"}) --> h

[cxmeels]

thanks for the reports (and solutions!), I’ll look into this when I can

[KelvenOne (Kelven)]

Can we have support to Rojo JSON Models?

Sync Details | Rojo

[cxmeels]

I don’t see why not. that looks like a good way to serialise the data before converting it to Luau, so I may switch over to that internally and give the option to expose it

I’m currently working on an update to Codify to fix a bunch of bugs, and add a few new features, so I’ll be sure to add this to the to-do list

[cxmeels]

Version 2.2.4-patch.1

This is an unofficial patch. The source for this patch has not been uploaded to GitHub, but will feature in the next update to the minor version (v2.3.0), which will also address more bugs and include a few new features . Plugin binaries are released on the plugin marketplace and Itch.io.

This is also a reminder that Codify now costs 350 via the Plugin Marketplace (and is now listed in the toolbox!), but can still be obtained for free via the Itch store page (optional donation), or by building from source—The GitHub README has not yet been updated to reflect this.

Finally, thank you so much for 1,000+ installs via Roblox! Please don’t forget to give the plugin a thumbs up if you’re enjoying it.

What’s Changed

• Patched number converter.

Fixed

• [Internal] Instances which allowed inf/-inf values would serialise as “inf”. This is a minor patch to convert those values to math.huge and -math.huge, respectively.

[cxmeels]

Version 2.2.4-patch.2

This is another unofficial patch. The source for this patch has not been uploaded to GitHub, but will feature in the next update to the minor version (v2.3.0), which will also address more bugs and include a few new features . Plugin binaries are released on the plugin marketplace and Itch.io.

Please don’t forget to give the plugin a thumbs up if you’re enjoying it.

What’s Changed

This patch now uses the new FontFace property to serialise fonts on TextLabels, TextButtons and TextBoxes. In settings, you’ll find the option to switch between “Smart” and “Full” formatting—The default configuration is “Full.”

You can read more about the changes to GUI Fonts here:

New Font UI [Beta]

This is a beta feature for a new editor in the Properties Panel for changing fonts of GUI instances like TextLabel, TextButton, and TextBox.

How to enable the beta

Go to File → Beta Features. [image] Scroll until you see New Font Picker UI. <a class="lightbox" href="/secure-media-uploads/uploads/original/4X/5/a/9/5a9007e5aaa2f12181439887632c09c103f68961.png" data-download-href="/uploads/short-url/cV9yx8X5G4oG0vNA6aAwGfBVfwZ.png?dl=1" title="">[…

Example outputs:

In a scenario where a TextLabel uses the font “Gotham SSm” in Bold.

-- Full formatting:
FontFace = Font.new(
  "rbxasset://fonts/families/GothamSSm.json",
  Enum.FontWeight.Bold,
  Enum.FontStyle.Normal
),

-- Smart formatting:
FontFace = Font.fromEnum(Enum.Font.GothamBold),

If “Smart” cannot find an Enum for the selected font, it’ll fallback to Full formatting. Additionally, if the weight and style of the font are set to their default values, the weight and style Enums will be omitted from the result:

Example output 2:

In a scenario where a TextLabel uses the font “Gotham SSm” with normal weight and styles:

-- Full formatting:
FontFace = Font.new("rbxasset://fonts/families/GothamSSm.json"),

Added

• Added support for the new Font datatype (FontFace property)

Removed

• Removed support for the Font property (which uses Enum.Font)

[cxmeels]

Version 2.2.4-patch.3

GitHub’s source code is now parallel with the plugin’s source code. The README has also been updated to reflect changes to pricing and other information.

Versions with the “-patch” suffix prior to v2.2.4-patch.3 are not available on GitHub. This is due to the way the reconciliation was performed.

---

This is a minor patch which bumps the version of most dependencies, with a focus on Highlighter. Please report any issues that may occur with the latest version, as Highlighter’s behaviour was previously unstable on v0.4.6. I have not personally run into any problems with the current version.

A full update is planned, but has been delayed due to personal issues. Keep an eye on this thread or Twitter to keep up to date with development.

[Ulferno]

I recently bought the plugin - however - whenever I run “Generate Snippet” it yields for a while before warning in the output Failed to get changed properties: Request timed out.

[cxmeels]

Thanks for the report! I’ve already had one other user report this issue, so I’ll look into this ASAP and get a patch pushed out for it.

[cxmeels]

Version 2.2.5

It’s been a while! The latest update addresses a few bugs reported by users (thanks @Ulferno, @PysephDEV, and others!). Codify also has a new section for experimental features—Use this at your own risk!

And don’t worry, updates are still in the works for Codify. No timeline, but I’d love for Codify to support Rojo’s JSON model format and TypeScript TSX support in the future. I’m also planning a UI overhaul to clean up the settings tab, and further customisation options to enable you to generate snippets to your own preferences.

You can also follow me on Twitter if you’d like to keep up to date with development.

What’s Changed

• v2.2.5 by @csqrl in #34

Fixed

• Issue #31: Some users found it confusing when Codify truncated a snippet when generating excessively large snippets. This is purely because of a limit on Roblox’s TextBoxes. If a snippet is truncated, Codify will now display a message above the snippet informing the user of this, and will advise the user to save the snippet to their device in order to view the full text.
• Issue #30: Sometimes Codify would yield for a long time when fetching API data. HTTP requests have had their timeouts lowered to 15s, and will additionally display an error message on the home tab when something goes wrong.
• Issue #28: Multiline strings were not handled correctly in previous versions. They will now be enclosed within double square brackets ([[ ... ]]). Any instances of closing double square brackets within multiline strings will be escaped.

Added

• Experimental settings section within the settings tab.
• Parallel Luau experiment - This makes use of the new task.synchronize and task.desynchronize methods to help prevent Studio from becoming unresponsive or crashing when generating excessively large snippets.

Changed

• Minor visual/apperance changes.
• [Internal] Changed the spelling of “colour” to the US spelling “color” within props. This keeps it consistent with structures like Color3, which use the US variant, and removes any confusion for potential contributors.

Removed

• Removed separate icons for different builds of Codify. Sometimes Codify would show the icon for unstable builds when manually installing the plugin from places like GitHub or Itch.io.

Full Changelog: 2.2.4-patch.3...2.2.5

[cxmeels]

Version 2.3.0

This is only a small update to Codify, but will deliver improved speeds and more reliable variable names.

What’s Changed

• v2.3.0 by @csqrl and @Aloroid in #34

Changed

• Performance improvements
• Back-ported SafeNamer from the work-in-progress Codify v3

Full Changelog: 2.2.5...2.3.0