vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Refactor #2811

pull/2817/head
mertsincan 2022-07-29 02:40:13 +01:00
parent a626dff37a
commit c18e76e1cd
1 changed files with 16 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/dropdown/Dropdown.vue
View File

@ -3,10 +3,10 @@
<input v-if="editable" ref="focusInput" :id="inputId" type="text" :style="inputStyle" :class="inputStyleClass" :value="editableInputValue" :placeholder="placeholder" :tabindex="!disabled ? tabindex : -1" :disabled="disabled" autocomplete="off" <input v-if="editable" ref="focusInput" :id="inputId" type="text" :style="inputStyle" :class="inputStyleClass" :value="editableInputValue" :placeholder="placeholder" :tabindex="!disabled ? tabindex : -1" :disabled="disabled" autocomplete="off"
role="combobox" :aria-label="ariaLabel" :aria-labelledby="ariaLabelledby" aria-haspopup="listbox" :aria-expanded="overlayVisible" :aria-controls="id + '_list'" :aria-activedescendant="focused ? focusedOptionId : undefined" role="combobox" :aria-label="ariaLabel" :aria-labelledby="ariaLabelledby" aria-haspopup="listbox" :aria-expanded="overlayVisible" :aria-controls="id + '_list'" :aria-activedescendant="focused ? focusedOptionId : undefined"
@focus="onFocus" @blur="onBlur" @keydown="onKeyDown" @input="onEditableInput" v-bind="inputProps"> @focus="onFocus" @blur="onBlur" @keydown="onKeyDown" @input="onEditableInput" v-bind="inputProps">
<span v-else ref="focusInput" :id="inputId" :style="inputStyle" :class="inputStyleClass" :tabindex="!disabled ? tabindex : -1" role="combobox" :aria-label="ariaLabel" :aria-labelledby="ariaLabelledby" <span v-else ref="focusInput" :id="inputId" :style="inputStyle" :class="inputStyleClass" :tabindex="!disabled ? tabindex : -1" role="combobox" :aria-label="ariaLabel || (label === 'p-emptylabel' ? undefined : label)" :aria-labelledby="ariaLabelledby"
aria-haspopup="listbox" :aria-expanded="overlayVisible" :aria-controls="id + '_list'" :aria-activedescendant="focused ? focusedOptionId : undefined" :aria-disabled="disabled" aria-haspopup="listbox" :aria-expanded="overlayVisible" :aria-controls="id + '_list'" :aria-activedescendant="focused ? focusedOptionId : undefined" :aria-disabled="disabled"
@focus="onFocus" @blur="onBlur" @keydown="onKeyDown" v-bind="inputProps"> @focus="onFocus" @blur="onBlur" @keydown="onKeyDown" v-bind="inputProps">
<slot name="value" :value="modelValue" :placeholder="placeholder">{{label === 'p-emptylabel' ? '&nbsp;' : label ||'empty'}}</slot> <slot name="value" :value="modelValue" :placeholder="placeholder">{{label === 'p-emptylabel' ? '&nbsp;' : label || 'empty'}}</slot>
</span> </span>
<i v-if="showClear && modelValue != null" class="p-dropdown-clear-icon pi pi-times" @click="onClearClick" v-bind="clearIconProps"></i> <i v-if="showClear && modelValue != null" class="p-dropdown-clear-icon pi pi-times" @click="onClearClick" v-bind="clearIconProps"></i>
<div class="p-dropdown-trigger"> <div class="p-dropdown-trigger">
@ -52,6 +52,9 @@
<slot name="empty">{{emptyMessageText}}</slot> <slot name="empty">{{emptyMessageText}}</slot>
</li> </li>
</ul> </ul>
<span v-if="(!options || (options && options.length === 0))" role="status" aria-live="polite" class="p-hidden-accessible">
{{emptyMessageText}}
</span>
<span role="status" aria-live="polite" class="p-hidden-accessible"> <span role="status" aria-live="polite" class="p-hidden-accessible">
{{selectedMessageText}} {{selectedMessageText}}
</span> </span>
@ -257,12 +260,16 @@ export default {
isFocus && this.$refs.focusInput.focus(); isFocus && this.$refs.focusInput.focus();
}, },
hide(isFocus) { hide(isFocus) {
this.$emit('before-hide'); const _hide = () => {
this.overlayVisible = false; this.$emit('before-hide');
this.focusedOptionIndex = -1; this.overlayVisible = false;
this.searchValue = ''; this.focusedOptionIndex = -1;
this.searchValue = '';
isFocus && this.$refs.focusInput.focus(); isFocus && this.$refs.focusInput.focus();
}
setTimeout(() => { _hide() }, 0); // For ScreenReaders
}, },
onFocus(event) { onFocus(event) {
this.focused = true; this.focused = true;
@ -771,7 +778,7 @@ export default {
}, },
listRef(el, contentRef) { listRef(el, contentRef) {
this.list = el; this.list = el;
contentRef && contentRef(el); // for virtualScroller contentRef && contentRef(el); // For VirtualScroller
}, },
virtualScrollerRef(el) { virtualScrollerRef(el) {
this.virtualScroller = el; this.virtualScroller = el;
@ -855,7 +862,7 @@ export default {
return this.emptySelectionMessage || this.$primevue.config.locale.emptySelectionMessage; return this.emptySelectionMessage || this.$primevue.config.locale.emptySelectionMessage;
}, },
selectedMessageText() { selectedMessageText() {
return ObjectUtils.isNotEmpty(this.modelValue) ? this.selectionMessageText.replaceAll('{0}', this.modelValue.length) : this.emptySelectionMessageText; return ObjectUtils.isNotEmpty(this.modelValue) ? this.selectionMessageText.replaceAll('{0}', '1') : this.emptySelectionMessageText;
}, },
focusedOptionId() { focusedOptionId() {
return this.focusedOptionIndex !== -1 ? `${this.id}_${this.focusedOptionIndex}` : null; return this.focusedOptionIndex !== -1 ? `${this.id}_${this.focusedOptionIndex}` : null;