Skip to main content

ShellBarSearch

<ui5-shellbar-search> | Since 2.10.0
info

The following entity is available under an experimental flag and its API and behavior are subject to change.

Search field for the ShellBar component.

Properties​

autoOpen​

DescriptionIndicates whether the suggestions popover should be opened on focus.
Typeboolean
Defaultfalse

loading​

DescriptionIndicates whether a loading indicator should be shown in the popup.
Typeboolean
Defaultfalse

noTypeahead​

DescriptionDefines whether the value will be autcompleted to match an item.
Typeboolean
Defaultfalse

open​

DescriptionIndicates whether the items picker is open.
Typeboolean
Defaultfalse

fieldLoading​

DescriptionIndicates whether a loading indicator should be shown in the input field.
Typeboolean
Defaultfalse
Since2.19.0

showClearIcon​

DescriptionDefines whether the clear icon of the search will be shown.
Typeboolean
Defaultfalse

value​

DescriptionDefines the value of the component.
Note: The property is updated upon typing.
Typestring
Default""

placeholder​

DescriptionDefines a short hint intended to aid the user with data entry when the component has no value.
Typestring | undefined
Defaultundefined

accessibleName​

DescriptionDefines the accessible ARIA name of the component.
Typestring | undefined
Defaultundefined

accessibleDescription​

DescriptionDefines the accessible ARIA description of the field.
Typestring | undefined
Defaultundefined

scopeValue​

DescriptionDefines the value of the component:
Applications are responsible for setting the correct scope value.
Note: If the given value does not match any existing scopes, no scope will be selected and the SearchField scope component will be displayed as empty.
Typestring | undefined
Default""
Since2.18.0

Slots​

default​

DescriptionDefines the Search suggestion items.
TypeArray<SearchItem | SearchItemGroup>

action​

DescriptionDefines the popup footer action button.
TypeArray<Button>

illustration​

DescriptionDefines the illustrated message to be shown in the popup.
TypeArray<IllustratedMessage>

messageArea​

DescriptionDefines the illustrated message to be shown in the popup.
TypeArray<SearchMessageArea>

scopes​

DescriptionDefines the component scope options.
TypeArray<ISearchScope>

filterButton​

DescriptionDefines the filter button slot, used to display an additional filtering button. This slot is intended for passing a ui5-button with a filter icon to provide extended filtering options.
Note: Scope button and Filter button are mutually exclusive.
TypeArray<Button>
Since2.11.0

Events​

open​

DescriptionFired when the popup is opened.
TypeCustomEvent
BubblesNo
CancelableNo

close​

DescriptionFired when the popup is closed.
TypeCustomEvent
BubblesNo
CancelableNo

input​

DescriptionFired when typing in input or clear icon is pressed.
TypeCustomEvent
BubblesYes
CancelableNo

scope-change​

DescriptionFired when the scope has changed.
TypeCustomEvent<SearchFieldScopeSelectionChangeDetails>
Parametersscope: HTMLElement
The newly selected scope
BubblesYes
CancelableNo
DescriptionFired when the user has triggered search with Enter key or Search Button press.
TypeCustomEvent
BubblesYes
CancelableYes - via preventDefault()

Methods​

No methods available for this component.

CSS Parts​

No CSS parts available for this component.