Add Headless API

CHANGELOG.md

@@ -1,6 +1,8 @@
 # Rojo Changelog
 
 ## Unreleased Changes
+
+* Added headless API for Studio companion plugins. ([#639])
 * Support for a `$schema` field in all special JSON files (`.project.json`, `.model.json`, and `.meta.json`) ([#974])
 * Projects may now manually link `Ref` properties together using `Attributes`. ([#843])
  	This has two parts: using `id` or `$id` in JSON files or a `Rojo_Target` attribute, an Instance
@@ -77,6 +79,7 @@
 
     **All** sync rules are reset between project files, so they must be specified in each one when nesting them. This is to ensure that nothing can break other projects by changing how files are synced!
 
+[#639]: https://github.com/rojo-rbx/rojo/pull/639
 [#813]: https://github.com/rojo-rbx/rojo/pull/813
 [#832]: https://github.com/rojo-rbx/rojo/pull/832
 [#834]: https://github.com/rojo-rbx/rojo/pull/834
@@ -163,6 +166,7 @@
 
 ## [7.4.0-rc1] - October 3, 2023
 ### Additions
+
 #### Project format
 * Added support for `.toml` files to `$path` ([#633])
 * Added support for `Font` and `CFrame` attributes ([rbx-dom#299], [rbx-dom#296])

plugin/src/App/Components/ScrollingFrame.lua

@@ -31,6 +31,7 @@ local function ScrollingFrame(props)
 			ElasticBehavior = Enum.ElasticBehavior.Always,
 			ScrollingDirection = props.scrollingDirection or Enum.ScrollingDirection.Y,
 
+			LayoutOrder = props.layoutOrder,
 			Size = props.size,
 			Position = props.position,
 			AnchorPoint = props.anchorPoint,

plugin/src/App/ConflictAPIPopup.lua

@@ -0,0 +1,129 @@
+local Rojo = script:FindFirstAncestor("Rojo")
+local Plugin = Rojo.Plugin
+local Packages = Rojo.Packages
+
+local Roact = require(Packages.Roact)
+
+local Config = require(Plugin.Config)
+local Version = require(Plugin.Version)
+local Theme = require(Plugin.App.Theme)
+
+local TextButton = require(Plugin.App.Components.TextButton)
+
+local e = Roact.createElement
+
+local ConflictAPIPopup = Roact.Component:extend("ConflictAPIPopup")
+
+function ConflictAPIPopup:render()
+	return Theme.with(function(theme)
+		theme = theme.Settings
+
+		return e("Frame", {
+			BackgroundTransparency = 1,
+			Size = UDim2.new(1, 0, 1, 0),
+		}, {
+			Padding = e("UIPadding", {
+				PaddingLeft = UDim.new(0, 20),
+				PaddingRight = UDim.new(0, 20),
+				PaddingTop = UDim.new(0, 15),
+				PaddingBottom = UDim.new(0, 15),
+			}),
+
+			Details = e("Frame", {
+				BackgroundTransparency = 1,
+				Size = UDim2.new(1, 0, 1, 0),
+			}, {
+				Layout = e("UIListLayout", {
+					FillDirection = Enum.FillDirection.Vertical,
+					SortOrder = Enum.SortOrder.LayoutOrder,
+					Padding = UDim.new(0, 15),
+					HorizontalAlignment = Enum.HorizontalAlignment.Center,
+				}),
+
+				Info = e("TextLabel", {
+					BackgroundTransparency = 1,
+					Size = UDim2.new(1, 0, 0, 0),
+					AutomaticSize = Enum.AutomaticSize.Y,
+					Text = "There is already a Rojo API exposed by a Rojo plugin. Do you want to overwrite it with this one?",
+					Font = Enum.Font.GothamMedium,
+					TextSize = 17,
+					TextColor3 = theme.Setting.NameColor,
+					TextXAlignment = Enum.TextXAlignment.Left,
+					TextWrapped = true,
+					TextTransparency = self.props.transparency,
+					LayoutOrder = 1,
+				}),
+
+				Existing = e("TextLabel", {
+					BackgroundTransparency = 1,
+					Size = UDim2.new(1, 0, 0, 0),
+					AutomaticSize = Enum.AutomaticSize.Y,
+					Text = string.format(
+						"Existing: Version %s, Protocol %d",
+						Version.display(self.props.existingAPI.Version),
+						self.props.existingAPI.ProtocolVersion
+					),
+					Font = Enum.Font.Gotham,
+					TextSize = 15,
+					TextColor3 = theme.Setting.DescriptionColor,
+					TextXAlignment = Enum.TextXAlignment.Left,
+					TextTransparency = self.props.transparency,
+					LayoutOrder = 2,
+				}),
+
+				Incoming = e("TextLabel", {
+					BackgroundTransparency = 1,
+					Size = UDim2.new(1, 0, 0, 0),
+					AutomaticSize = Enum.AutomaticSize.Y,
+					Text = string.format(
+						"Incoming: Version %s, Protocol %d",
+						Version.display(Config.version),
+						Config.protocolVersion
+					),
+					Font = Enum.Font.Gotham,
+					TextSize = 15,
+					TextColor3 = theme.Setting.DescriptionColor,
+					TextXAlignment = Enum.TextXAlignment.Left,
+					TextTransparency = self.props.transparency,
+					LayoutOrder = 3,
+				}),
+			}),
+
+			Actions = e("Frame", {
+				BackgroundTransparency = 1,
+				Size = UDim2.new(1, 0, 0, 34),
+				Position = UDim2.fromScale(0, 1),
+				AnchorPoint = Vector2.new(0, 1),
+			}, {
+				Layout = e("UIListLayout", {
+					FillDirection = Enum.FillDirection.Horizontal,
+					SortOrder = Enum.SortOrder.LayoutOrder,
+					Padding = UDim.new(0, 10),
+					HorizontalAlignment = Enum.HorizontalAlignment.Right,
+				}),
+
+				Keep = e(TextButton, {
+					text = "Keep",
+					style = "Bordered",
+					transparency = self.props.transparency,
+					layoutOrder = 1,
+					onClick = function()
+						self.props.onDeny()
+					end,
+				}),
+
+				Overwrite = e(TextButton, {
+					text = "Overwrite",
+					style = "Solid",
+					transparency = self.props.transparency,
+					layoutOrder = 2,
+					onClick = function()
+						self.props.onAccept()
+					end,
+				}),
+			}),
+		})
+	end)
+end
+
+return ConflictAPIPopup

plugin/src/App/Notifications.lua

@@ -119,14 +119,18 @@ function Notification:render()
 		buttonsX += (count - 1) * 5
 	end
 
-	local paddingY, logoSize = 20, 32
+	local paddingX, paddingY, logoSize = 24, 20, 32
+	local sourceY = if self.props.source then logoSize + 5 else 0
+	local sourceX = if self.props.source
+		then TextService:GetTextSize(self.props.source, 15, Enum.Font.GothamMedium, Vector2.new(350, 15)).X + logoSize + 5
+		else 0
 	local actionsY = if self.props.actions then 35 else 0
-	local contentX = math.max(textBounds.X, buttonsX)
+	local contentX = math.max(textBounds.X, buttonsX, sourceX) + (if self.props.thirdParty then 0 else logoSize + 3) + 2
 
 	local size = self.binding:map(function(value)
 		return UDim2.fromOffset(
-			(35 + 40 + contentX) * value,
-			5 + actionsY + paddingY + math.max(logoSize, textBounds.Y)
+			(paddingX + contentX) * value,
+			5 + actionsY + sourceY + paddingY + math.max(logoSize, textBounds.Y)
 		)
 	end)
 
@@ -146,56 +150,69 @@ function Notification:render()
 				transparency = transparency,
 				size = UDim2.new(1, 0, 1, 0),
 			}, {
-				Contents = e("Frame", {
-					Size = UDim2.new(0, 35 + contentX, 1, -paddingY),
-					Position = UDim2.new(0, 0, 0, paddingY / 2),
+				Logo = e("ImageLabel", {
+					ImageTransparency = transparency,
+					Image = if self.props.thirdParty
+						then Assets.Images.ThirdPartyPlugin
+						else Assets.Images.PluginButton,
 					BackgroundTransparency = 1,
-				}, {
-					Logo = e("ImageLabel", {
-						ImageTransparency = transparency,
-						Image = Assets.Images.PluginButton,
-						BackgroundTransparency = 1,
-						Size = UDim2.new(0, logoSize, 0, logoSize),
-						Position = UDim2.new(0, 0, 0, 0),
-						AnchorPoint = Vector2.new(0, 0),
-					}),
-					Info = e("TextLabel", {
-						Text = self.props.text,
+					Size = UDim2.new(0, logoSize, 0, logoSize),
+					Position = UDim2.new(0, 0, 0, 0),
+					AnchorPoint = Vector2.new(0, 0),
+				}),
+				Source = if self.props.source
+					then e("TextLabel", {
+						Text = self.props.source,
 						Font = Enum.Font.GothamMedium,
 						TextSize = 15,
 						TextColor3 = theme.Notification.InfoColor,
 						TextTransparency = transparency,
 						TextXAlignment = Enum.TextXAlignment.Left,
-						TextWrapped = true,
-
-						Size = UDim2.new(0, textBounds.X, 0, textBounds.Y),
-						Position = UDim2.fromOffset(35, 0),
+						TextTruncate = Enum.TextTruncate.AtEnd,
 
-						LayoutOrder = 1,
+						Size = UDim2.new(1, -logoSize - 5, 0, logoSize),
+						Position = UDim2.fromOffset(logoSize + 5, 0),
 						BackgroundTransparency = 1,
-					}),
-					Actions = if self.props.actions
-						then e("Frame", {
-							Size = UDim2.new(1, -40, 0, 35),
-							Position = UDim2.new(1, 0, 1, 0),
-							AnchorPoint = Vector2.new(1, 1),
-							BackgroundTransparency = 1,
-						}, {
-							Layout = e("UIListLayout", {
-								FillDirection = Enum.FillDirection.Horizontal,
-								HorizontalAlignment = Enum.HorizontalAlignment.Right,
-								VerticalAlignment = Enum.VerticalAlignment.Center,
-								SortOrder = Enum.SortOrder.LayoutOrder,
-								Padding = UDim.new(0, 5),
-							}),
-							Buttons = Roact.createFragment(actionButtons),
-						})
-						else nil,
+					})
+					else nil,
+				Message = e("TextLabel", {
+					Text = self.props.text,
+					Font = Enum.Font.GothamMedium,
+					TextSize = 15,
+					TextColor3 = theme.Notification.InfoColor,
+					TextTransparency = transparency,
+					TextXAlignment = Enum.TextXAlignment.Left,
+					TextWrapped = true,
+
+					Size = UDim2.new(0, textBounds.X, 0, textBounds.Y),
+					Position = if self.props.thirdParty
+						then UDim2.fromOffset(0, logoSize + 5)
+						else UDim2.fromOffset(logoSize + 3, 0),
+					BackgroundTransparency = 1,
 				}),
+				Actions = if self.props.actions
+					then e("Frame", {
+						Size = UDim2.new(1, -40, 0, 35),
+						Position = UDim2.new(1, 0, 1, 0),
+						AnchorPoint = Vector2.new(1, 1),
+						BackgroundTransparency = 1,
+					}, {
+						Layout = e("UIListLayout", {
+							FillDirection = Enum.FillDirection.Horizontal,
+							HorizontalAlignment = Enum.HorizontalAlignment.Right,
+							VerticalAlignment = Enum.VerticalAlignment.Center,
+							SortOrder = Enum.SortOrder.LayoutOrder,
+							Padding = UDim.new(0, 5),
+						}),
+						Buttons = Roact.createFragment(actionButtons),
+					})
+					else nil,
 
 				Padding = e("UIPadding", {
-					PaddingLeft = UDim.new(0, 17),
-					PaddingRight = UDim.new(0, 15),
+					PaddingLeft = UDim.new(0, paddingX / 2),
+					PaddingRight = UDim.new(0, paddingX / 2),
+					PaddingTop = UDim.new(0, paddingY / 2),
+					PaddingBottom = UDim.new(0, paddingY / 2),
 				}),
 			}),
 		})
@@ -214,6 +231,8 @@ function Notifications:render()
 			timestamp = notif.timestamp,
 			timeout = notif.timeout,
 			actions = notif.actions,
+			source = notif.source,
+			thirdParty = notif.thirdParty,
 			layoutOrder = (notif.timestamp - baseClock),
 			onClose = function()
 				self.props.onClose(id)