local K=Roact.Component:extend("\083\117\114\102\097\099\101\067\097\110\118\097\115")K.defaultProps={numRows=2;numCols=5,paddingLeft=UDim.new(0,8),paddingRight=UDim.new(0,8),paddingTop=UDim.new(0,8),paddingBottom=UDim.new(0,8)}function K.render(K)local k=K.props[Roact.Children]for K,W in ipairs(k)do k[K]=Roact.createElement("\070\114\097\109\101",{LayoutOrder=K;BackgroundTransparency=1,Size=UDim2.fromScale(1,1)},W)end return Roact.createElement("\070\114\097\109\101",{BackgroundTransparency=1;Size=UDim2.fromScale(1,1);[Roact.Ref]=K.frame},Cryo.List.join({Roact.createElement("\085\073\071\114\105\100\076\097\121\111\117\116",{SortOrder=Enum.SortOrder.LayoutOrder,CellPadding=UDim2.fromScale(0,0);CellSize=UDim2.fromScale(1/K.props.numCols,1/K.props.numRows)});Roact.createElement("\085\073\080\097\100\100\105\110\103",{PaddingLeft=K.props.paddingLeft;PaddingRight=K.props.paddingRight,PaddingTop=K.props.paddingTop,PaddingBottom=K.props.paddingBottom})},k))end return K
--[[
	Responsible for managing positions for art spots on a single surface.

	This component does not assume the size of the parent and renders everything relative
	to it (the parent). i.e. This is not a SurfaceGui component for testability purposes.
	We will adorn this to a SurfaceGui one level higher.
]]
local SurfaceCanvas = Roact.Component:extend("SurfaceCanvas")

SurfaceCanvas.defaultProps = {
	numRows = 2,
	numCols = 5,
	paddingLeft = UDim.new(0, 8),
	paddingRight = UDim.new(0, 8),
	paddingTop = UDim.new(0, 8),
	paddingBottom = UDim.new(0, 8),
}

function SurfaceCanvas:render()
	local artItems = self.props[Roact.Children]
	for i, artItem in ipairs(artItems) do
		artItems[i] = Roact.createElement("Frame", {
			LayoutOrder = i,
			BackgroundTransparency = 1,
			Size = UDim2.fromScale(1, 1),
		}, artItem)
	end

	return Roact.createElement(
		"Frame",
		{
			BackgroundTransparency = 1,
			Size = UDim2.fromScale(1, 1),
			[Roact.Ref] = self.frame,
		},
		Cryo.List.join({
			Roact.createElement("UIGridLayout", {
				SortOrder = Enum.SortOrder.LayoutOrder,
				CellPadding = UDim2.fromScale(0, 0),
				CellSize = UDim2.fromScale(1 / self.props.numCols, 1 / self.props.numRows),
			}),
			Roact.createElement("UIPadding", {
				PaddingLeft = self.props.paddingLeft,
				PaddingRight = self.props.paddingRight,
				PaddingTop = self.props.paddingTop,
				PaddingBottom = self.props.paddingBottom,
			}),
		}, artItems)
	)
end

return SurfaceCanvas
