diff --git a/src/components/Select.vue b/src/components/Select.vue
index 503ab95c..f836f3f8 100644
--- a/src/components/Select.vue
+++ b/src/components/Select.vue
@@ -12,7 +12,7 @@
role="combobox"
:aria-expanded="dropdownOpen.toString()"
:aria-owns="`vs${uid}__listbox`"
- aria-label="Search for option"
+ :aria-label="ariaLabelCombobox"
@mousedown="toggleDropdown($event)"
>
@@ -37,8 +37,8 @@
:disabled="disabled"
type="button"
class="vs__deselect"
- :title="`Deselect ${getOptionLabel(option)}`"
- :aria-label="`Deselect ${getOptionLabel(option)}`"
+ :title="ariaLabelDeselectOption(getOptionLabel(option))"
+ :aria-label="ariaLabelDeselectOption(getOptionLabel(option))"
@mousedown.stop="deselect(option)"
@keydown.enter="keyboardDeselect(option, index)"
>
@@ -63,8 +63,8 @@
:disabled="disabled"
type="button"
class="vs__clear"
- title="Clear Selected"
- aria-label="Clear Selected"
+ :title="ariaLabelClearSelected"
+ :aria-label="ariaLabelClearSelected"
@click="clearSelection"
>
@@ -295,6 +295,36 @@ export default {
default: 'label',
},
+ /**
+ * Allows to customize the `aria-label` set on the comobobox for searching options.
+ * @type {String}
+ * @default 'Search for options'
+ */
+ ariaLabelCombobox: {
+ type: String,
+ default: 'Search for options',
+ },
+
+ /**
+ * Allows to customize the `aria-label` set on the clear-selected button
+ * @type {String}
+ * @default 'Clear selected'
+ */
+ ariaLabelClearSelected: {
+ type: String,
+ default: 'Clear selected',
+ },
+
+ /**
+ * Allows to customize the `aria-label` for the deselect-option button
+ * The default is "Deselect " + optionLabel
+ * @type {(optionLabel: string) => string}
+ */
+ ariaLabelDeselectOption: {
+ type: Function,
+ default: (optionLabel) => `Deselect ${optionLabel}`,
+ },
+
/**
* Value of the 'autocomplete' field of the input
* element.