Skip to the content

Taisen Brackets対戦

Knockout brackets as SVG, from a list of ties.

Taisen (対戦, たいせん) is Japanese for a matchup: two sides facing each other. About the name

Contents

Reference · Where every tie sits

Feedtype

What takes a side of a tie: a tie's id (its winner, as feeds always meant) or { tie, result }, which can name the tie's loser as well (a play-in's loser goes on to a decider).

Import it

import type { Feed } from "@johnmorrisdotca/taisen-brackets/layout";

Also exported from: @johnmorrisdotca/taisen-brackets

Definition

type Feed = string | {
    tie: string;
    result: "winner" | "loser";
};

Examples

import { layoutBracket, type Feed } from "@johnmorrisdotca/taisen-brackets";

const loser: Feed = { tie: "sf1", result: "loser" };
const layout = layoutBracket([
  { id: "sf1", sides: ["A", "B"], score: [1, 0] },
  { id: "sf2", sides: ["C", "D"], score: [0, 2] },
  { id: "final", sides: ["A", "D"], score: [2, 1] },
  { id: "bronze", sides: [null, null], feeds: [loser, { tie: "sf2", result: "loser" }], third: true },
]);
console.log(layout.third);
3

What it prints (run when this page was built)

View sourceEdit on GitHubMade from the source of @johnmorrisdotca/taisen-brackets 0.20.0.