forked from vikunja/frontend
chore: improve multiselect hover types
when hovering over props you can only see comments if written with JSDoc
This commit is contained in:
parent
1101fcb3ff
commit
caa29c152d
|
@ -100,38 +100,52 @@ function elementInResults(elem: string | any, label: string, query: string): boo
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
// When true, shows a loading spinner
|
/**
|
||||||
|
* When true, shows a loading spinner
|
||||||
|
*/
|
||||||
loading: {
|
loading: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
// The placeholder of the search input
|
/**
|
||||||
|
* The placeholder of the search input
|
||||||
|
*/
|
||||||
placeholder: {
|
placeholder: {
|
||||||
type: String,
|
type: String,
|
||||||
default: '',
|
default: '',
|
||||||
},
|
},
|
||||||
// The search results where the @search listener needs to put the results into
|
/**
|
||||||
|
* The search results where the @search listener needs to put the results into
|
||||||
|
*/
|
||||||
searchResults: {
|
searchResults: {
|
||||||
type: Array as PropType<{[id: string]: any}>,
|
type: Array as PropType<{[id: string]: any}>,
|
||||||
default: () => [],
|
default: () => [],
|
||||||
},
|
},
|
||||||
// The name of the property of the searched object to show the user.
|
/**
|
||||||
// If empty the component will show all raw data of an entry.
|
* The name of the property of the searched object to show the user.
|
||||||
|
* If empty the component will show all raw data of an entry.
|
||||||
|
*/
|
||||||
label: {
|
label: {
|
||||||
type: String,
|
type: String,
|
||||||
default: '',
|
default: '',
|
||||||
},
|
},
|
||||||
// The object with the value, updated every time an entry is selected.
|
/**
|
||||||
|
* The object with the value, updated every time an entry is selected.
|
||||||
|
*/
|
||||||
modelValue: {
|
modelValue: {
|
||||||
type: [] as PropType<{[key: string]: any}>,
|
type: [] as PropType<{[key: string]: any}>,
|
||||||
default: null,
|
default: null,
|
||||||
},
|
},
|
||||||
// If true, will provide an "add this as a new value" entry which fires an @create event when clicking on it.
|
/**
|
||||||
|
* If true, will provide an "add this as a new value" entry which fires an @create event when clicking on it.
|
||||||
|
*/
|
||||||
creatable: {
|
creatable: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
// The text shown next to the new value option.
|
/**
|
||||||
|
* The text shown next to the new value option.
|
||||||
|
*/
|
||||||
createPlaceholder: {
|
createPlaceholder: {
|
||||||
type: String,
|
type: String,
|
||||||
default() {
|
default() {
|
||||||
|
@ -139,7 +153,9 @@ const props = defineProps({
|
||||||
return t('input.multiselect.createPlaceholder')
|
return t('input.multiselect.createPlaceholder')
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
// The text shown next to an option.
|
/**
|
||||||
|
* The text shown next to an option.
|
||||||
|
*/
|
||||||
selectPlaceholder: {
|
selectPlaceholder: {
|
||||||
type: String,
|
type: String,
|
||||||
default() {
|
default() {
|
||||||
|
@ -147,22 +163,30 @@ const props = defineProps({
|
||||||
return t('input.multiselect.selectPlaceholder')
|
return t('input.multiselect.selectPlaceholder')
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
// If true, allows for selecting multiple items. v-model will be an array with all selected values in that case.
|
/**
|
||||||
|
* If true, allows for selecting multiple items. v-model will be an array with all selected values in that case.
|
||||||
|
*/
|
||||||
multiple: {
|
multiple: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
// If true, displays the search results inline instead of using a dropdown.
|
/**
|
||||||
|
* If true, displays the search results inline instead of using a dropdown.
|
||||||
|
*/
|
||||||
inline: {
|
inline: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
// If true, shows search results when no query is specified.
|
/**
|
||||||
|
* If true, shows search results when no query is specified.
|
||||||
|
*/
|
||||||
showEmpty: {
|
showEmpty: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: true,
|
||||||
},
|
},
|
||||||
// The delay in ms after which the search event will be fired. Used to avoid hitting the network on every keystroke.
|
/**
|
||||||
|
* The delay in ms after which the search event will be fired. Used to avoid hitting the network on every keystroke.
|
||||||
|
*/
|
||||||
searchDelay: {
|
searchDelay: {
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 200,
|
default: 200,
|
||||||
|
@ -175,13 +199,21 @@ const props = defineProps({
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{
|
||||||
(e: 'update:modelValue', value: null): void
|
(e: 'update:modelValue', value: null): void
|
||||||
// @search: Triggered every time the search query input changes
|
/**
|
||||||
|
* Triggered every time the search query input changes
|
||||||
|
*/
|
||||||
(e: 'search', query: string): void
|
(e: 'search', query: string): void
|
||||||
// @select: Triggered every time an option from the search results is selected. Also triggers a change in v-model.
|
/**
|
||||||
|
* Triggered every time an option from the search results is selected. Also triggers a change in v-model.
|
||||||
|
*/
|
||||||
(e: 'select', value: {[key: string]: any}): void
|
(e: 'select', value: {[key: string]: any}): void
|
||||||
// @create: If nothing or no exact match was found and `creatable` is true, this event is triggered with the current value of the search query.
|
/**
|
||||||
|
* If nothing or no exact match was found and `creatable` is true, this event is triggered with the current value of the search query.
|
||||||
|
*/
|
||||||
(e: 'create', query: string): void
|
(e: 'create', query: string): void
|
||||||
// @remove: If `multiple` is enabled, this will be fired every time an item is removed from the array of selected items.
|
/**
|
||||||
|
* If `multiple` is enabled, this will be fired every time an item is removed from the array of selected items.
|
||||||
|
*/
|
||||||
(e: 'remove', value: null): void
|
(e: 'remove', value: null): void
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue