vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 17:02:38 +00:00
Code Issues Projects Releases Packages Wiki Activity

Refactor #5426 - For Dropdown

Browse source
This commit is contained in:
tugcekucukoglu 2024-03-18 13:01:48 +03:00
parent bcdc8cb702
commit 3869287056
3 changed files with 43 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

23
components/lib/dropdown/Dropdown.vue
View file

@ -1,6 +1,6 @@
<template>
<div ref="container" :id="id" :class="cx('root')" @click="onContainerClick" v-bind="ptmi('root')">
<input
<DInputText
v-if="editable"
ref="focusInput"
:id="inputId"
@ -11,6 +11,9 @@
:placeholder="placeholder"
:tabindex="!disabled ? tabindex : -1"
:disabled="disabled"
:invalid="invalid"
:variant="variant"
:unstyled="unstyled"
autocomplete="off"
role="combobox"
:aria-label="ariaLabel"
@ -19,12 +22,12 @@
:aria-expanded="overlayVisible"
:aria-controls="id + '_list'"
:aria-activedescendant="focused ? focusedOptionId : undefined"
:aria-invalid="invalid || undefined"
@focus="onFocus"
@blur="onBlur"
@keydown="onKeyDown"
@input="onEditableInput"
v-bind="{ ...inputProps, ...ptm('input') }"
v-bind="inputProps"
:pt="ptm('input')"
/>
<span
v-else
@ -77,7 +80,7 @@
<slot name="header" :value="modelValue" :options="visibleOptions"></slot>
<div v-if="filter" :class="cx('header')" v-bind="ptm('header')">
<div :class="cx('filterContainer')" v-bind="ptm('filterContainer')">
<input
<DInputText
ref="filterInput"
type="text"
:value="filterValue"
@ -85,6 +88,9 @@
@vue:updated="onFilterUpdated"
:class="cx('filterInput')"
:placeholder="filterPlaceholder"
:invalid="invalid"
:variant="variant"
:unstyled="unstyled"
role="searchbox"
autocomplete="off"
:aria-owns="id + '_list'"
@ -92,7 +98,8 @@
@keydown="onFilterKeyDown"
@blur="onFilterBlur"
@input="onFilterChange"
v-bind="{ ...filterInputProps, ...ptm('filterInput') }"
v-bind="filterInputProps"
:pt="ptm('filterInput')"
/>
<slot name="filtericon" :class="cx('filterIcon')">
<component :is="filterIcon ? 'span' : 'SearchIcon'" :class="[cx('filterIcon'), filterIcon]" v-bind="ptm('filterIcon')" />
@ -185,6 +192,7 @@ import ChevronDownIcon from 'primevue/icons/chevrondown';
import SearchIcon from 'primevue/icons/search';
import SpinnerIcon from 'primevue/icons/spinner';
import TimesIcon from 'primevue/icons/times';
import InputText from 'primevue/inputtext';
import OverlayEventBus from 'primevue/overlayeventbus';
import Portal from 'primevue/portal';
import Ripple from 'primevue/ripple';
@ -297,7 +305,7 @@ export default {
this.overlayVisible = true;
this.focusedOptionIndex = this.focusedOptionIndex !== -1 ? this.focusedOptionIndex : this.autoOptionFocus ? this.findFirstFocusedOptionIndex() : this.editable ? -1 : this.findSelectedOptionIndex();
isFocus && DomHandler.focus(this.$refs.focusInput);
isFocus && DomHandler.focus(this.$refs.focusInput.$el ? this.$refs.focusInput.$el : this.$refs.focusInput);
},
hide(isFocus) {
const _hide = () => {
@ -308,7 +316,7 @@ export default {
this.searchValue = '';
this.resetFilterOnHide && (this.filterValue = null);
isFocus && DomHandler.focus(this.$refs.focusInput);
isFocus && DomHandler.focus(this.$refs.focusInput.$el ? this.$refs.focusInput.$el : this.$refs.focusInput);
};
setTimeout(() => {
@ -976,6 +984,7 @@ export default {
ripple: Ripple
},
components: {
DInputText: InputText,
VirtualScroller,
Portal,
TimesIcon,