Ready 4.1.0+
GeoSelectGeoSelect
is a replacement for plain HTML <select>
tags aimed to offer
a better UX, including chunked load and search capabilities.
Properties
Prop name | Type | Default value | Description |
---|---|---|---|
fixedWidth
| boolean |
true
| Show description |
options
| array | Show description | |
keyForLabel
| string |
'label'
| Show description |
placeholder
| string | Show description | |
searchable
| boolean |
false
| Show description |
grouped
| boolean |
false
| Show description |
searchInputPlaceholder
| string | Show description | |
getMatchesForItem
| func | Show description | |
pageSize
| number | Show description | |
dropdownIcon
| array |
| Show description |
deleteIcon
| array |
| Show description |
searchIcon
| array |
| Show description |
forceYAxisPosition
| enumPropertyFactory({
componentName: 'GeoSelect',
propertyName: 'forceYAxisPosition',
enumDictionary: Y_AXIS_POSITION,
required: false,
checkUndefined: true
}) | Show description | |
isValueDeletable
| boolean |
false
| Show description |
disabled
| boolean |
false
| Show description |
variant
| enumPropertyFactory({
componentName: 'GeoSelect',
propertyName: 'variant',
enumDictionary: VARIANTS,
defaultValue: VARIANTS.regular
}) | Show description | |
popupClass
| string|array|object | Show description | |
value
| object | Show description |
Events
Name | Type | Description |
---|---|---|
toggle |
undefined
| |
delete-value | User typed on the input box. | |
input |
object
| Change GeoSelect selection event |
Slots
Name | Description |
---|---|
toggleButton | Optional. Use this slot to customize toggle button. |
header | Optional. Use this slot to add a custom header. |
searchHeader | Optional. Use this slot to customize search form. |
group | Optional. Use this slot to customize how groups are displayed
in grouped |
group-title | |
group-item | |
default | Optional. Use this slot to customize how options are displayed
in non-grouped |
noResults | Use this slot to customize the label that will be displayed when no results are found after searching for an option |
moreResultsTextContent | Use this slot to customize the label of the button allowing to display additional options when there are too many to be displayed at once |
footer | Use this slot to customize the footer of the selection popup |
Constants
This component has no exported constants.