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

Use IconField and InputIcon for filter inputs

Browse source
This commit is contained in:
tugcekucukoglu 2024-05-07 18:47:11 +03:00
parent a547ed4681
commit 1e3fcfca59
16 changed files with 52 additions and 105 deletions
Download patch file Download diff file Expand all files Collapse all files

18
components/lib/listbox/Listbox.vue
View file

@ -15,7 +15,7 @@
<slot name="header" :value="modelValue" :options="visibleOptions"></slot>
</div>
<div v-if="filter" :class="cx('header')" v-bind="ptm('header')">
<div :class="cx('filterContainer')" v-bind="ptm('filterContainer')">
<IconField :unstyled="unstyled" v-bind="ptm('pcFilterContainer')">
<InputText
v-model="filterValue"
type="text"
@ -34,11 +34,13 @@
@keydown="onFilterKeyDown"
:pt="ptm('pcFilter')"
/>
<slot name="filtericon" :class="cx('filterIcon')">
<component :is="filterIcon ? 'span' : 'SearchIcon'" :class="[cx('filterIcon'), filterIcon]" v-bind="ptm('filterIcon')" />
</slot>
</div>
<InputIcon :unstyled="unstyled" v-bind="ptm('pcFilterIconContainer')">
<slot name="filtericon">
<span v-if="filterIcon" :class="filterIcon" v-bind="ptm('filterIcon')" />
<SearchIcon v-else v-bind="ptm('filterIcon')" />
</slot>
</InputIcon>
</IconField>
<span role="status" aria-live="polite" class="p-hidden-accessible" v-bind="ptm('hiddenFilterResult')" :data-p-hidden-accessible="true">
{{ filterResultMessageText }}
</span>
@ -128,7 +130,9 @@
<script>
import { FilterService } from 'primevue/api';
import IconField from 'primevue/iconfield';
import SearchIcon from 'primevue/icons/search';
import InputIcon from 'primevue/inputicon';
import InputText from 'primevue/inputtext';
import Ripple from 'primevue/ripple';
import { DomHandler, ObjectUtils, UniqueComponentId } from 'primevue/utils';
@ -748,6 +752,8 @@ export default {
components: {
InputText,
VirtualScroller,
InputIcon,
IconField,
SearchIcon
}
};