Skip to content

Commit 472bb53

Browse files
kristian-zendatonextcloud-command
authored andcommitted
fix: make unified filter chip accessible
Signed-off-by: kristian-zendato <kristian.zendato@nextcloud.com>
1 parent 374dc7b commit 472bb53

2 files changed

Lines changed: 12 additions & 88 deletions

File tree

core/src/components/UnifiedSearch/SearchFilterChip.vue

Lines changed: 0 additions & 82 deletions
This file was deleted.

core/src/components/UnifiedSearch/UnifiedSearchModal.vue

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -102,12 +102,13 @@
102102
</NcCheckboxRadioSwitch>
103103
</div>
104104
<div class="unified-search-modal__filters-applied">
105-
<FilterChip
105+
<NcChip
106106
v-for="filter in filters"
107107
:key="filter.id"
108108
:text="filter.name ?? filter.text"
109109
pretext=""
110-
@delete="removeFilter(filter)">
110+
:aria-label-close="t('core', 'Remove filter: {text}', { text: filter.name ?? filter.text })"
111+
@close="removeFilter(filter)">
111112
<template #icon>
112113
<NcAvatar
113114
v-if="filter.type === 'person'"
@@ -117,9 +118,13 @@
117118
hide-user-status
118119
:hide-favorite="false" />
119120
<IconCalendarRange v-else-if="filter.type === 'date'" />
120-
<img v-else :src="filter.icon" alt="">
121+
<img
122+
v-else
123+
:src="filter.icon"
124+
class="unified-search-modal__filter-icon"
125+
alt="">
121126
</template>
122-
</FilterChip>
127+
</NcChip>
123128
</div>
124129
</div>
125130

@@ -208,6 +213,7 @@ import NcActions from '@nextcloud/vue/components/NcActions'
208213
import NcAvatar from '@nextcloud/vue/components/NcAvatar'
209214
import NcButton from '@nextcloud/vue/components/NcButton'
210215
import NcCheckboxRadioSwitch from '@nextcloud/vue/components/NcCheckboxRadioSwitch'
216+
import NcChip from '@nextcloud/vue/components/NcChip'
211217
import NcDialog from '@nextcloud/vue/components/NcDialog'
212218
import NcEmptyContent from '@nextcloud/vue/components/NcEmptyContent'
213219
import NcInputField from '@nextcloud/vue/components/NcInputField'
@@ -220,7 +226,6 @@ import IconListBox from 'vue-material-design-icons/ListBox.vue'
220226
import IconMagnify from 'vue-material-design-icons/Magnify.vue'
221227
import CustomDateRangeModal from './CustomDateRangeModal.vue'
222228
import SearchableList from './SearchableList.vue'
223-
import FilterChip from './SearchFilterChip.vue'
224229
import SearchResult from './SearchResult.vue'
225230
import { unifiedSearchLogger } from '../../logger.js'
226231
import { getContacts, getProviders, search as unifiedSearch } from '../../services/UnifiedSearchService.js'
@@ -238,11 +243,11 @@ export default defineComponent({
238243
IconMagnify,
239244
240245
CustomDateRangeModal,
241-
FilterChip,
242246
NcActions,
243247
NcActionButton,
244248
NcAvatar,
245249
NcButton,
250+
NcChip,
246251
NcEmptyContent,
247252
NcDialog,
248253
NcInputField,
@@ -936,6 +941,7 @@ export default defineComponent({
936941
padding-top: 4px;
937942
display: flex;
938943
flex-wrap: wrap;
944+
gap: 4px;
939945
}
940946
941947
&__no-content {

0 commit comments

Comments
 (0)