Smart ComboBox is an AI upgrade to the traditional combo box.
Traditional combo boxes suggest values only based on exact substring matches.
Smart ComboBox upgrades this by suggesting semantic matches
(i.e., options with the most closely related meanings).
This is much more helpful for users who don't know/remember
the exact predefined string they are looking for.HxSmartComboBox
derives from SmartComboBox,
a component created by the Microsoft Blazor team.
It extends the original component with Bootstrap styling and Hx-component features.
EXPERIMENTAL, UNDER DEVELOPMENT
Smart components are available as separate NuGet package:Havit.Blazor.Components.Web.Bootstrap.Smart
.
<HxSmartComboBox Label="Expense category"
Url="api/SmartComboBox/expense-category"
Hint="Start typing an expense category, AI will offer most appropriate categories from predefined list."
@bind-Value="expenseCategory" />
@code {
private string expenseCategory;
}
HxSmartComboBox
you do not need to configure the OpenAI backend, since it runs entirely locally.
Name | Type | Description |
---|---|---|
UrlREQUIRED | string |
API endpoint that Smart ComboBox will call to get suggestions. |
AdditionalAttributes | IReadOnlyDictionary<string, object> |
A collection of additional attributes that will be applied to the created element. |
ChipTemplate | RenderFragment |
|
CssClass | string |
|
DisplayName | string |
Gets or sets the display name for this field. This value is used when generating error messages when the input value fails to parse correctly. |
Enabled | bool? |
When null (default), the Enabled value is received from cascading FormState .
When value is false , input is rendered as disabled.
To set multiple controls as disabled use HxFormState . |
GenerateChip | bool |
|
Hint | string |
|
HintTemplate | RenderFragment |
|
InputCssClass | string |
|
InputGroupEndTemplate | RenderFragment |
|
InputGroupEndText | string |
|
InputGroupStartTemplate | RenderFragment |
|
InputGroupStartText | string |
|
InputMode | InputMode? |
Hint to browsers as to the type of virtual keyboard configuration to use when editing. The default is null (not set). |
InputSize | InputSize? |
Size of the input. |
Label | string |
|
LabelCssClass | string |
|
LabelTemplate | RenderFragment |
|
LabelType | LabelType? |
|
MaxLength | int? |
The maximum number of characters (UTF-16 code units) that the user can enter. If the parameter value isn't specified, the MaxLengthAttribute of the Value is checked and used.If not specified either, the user can enter an unlimited number of characters. |
MaxSuggestions | int |
Maximum number of suggestions offered. Default is 10 . |
Placeholder | string |
Placeholder for the input. |
Settings | InputTextSettings |
Set of settings to be applied to the component instance (overrides HxInputText.Defaults , overridden by individual parameters). |
SimilarityThreshold | float |
Minimal similarity coefficient for an item to be offered. Default is 0.5 . |
ValidationMessageMode | ValidationMessageMode? |
|
Value | string |
Value of the input. This should be used with two-way binding. |
ValueChanged | EventCallback<string> |
A callback that updates the bound value. |
ValueExpression | Expression<Func<string>> |
An expression that identifies the bound value. |
Method | Returns | Description |
---|---|---|
FocusAsync() | ValueTask |
Property | Type | Description |
---|---|---|
Defaults | InputTextSettings |
Application-wide defaults for the HxInputFile and derived components.Full documentation and demos: https://havit.blazor.eu/components/HxInputText. |