From 37b1a5668c0eb3e5f033b434025f54633391956a Mon Sep 17 00:00:00 2001 From: "google-labs-jules[bot]" <161369871+google-labs-jules[bot]@users.noreply.github.com> Date: Sun, 26 Apr 2026 01:27:57 +0000 Subject: [PATCH] feat(a11y): add accessibility label to notepad clear button Added `accessible`, `accessibilityRole`, and `accessibilityLabel` to the icon-only delete button in NotepadScreen to ensure screen readers announce it properly. Co-authored-by: TargetMisser <52361977+TargetMisser@users.noreply.github.com> --- .jules/palette.md | 3 +++ src/screens/NotepadScreen.tsx | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) create mode 100644 .jules/palette.md diff --git a/.jules/palette.md b/.jules/palette.md new file mode 100644 index 0000000..81d393a --- /dev/null +++ b/.jules/palette.md @@ -0,0 +1,3 @@ +## 2026-04-15 - Missing ARIA labels on Icon-only buttons +**Learning:** Icon-only buttons without an explicit ARIA label are not announced correctly by screen readers, rendering them inaccessible. This is a common pattern in the React Native codebase where visual icons (like 'delete-outline') are heavily used without text. +**Action:** Always apply `accessible={true}`, `accessibilityRole="button"`, and a descriptive `accessibilityLabel` to `` wrappers surrounding icon-only components. diff --git a/src/screens/NotepadScreen.tsx b/src/screens/NotepadScreen.tsx index 9114a9e..312f44a 100644 --- a/src/screens/NotepadScreen.tsx +++ b/src/screens/NotepadScreen.tsx @@ -109,7 +109,7 @@ export default function NotepadScreen() { {t('notepadTitle')} - +