Another SmartComboBox sample

dotnet · Sep 18, 2024 · d247f88 · d247f88
1 parent 412223f
commit d247f88
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 1 deletion.
diff --git a/samples/ExampleBlazorApp/Components/Pages/SmartComboBoxExamples/Examples.razor b/samples/ExampleBlazorApp/Components/Pages/SmartComboBoxExamples/Examples.razor
@@ -2,14 +2,25 @@
 
 <PageTitle>Smart ComboBox</PageTitle>
 
-<form class="default-form rounded-md bg-gray-200 p-6 shadow-xl mb-12 grid gap-12 md:grid-cols-3">
+<p class="p-4">
+    <span class="font-semibold">Smart ComboBox</span> is an upgrade for a regular combo box. Except instead of just offering
+    substring matches, it offers <span class="font-semibold">semantic matches</span>.
+</p>
+
+<form class="default-form rounded-md bg-gray-200 p-6 shadow-xl mb-12 grid gap-12 md:grid-cols-2">
     <div class="floating-placeholder" data-permanent="combo-box-example">
         <SmartComboBox Url="api/suggestions/expense-category"
             id="expense-category" @bind-Value="@expenseCategory" placeholder=" " />
         <label for="expense-category">Expense category</label>
     </div>
+    <div class="floating-placeholder" data-permanent="combo-box-example">
+        <SmartComboBox Url="api/suggestions/issue-label"
+                       id="issue-label" @bind-Value="@issueLabel" placeholder=" " />
+        <label for="issue-label">Issue label</label>
+    </div>
 </form>
 
 @code {
     string? expenseCategory;
+    string? issueLabel;
 }
diff --git a/samples/ExampleBlazorApp/Program.cs b/samples/ExampleBlazorApp/Program.cs
@@ -38,8 +38,13 @@
 var embedder = app.Services.GetRequiredService<LocalEmbedder>();
 var expenseCategories = embedder.EmbedRange(
     ["Groceries", "Utilities", "Rent", "Mortgage", "Car Payment", "Car Insurance", "Health Insurance", "Life Insurance", "Home Insurance", "Gas", "Public Transportation", "Dining Out", "Entertainment", "Travel", "Clothing", "Electronics", "Home Improvement", "Gifts", "Charity", "Education", "Childcare", "Pet Care", "Other"]);
+var issueLabels = embedder.EmbedRange(
+    ["Bug", "Docs", "Enhancement", "Question", "UI (Android)", "UI (iOS)", "UI (Windows)", "UI (Mac)", "Performance", "Security", "Authentication", "Accessibility"]);
 
 app.MapSmartComboBox("/api/suggestions/expense-category",
     request => embedder.FindClosest(request.Query, expenseCategories));
 
+app.MapSmartComboBox("/api/suggestions/issue-label",
+    request => embedder.FindClosest(request.Query, issueLabels));
+
 app.Run();