@namespace Lumeo.Docs.Shared.Patterns

<Stack Gap="3">
<PatternCard Label="Basic TagInput" Code="@_codeBasic">
    <TagInput @bind-Tags="_tags1" Placeholder="Add tags..." Class="max-w-sm" />
</PatternCard>

<PatternCard Label="With Suggestions" Code="@_codeSuggestions">
    <TagInput @bind-Tags="_tags2" Suggestions="@_suggestions" MaxTags="5" Placeholder="Type to search..." Class="max-w-sm" />
</PatternCard>
</Stack>

@code {
    private List<string> _tags1 = new() { "Blazor", "C#" };
    private List<string> _tags2 = new() { "React" };

    private List<string> _suggestions = new()
    {
        "JavaScript", "TypeScript", "Python", "Rust", "Go", "Java", "Swift"
    };

    private string _codeBasic = @"<TagInput @bind-Tags=""_tags"" Placeholder=""Add tags..."" />";

    private string _codeSuggestions = @"<TagInput @bind-Tags=""_tags"" Suggestions=""@_suggestions"" MaxTags=""5"" />";
}
