2021-05-12 09:35:29 +00:00
const AutoCompleteProps = [
{
2022-08-22 13:47:07 +00:00
name : "value" ,
2021-05-12 09:35:29 +00:00
type : "any" ,
default : "null" ,
description : "Value of the component."
} ,
{
name : "suggestions" ,
type : "array" ,
default : "null" ,
description : "An array of suggestions to display."
} ,
{
name : "field" ,
type : "any" ,
default : "null" ,
description : "Property name or getter function of a suggested object to resolve and display."
} ,
{
name : "scrollHeight" ,
type : "string" ,
default : "200px" ,
description : "Maximum height of the suggestions panel."
} ,
{
name : "dropdown" ,
type : "boolean" ,
default : "false" ,
description : "Displays a button next to the input field when enabled."
} ,
{
name : "dropdownMode" ,
type : "string" ,
default : "blank" ,
description : 'Specifies the behavior dropdown button. Default "blank" mode sends an empty string and "current" mode sends the input value.'
} ,
{
name : "multiple" ,
type : "boolean" ,
default : "false" ,
description : "Specifies if multiple values can be selected."
} ,
2022-08-01 01:46:01 +00:00
{
name : "minLength" ,
type : "number" ,
default : "1" ,
description : "Minimum number of characters to initiate a search."
2021-05-17 06:02:55 +00:00
} ,
2021-05-12 09:35:29 +00:00
{
name : "delay" ,
type : "number" ,
default : "300" ,
description : "Delay between keystrokes to wait before sending a query."
} ,
{
name : "appendTo" ,
type : "string" ,
2022-08-22 13:47:07 +00:00
default : "null" ,
description : 'Id of the element or "body" for document where the overlay should be appended to.'
2021-05-12 09:35:29 +00:00
} ,
2022-08-01 01:46:01 +00:00
{
name : "forceSelection" ,
type : "boolean" ,
default : "false" ,
description : "When present, autocomplete clears the manual input if it does not match of the suggestions to force only accepting values from the suggestions."
} ,
2021-05-12 09:35:29 +00:00
{
name : "panelClass" ,
type : "string" ,
default : "null" ,
description : "Style class of the overlay panel."
2021-08-16 11:21:09 +00:00
} ,
2022-08-01 01:46:01 +00:00
{
2022-08-22 13:47:07 +00:00
name : "autoHighlight" ,
2022-08-01 01:46:01 +00:00
type : "boolean" ,
2022-08-22 13:47:07 +00:00
default : "false" ,
description : "Highlights automatically the first item of the dropdown to be selected."
2021-05-12 09:35:29 +00:00
}
] ;
const AutoCompleteEvents = [
{
2022-08-22 13:47:07 +00:00
name : "complete" ,
description : "Callback to invoke to search for suggestions." ,
2021-05-12 09:35:29 +00:00
arguments : [
{
2022-08-22 13:47:07 +00:00
name : "originalEvent" ,
2021-05-12 09:35:29 +00:00
type : "object" ,
2022-08-22 13:47:07 +00:00
description : "Original event"
2021-05-12 09:35:29 +00:00
} ,
{
2022-08-22 13:47:07 +00:00
name : "query" ,
2021-05-12 09:35:29 +00:00
type : "string" ,
2022-08-22 13:47:07 +00:00
description : "Value to search with"
2021-05-12 09:35:29 +00:00
}
]
} ,
{
name : "item-select" ,
description : "Callback to invoke when a suggestion is selected." ,
arguments : [
{
name : "originalEvent" ,
type : "object" ,
description : "Original event"
} ,
{
name : "value" ,
type : "object" ,
description : "Selected item"
}
]
} ,
{
name : "item-unselect" ,
description : "Callback to invoke when a selected value is removed." ,
arguments : [
{
name : "originalEvent" ,
type : "object" ,
description : "Original event"
} ,
{
name : "value" ,
type : "object" ,
description : "Unselected item"
}
]
} ,
{
name : "dropdown-click" ,
description : "Callback to invoke to when dropdown button is clicked." ,
arguments : [
{
name : "originalEvent" ,
type : "object" ,
description : "Original event"
} ,
{
name : "query" ,
type : "string" ,
description : "Current value of the input field"
}
]
} ,
{
name : "clear" ,
description : "Callback to invoke when input is cleared by the user."
}
] ;
const AutoCompleteSlots = [
2021-06-11 12:38:06 +00:00
{
2022-08-01 01:46:01 +00:00
name : "item" ,
description : "Custom content for the item."
2021-05-12 09:35:29 +00:00
}
] ;
module . exports = {
autocomplete : {
name : "AutoComplete" ,
description : "AutoComplete is an input component that provides real-time suggestions when being typed." ,
props : AutoCompleteProps ,
events : AutoCompleteEvents ,
slots : AutoCompleteSlots
}
} ;