tournament-brackets-ui 0.1.0

package/src/stories/Teams/08-Team/CollapsedRight.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedRight from "../../../components/Teams/08-Team/CollapsedRight";
+import { sampleTeams8 } from "../../data/teams";
+
+export default {
+  title: "Teams/08-Team/CollapsedRight",
+  component: CollapsedRight,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: "text",
+      description: "CSS font-family for the team-ID cell",
+    },
+    teamIDColor: {
+      control: "color",
+      description: "CSS text color for the team-ID cell",
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  },
+};
+
+const Template = (args) => <CollapsedRight {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams8,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/08-Team/Expanded.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import Expanded from "../../../components/Teams/08-Team/Expanded";
+import { sampleTeams8 } from "../../data/teams";
+
+export default {
+  title: "Teams/08-Team/Expanded",
+  component: Expanded,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: "text",
+      description: "CSS font-family for the team-ID cell",
+    },
+    teamIDColor: {
+      control: "color",
+      description: "CSS text color for the team-ID cell",
+    },
+    teamIDFontSize: {
+      control: { type: "number", min: 6, max: 72, step: 1 },
+      description: "Font size (in points) for the team-ID cell",
+    },
+  },
+};
+
+const Template = (args) => <Expanded {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams8,
+  teamIDFontFamily: "Arial, sans-serif",
+  teamIDColor: "#c00",
+  teamIDFontSize: 14,
+};

package/src/stories/Teams/09-Team/CollapsedLeft.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedLeft from "../../../components/Teams/09-Team/CollapsedLeft";
+import { sampleTeams9 } from "../../data/teams";
+
+export default {
+  title: "Teams/09-Team/CollapsedLeft",
+  component: CollapsedLeft,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedLeft {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams9,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/09-Team/CollapsedRight.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedRight from "../../../components/Teams/09-Team/CollapsedRight";
+import { sampleTeams9 } from "../../data/teams";
+
+export default {
+  title: "Teams/09-Team/CollapsedRight",
+  component: CollapsedRight,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedRight {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams9,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/09-Team/Expanded.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import Expanded from "../../../components/Teams/09-Team/Expanded";
+import { sampleTeams9 } from "../../data/teams";
+
+export default {
+  title: "Teams/09-Team/Expanded",
+  component: Expanded,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <Expanded {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams9,
+  teamIDFontFamily: "Arial, sans-serif",
+  teamIDColor: "#c00",
+  teamIDFontSize: 14,
+};

package/src/stories/Teams/10-Team/CollapsedLeft.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedLeft from "../../../components/Teams/10-Team/CollapsedLeft";
+import { sampleTeams10 } from "../../data/teams";
+
+export default {
+  title: "Teams/10-Team/CollapsedLeft",
+  component: CollapsedLeft,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedLeft {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams10,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/10-Team/CollapsedRight.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedRight from "../../../components/Teams/10-Team/CollapsedRight";
+import { sampleTeams10 } from "../../data/teams";
+
+export default {
+  title: "Teams/10-Team/CollapsedRight",
+  component: CollapsedRight,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedRight {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams10,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/10-Team/Expanded.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import Expanded from "../../../components/Teams/10-Team/Expanded";
+import { sampleTeams10 } from "../../data/teams";
+
+export default {
+  title: "Teams/10-Team/Expanded",
+  component: Expanded,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <Expanded {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams10,
+  teamIDFontFamily: "Arial, sans-serif",
+  teamIDColor: "#c00",
+  teamIDFontSize: 14,
+};

package/src/stories/Teams/11-Team/CollapsedLeft.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedLeft from "../../../components/Teams/11-Team/CollapsedLeft";
+import { sampleTeams11 } from "../../data/teams";
+
+export default {
+  title: "Teams/11-Team/CollapsedLeft",
+  component: CollapsedLeft,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedLeft {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams11,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/11-Team/CollapsedRight.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedRight from "../../../components/Teams/11-Team/CollapsedRight";
+import { sampleTeams11 } from "../../data/teams";
+
+export default {
+  title: "Teams/11-Team/CollapsedRight",
+  component: CollapsedRight,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedRight {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams11,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/11-Team/Expanded.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import Expanded from "../../../components/Teams/11-Team/Expanded";
+import { sampleTeams11 } from "../../data/teams";
+
+export default {
+  title: "Teams/11-Team/Expanded",
+  component: Expanded,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <Expanded {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams11,
+  teamIDFontFamily: "Arial, sans-serif",
+  teamIDColor: "#c00",
+  teamIDFontSize: 14,
+};

package/src/stories/Teams/12-Team/CollapsedLeft.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedLeft from "../../../components/Teams/12-Team/CollapsedLeft";
+import { sampleTeams12 } from "../../data/teams";
+
+export default {
+  title: "Teams/12-Team/CollapsedLeft",
+  component: CollapsedLeft,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedLeft {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams12,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/12-Team/CollapsedRight.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedRight from "../../../components/Teams/12-Team/CollapsedRight";
+import { sampleTeams12 } from "../../data/teams";
+
+export default {
+  title: "Teams/12-Team/CollapsedRight",
+  component: CollapsedRight,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedRight {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams12,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/12-Team/Expanded.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import Expanded from "../../../components/Teams/12-Team/Expanded";
+import { sampleTeams12 } from "../../data/teams";
+
+export default {
+  title: "Teams/12-Team/Expanded",
+  component: Expanded,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <Expanded {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams12,
+  teamIDFontFamily: "Arial, sans-serif",
+  teamIDColor: "#c00",
+  teamIDFontSize: 14,
+};

package/src/stories/Teams/13-Team/CollapsedLeft.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedLeft from "../../../components/Teams/13-Team/CollapsedLeft";
+import { sampleTeams13 } from "../../data/teams";
+
+export default {
+  title: "Teams/13-Team/CollapsedLeft",
+  component: CollapsedLeft,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedLeft {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams13,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/13-Team/CollapsedRight.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedRight from "../../../components/Teams/13-Team/CollapsedRight";
+import { sampleTeams13 } from "../../data/teams";
+
+export default {
+  title: "Teams/13-Team/CollapsedRight",
+  component: CollapsedRight,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedRight {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams13,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/13-Team/Expanded.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import Expanded from "../../../components/Teams/13-Team/Expanded";
+import { sampleTeams13 } from "../../data/teams";
+
+export default {
+  title: "Teams/13-Team/Expanded",
+  component: Expanded,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <Expanded {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams13,
+  teamIDFontFamily: "Arial, sans-serif",
+  teamIDColor: "#c00",
+  teamIDFontSize: 14,
+};

package/src/stories/Teams/14-Team/CollapsedLeft.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedLeft from "../../../components/Teams/14-Team/CollapsedLeft";
+import { sampleTeams14 } from "../../data/teams";
+
+export default {
+  title: "Teams/14-Team/CollapsedLeft",
+  component: CollapsedLeft,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedLeft {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams14,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/14-Team/CollapsedRight.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import CollapsedRight from "../../../components/Teams/14-Team/CollapsedRight";
+import { sampleTeams14 } from "../../data/teams";
+
+export default {
+  title: "Teams/14-Team/CollapsedRight",
+  component: CollapsedRight,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <CollapsedRight {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams14,
+  teamIDFontFamily: 'Arial, sans-serif',
+  teamIDColor:      '#c00',
+  teamIDFontSize:   11,
+};

package/src/stories/Teams/14-Team/Expanded.stories.jsx

@@ -0,0 +1,33 @@
+import React from "react";
+import Expanded from "../../../components/Teams/14-Team/Expanded";
+import { sampleTeams14 } from "../../data/teams";
+
+export default {
+  title: "Teams/14-Team/Expanded",
+  component: Expanded,
+  argTypes: {
+    teams:            { control: 'object' },
+    teamIDFontFamily: {
+      control: 'text',
+      description: 'CSS font-family for the team-ID cell'
+    },
+    teamIDColor: {
+      control: 'color',
+      description: 'CSS text color for the team-ID cell'
+    },
+    teamIDFontSize: {
+      control:    { type: 'number', min: 6, max: 72, step: 1 },
+      description:'Font size (in points) for the team-ID cell',
+    },
+  }
+};
+
+const Template = (args) => <Expanded {...args} />;
+
+export const Default = Template.bind({});
+Default.args = {
+  teams:            sampleTeams14,
+  teamIDFontFamily: "Arial, sans-serif",
+  teamIDColor: "#c00",
+  teamIDFontSize: 14,
+};