@namespace Lumeo.Docs.Shared.Patterns

<Stack Gap="3">
<PatternCard Label="Basic Statistic" Code="@_codeBasic">
    <Flex Gap="8">
        <Statistic Title="Active Users" Value="1,234" />
        <Statistic Title="Revenue" Value="45,678" Precision="2" />
    </Flex>
</PatternCard>

<PatternCard Label="With Trend" Code="@_codeTrend">
    <Flex Gap="8">
        <Statistic Title="Sales" Value="12,345" ShowTrend="true" TrendValue="+12.5%" TrendDirection="Statistic.TrendType.Up" />
        <Statistic Title="Refunds" Value="234" ShowTrend="true" TrendValue="-3.2%" TrendDirection="Statistic.TrendType.Down" />
    </Flex>
</PatternCard>
</Stack>

@code {
    private string _codeBasic = @"<Statistic Title=""Active Users"" Value=""1,234"" />
<Statistic Title=""Revenue"" Value=""45,678"" Precision=""2"" />";

    private string _codeTrend = @"<Statistic Title=""Sales"" Value=""12,345""
    ShowTrend=""true"" TrendValue=""+12.5%""
    TrendDirection=""Statistic.TrendType.Up"" />";
}
