diff --git a/lua/wikis/commons/Bracket/Template.lua b/lua/wikis/commons/Bracket/Template.lua
index 6ef6cfbc259..b8e8af6946a 100644
--- a/lua/wikis/commons/Bracket/Template.lua
+++ b/lua/wikis/commons/Bracket/Template.lua
@@ -18,6 +18,8 @@ local MatchGroupCoordinates = Lua.import('Module:MatchGroup/Coordinates')
 local MatchGroupUtil = Lua.import('Module:MatchGroup/Util/Custom')
 local Opponent = Lua.import('Module:Opponent')
 
+local Html = Lua.import('Module:Widget/Html')
+
 ---@class BracketTemplateBracket
 ---@field bracketDatasById table<string,MatchGroupUtilBracketBracketData>
 ---@field rootMatchIds string[]
@@ -57,14 +59,14 @@ end
 function BracketTemplate.BracketContainer(props)
 	local matchRecords = MatchGroupUtil.fetchMatchRecords(props.bracketId)
 	Array.forEach(matchRecords, function(match)
-		match.match2opponents = {{type = Opponent.literal, name = '', match2players = {}}}
+		match.match2opponents = {Opponent.blank(Opponent.literal)}
 	end)
 	local bracket = MatchGroupUtil.makeMatchGroup(matchRecords) --[[@as MatchGroupUtilBracket]]
 
 	return BracketDisplay.Bracket({
 		bracket = bracket,
 		config = Table.merge(props.config, {
-			OpponentEntry = function() return mw.html.create('div'):addClass('brkts-opponent-entry') end,
+			OpponentEntry = function() return Html.Div{classes = {'brkts-opponent-entry'}} end,
 			matchHasDetails = function() return false end,
 		})
 	})
diff --git a/lua/wikis/commons/MatchGroup/Display/Bracket.lua b/lua/wikis/commons/MatchGroup/Display/Bracket.lua
index 53d2f9b8927..a6cadedb961 100644
--- a/lua/wikis/commons/MatchGroup/Display/Bracket.lua
+++ b/lua/wikis/commons/MatchGroup/Display/Bracket.lua
@@ -20,8 +20,8 @@ local MatchGroupUtil = Lua.import('Module:MatchGroup/Util/Custom')
 local WikiSpecific = Lua.import('Module:Brkts/WikiSpecific')
 
 local Opponent = Lua.import('Module:Opponent/Custom')
-local OpponentDisplay = Lua.import('Module:OpponentDisplay/Custom')
 
+local BracketOpponentEntry = Lua.import('Module:Widget/Match/Bracket/OpponentEntry')
 local MatchInfoIcon = Lua.import('Module:Widget/Match/InfoIcon')
 
 local NON_BREAKING_SPACE = '&nbsp;'
@@ -29,7 +29,7 @@ local OPPONENT_HEIGHT_PADDING = 4
 
 ---@class BracketConfigOptions
 ---@field MatchSummaryContainer function?
----@field OpponentEntry function?
+---@field OpponentEntry Component<BracketOpponentEntryProps>?
 ---@field forceShortName boolean?
 ---@field headerHeight number?
 ---@field headerMargin number?
@@ -65,7 +65,7 @@ local OPPONENT_HEIGHT_PADDING = 4
 ---@field matchesById table<string, MatchGroupUtilMatch>
 
 ---@class BracketDisplayMatchProps
----@field OpponentEntry function
+---@field OpponentEntry Component<BracketOpponentEntryProps>
 ---@field MatchSummaryContainer function
 ---@field match MatchGroupUtilMatch
 ---@field forceShortName boolean
@@ -119,7 +119,7 @@ function BracketDisplay.Bracket(props)
 	local propsConfig = props.config or {}
 	local config = {
 		MatchSummaryContainer = propsConfig.MatchSummaryContainer or DisplayHelper.DefaultMatchSummaryContainer,
-		OpponentEntry = propsConfig.OpponentEntry or BracketDisplay.OpponentEntry,
+		OpponentEntry = propsConfig.OpponentEntry or BracketOpponentEntry,
 		forceShortName = propsConfig.forceShortName or defaultConfig.forceShortName,
 		headerHeight = propsConfig.headerHeight or defaultConfig.headerHeight,
 		headerMargin = propsConfig.headerMargin or defaultConfig.headerMargin,
@@ -540,11 +540,11 @@ function BracketDisplay.NodeBody(props)
 				type = 'literal',
 				name = match.bracketData.qualLoseLiteral or '',
 			})
-		qualLoseNode = BracketDisplay.Qualified({
+		qualLoseNode = BracketDisplay.Qualified{
 			OpponentEntry = config.OpponentEntry,
 			height = config.opponentHeight,
 			opponent = opponent,
-		})
+		}
 			:css('margin-top', config.matchMargin + 6 .. 'px')
 			:css('margin-bottom', config.matchMargin .. 'px')
 	end
@@ -573,15 +573,13 @@ function BracketDisplay.Match(props)
 	local matchNode = mw.html.create('div'):addClass('brkts-match brkts-match-popup-wrapper')
 
 	for ix, opponent in ipairs(props.match.opponents) do
-		local opponentEntryNode = props.OpponentEntry({
+		local opponentEntryNode = props.OpponentEntry{
 			displayType = 'bracket',
 			forceShortName = props.forceShortName,
 			height = props.opponentHeight,
 			opponent = opponent,
-		})
-			:addClass(ix == #props.match.opponents and 'brkts-opponent-entry-last' or nil)
-			:css('height', props.opponentHeight .. 'px')
-		DisplayHelper.addOpponentHighlight(opponentEntryNode, opponent)
+			classes = ix == #props.match.opponents and {'brkts-opponent-entry-last'} or nil,
+		}
 		matchNode:node(opponentEntryNode)
 	end
 
@@ -610,17 +608,15 @@ function BracketDisplay.Match(props)
 end
 
 ---Display component for a qualification spot.
----@param props {OpponentEntry: function, height: number, opponent: standardOpponent}
+---@param props {OpponentEntry: Component<BracketOpponentEntryProps>, height: number, opponent: standardOpponent}
 ---@return Html
 function BracketDisplay.Qualified(props)
-	local opponentEntryNode = props.OpponentEntry({
+	local opponentEntryNode = props.OpponentEntry{
 		displayType = 'bracket-qualified',
 		height = props.height,
 		opponent = props.opponent,
-	})
-		:addClass('brkts-opponent-entry-last')
-		:css('height', props.height .. 'px')
-	DisplayHelper.addOpponentHighlight(opponentEntryNode, props.opponent)
+		classes = {'brkts-opponent-entry-last'},
+	}
 
 	return mw.html.create('div'):addClass('brkts-qualified')
 		:node(opponentEntryNode)
@@ -816,24 +812,4 @@ function BracketDisplay.getRunnerUpOpponent(match, bracketResetMatch)
 	end
 end
 
---[[
-Display component for an opponent in a bracket match. Shows the name and flag
-of the opponent, as well as the opponent's scores.
-
-This is the default opponent entry component. Specific wikis may override this
-by passing in a different props.OpponentEntry in the Bracket component.
-]]
----@param props {opponent: standardOpponent, displayType: string, forceShortName: boolean?, height: number}
----@return Html
-function BracketDisplay.OpponentEntry(props)
-	local opponentEntry = OpponentDisplay.BracketOpponentEntry(
-		props.opponent,
-		{forceShortName = props.forceShortName, showTbd = false}
-	)
-	if props.displayType == 'bracket' then
-		opponentEntry:addScores(props.opponent)
-	end
-	return opponentEntry.root
-end
-
 return BracketDisplay
diff --git a/lua/wikis/commons/MatchGroup/Display/Helper.lua b/lua/wikis/commons/MatchGroup/Display/Helper.lua
index 943e72250e0..7680b5d503c 100644
--- a/lua/wikis/commons/MatchGroup/Display/Helper.lua
+++ b/lua/wikis/commons/MatchGroup/Display/Helper.lua
@@ -42,6 +42,22 @@ function DisplayHelper.addOpponentHighlight(node, opponent)
 		:attr('aria-label', Opponent.toName(opponent))
 end
 
+---@param props HtmlNodeProps
+---@param opponent standardOpponent
+---@return HtmlNodeProps
+function DisplayHelper.addOpponentHighlightToProps(props, opponent)
+	if Opponent.isTbd(opponent) then
+		return props
+	end
+	props.classes = props.classes or {}
+	table.insert(props.classes, 'brkts-opponent-hover')
+
+	props.attributes = props.attributes or {}
+	props.attributes['aria-label'] = Opponent.toName(opponent)
+
+	return props
+end
+
 -- Expands a header code by making a RPC call.
 ---@param headerCode string
 ---@return string[]
diff --git a/lua/wikis/commons/OpponentDisplay.lua b/lua/wikis/commons/OpponentDisplay.lua
index f673464a90c..8395c065372 100644
--- a/lua/wikis/commons/OpponentDisplay.lua
+++ b/lua/wikis/commons/OpponentDisplay.lua
@@ -8,9 +8,7 @@
 local Lua = require('Module:Lua')
 
 local Array = Lua.import('Module:Array')
-local Class = Lua.import('Module:Class')
 local DisplayUtil = Lua.import('Module:DisplayUtil')
-local Faction = Lua.import('Module:Faction')
 local Logic = Lua.import('Module:Logic')
 local Math = Lua.import('Module:MathUtil')
 local Table = Lua.import('Module:Table')
@@ -19,7 +17,7 @@ local TypeUtil = Lua.import('Module:TypeUtil')
 local Opponent = Lua.import('Module:Opponent')
 local PlayerDisplay = Lua.import('Module:Player/Display/Custom')
 
-local HtmlWidgets = Lua.import('Module:Widget/Html/All')
+local Html = Lua.import('Module:Widget/Html')
 local BlockTeam = Lua.import('Module:Widget/TeamDisplay/Block')
 local TeamInline = Lua.import('Module:Widget/TeamDisplay/Inline')
 
@@ -31,100 +29,6 @@ local OpponentDisplay = {propTypes = {}, types = {}}
 OpponentDisplay.types.TeamStyle = TypeUtil.literalUnion('standard', 'short', 'bracket', 'hybrid', 'icon', 'dynamic')
 ---@alias teamStyle 'standard'|'short'|'bracket'|'hybrid'|'icon'|'dynamic'
 
----Display component for an opponent entry appearing in a bracket match.
----@class BracketOpponentEntry
----@operator call(...): BracketOpponentEntry
----@field content Html
----@field root Html
-OpponentDisplay.BracketOpponentEntry = Class.new(
-	---@param self self
-	---@param opponent standardOpponent
-	---@param options {forceShortName: boolean, showTbd: boolean}
-	function(self, opponent, options)
-		self.content = mw.html.create('div'):addClass('brkts-opponent-entry-left')
-
-		if opponent.type == Opponent.team then
-			if options.showTbd ~= false or not Opponent.isTbd(opponent) then
-				self:createTeam(opponent.template or 'tbd', options)
-			end
-		elseif Opponent.typeIsParty(opponent.type) then
-			self:createPlayers(opponent, options)
-		elseif opponent.type == Opponent.literal then
-			self:createLiteral(opponent.name or '')
-		end
-
-		self.root = mw.html.create('div'):addClass('brkts-opponent-entry')
-			:node(self.content)
-	end
-)
-
----Creates team display as BracketOpponentEntry
----@param template string
----@param options {forceShortName: boolean}
-function OpponentDisplay.BracketOpponentEntry:createTeam(template, options)
-	options = options or {}
-	local forceShortName = options.forceShortName
-
-	local opponentNode = OpponentDisplay.BlockTeamContainer{
-		showLink = false,
-		style = forceShortName and 'short' or 'dynamic',
-		template = template,
-	}
-
-	self.content:node(opponentNode)
-end
-
----Creates party display as BracketOpponentEntry
----@param opponent standardOpponent
----@param options {showTbd: boolean?}
-function OpponentDisplay.BracketOpponentEntry:createPlayers(opponent, options)
-	local playerNode = OpponentDisplay.BlockPlayers({
-		opponent = opponent,
-		overflow = 'ellipsis',
-		showLink = false,
-		showTbd = options.showTbd,
-	})
-	self.content:node(playerNode)
-
-	if opponent.type == Opponent.solo then
-		self.content:addClass(Faction.bgClass(opponent.players[1].faction))
-	end
-end
-
----Creates literal display as BracketOpponentEntry
----@param name string
-function OpponentDisplay.BracketOpponentEntry:createLiteral(name)
-	local literal = OpponentDisplay.BlockLiteral({
-		name = name,
-		overflow = 'ellipsis',
-	})
-	self.content:node(literal)
-end
-
----Adds scores to BracketOpponentEntry
----@param opponent standardOpponent
-function OpponentDisplay.BracketOpponentEntry:addScores(opponent)
-	local score1Node = OpponentDisplay.BracketScore({
-		isWinner = opponent.placement == 1 or opponent.advances,
-		scoreText = OpponentDisplay.InlineScore(opponent),
-	})
-	self.root:node(score1Node)
-
-	local score2Node
-	if opponent.score2 then
-		score2Node = OpponentDisplay.BracketScore({
-			isWinner = opponent.placement2 == 1,
-			scoreText = OpponentDisplay.InlineScore2(opponent),
-		})
-	end
-	self.root:node(score2Node)
-
-	if (opponent.placement2 or opponent.placement or 0) == 1
-		or opponent.advances then
-		self.content:addClass('brkts-opponent-win')
-	end
-end
-
 ---@class InlineOpponentProps
 ---@field flip boolean?
 ---@field opponent standardOpponent
@@ -211,7 +115,7 @@ function OpponentDisplay.BlockOpponent(props)
 
 	if opponent.type == Opponent.team then
 		if props.showTbd == false and Opponent.isTbd(opponent) then
-			return HtmlWidgets.Fragment{}
+			return Html.Fragment{}
 		end
 		return OpponentDisplay.BlockTeamContainer{
 			flip = props.flip,
@@ -237,9 +141,9 @@ function OpponentDisplay.BlockOpponent(props)
 end
 
 ---@param props BlockOpponentProps
----@return Widget
+---@return VNode
 function OpponentDisplay.BlockPlayers(props)
-	return HtmlWidgets.Div{
+	return Html.Div{
 		classes = Array.extend('block-players-wrapper', props.additionalClasses),
 		children = OpponentDisplay.getBlockPlayerNodes(props)
 	}
@@ -302,11 +206,11 @@ OpponentDisplay.propTypes.BlockLiteral = {
 
 ---Displays the name of a literal opponent as a block element.
 ---@param props {flip: boolean?, name: string, overflow: OverflowModes, additionalClasses: string[]?}
----@return Widget
+---@return VNode
 function OpponentDisplay.BlockLiteral(props)
 	DisplayUtil.assertPropTypes(props, OpponentDisplay.propTypes.BlockLiteral)
 
-	return HtmlWidgets.Div{
+	return Html.Div{
 		classes = Array.extend(
 			'brkts-opponent-block-literal',
 			props.flip and 'flipped' or nil,
@@ -325,15 +229,15 @@ OpponentDisplay.propTypes.BlockScore = {
 
 ---Displays a score within the context of a block element.
 ---@param props {isWinner: boolean?, scoreText: string|number?, additionalClasses: string[]?}
----@return Widget
+---@return VNode
 function OpponentDisplay.BlockScore(props)
 	DisplayUtil.assertPropTypes(props, OpponentDisplay.propTypes.BlockScore)
 
 	local scoreText = props.scoreText
 
-	return HtmlWidgets.Div{
+	return Html.Div{
 		classes = props.additionalClasses,
-		children = props.isWinner and HtmlWidgets.B{children = scoreText} or scoreText
+		children = props.isWinner and Html.B{children = scoreText} or scoreText
 	}
 end
 
@@ -369,27 +273,4 @@ function OpponentDisplay.InlineScore2(opponent)
 	end
 end
 
-OpponentDisplay.propTypes.BracketScore = {
-	isWinner = 'boolean?',
-	scoreText = 'any',
-}
-
----Displays a score within the context of a bracket opponent entry.
----@param props {isWinner: boolean?, scoreText: string|number?}
----@return Html
-function OpponentDisplay.BracketScore(props)
-	DisplayUtil.assertPropTypes(props, OpponentDisplay.propTypes.BracketScore)
-
-	local scoreText = props.scoreText
-	if props.isWinner then
-		scoreText = '<b>' .. scoreText .. '</b>'
-	end
-
-	return mw.html.create('div'):addClass('brkts-opponent-score-outer')
-		:node(
-			mw.html.create('div'):addClass('brkts-opponent-score-inner')
-				:wikitext(scoreText)
-		)
-end
-
 return OpponentDisplay
diff --git a/lua/wikis/commons/OpponentDisplay/Starcraft.lua b/lua/wikis/commons/OpponentDisplay/Starcraft.lua
index 8e8f82da49d..2d370a94004 100644
--- a/lua/wikis/commons/OpponentDisplay/Starcraft.lua
+++ b/lua/wikis/commons/OpponentDisplay/Starcraft.lua
@@ -8,7 +8,6 @@
 local Lua = require('Module:Lua')
 
 local Array = Lua.import('Module:Array')
-local Class = Lua.import('Module:Class')
 local Faction = Lua.import('Module:Faction')
 local Icon = Lua.import('Module:Icon')
 local Logic = Lua.import('Module:Logic')
@@ -27,66 +26,6 @@ local StarcraftOpponentDisplay = Table.copy(OpponentDisplay)
 ---@class StarcraftBlockOpponentProps: BlockOpponentProps
 ---@field opponent StarcraftStandardOpponent
 
----Display component for an opponent entry appearing in a bracket match.
----@class StarcraftBracketOpponentEntry
----@operator call(...): StarcraftBracketOpponentEntry
----@field content Html
----@field root Html
-local BracketOpponentEntry = Class.new(OpponentDisplay.BracketOpponentEntry,
-	---@param self self
-	---@param opponent StarcraftStandardOpponent
-	---@param options {forceShortName: boolean, showTbd: boolean}
-	function(self, opponent, options)
-		local showFactionBackground = opponent.type == Opponent.solo
-			or opponent.type == Opponent.duo and opponent.isArchon
-
-		self.content = mw.html.create('div'):addClass('brkts-opponent-entry-left')
-			:addClass(showFactionBackground and Faction.bgClass(opponent.players[1].faction) or nil)
-
-		if opponent.type == Opponent.team then
-			if options.showTbd ~= false or not Opponent.isTbd(opponent) then
-				self:createTeam(opponent.template or 'tbd', options)
-			end
-		elseif Opponent.typeIsParty(opponent.type) then
-			self.content:node(StarcraftOpponentDisplay.BlockOpponent{
-				opponent = opponent,
-				overflow = 'ellipsis',
-				playerClass = 'starcraft-bracket-block-player',
-				showLink = false,
-				showTbd = options.showTbd,
-			})
-		else
-			self:createLiteral(opponent.name or '')
-		end
-
-		self.root = mw.html.create('div'):addClass('brkts-opponent-entry')
-			:node(self.content)
-	end
-)
-
----Adds scores to BracketOpponentEntry
----@param opponent StarcraftStandardOpponent
-function BracketOpponentEntry:addScores(opponent)
-	self.root:node(OpponentDisplay.BracketScore{
-		isWinner = opponent.placement == 1 or opponent.advances,
-		scoreText = StarcraftOpponentDisplay.InlineScore(opponent),
-	})
-
-	if opponent.score2 then
-		self.root:node(OpponentDisplay.BracketScore{
-			isWinner = opponent.placement2 == 1,
-			scoreText = StarcraftOpponentDisplay.InlineScore2(opponent),
-		})
-	end
-
-	if (opponent.placement2 or opponent.placement or 0) == 1
-		or opponent.advances then
-		self.content:addClass('brkts-opponent-win')
-	end
-end
-
-StarcraftOpponentDisplay.BracketOpponentEntry = BracketOpponentEntry
-
 ---Displays an opponent as a block element. The width of the component is
 ---determined by its layout context, and not of the opponent.
 ---@param props StarcraftBlockOpponentProps
@@ -111,7 +50,7 @@ end
 
 ---Displays a player opponent (solo, duo, trio, or quad) as a block element.
 ---@param props StarcraftBlockOpponentProps
----@return Widget
+---@return Renderable
 function StarcraftOpponentDisplay.BlockPlayers(props)
 	local opponent = props.opponent
 	local showFaction = props.showFaction ~= false
diff --git a/lua/wikis/commons/Widget/Match/Bracket/Opponent.lua b/lua/wikis/commons/Widget/Match/Bracket/Opponent.lua
new file mode 100644
index 00000000000..2780b1bbc07
--- /dev/null
+++ b/lua/wikis/commons/Widget/Match/Bracket/Opponent.lua
@@ -0,0 +1,47 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/Opponent
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local Opponent = Lua.import('Module:Opponent/Custom')
+local OpponentDisplay = Lua.import('Module:OpponentDisplay')
+
+local Component = Lua.import('Module:Widget/Component')
+
+---@class BracketOpponentProps
+---@field opponent standardOpponent
+---@field forceShortName boolean?
+---@field showTbd boolean?
+
+---@param props BracketOpponentProps
+---@return VNode
+local function BracketOpponent(props)
+	local opponent = props.opponent
+	if opponent.type == Opponent.team then
+		if props.showTbd ~= false or not Opponent.isTbd(opponent) then
+			return OpponentDisplay.BlockTeamContainer{
+				showLink = false,
+				style = props.forceShortName and 'short' or 'dynamic',
+				template = opponent.template or 'tbd',
+			}
+		end
+	elseif Opponent.typeIsParty(opponent.type) then
+		return OpponentDisplay.BlockPlayers{
+			opponent = opponent,
+			overflow = 'ellipsis',
+			showLink = false,
+			showTbd = props.showTbd,
+		}
+	end
+	-- Literal opponent type
+	return OpponentDisplay.BlockLiteral{
+		name = Opponent.toName(opponent),
+		overflow = 'ellipsis',
+	}
+end
+
+return Component.component(BracketOpponent)
diff --git a/lua/wikis/commons/Widget/Match/Bracket/Opponent/Starcraft.lua b/lua/wikis/commons/Widget/Match/Bracket/Opponent/Starcraft.lua
new file mode 100644
index 00000000000..0ab0617f44a
--- /dev/null
+++ b/lua/wikis/commons/Widget/Match/Bracket/Opponent/Starcraft.lua
@@ -0,0 +1,46 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/Opponent/Starcraft
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local Opponent = Lua.import('Module:Opponent/Custom')
+local OpponentDisplay = Lua.import('Module:OpponentDisplay/Starcraft')
+
+local Component = Lua.import('Module:Widget/Component')
+
+---@class StarcraftBracketOpponentProps: BracketOpponentProps
+---@field opponent StarcraftStandardOpponent
+
+---@param props StarcraftBracketOpponentProps
+---@return Renderable
+local function StarcraftBracketOpponent(props)
+	local opponent = props.opponent
+	if opponent.type == Opponent.team then
+		if props.showTbd ~= false or not Opponent.isTbd(opponent) then
+			return OpponentDisplay.BlockTeamContainer{
+				showLink = false,
+				style = props.forceShortName and 'short' or 'hybrid',
+				template = opponent.template or 'tbd',
+			}
+		end
+	elseif Opponent.typeIsParty(opponent.type) then
+		return OpponentDisplay.BlockOpponent{
+			opponent = opponent,
+			overflow = 'ellipsis',
+			playerClass = 'starcraft-bracket-block-player',
+			showLink = false,
+			showTbd = props.showTbd,
+		}
+	end
+	-- Literal opponent type
+	return OpponentDisplay.BlockLiteral{
+		name = Opponent.toName(opponent),
+		overflow = 'ellipsis',
+	}
+end
+
+return Component.component(StarcraftBracketOpponent)
diff --git a/lua/wikis/commons/Widget/Match/Bracket/OpponentEntry.lua b/lua/wikis/commons/Widget/Match/Bracket/OpponentEntry.lua
new file mode 100644
index 00000000000..112589ec91d
--- /dev/null
+++ b/lua/wikis/commons/Widget/Match/Bracket/OpponentEntry.lua
@@ -0,0 +1,64 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/OpponentEntry
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local Array = Lua.import('Module:Array')
+local DisplayHelper = Lua.import('Module:MatchGroup/Display/Helper')
+local Faction = Lua.import('Module:Faction')
+local Logic = Lua.import('Module:Logic')
+local Opponent = Lua.import('Module:Opponent/Custom')
+
+local Component = Lua.import('Module:Widget/Component')
+local Html = Lua.import('Module:Widget/Html')
+local ScoreContainer = Lua.import('Module:Widget/Match/Bracket/ScoreContainer/Custom')
+
+---@class BracketOpponentEntryProps: BracketOpponentProps
+---@field classes string[]?
+---@field height number
+---@field displayType string
+---@field showFactionBackground boolean?
+---@field BracketOpponent Component<BracketOpponentProps>?
+
+---@param props BracketOpponentEntryProps
+---@return VNode
+local function BracketOpponentEntry(props)
+	local opponent = props.opponent
+	local win = (opponent.placement2 or opponent.placement or 0) == 1
+		or opponent.advances
+	local BracketOpponent = props.BracketOpponent or Lua.import('Module:Widget/Match/Bracket/Opponent')
+	return Html.Div(DisplayHelper.addOpponentHighlightToProps(
+		{
+			classes = Array.extend(
+				'brkts-opponent-entry',
+				props.classes
+			),
+			css = props.height and {height = props.height .. 'px'} or nil,
+			children = {
+				Html.Div{
+					classes = Array.extend(
+						'brkts-opponent-entry-left',
+						win and 'brkts-opponent-win' or nil,
+						Logic.nilOr(
+							props.showFactionBackground, opponent.type == Opponent.solo
+						) and Faction.bgClass(opponent.players[1].faction) or nil
+					),
+					children = BracketOpponent(props),
+				},
+				props.displayType == 'bracket' and ScoreContainer(props) or nil
+			}
+		},
+		props.opponent
+	))
+end
+
+return Component.component(
+	BracketOpponentEntry,
+	{
+		showTbd = false
+	}
+)
diff --git a/lua/wikis/commons/Widget/Match/Bracket/OpponentEntry/Starcraft.lua b/lua/wikis/commons/Widget/Match/Bracket/OpponentEntry/Starcraft.lua
new file mode 100644
index 00000000000..b3c705f7922
--- /dev/null
+++ b/lua/wikis/commons/Widget/Match/Bracket/OpponentEntry/Starcraft.lua
@@ -0,0 +1,29 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/OpponentEntry
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local Opponent = Lua.import('Module:Opponent/Starcraft')
+
+local Component = Lua.import('Module:Widget/Component')
+local BracketOpponentEntry = Lua.import('Module:Widget/Match/Bracket/OpponentEntry')
+local StarcraftBracketOpponent = Lua.import('Module:Widget/Match/Bracket/Opponent/Starcraft')
+
+---@class StarcraftBracketOpponentEntryProps: BracketOpponentEntryProps
+---@field opponent StarcraftStandardOpponent
+
+---@param props StarcraftBracketOpponentEntryProps
+---@return VNode
+local function StarcraftBracketOpponentEntry(props)
+	local opponent = props.opponent
+	props.BracketOpponent = StarcraftBracketOpponent
+	props.showFactionBackground = opponent.type == Opponent.solo
+			or opponent.type == Opponent.duo and opponent.isArchon
+	return BracketOpponentEntry(props)
+end
+
+return Component.component(StarcraftBracketOpponentEntry, {showTbd = false})
diff --git a/lua/wikis/commons/Widget/Match/Bracket/Score.lua b/lua/wikis/commons/Widget/Match/Bracket/Score.lua
new file mode 100644
index 00000000000..d27a30b75e8
--- /dev/null
+++ b/lua/wikis/commons/Widget/Match/Bracket/Score.lua
@@ -0,0 +1,25 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/Score
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local Component = Lua.import('Module:Widget/Component')
+local Html = Lua.import('Module:Widget/Html')
+
+---@param props {isWinner: boolean?, scoreText: Renderable?}
+---@return VNode
+local function BracketScoreDisplay(props)
+	return Html.Div{
+		classes = {'brkts-opponent-score-outer'},
+		children = Html.Div{
+			classes = {'brkts-opponent-score-inner'},
+			children = props.isWinner and Html.B{children = props.scoreText} or props.scoreText
+		}
+	}
+end
+
+return Component.component(BracketScoreDisplay)
diff --git a/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer.lua b/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer.lua
new file mode 100644
index 00000000000..27f8c7f50fa
--- /dev/null
+++ b/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer.lua
@@ -0,0 +1,31 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/ScoreContainer
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local OpponentDisplay = Lua.import('Module:OpponentDisplay')
+
+local BracketScoreDisplay = Lua.import('Module:Widget/Match/Bracket/Score')
+local Component = Lua.import('Module:Widget/Component')
+
+---@param props {opponent: standardOpponent}
+---@return VNode[]
+local function BracketScoreContainer(props)
+	local opponent = props.opponent
+	return {
+		BracketScoreDisplay{
+			isWinner = opponent.placement == 1 or opponent.advances,
+			scoreText = OpponentDisplay.InlineScore(opponent),
+		},
+		opponent.placement2 and BracketScoreDisplay{
+			isWinner = opponent.placement2 == 1,
+			scoreText = OpponentDisplay.InlineScore2(opponent),
+		} or nil,
+	}
+end
+
+return Component.component(BracketScoreContainer)
diff --git a/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer/Custom.lua b/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer/Custom.lua
new file mode 100644
index 00000000000..bd3aeb889cc
--- /dev/null
+++ b/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer/Custom.lua
@@ -0,0 +1,10 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/ScoreContainer/Custom
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+return Lua.import('Module:Widget/Match/Bracket/ScoreContainer')
diff --git a/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer/Starcraft.lua b/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer/Starcraft.lua
new file mode 100644
index 00000000000..33ce816c3ee
--- /dev/null
+++ b/lua/wikis/commons/Widget/Match/Bracket/ScoreContainer/Starcraft.lua
@@ -0,0 +1,31 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/ScoreContainer/Starcraft
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local OpponentDisplay = Lua.import('Module:OpponentDisplay/Starcraft')
+
+local BracketScoreDisplay = Lua.import('Module:Widget/Match/Bracket/Score')
+local Component = Lua.import('Module:Widget/Component')
+
+---@param props {opponent: StarcraftStandardOpponent}
+---@return VNode[]
+local function StarcraftBracketScoreContainer(props)
+	local opponent = props.opponent
+	return {
+		BracketScoreDisplay{
+			isWinner = opponent.placement == 1 or opponent.advances,
+			scoreText = OpponentDisplay.InlineScore(opponent),
+		},
+		opponent.placement2 and BracketScoreDisplay{
+			isWinner = opponent.placement2 == 1,
+			scoreText = OpponentDisplay.InlineScore2(opponent),
+		} or nil,
+	}
+end
+
+return Component.component(StarcraftBracketScoreContainer)
diff --git a/lua/wikis/rocketleague/Brkts/WikiSpecific.lua b/lua/wikis/rocketleague/Brkts/WikiSpecific.lua
index 94f50699394..22d325d50be 100644
--- a/lua/wikis/rocketleague/Brkts/WikiSpecific.lua
+++ b/lua/wikis/rocketleague/Brkts/WikiSpecific.lua
@@ -7,20 +7,4 @@
 
 local Lua = require('Module:Lua')
 
-local Table = Lua.import('Module:Table')
-
-local BaseWikiSpecific = Lua.import('Module:Brkts/WikiSpecific/Base')
-
----@class RocketleagueBrktsWikiSpecific: BrktsWikiSpecific
-local WikiSpecific = Table.copy(BaseWikiSpecific)
-
----@param matchGroupType string
----@param maxOpponentCount integer
----@return function
-function WikiSpecific.getMatchGroupContainer(matchGroupType, maxOpponentCount)
-	return matchGroupType == 'matchlist'
-		and Lua.import('Module:MatchGroup/Display/Matchlist').MatchlistContainer
-		or Lua.import('Module:MatchGroup/Display/Bracket/Custom').BracketContainer
-end
-
-return WikiSpecific
+return Lua.import('Module:Brkts/WikiSpecific/Base')
diff --git a/lua/wikis/rocketleague/MatchGroup/Display/Bracket/Custom.lua b/lua/wikis/rocketleague/MatchGroup/Display/Bracket/Custom.lua
deleted file mode 100644
index 7e4f9958aee..00000000000
--- a/lua/wikis/rocketleague/MatchGroup/Display/Bracket/Custom.lua
+++ /dev/null
@@ -1,42 +0,0 @@
----
--- @Liquipedia
--- page=Module:MatchGroup/Display/Bracket/Custom
---
--- Please see https://github.com/Liquipedia/Lua-Modules to contribute
---
-
-local Lua = require('Module:Lua')
-
-local Table = Lua.import('Module:Table')
-
-local BracketDisplay = Lua.import('Module:MatchGroup/Display/Bracket')
-local CustomOpponentDisplay = Lua.import('Module:OpponentDisplay/Custom')
-local MatchGroupUtil = Lua.import('Module:MatchGroup/Util/Custom')
-
-local CustomBracketDisplay = {propTypes = {}}
-
----@param props {bracketId: string, config: BracketConfigOptions}
----@return Html
-function CustomBracketDisplay.BracketContainer(props)
-	return BracketDisplay.Bracket({
-		bracket = MatchGroupUtil.fetchMatchGroup(props.bracketId) --[[@as MatchGroupUtilBracket]],
-		config = Table.merge(props.config, {
-			OpponentEntry = CustomBracketDisplay.OpponentEntry,
-		})
-	})
-end
-
----@param props {opponent: standardOpponent, displayType: string, forceShortName: boolean?, height: number}
----@return Html
-function CustomBracketDisplay.OpponentEntry(props)
-	local opponentEntry = CustomOpponentDisplay.BracketOpponentEntry(
-		props.opponent,
-		{forceShortName = props.forceShortName, showTbd = false}
-	)
-	if props.displayType == 'bracket' then
-		opponentEntry:addScores(props.opponent)
-	end
-	return opponentEntry.root
-end
-
-return CustomBracketDisplay
diff --git a/lua/wikis/rocketleague/OpponentDisplay/Custom.lua b/lua/wikis/rocketleague/OpponentDisplay/Custom.lua
deleted file mode 100644
index 12a46ea86f1..00000000000
--- a/lua/wikis/rocketleague/OpponentDisplay/Custom.lua
+++ /dev/null
@@ -1,80 +0,0 @@
----
--- @Liquipedia
--- page=Module:OpponentDisplay/Custom
---
--- Please see https://github.com/Liquipedia/Lua-Modules to contribute
---
-
-local Lua = require('Module:Lua')
-
-local Class = Lua.import('Module:Class')
-local Table = Lua.import('Module:Table')
-
-local Opponent = Lua.import('Module:Opponent')
-local OpponentDisplay = Lua.import('Module:OpponentDisplay')
-
-local CustomOpponentDisplay = Table.deepCopy(OpponentDisplay)
-
-CustomOpponentDisplay.BracketOpponentEntry = Class.new(OpponentDisplay.BracketOpponentEntry, function(self) end)
-
----@class RocketLeagueStandardOpponent:standardOpponent
----@field extradata table?
-
----@param opponent RocketLeagueStandardOpponent
-function CustomOpponentDisplay.BracketOpponentEntry:addScores(opponent)
-	local extradata = opponent.extradata or {}
-	if not extradata.additionalScores then
-		OpponentDisplay.BracketOpponentEntry.addScores(self, opponent)
-		return
-	end
-
-	local score1Node = OpponentDisplay.BracketScore({
-		isWinner = extradata.set1win,
-		scoreText = CustomOpponentDisplay.InlineScoreSpecial{
-			opponent = opponent, score = extradata.score1
-		},
-	})
-	self.root:node(score1Node)
-
-	local score2Node
-	if extradata.score2 or opponent.score2 then
-		score2Node = OpponentDisplay.BracketScore({
-			isWinner = extradata.set2win,
-			scoreText = CustomOpponentDisplay.InlineScoreSpecial{
-				opponent = opponent, score = extradata.score2
-			},
-		})
-	end
-	self.root:node(score2Node)
-
-	local score3Node
-	if extradata.score3 then
-		score3Node = OpponentDisplay.BracketScore({
-			isWinner = extradata.set3win,
-			scoreText = CustomOpponentDisplay.InlineScoreSpecial{
-				opponent = opponent, score = extradata.score3
-			},
-		})
-	end
-	self.root:node(score3Node)
-
-	if (opponent.placement2 or opponent.placement or 0) == 1
-		or opponent.advances then
-		self.content:addClass('brkts-opponent-win')
-	end
-end
-
----Displays a score or status of the opponent, as a string.
----@param props {opponent: RocketLeagueStandardOpponent, status: string?, score: number?}
----@return number|string
-function CustomOpponentDisplay.InlineScoreSpecial(props)
-	if props.score == -1 then
-		return ''
-	end
-	if props.score == 0 and Opponent.isTbd(props.opponent) then
-		return ''
-	end
-	return tostring(props.score)
-end
-
-return CustomOpponentDisplay
diff --git a/lua/wikis/rocketleague/Widget/Match/Bracket/ScoreContainer/Custom.lua b/lua/wikis/rocketleague/Widget/Match/Bracket/ScoreContainer/Custom.lua
new file mode 100644
index 00000000000..e7f6cce2cdf
--- /dev/null
+++ b/lua/wikis/rocketleague/Widget/Match/Bracket/ScoreContainer/Custom.lua
@@ -0,0 +1,54 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/ScoreContainer/Custom
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local Opponent = Lua.import('Module:Opponent/Custom')
+
+local BracketScoreContainer = Lua.import('Module:Widget/Match/Bracket/ScoreContainer')
+local BracketScoreDisplay = Lua.import('Module:Widget/Match/Bracket/Score')
+local Component = Lua.import('Module:Widget/Component')
+local WidgetUtil = Lua.import('Module:Widget/Util')
+
+---@param props {opponent: standardOpponent}
+---@return VNode[]
+local function RocketLeagueBracketScoreContainer(props)
+	local opponent = props.opponent
+	local extradata = opponent.extradata or {}
+	if not extradata.additionalScores then
+		return BracketScoreContainer(props)
+	end
+
+	---Displays a score or status of the opponent, as a string.
+	---@param score number?
+	---@return string
+	local function InlineScoreSpecial(score)
+		if score == -1 then
+			return ''
+		elseif score == 0 and Opponent.isTbd(opponent) then
+			return ''
+		end
+		return tostring(score)
+	end
+
+	return WidgetUtil.collect(
+		BracketScoreDisplay{
+			isWinner = extradata.set1win,
+			scoreText = InlineScoreSpecial(extradata.score1),
+		},
+		(extradata.score2 or opponent.score2) and BracketScoreDisplay{
+			isWinner = extradata.set2win,
+			scoreText = InlineScoreSpecial(extradata.score2),
+		} or nil,
+		extradata.score3 and BracketScoreDisplay{
+			isWinner = extradata.set3win,
+			scoreText = InlineScoreSpecial(extradata.score3),
+		} or nil
+	)
+end
+
+return Component.component(RocketLeagueBracketScoreContainer)
diff --git a/lua/wikis/smash/Brkts/WikiSpecific.lua b/lua/wikis/smash/Brkts/WikiSpecific.lua
index 9e0e1dabef6..ed3db671d4b 100644
--- a/lua/wikis/smash/Brkts/WikiSpecific.lua
+++ b/lua/wikis/smash/Brkts/WikiSpecific.lua
@@ -15,15 +15,6 @@ local BaseWikiSpecific = Lua.import('Module:Brkts/WikiSpecific/Base')
 ---@class SmashBrktsWikiSpecific: BrktsWikiSpecific
 local WikiSpecific = Table.copy(BaseWikiSpecific)
 
----@param matchGroupType string
----@param maxOpponentCount integer
----@return function
-function WikiSpecific.getMatchGroupContainer(matchGroupType, maxOpponentCount)
-	return matchGroupType == 'matchlist'
-		and Lua.import('Module:MatchGroup/Display/Matchlist').MatchlistContainer
-		or Lua.import('Module:MatchGroup/Display/Bracket/Custom').BracketContainer
-end
-
 ---@param match table
 ---@return boolean
 function WikiSpecific.matchHasDetails(match)
diff --git a/lua/wikis/smash/MatchGroup/Display/Bracket/Custom.lua b/lua/wikis/smash/MatchGroup/Display/Bracket/Custom.lua
deleted file mode 100644
index a623874221c..00000000000
--- a/lua/wikis/smash/MatchGroup/Display/Bracket/Custom.lua
+++ /dev/null
@@ -1,66 +0,0 @@
----
--- @Liquipedia
--- page=Module:MatchGroup/Display/Bracket/Custom
---
--- Please see https://github.com/Liquipedia/Lua-Modules to contribute
---
-
-local Lua = require('Module:Lua')
-
-local Array = Lua.import('Module:Array')
-local Characters = Lua.import('Module:Characters')
-local Table = Lua.import('Module:Table')
-
-local Opponent = Lua.import('Module:Opponent/Custom')
-local OpponentDisplay = Lua.import('Module:OpponentDisplay/Custom')
-
-local BracketDisplay = Lua.import('Module:MatchGroup/Display/Bracket')
-local MatchGroupUtil = Lua.import('Module:MatchGroup/Util/Custom')
-
-local CustomBracketDisplay = {propTypes = {}}
-
----@param props {bracketId: string, config: BracketConfigOptions}
----@return Html
-function CustomBracketDisplay.BracketContainer(props)
-	return BracketDisplay.Bracket({
-		bracket = MatchGroupUtil.fetchMatchGroup(props.bracketId) --[[@as MatchGroupUtilBracket]],
-		config = Table.merge(props.config, {
-			OpponentEntry = CustomBracketDisplay.OpponentEntry,
-		})
-	})
-end
-
----@param props {opponent: SmashStandardOpponent, displayType: string, forceShortName: boolean?, height: number}
----@return Html
-function CustomBracketDisplay.OpponentEntry(props)
-	local opponentEntry = OpponentDisplay.BracketOpponentEntry(
-		props.opponent,
-		{forceShortName = props.forceShortName, showTbd = false}
-	)
-	if props.displayType == 'bracket' and props.opponent.type == Opponent.solo then
-		CustomBracketDisplay._addHeads(opponentEntry, props.opponent)
-		if props.opponent.placement == 1 then
-			opponentEntry.content:addClass('brkts-opponent-win')
-		end
-	elseif props.displayType == 'bracket' then
-		opponentEntry:addScores(props.opponent)
-	end
-	return opponentEntry.root
-end
-
----@param opponentEntry BracketOpponentEntry
----@param opponent SmashStandardOpponent
-function CustomBracketDisplay._addHeads(opponentEntry, opponent)
-	local game = opponent.players[1].game
-	local charactersNode = mw.html.create('div'):css('display', 'flex'):css('align-items', 'center')
-	Array.forEach(opponent.players[1].heads or {}, function(headData)
-		charactersNode:node(
-			mw.html.create('span')
-				:node(Characters.GetIconAndName{headData.name, game = game})
-				:css('opacity', headData.status == 0 and '0.3' or nil)
-		)
-	end)
-	opponentEntry.root:node(charactersNode)
-end
-
-return CustomBracketDisplay
diff --git a/lua/wikis/starcraft/Brkts/WikiSpecific.lua b/lua/wikis/starcraft/Brkts/WikiSpecific.lua
index e3f843e0739..5fbfb065b9c 100644
--- a/lua/wikis/starcraft/Brkts/WikiSpecific.lua
+++ b/lua/wikis/starcraft/Brkts/WikiSpecific.lua
@@ -11,6 +11,7 @@ local FnUtil = Lua.import('Module:FnUtil')
 local Table = Lua.import('Module:Table')
 
 local BaseWikiSpecific = Lua.import('Module:Brkts/WikiSpecific/Base')
+local StarcraftBracketOpponentEntry = Lua.import('Module:Widget/Match/Bracket/OpponentEntry')
 
 ---@class StarcraftBrktsWikiSpecific: BrktsWikiSpecific
 local WikiSpecific = Table.copy(BaseWikiSpecific)
@@ -38,7 +39,7 @@ function WikiSpecific.getMatchGroupContainer(matchGroupType, maxOpponentCount)
 	end
 
 	local Bracket = Lua.import('Module:MatchGroup/Display/Bracket')
-	return WikiSpecific.adjustMatchGroupContainerConfig(Bracket.BracketContainer)
+	return WikiSpecific.adjustBracketContainerConfig(Bracket.BracketContainer)
 end
 
 ---@param displayContainer function
@@ -51,6 +52,19 @@ function WikiSpecific.adjustMatchGroupContainerConfig(displayContainer)
 	end
 end
 
+---@param displayContainer fun(props: {bracketId: string, config: BracketConfigOptions}): Html
+---@return fun(props: {bracketId: string, config: BracketConfigOptions}): Html
+function WikiSpecific.adjustBracketContainerConfig(displayContainer)
+	local StarcraftMatchSummary = Lua.import('Module:MatchSummary/Starcraft')
+	return function(props)
+		local config = Table.merge(props.config, {
+			MatchSummaryContainer = StarcraftMatchSummary.getByMatchId,
+			OpponentEntry = StarcraftBracketOpponentEntry
+		})
+		return displayContainer(Table.merge(props, {config = config}))
+	end
+end
+
 ---@param displayMode string
 ---@return function?
 function WikiSpecific.getMatchContainer(displayMode)
diff --git a/lua/wikis/starcraft/Widget/Match/Bracket/ScoreContainer/Custom.lua b/lua/wikis/starcraft/Widget/Match/Bracket/ScoreContainer/Custom.lua
new file mode 100644
index 00000000000..b8290af5ae9
--- /dev/null
+++ b/lua/wikis/starcraft/Widget/Match/Bracket/ScoreContainer/Custom.lua
@@ -0,0 +1,10 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/ScoreContainer/Custom
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+return Lua.import('Module:Widget/Match/Bracket/ScoreContainer/Starcraft')
diff --git a/lua/wikis/starcraft2/Brkts/WikiSpecific.lua b/lua/wikis/starcraft2/Brkts/WikiSpecific.lua
index 4a6ec507795..d929032b966 100644
--- a/lua/wikis/starcraft2/Brkts/WikiSpecific.lua
+++ b/lua/wikis/starcraft2/Brkts/WikiSpecific.lua
@@ -11,6 +11,7 @@ local FnUtil = Lua.import('Module:FnUtil')
 local Table = Lua.import('Module:Table')
 
 local BaseWikiSpecific = Lua.import('Module:Brkts/WikiSpecific/Base')
+local StarcraftBracketOpponentEntry = Lua.import('Module:Widget/Match/Bracket/OpponentEntry')
 
 ---@class Starcraft2BrktsWikiSpecific: BrktsWikiSpecific
 local WikiSpecific = Table.copy(BaseWikiSpecific)
@@ -38,7 +39,7 @@ function WikiSpecific.getMatchGroupContainer(matchGroupType, maxOpponentCount)
 	end
 
 	local Bracket = Lua.import('Module:MatchGroup/Display/Bracket')
-	return WikiSpecific.adjustMatchGroupContainerConfig(Bracket.BracketContainer)
+	return WikiSpecific.adjustBracketContainerConfig(Bracket.BracketContainer)
 end
 
 ---@param displayContainer function
@@ -51,6 +52,19 @@ function WikiSpecific.adjustMatchGroupContainerConfig(displayContainer)
 	end
 end
 
+---@param displayContainer fun(props: {bracketId: string, config: BracketConfigOptions}): Html
+---@return fun(props: {bracketId: string, config: BracketConfigOptions}): Html
+function WikiSpecific.adjustBracketContainerConfig(displayContainer)
+	local StarcraftMatchSummary = Lua.import('Module:MatchSummary/Starcraft')
+	return function(props)
+		local config = Table.merge(props.config, {
+			MatchSummaryContainer = StarcraftMatchSummary.getByMatchId,
+			OpponentEntry = StarcraftBracketOpponentEntry
+		})
+		return displayContainer(Table.merge(props, {config = config}))
+	end
+end
+
 ---@param displayMode string
 ---@return function?
 function WikiSpecific.getMatchContainer(displayMode)
diff --git a/lua/wikis/starcraft2/Widget/Match/Bracket/ScoreContainer/Custom.lua b/lua/wikis/starcraft2/Widget/Match/Bracket/ScoreContainer/Custom.lua
new file mode 100644
index 00000000000..b8290af5ae9
--- /dev/null
+++ b/lua/wikis/starcraft2/Widget/Match/Bracket/ScoreContainer/Custom.lua
@@ -0,0 +1,10 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/ScoreContainer/Custom
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+return Lua.import('Module:Widget/Match/Bracket/ScoreContainer/Starcraft')
diff --git a/lua/wikis/trackmania/Brkts/WikiSpecific.lua b/lua/wikis/trackmania/Brkts/WikiSpecific.lua
index 1bfb2a38e90..19015c5cabf 100644
--- a/lua/wikis/trackmania/Brkts/WikiSpecific.lua
+++ b/lua/wikis/trackmania/Brkts/WikiSpecific.lua
@@ -23,7 +23,7 @@ function WikiSpecific.getMatchGroupContainer(matchGroupType, maxOpponentCount)
 		return MatchList.MatchlistContainer
 	end
 
-	local Bracket = Lua.import('Module:MatchGroup/Display/Bracket/Custom')
+	local Bracket = Lua.import('Module:MatchGroup/Display/Bracket')
 	return Bracket.BracketContainer
 end
 
diff --git a/lua/wikis/trackmania/MatchGroup/Display/Bracket/Custom.lua b/lua/wikis/trackmania/MatchGroup/Display/Bracket/Custom.lua
deleted file mode 100644
index 91e91607555..00000000000
--- a/lua/wikis/trackmania/MatchGroup/Display/Bracket/Custom.lua
+++ /dev/null
@@ -1,42 +0,0 @@
----
--- @Liquipedia
--- page=Module:MatchGroup/Display/Bracket/Custom
---
--- Please see https://github.com/Liquipedia/Lua-Modules to contribute
---
-
-local Lua = require('Module:Lua')
-
-local Table = Lua.import('Module:Table')
-
-local BracketDisplay = Lua.import('Module:MatchGroup/Display/Bracket')
-local CustomOpponentDisplay = Lua.import('Module:OpponentDisplay/Custom')
-local MatchGroupUtil = Lua.import('Module:MatchGroup/Util/Custom')
-
-local CustomBracketDisplay = {propTypes = {}}
-
----@param props {bracketId: string, config: BracketConfigOptions}
----@return Html
-function CustomBracketDisplay.BracketContainer(props)
-	return BracketDisplay.Bracket({
-		bracket = MatchGroupUtil.fetchMatchGroup(props.bracketId) --[[@as MatchGroupUtilBracket]],
-		config = Table.merge(props.config, {
-			OpponentEntry = CustomBracketDisplay.OpponentEntry,
-		})
-	})
-end
-
----@param props {opponent: standardOpponent, displayType: string, forceShortName: boolean?, height: number}
----@return unknown
-function CustomBracketDisplay.OpponentEntry(props)
-	local opponentEntry = CustomOpponentDisplay.BracketOpponentEntry(
-		props.opponent,
-		{forceShortName = props.forceShortName, showTbd = false}
-	)
-	if props.displayType == 'bracket' then
-		opponentEntry:addScores(props.opponent)
-	end
-	return opponentEntry.root
-end
-
-return CustomBracketDisplay
diff --git a/lua/wikis/trackmania/OpponentDisplay/Custom.lua b/lua/wikis/trackmania/OpponentDisplay/Custom.lua
deleted file mode 100644
index 0854aa795c9..00000000000
--- a/lua/wikis/trackmania/OpponentDisplay/Custom.lua
+++ /dev/null
@@ -1,79 +0,0 @@
----
--- @Liquipedia
--- page=Module:OpponentDisplay/Custom
---
--- Please see https://github.com/Liquipedia/Lua-Modules to contribute
---
-
-local Lua = require('Module:Lua')
-
-local Class = Lua.import('Module:Class')
-local Logic = Lua.import('Module:Logic')
-local Table = Lua.import('Module:Table')
-
-local Opponent = Lua.import('Module:Opponent')
-local OpponentDisplay = Lua.import('Module:OpponentDisplay')
-
-local OpponentDisplayCustom = Table.deepCopy(OpponentDisplay)
-
-local SCORE_STATUS = 'S'
-local NO_SCORE = -1
-local ZERO_SCORE = 0
-
-OpponentDisplayCustom.BracketOpponentEntry = Class.new(OpponentDisplay.BracketOpponentEntry)
-
----@class TrackmaniaStandardOpponent:standardOpponent
----@field score3 number?
----@field status3 string?
----@field extradata table?
-
----@param opponent TrackmaniaStandardOpponent
-function OpponentDisplayCustom.BracketOpponentEntry:addScores(opponent)
-	local extradata = opponent.extradata or {}
-	if not extradata.additionalScores then
-		OpponentDisplay.BracketOpponentEntry.addScores(self, opponent)
-		return
-	end
-	self.root:node(OpponentDisplay.BracketScore{
-		isWinner = extradata.set1win,
-		scoreText = OpponentDisplayCustom.InlineScore(opponent, 1),
-	})
-	if opponent.extradata.score2 or opponent.score2 then
-		self.root:node(OpponentDisplay.BracketScore{
-			isWinner = extradata.set2win,
-			scoreText = OpponentDisplayCustom.InlineScore(opponent, 2),
-		})
-	end
-	if opponent.extradata.score3 then
-		self.root:node(OpponentDisplay.BracketScore{
-			isWinner = extradata.set3win,
-			scoreText = OpponentDisplayCustom.InlineScore(opponent, 3)
-		})
-	end
-	if (opponent.placement2 or opponent.placement or 0) == 1
-		or opponent.advances then
-		self.content:addClass('brkts-opponent-win')
-	end
-end
-
----@param opponent TrackmaniaStandardOpponent
----@param scoreIndex integer|string
----@return number|string
-function OpponentDisplayCustom.InlineScore(opponent, scoreIndex)
-	scoreIndex = scoreIndex or ''
-	local status = opponent['status' .. scoreIndex] or opponent.extradata['status' .. scoreIndex]
-	local score = tonumber(opponent['score' .. scoreIndex] or opponent.extradata['score' .. scoreIndex])
-
-	if Logic.isNotEmpty(status) and status ~= SCORE_STATUS then
-		return status
-	end
-
-	score = score or 0
-	if (score == ZERO_SCORE and Opponent.isTbd(opponent)) or score == NO_SCORE then
-		return ''
-	end
-
-	return score
-end
-
-return OpponentDisplayCustom
diff --git a/lua/wikis/trackmania/Widget/Match/Bracket/ScoreContainer/Custom.lua b/lua/wikis/trackmania/Widget/Match/Bracket/ScoreContainer/Custom.lua
new file mode 100644
index 00000000000..6a12f2cfee2
--- /dev/null
+++ b/lua/wikis/trackmania/Widget/Match/Bracket/ScoreContainer/Custom.lua
@@ -0,0 +1,64 @@
+---
+-- @Liquipedia
+-- page=Module:Widget/Match/Bracket/ScoreContainer/Custom
+--
+-- Please see https://github.com/Liquipedia/Lua-Modules to contribute
+--
+
+local Lua = require('Module:Lua')
+
+local Logic = Lua.import('Module:Logic')
+local Opponent = Lua.import('Module:Opponent/Custom')
+
+local BracketScoreContainer = Lua.import('Module:Widget/Match/Bracket/ScoreContainer')
+local BracketScoreDisplay = Lua.import('Module:Widget/Match/Bracket/Score')
+local Component = Lua.import('Module:Widget/Component')
+local WidgetUtil = Lua.import('Module:Widget/Util')
+
+---@param props {opponent: standardOpponent}
+---@return VNode[]
+local function TrackmaniaBracketScoreContainer(props)
+	local opponent = props.opponent
+	local extradata = opponent.extradata or {}
+	if not extradata.additionalScores then
+		return BracketScoreContainer(props)
+	end
+
+	---@param scoreIndex integer|string
+	---@return number|string
+	local function InlineScoreSpecial(scoreIndex)
+		scoreIndex = scoreIndex or ''
+		local status = opponent['status' .. (
+			scoreIndex == 1 and '' or scoreIndex
+		)] or opponent.extradata['status' .. scoreIndex]
+		local score = tonumber(opponent['score' .. scoreIndex] or opponent.extradata['score' .. scoreIndex])
+
+		if Logic.isNotEmpty(status) and status ~= 'S' then
+			return status
+		end
+
+		score = score or 0
+		if (score == 0 and Opponent.isTbd(opponent)) or score == -1 then
+			return ''
+		end
+
+		return score
+	end
+
+	return WidgetUtil.collect(
+		BracketScoreDisplay{
+			isWinner = extradata.set1win,
+			scoreText = InlineScoreSpecial(1),
+		},
+		(extradata.score2 or opponent.score2) and BracketScoreDisplay{
+			isWinner = extradata.set2win,
+			scoreText = InlineScoreSpecial(2),
+		} or nil,
+		extradata.score3 and BracketScoreDisplay{
+			isWinner = extradata.set3win,
+			scoreText = InlineScoreSpecial(3),
+		} or nil
+	)
+end
+
+return Component.component(TrackmaniaBracketScoreContainer)