Player stat component build

dist/cjs/declarations/DemoMantineComponent/DemoMantineComponent.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { DefaultProps, MantineNumberSize, Selectors } from '@mantine/core';
+export interface DemoMantineComponentStylesParams {
+    radius?: MantineNumberSize;
+}
+declare const useStyles: (params: DemoMantineComponentStylesParams, options?: import("@mantine/core").UseStylesOptions<string>) => {
+    classes: {
+        root: string;
+    };
+    cx: (...args: any) => string;
+    theme: import("@mantine/core").MantineTheme;
+};
+declare type DemoMantineComponentStylesNames = Selectors<typeof useStyles>;
+export interface DemoMantineComponentProps extends DefaultProps<DemoMantineComponentStylesNames, DemoMantineComponentStylesParams> {
+    radius?: MantineNumberSize;
+}
+export declare const DemoMantineComponent: React.FC<DemoMantineComponentProps>;
+export {};
+//# sourceMappingURL=DemoMantineComponent.d.ts.map

dist/cjs/declarations/DemoMantineComponent/DemoMantineComponent.story.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare function WithClassNameRenaming(): JSX.Element;
+export declare function WithSXUsage(): JSX.Element;
+export declare function WithStylesUsage(): JSX.Element;
+//# sourceMappingURL=DemoMantineComponent.story.d.ts.map

dist/cjs/declarations/IconButton/IconButton.d.ts

@@ -1,5 +1,5 @@
-import { Sx } from "@mantine/core";
-import React, { MouseEventHandler } from "react";
+import { Sx } from '@mantine/core';
+import React, { MouseEventHandler } from 'react';
 export interface IconButtonProps {
     label: React.ReactNode;
     className?: string;

dist/cjs/declarations/PlayerStats/PlayerLosses/PlayerLosses.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface PlayerLossesProps {
+    losses: unknown;
+}
+export declare const PlayerLosses: React.FC<PlayerLossesProps>;
+//# sourceMappingURL=PlayerLosses.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerLosses/PlayerLosses.story.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare function WithNoWin(): JSX.Element;
+export declare function WithAValidWinValue(): JSX.Element;
+export declare function WithNegative(): JSX.Element;
+export declare function WithUndefined(): JSX.Element;
+export declare function WithNull(): JSX.Element;
+//# sourceMappingURL=PlayerLosses.story.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerRank/PlayerRank.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface PlayerRankProps {
+    rank: unknown;
+}
+export declare const PlayerRank: React.FC<PlayerRankProps>;
+//# sourceMappingURL=PlayerRank.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerRank/PlayerRank.story.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare function WithAValidRank(): JSX.Element;
+export declare function WithNegativeOne(): JSX.Element;
+export declare function WithUndefined(): JSX.Element;
+export declare function WithNull(): JSX.Element;
+//# sourceMappingURL=PlayerRank.story.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerStreak/PlayerStreak.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface PlayerStreakProps {
+    streak: unknown;
+}
+export declare const PlayerStreak: React.FC<PlayerStreakProps>;
+//# sourceMappingURL=PlayerStreak.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerStreak/PlayerStreak.story.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare function WithNoStreak(): JSX.Element;
+export declare function WithPositiveStreak(): JSX.Element;
+export declare function WithNegativeStreak(): JSX.Element;
+export declare function WithUndefined(): JSX.Element;
+export declare function WithNull(): JSX.Element;
+//# sourceMappingURL=PlayerStreak.story.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerWinRatio/PlayerWinRatio.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export interface PlayerWinRatioProps {
+    wins: unknown;
+    losses: unknown;
+}
+export declare const PlayerWinRatio: React.FC<PlayerWinRatioProps>;
+//# sourceMappingURL=PlayerWinRatio.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerWinRatio/PlayerWinRatio.story.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare function WithNoWinNoLoss(): JSX.Element;
+export declare function Usage(): JSX.Element;
+export declare function WithNegativeWins(): JSX.Element;
+export declare function WithNegativeLosses(): JSX.Element;
+export declare function WithUndefinedWins(): JSX.Element;
+export declare function WithUndefinedLosses(): JSX.Element;
+export declare function WithNullWins(): JSX.Element;
+export declare function WithNullLosses(): JSX.Element;
+//# sourceMappingURL=PlayerWinRatio.story.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerWins/PlayerWins.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface PlayerWinsProps {
+    wins: unknown;
+}
+export declare const PlayerWins: React.FC<PlayerWinsProps>;
+//# sourceMappingURL=PlayerWins.d.ts.map

dist/cjs/declarations/PlayerStats/PlayerWins/PlayerWins.story.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare function WithNoWin(): JSX.Element;
+export declare function WithAValidWinValue(): JSX.Element;
+export declare function WithNegative(): JSX.Element;
+export declare function WithUndefined(): JSX.Element;
+export declare function WithNull(): JSX.Element;
+//# sourceMappingURL=PlayerWins.story.d.ts.map

dist/cjs/declarations/PlayerStats/index.d.ts

@@ -0,0 +1,6 @@
+export { PlayerLosses } from "./PlayerLosses/PlayerLosses";
+export { PlayerWins } from "./PlayerWins/PlayerWins";
+export { PlayerWinRatio } from "./PlayerWinRatio/PlayerWinRatio";
+export { PlayerRank } from "./PlayerRank/PlayerRank";
+export { PlayerStreak } from "./PlayerStreak/PlayerStreak";
+//# sourceMappingURL=index.d.ts.map

dist/cjs/declarations/index.d.ts

@@ -1,6 +1,7 @@
 export { TestComponent } from './TestComponent/TestComponent';
 export type { TestComponentProps } from './TestComponent/TestComponent';
-export { IconButton } from "./IconButton/IconButton";
-export type { IconButtonProps } from "./IconButton/IconButton";
-export { ColorSchemeToggle } from "./ColorSchemeToggle/ColorSchemeToggle";
+export { IconButton } from './IconButton/IconButton';
+export type { IconButtonProps } from './IconButton/IconButton';
+export { ColorSchemeToggle } from './ColorSchemeToggle/ColorSchemeToggle';
+export * from "./PlayerStats";
 //# sourceMappingURL=index.d.ts.map

dist/cjs/index.js

@@ -44,12 +44,90 @@ function t(){return t=Object.assign?Object.assign.bind():function(e){for(var t=1
 
 function ColorSchemeToggle() {
     const { colorScheme, toggleColorScheme } = core.useMantineColorScheme();
-    return (e__default["default"].createElement(IconButton, { label: colorScheme === "dark" ? "Light mode" : "Dark mode", onClick: () => toggleColorScheme(), sx: (theme) => ({
-            backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[0],
-            color: theme.colorScheme === "dark" ? theme.colors.yellow[4] : theme.colors.blue[6],
-        }) }, colorScheme === "dark" ? (e__default["default"].createElement(lIe, { size: 20, stroke: 1.5 })) : (e__default["default"].createElement(Uve, { size: 20, stroke: 1.5 }))));
+    return (e__default["default"].createElement(IconButton, { label: colorScheme === 'dark' ? 'Light mode' : 'Dark mode', onClick: () => toggleColorScheme(), sx: (theme) => ({
+            backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],
+            color: theme.colorScheme === 'dark' ? theme.colors.yellow[4] : theme.colors.blue[6],
+        }) }, colorScheme === 'dark' ? (e__default["default"].createElement(lIe, { size: 20, stroke: 1.5 })) : (e__default["default"].createElement(Uve, { size: 20, stroke: 1.5 }))));
 }
 
+const PlayerLosses = ({ losses }) => {
+    let content = '-';
+    let color;
+    if (losses !== undefined && losses !== null) {
+        const lossesNumber = Number(losses);
+        if (!isNaN(lossesNumber) && lossesNumber >= 0) {
+            content = lossesNumber + 'L';
+            color = 'red';
+        }
+    }
+    return (e__default["default"].createElement(e__default["default"].Fragment, null,
+        e__default["default"].createElement(core.Text, { color: color }, content)));
+};
+
+const PlayerWins = ({ wins }) => {
+    let content = '-';
+    let color;
+    if (wins !== undefined && wins !== null) {
+        const winsNumber = Number(wins);
+        if (!isNaN(winsNumber) && winsNumber >= 0) {
+            content = winsNumber + 'W';
+            color = 'green';
+        }
+    }
+    return (e__default["default"].createElement(e__default["default"].Fragment, null,
+        e__default["default"].createElement(core.Text, { color: color }, content)));
+};
+
+const PlayerWinRatio = ({ wins, losses }) => {
+    let content = '-';
+    if (wins !== undefined && wins !== null && losses !== undefined && losses !== null) {
+        const winsNumber = Number(wins);
+        const lossesNumber = Number(losses);
+        if (!isNaN(winsNumber) && winsNumber >= 0 && !isNaN(lossesNumber) && lossesNumber >= 0 && (lossesNumber + winsNumber > 0)) {
+            content = ((winsNumber / (winsNumber + lossesNumber)) * 100).toFixed(0) + '%';
+        }
+    }
+    return (e__default["default"].createElement(e__default["default"].Fragment, null,
+        e__default["default"].createElement(core.Text, null, content)));
+};
+
+const PlayerRank = ({ rank }) => {
+    let content = '-';
+    if (rank !== undefined && rank !== null) {
+        const rankNumber = Number(rank);
+        if (!isNaN(rankNumber) && rankNumber > -1) {
+            content = '#' + rankNumber;
+        }
+    }
+    return (e__default["default"].createElement(e__default["default"].Fragment, null,
+        e__default["default"].createElement(core.Text, null, content)));
+};
+
+const PlayerStreak = ({ streak }) => {
+    let content = '-';
+    let color;
+    if (streak !== undefined && streak !== null) {
+        const streakNumber = Number(streak);
+        if (!isNaN(streakNumber)) {
+            content = '' + streakNumber;
+            if (streakNumber > 0) {
+                color = 'green';
+                content = '+' + streakNumber;
+            }
+            if (streakNumber < 0) {
+                color = 'red';
+            }
+        }
+    }
+    return (e__default["default"].createElement(e__default["default"].Fragment, null,
+        e__default["default"].createElement(core.Text, { color: color }, content)));
+};
+
 exports.ColorSchemeToggle = ColorSchemeToggle;
 exports.IconButton = IconButton;
+exports.PlayerLosses = PlayerLosses;
+exports.PlayerRank = PlayerRank;
+exports.PlayerStreak = PlayerStreak;
+exports.PlayerWinRatio = PlayerWinRatio;
+exports.PlayerWins = PlayerWins;
 exports.TestComponent = TestComponent;

dist/esm/declarations/DemoMantineComponent/DemoMantineComponent.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { DefaultProps, MantineNumberSize, Selectors } from '@mantine/core';
+export interface DemoMantineComponentStylesParams {
+    radius?: MantineNumberSize;
+}
+declare const useStyles: (params: DemoMantineComponentStylesParams, options?: import("@mantine/core").UseStylesOptions<string>) => {
+    classes: {
+        root: string;
+    };
+    cx: (...args: any) => string;
+    theme: import("@mantine/core").MantineTheme;
+};
+declare type DemoMantineComponentStylesNames = Selectors<typeof useStyles>;
+export interface DemoMantineComponentProps extends DefaultProps<DemoMantineComponentStylesNames, DemoMantineComponentStylesParams> {
+    radius?: MantineNumberSize;
+}
+export declare const DemoMantineComponent: React.FC<DemoMantineComponentProps>;
+export {};
+//# sourceMappingURL=DemoMantineComponent.d.ts.map

dist/esm/declarations/DemoMantineComponent/DemoMantineComponent.story.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare function WithClassNameRenaming(): JSX.Element;
+export declare function WithSXUsage(): JSX.Element;
+export declare function WithStylesUsage(): JSX.Element;
+//# sourceMappingURL=DemoMantineComponent.story.d.ts.map

dist/esm/declarations/IconButton/IconButton.d.ts

@@ -1,5 +1,5 @@
-import { Sx } from "@mantine/core";
-import React, { MouseEventHandler } from "react";
+import { Sx } from '@mantine/core';
+import React, { MouseEventHandler } from 'react';
 export interface IconButtonProps {
     label: React.ReactNode;
     className?: string;

dist/esm/declarations/PlayerStats/PlayerLosses/PlayerLosses.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface PlayerLossesProps {
+    losses: unknown;
+}
+export declare const PlayerLosses: React.FC<PlayerLossesProps>;
+//# sourceMappingURL=PlayerLosses.d.ts.map