Add new prop to allow users to pass in the loader icon

pull/2609/head
Ancient-Dragon 2022-06-01 13:28:30 +01:00
parent 75a28297ca
commit 83ba42613c
2 changed files with 14 additions and 1 deletions

View File

@ -14,7 +14,7 @@
role="searchbox" aria-autocomplete="list" :aria-controls="listId"> role="searchbox" aria-autocomplete="list" :aria-controls="listId">
</li> </li>
</ul> </ul>
<i class="p-autocomplete-loader pi pi-spinner pi-spin" v-if="searching"></i> <i :class="computedIconClasses" v-if="searching"></i>
<Button ref="dropdownButton" type="button" icon="pi pi-chevron-down" class="p-autocomplete-dropdown" :disabled="$attrs.disabled" @click="onDropdownClick" v-if="dropdown"/> <Button ref="dropdownButton" type="button" icon="pi pi-chevron-down" class="p-autocomplete-dropdown" :disabled="$attrs.disabled" @click="onDropdownClick" v-if="dropdown"/>
<Portal :appendTo="appendTo"> <Portal :appendTo="appendTo">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave"> <transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
@ -123,6 +123,10 @@ export default {
virtualScrollerOptions: { virtualScrollerOptions: {
type: Object, type: Object,
default: null default: null
},
loadingIcon: {
type: String,
default: 'pi pi-spinner'
} }
}, },
timeout: null, timeout: null,
@ -571,6 +575,9 @@ export default {
} }
}, },
computed: { computed: {
loadingIconClass() {
return ['p-autocomplete-loader', 'pi-spin', this.loadingIcon];
},
containerClass() { containerClass() {
return ['p-autocomplete p-component p-inputwrapper', this.class, { return ['p-autocomplete p-component p-inputwrapper', this.class, {
'p-autocomplete-dd': this.dropdown, 'p-autocomplete-dd': this.dropdown,

View File

@ -273,6 +273,12 @@ export default {
<td>object</td> <td>object</td>
<td>null</td> <td>null</td>
<td>Whether to use the virtualScroller feature. The properties of <router-link to="/virtualscroller">VirtualScroller</router-link> component can be used like an object in it.</td> <td>Whether to use the virtualScroller feature. The properties of <router-link to="/virtualscroller">VirtualScroller</router-link> component can be used like an object in it.</td>
</tr>
<tr>
<td>loadingIcon</td>
<td>string</td>
<td>pi pi-spinner</td>
<td>Icon class used when loading</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>