From 2a26c0a4bcbcb8c565357362c54f7afd2478efc7 Mon Sep 17 00:00:00 2001 From: truph01 Date: Tue, 31 Mar 2026 00:50:48 +0700 Subject: [PATCH 1/6] fix: update dark-contrast config --- src/styles/theme/themes/dark-contrast.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/styles/theme/themes/dark-contrast.ts b/src/styles/theme/themes/dark-contrast.ts index d54754dcded59..75c77a848bc7c 100644 --- a/src/styles/theme/themes/dark-contrast.ts +++ b/src/styles/theme/themes/dark-contrast.ts @@ -10,9 +10,10 @@ const darkContrastTheme = { buttonSuccessText: colors.productLight900, bordersBold: colors.productDark700, buttonIcon: colors.productDark900, - mentionText: colors.blue600, + mentionText: colors.blue700, textLight: colors.productLight900, iconColorfulBackground: colors.yellow800, + mentionBG: colors.blue100, } satisfies ThemeColors; export default darkContrastTheme; From ff6ba213769f272cf32bee9edd603c3997411b7c Mon Sep 17 00:00:00 2001 From: truph01 Date: Tue, 31 Mar 2026 01:18:41 +0700 Subject: [PATCH 2/6] fix: update badge color --- src/styles/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/index.ts b/src/styles/index.ts index 3ed38f55d4ea2..8a2b664266d8c 100644 --- a/src/styles/index.ts +++ b/src/styles/index.ts @@ -1077,7 +1077,7 @@ const staticStyles = (theme: ThemeColors) => }, badgeStrongText: { - color: colors.white, + color: theme.buttonSuccessText, }, badgeText: { From 67c2b27dc088463878dd8bbcfb3c08020495f43f Mon Sep 17 00:00:00 2001 From: truph01 Date: Tue, 31 Mar 2026 01:24:03 +0700 Subject: [PATCH 3/6] fix: allow to toggle switch by Enter key --- src/components/SelectionList/BaseSelectionList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx index 2280563fa3225..3c2fdc6a5f46b 100644 --- a/src/components/SelectionList/BaseSelectionList.tsx +++ b/src/components/SelectionList/BaseSelectionList.tsx @@ -264,7 +264,7 @@ function BaseSelectionList({ }; // Disable `Enter` shortcut if the active element is a button or checkbox - const disableEnterShortcut = activeElementRole && [CONST.ROLE.BUTTON, CONST.ROLE.CHECKBOX].includes(activeElementRole as ButtonOrCheckBoxRoles); + const disableEnterShortcut = activeElementRole && [CONST.ROLE.BUTTON, CONST.ROLE.CHECKBOX, CONST.ROLE.SWITCH].includes(activeElementRole as ButtonOrCheckBoxRoles); useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.ENTER, selectFocusedOption, { captureOnInputs: true, From 635e2ceda4ca4a9d4a2d3cc4851e2bdd3d734b24 Mon Sep 17 00:00:00 2001 From: truph01 Date: Tue, 31 Mar 2026 01:44:49 +0700 Subject: [PATCH 4/6] fix: apply AI suggestion --- src/components/SelectionList/BaseSelectionList.tsx | 6 +++--- .../BaseSelectionListWithSections.tsx | 6 +++--- src/components/SelectionList/types.ts | 4 ++-- 3 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx index 3c2fdc6a5f46b..721ca77940528 100644 --- a/src/components/SelectionList/BaseSelectionList.tsx +++ b/src/components/SelectionList/BaseSelectionList.tsx @@ -26,7 +26,7 @@ import TextInput from './components/TextInput'; import useSearchFocusSync from './hooks/useSearchFocusSync'; import useSelectedItemFocusSync from './hooks/useSelectedItemFocusSync'; import ListItemRenderer from './ListItem/ListItemRenderer'; -import type {ButtonOrCheckBoxRoles, DataDetailsType, ListItem, SelectionListProps} from './types'; +import type {DataDetailsType, InteractiveElementRoles, ListItem, SelectionListProps} from './types'; import {getListboxRole} from './utils/getListboxRole'; const ANIMATED_HIGHLIGHT_DURATION = @@ -263,8 +263,8 @@ function BaseSelectionList({ selectRow(focusedOption); }; - // Disable `Enter` shortcut if the active element is a button or checkbox - const disableEnterShortcut = activeElementRole && [CONST.ROLE.BUTTON, CONST.ROLE.CHECKBOX, CONST.ROLE.SWITCH].includes(activeElementRole as ButtonOrCheckBoxRoles); + // Disable `Enter` shortcut if the active element is a button, checkbox, or switch + const disableEnterShortcut = activeElementRole && [CONST.ROLE.BUTTON, CONST.ROLE.CHECKBOX, CONST.ROLE.SWITCH].includes(activeElementRole as InteractiveElementRoles); useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.ENTER, selectFocusedOption, { captureOnInputs: true, diff --git a/src/components/SelectionList/SelectionListWithSections/BaseSelectionListWithSections.tsx b/src/components/SelectionList/SelectionListWithSections/BaseSelectionListWithSections.tsx index 29dc9f607c478..7a9e915f8e223 100644 --- a/src/components/SelectionList/SelectionListWithSections/BaseSelectionListWithSections.tsx +++ b/src/components/SelectionList/SelectionListWithSections/BaseSelectionListWithSections.tsx @@ -12,7 +12,7 @@ import useFlattenedSections, {isItemSelected, shouldTreatItemAsDisabled} from '@ import useSearchFocusSync from '@components/SelectionList/hooks/useSearchFocusSync'; import useSelectedItemFocusSync from '@components/SelectionList/hooks/useSelectedItemFocusSync'; import ListItemRenderer from '@components/SelectionList/ListItem/ListItemRenderer'; -import type {ButtonOrCheckBoxRoles} from '@components/SelectionList/types'; +import type {InteractiveElementRoles} from '@components/SelectionList/types'; import {getListboxRole} from '@components/SelectionList/utils/getListboxRole'; import Text from '@components/Text'; import type {BaseTextInputRef} from '@components/TextInput/BaseTextInput/types'; @@ -225,8 +225,8 @@ function BaseSelectionListWithSections({ [focusTextInput, scrollToIndex, clearInputAfterSelect, updateAndScrollToFocusedIndex, updateExternalTextInputFocus, getFocusedItem], ); - // Disable `Enter` shortcut if the active element is a button or checkbox - const disableEnterShortcut = activeElementRole && [CONST.ROLE.BUTTON, CONST.ROLE.CHECKBOX].includes(activeElementRole as ButtonOrCheckBoxRoles); + // Disable `Enter` shortcut if the active element is a button, checkbox, or switch + const disableEnterShortcut = activeElementRole && [CONST.ROLE.BUTTON, CONST.ROLE.CHECKBOX, CONST.ROLE.SWITCH].includes(activeElementRole as InteractiveElementRoles); useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.ENTER, selectFocusedItem, { captureOnInputs: true, diff --git a/src/components/SelectionList/types.ts b/src/components/SelectionList/types.ts index 8b6b8eca5300c..64f08c700b8ca 100644 --- a/src/components/SelectionList/types.ts +++ b/src/components/SelectionList/types.ts @@ -284,7 +284,7 @@ type ConfirmButtonOptions = { isDisabled?: boolean; }; -type ButtonOrCheckBoxRoles = 'button' | 'checkbox'; +type InteractiveElementRoles = 'button' | 'checkbox' | 'switch'; type SelectionListHandle = { /** Scrolls to and highlights the specified items */ @@ -331,7 +331,7 @@ export type { TextInputOptions, ConfirmButtonOptions, ListItem, - ButtonOrCheckBoxRoles, + InteractiveElementRoles, SelectionListStyle, SelectionListWithSectionsHandle, SelectionListWithSectionsProps, From 667c02fdaa5b81590c8e89d6ef2ff3d25e422d39 Mon Sep 17 00:00:00 2001 From: truph01 Date: Tue, 31 Mar 2026 02:22:34 +0700 Subject: [PATCH 5/6] fix: update strong badge text color --- src/components/Badge.tsx | 3 ++- src/styles/index.ts | 4 ---- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/src/components/Badge.tsx b/src/components/Badge.tsx index cca795cfa5e53..27d94b3bfc3a2 100644 --- a/src/components/Badge.tsx +++ b/src/components/Badge.tsx @@ -124,7 +124,8 @@ function Badge({ !isStrong && !success && !error && styles.badgeDefaultText, !isStrong && success && styles.badgeSuccessText, !isStrong && error && styles.badgeDangerText, - isStrong && (success || error) && styles.badgeStrongText, + isStrong && success && styles.buttonSuccessText, + isStrong && error && styles.buttonDangerText, textStyles, isDeleted ? styles.offlineFeedbackDeleted : {}, ]} diff --git a/src/styles/index.ts b/src/styles/index.ts index 8a2b664266d8c..7a79a3a343969 100644 --- a/src/styles/index.ts +++ b/src/styles/index.ts @@ -1076,10 +1076,6 @@ const staticStyles = (theme: ThemeColors) => color: theme.badgeDangerText, }, - badgeStrongText: { - color: theme.buttonSuccessText, - }, - badgeText: { color: theme.text, fontSize: variables.fontSizeSmall, From f4f3999d92a171311a933590f4ee0162bd94bea6 Mon Sep 17 00:00:00 2001 From: truph01 Date: Wed, 1 Apr 2026 15:20:39 +0700 Subject: [PATCH 6/6] fix update ourMentionBG and ourMentionText in dark contrast --- src/styles/theme/themes/dark-contrast.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/styles/theme/themes/dark-contrast.ts b/src/styles/theme/themes/dark-contrast.ts index 75c77a848bc7c..725971457960e 100644 --- a/src/styles/theme/themes/dark-contrast.ts +++ b/src/styles/theme/themes/dark-contrast.ts @@ -14,6 +14,8 @@ const darkContrastTheme = { textLight: colors.productLight900, iconColorfulBackground: colors.yellow800, mentionBG: colors.blue100, + ourMentionBG: colors.green100, + ourMentionText: colors.green700, } satisfies ThemeColors; export default darkContrastTheme;