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

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

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.