@namespace Lumeo.Docs.Shared.Patterns

<Stack Gap="3">
<PatternCard Label="Basic TreeView" Code="@_codeBasic">
    <TreeView T="string" Items="@_items" Class="max-w-sm" />
</PatternCard>

<PatternCard Label="With Checkboxes" Code="@_codeCheckbox">
    <TreeView T="string" Items="@_checkItems" ShowCheckboxes="true" Class="max-w-sm" />
</PatternCard>
</Stack>

@code {
    private List<TreeView<string>.TreeViewItem<string>> _items = new()
    {
        new()
        {
            Text = "Documents",
            Value = "docs",
            Children = new()
            {
                new() { Text = "Resume.pdf", Value = "resume" },
                new() { Text = "Cover Letter.docx", Value = "cover" },
            }
        },
        new()
        {
            Text = "Images",
            Value = "images",
            Children = new()
            {
                new() { Text = "Photo.jpg", Value = "photo" },
                new() { Text = "Logo.png", Value = "logo" },
            }
        },
    };

    private List<TreeView<string>.TreeViewItem<string>> _checkItems = new()
    {
        new()
        {
            Text = "Notifications",
            Value = "notif",
            Children = new()
            {
                new() { Text = "Email", Value = "email", IsChecked = true },
                new() { Text = "Push", Value = "push" },
                new() { Text = "SMS", Value = "sms" },
            }
        },
    };

    private string _codeBasic = @"<TreeView T=""string"" Items=""@_items"" />";

    private string _codeCheckbox = @"<TreeView T=""string"" Items=""@_items"" ShowCheckboxes=""true"" />";
}
