feat(team_participant): reorganize former members with subheaders in Former tab

lua/wikis/commons/TeamParticipants/Parse/Wiki.lua

@@ -203,6 +203,7 @@ function TeamParticipantsWikiParser.parsePlayer(playerInput)
 	local resultsInput = Logic.readBoolOrNil(playerInput.results)
 	local roles = RoleUtil.readRoleArgs(playerInput.role)
 	local playerType = playerInput.type or 'player'
+	local isFormer = playerType == 'former'
 
 	local hasNoStaffRoles = Array.all(roles, function(role) return role.type ~= RoleUtil.ROLE_TYPE.STAFF end)
 
@@ -214,6 +215,7 @@ function TeamParticipantsWikiParser.parsePlayer(playerInput)
 		roles = roles,
 		trophies = tonumber(playerInput.trophies),
 		type = playerType,
+		isFormer = isFormer,
 		played = Logic.nilOr(playedInput, true),
 		results = Logic.nilOr(resultsInput, playedInput, true),
 	}

lua/wikis/commons/Widget/Participants/Team/PotentialQualifiers.lua

@@ -30,7 +30,7 @@ function PotentialQualifiers:render()
 
 	local children = {
 		Div{
-			classes = {'team-participant-card__potential-qualifiers-title'},
+			classes = {'team-participant-card__subheader'},
 			children = 'Potential qualifiers'
 		},
 		Div{

lua/wikis/commons/Widget/Participants/Team/Roster.lua

@@ -1,3 +1,3 @@
 ---
 -- @Liquipedia
 -- page=Module:Widget/Participants/Team/Roster
@@ -110,6 +110,62 @@
 			end
 			return orderA < orderB
 		end)
+
+		-- Split into former players and former staff
+		local formerPlayers = Array.filter(players, function(player)
+			return player.extradata.isFormer and player.extradata.type ~= 'staff'
+		end)
+		local formerStaff = Array.filter(players, function(player)
+			return player.extradata.isFormer and player.extradata.type == 'staff'
+		end)
+
+		-- If we have former players or staff, render with subheaders
+		if #formerPlayers > 0 or #formerStaff > 0 then
+			local function makeRosterSection(sectionPlayers)
+				return Div{
+					classes = { 'team-participant-roster' },
+					children = Array.map(sectionPlayers, function(player, index)
+						local playerTeam = participant.opponent.template ~= player.team and player.team or nil
+						local playerTeamAsOpponent = playerTeam and Opponent.readOpponentArgs{
+							type = Opponent.team,
+							template = playerTeam,
+						} or nil
+						local roleLeft, roleRight = getRoleDisplays(player)
+						return ParticipantsTeamMember{
+							player = player,
+							team = playerTeamAsOpponent,
+							even = index % 2 == 0,
+							roleLeft = roleLeft,
+							roleRight = roleRight,
+							trophies = player.extradata.trophies or 0,
+						}
+					end)
+				}
+			end
+
+			local children = {}
+			if #formerPlayers > 0 then
+				table.insert(children, Div{
+					classes = {'team-participant-card__subheader'},
+					children = 'Players'
+				})
+				table.insert(children, makeRosterSection(formerPlayers))
+			end
+			if #formerStaff > 0 then
+				table.insert(children, Div{
+					classes = {'team-participant-card__subheader'},
+					children = 'Staff'
+				})
+				table.insert(children, makeRosterSection(formerStaff))
+			end
+
+			return Div{
+				classes = { 'team-participant-roster' },
+				children = children
+			}
+		end
+
+		-- Otherwise render as a single roster (for non-former tabs)
 		return Div{
 			classes = { 'team-participant-roster' },
 			children = Array.map(players, function(player, index)
@@ -126,7 +182,6 @@
 					roleLeft = roleLeft,
 					roleRight = roleRight,
 					trophies = player.extradata.trophies or 0,
-					strikethrough = player.extradata.type == 'former',
 				}
 			end)
 		}
@@ -136,7 +191,13 @@
 		local tabTypeEnum, tabData = tabTuple[1], tabTuple[2]
 		local tabPlayers = Array.filter(participant.opponent.players or {}, function(player)
 			local personType = player.extradata.type
-			return PERSON_TYPE_TO_TAB[personType] == tabTypeEnum
+			if tabTypeEnum == TAB_ENUM.STAFF then
+				return personType == 'staff'
+			elseif tabTypeEnum == TAB_ENUM.FORMER then
+				return player.extradata.isFormer
+			else
+				return PERSON_TYPE_TO_TAB[personType] == tabTypeEnum
+			end
 		end)
 		return {
 			order = tabData.order,

stylesheets/commons/TeamParticipantCard.scss

@@ -427,20 +427,6 @@ $compact-selector: '[data-switch-group="team-cards-compact"]';
 		flex-direction: column;
 		gap: 0.25rem;
 
-		&-title {
-			padding: 0 0.5rem;
-			font-size: 0.875rem;
-			font-weight: bold;
-
-			.theme--light & {
-				color: var( --clr-secondary-25 );
-			}
-
-			.theme--dark & {
-				color: var( --clr-secondary-90 );
-			}
-		}
-
 		&-list {
 			display: flex;
 			flex-direction: column;
@@ -467,6 +453,20 @@ $compact-selector: '[data-switch-group="team-cards-compact"]';
 			}
 		}
 	}
+
+	&__subheader {
+		padding: 0 0.5rem;
+		font-size: 0.875rem;
+		font-weight: bold;
+
+		.theme--light & {
+			color: var( --clr-secondary-25 );
+		}
+
+		.theme--dark & {
+			color: var( --clr-secondary-90 );
+		}
+	}
 }
 
 body:has( .switch-toggle-active#{ $compact-selector } ) {