-
-
Notifications
You must be signed in to change notification settings - Fork 60
/
HxSearchBox_Documentation.razor
38 lines (35 loc) · 2.11 KB
/
HxSearchBox_Documentation.razor
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
@attribute [Route("/components/" + nameof(HxSearchBox<TItem>))]
<ComponentApiDoc Type="typeof(HxSearchBox<TItem>)">
<MainContent>
<DocAlert Type="DocAlertType.Warning">
Due to breaking change in Bootstrap 5.2, the keyboard navigation stopped working for dropdowns triggered from <code>input</code> (the <code>Up</code> and <code>Down</code> keys).
As an experimental feature we added our own keyboard navigation routines to the affected components. This might be subject to future change.
You can check the progress here: <a href="https://github.com/havit/Havit.Blazor/issues/348">https://github.com/havit/Havit.Blazor/issues/348</a>.
</DocAlert>
<SectionTitle>Basic usage</SectionTitle>
<Demo Type="typeof(HxSearchBox_Demo)" />
<SectionTitle>Suggestions only</SectionTitle>
<p>You can disable free-text query by setting <code>AllowTextQuery="false"</code>. Only suggestions will be allowed.</p>
<Demo Type="typeof(HxSearchBox_Demo_DisableTextQuery)" />
</MainContent>
<CssVariables>
<ComponentApiDocCssVariable Name="--hx-search-box-item-icon-margin" Default="0 .5rem 0 0">
Item icon margin.
</ComponentApiDocCssVariable>
<ComponentApiDocCssVariable Name="--hx-search-box-item-icon-font-size" Default="inherit">
Item icon font-size.
</ComponentApiDocCssVariable>
<ComponentApiDocCssVariable Name="--hx-search-box-item-title-font-size" Default="inherit">
Item title font-size.
</ComponentApiDocCssVariable>
<ComponentApiDocCssVariable Name="--hx-search-box-item-title-color" Default="inherit">
Item title color.
</ComponentApiDocCssVariable>
<ComponentApiDocCssVariable Name="--hx-search-box-item-subtitle-font-size" Default=".75rem">
Item subtitle font-size.
</ComponentApiDocCssVariable>
<ComponentApiDocCssVariable Name="--hx-search-box-item-subtitle-color" Default="var(--bs-secondary)">
Item subtitle color.
</ComponentApiDocCssVariable>
</CssVariables>
</ComponentApiDoc>