Add aria-disabled attributes

reedsy · May 30, 2024 · a2aae41 · a2aae41
1 parent b8ed736
commit a2aae41
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 2 deletions.
diff --git a/src/components/DateInput.vue b/src/components/DateInput.vue
@@ -27,6 +27,7 @@
       :placeholder="placeholder"
       :clear-button="clearButton"
       :disabled="disabled || null"
+      :aria-disabled="disabled || null"
       :required="required"
       :readonly="!typeable"
       autocomplete="off"

diff --git a/src/components/Datepicker.vue b/src/components/Datepicker.vue
@@ -22,7 +22,8 @@
       :calendar-button="calendarButton"
       :calendar-button-icon="calendarButtonIcon"
       :calendar-button-icon-content="calendarButtonIconContent"
-      :disabled="disabled"
+      :disabled="disabled || null"
+      :aria-disabled="disabled || null"
       :required="required"
       :bootstrap-styling="bootstrapStyling"
       :use-utc="useUtc"
@@ -236,7 +237,7 @@ export default {
   emits: [
     'changedMonth',
     'changedYear',
-    'cleared',  
+    'cleared',
     'closed',
     'highlight-date',
     'selected',

diff --git a/src/components/PickerDay.vue b/src/components/PickerDay.vue
@@ -21,6 +21,7 @@
         class="prev"
         :aria-label="isRtl ? 'Next Month' : 'Previous Month'"
         :disabled="isLeftNavDisabled || null"
+        :aria-disabled="isLeftNavDisabled || null"
         @click="isRtl ? nextMonth() : previousMonth()"
         @keydown.space.enter.prevent="isRtl ? nextMonth() : previousMonth()"
         @keydown="$emit('keydown', $event)"
@@ -56,6 +57,7 @@
         class="next"
         :aria-label="isRtl ? 'Previous Month' : 'Next Month'"
         :disabled="isRightNavDisabled || null"
+        :aria-disabled="isRightNavDisabled || null"
         @click="isRtl ? previousMonth() : nextMonth()"
         @keydown.space.enter.prevent="isRtl ? previousMonth() : nextMonth()"
         @keydown="$emit('keydown', $event)"

diff --git a/src/components/PickerMonth.vue b/src/components/PickerMonth.vue
@@ -20,6 +20,7 @@
         type="button"
         class="prev"
         :disabled="isLeftNavDisabled || null"
+        :aria-disabled="isLeftNavDisabled || null"
         :aria-label="isRtl ? 'Next Year' : 'Previous Year'"
         @click="isRtl ? nextYear() : previousYear()"
         @keydown.space.enter.prevent="isRtl ? nextYear() : previousYear()"
@@ -44,6 +45,7 @@
         class="next"
         :aria-label="isRtl ? 'Previous Year' : 'Next Year'"
         :disabled="isRightNavDisabled || null"
+        :aria-disabled="isRightNavDisabled || null"
         @click="isRtl ? previousYear() : nextYear()"
         @keydown.space.enter.prevent="isRtl ? previousYear() : nextYear()"
         @keydown="$emit('keydown', $event)"

diff --git a/src/components/PickerYear.vue b/src/components/PickerYear.vue
@@ -20,6 +20,7 @@
         type="button"
         class="prev"
         :disabled="isLeftNavDisabled || null"
+        :aria-disabled="isLeftNavDisabled || null"
         :aria-label="isRtl ? 'Next Decade' : 'Previous Decade'"
         @click="isRtl ? nextDecade() : previousDecade()"
         @keydown.space.enter.prevent="isRtl ? nextDecade() : previousDecade()"
@@ -39,6 +40,7 @@
         class="next"
         :aria-label="isRtl ? 'Previous Decade' : 'Next Decade'"
         :disabled="isRightNavDisabled || null"
+        :aria-disabled="isRightNavDisabled || null"
         @click="isRtl ? previousDecade() : nextDecade()"
         @keydown="$emit('keydown', $event)"
       >