From 7cb9ae9edea9e5ab09cda41a4b275efc7b646e94 Mon Sep 17 00:00:00 2001
From: Ilia Mashkov <hikkikomori7@gmail.com>
Date: Tue, 24 Feb 2026 18:03:40 +0300
Subject: [PATCH] feat(StatGroup): wrapper around Stat to group a list of stats

---
 src/shared/ui/Stat/StatGroup.svelte | 32 +++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)
 create mode 100644 src/shared/ui/Stat/StatGroup.svelte

diff --git a/src/shared/ui/Stat/StatGroup.svelte b/src/shared/ui/Stat/StatGroup.svelte
new file mode 100644
index 0000000..8809790
--- /dev/null
+++ b/src/shared/ui/Stat/StatGroup.svelte
@@ -0,0 +1,32 @@
+<!--
+    Component: StatGroup
+    Renders multiple Stat components in a row with auto-separators.
+-->
+<script lang="ts">
+import { cn } from '$shared/shadcn/utils/shadcn-utils';
+import { Stat } from '$shared/ui';
+import type { ComponentProps } from 'svelte';
+
+interface StatItem extends Partial<Pick<ComponentProps<typeof Stat>, 'variant'>> {
+    label: string;
+    value: string | number;
+}
+
+interface Props {
+    stats: StatItem[];
+    class?: string;
+}
+
+let { stats, class: className }: Props = $props();
+</script>
+
+<div class={cn('flex items-center gap-4', className)}>
+    {#each stats as stat, i}
+        <Stat
+            label={stat.label}
+            value={stat.value}
+            variant={stat.variant}
+            separator={i < stats.length - 1}
+        />
+    {/each}
+</div>