1. Summary
The Button component from @amazon-devices/kepler-ui-components correctly applies
focusedStyle when a button receives focus via the Fire TV remote D-pad. However, after
the user presses and releases the OK/Select button on the remote, the focusedStyle is
visually removed — even though the button remains focused . while still
being the active focused element, breaking the TV navigation experience for the user.
App Name: frndly tv
Bug Severity
- Impacts operation of app
2. Steps to Reproduce
-
- Render a
Buttoncomponent with afocusedStyleprop (e.g. green background/border). - Launch the app on a Fire TV device or simulator.
- Navigate to the button using the D-pad on the Fire TV remote —
focusedStyleis
applied correctly (green style visible). - Press the OK / Select button on the Fire TV remote to trigger
onPress. - Release the OK / Select button.
- Observe the button’s visual appearance after release.
- Render a
3. Observed Behavior
- - When the button receives focus via D-pad: focusedStyle is correctly applied
- When the OK button is pressed (held down): focusedStyle / pressedStyle visible
- After the OK button is RELEASED: focusedStyle disappears
- The button visually reverts to its base `style` prop
- No `onBlur` event is fired — the button is still focused
- This creates a visual flash and leaves no focus indicator for the user
- Reproducible on every Button in the app that uses focusedStyle
4. Expected Behavior
ng and releasing the OK/Select button on the Fire TV remote:
- The button should remain visually focused (focusedStyle should persist)
- focusedStyle should only be removed when onBlur fires (i.e. focus moves away)
- The press-release cycle should not affect the focused visual state
4.a Possible Root Cause & Temporary Workaround
Fill out anything you have tried. If you don’t know, N/A is acceptable
<!-- Answer here -->
5. Logs or crash report
(Please make sure to provide relevant logs as attachment)
For crash issues, please refer this guide for faster troubleshooting: Detect Where the App Crash Originates | Design and Develop Vega Apps
-
For issues with Vega Studio Extension, please share log files from below folders:
For v0.22+:~/.vscode/extensions/amazon.vega-extension-<version>/ExtensionLogs ~/.vscode/extensions/amazon.vega-ui-extension-<version>/ExtensionLogsFor v0.21 and earlier:
~/.vscode/extensions/amazon.kepler-extension-<version>/ExtensionLogs ~/.vscode/extensions/amazon.kepler-ui-extension-<version>/ExtensionLogs
6. Environment
Please fill out the fields related to your bug below:
-
**SDK Version:**Active SDK Version: 0.22.6150
Vega CLI Version: 1.2.18 -
OS Information: NAME=“OS”
OE_VERSION=“4.0.0”
OS_MAJOR_VERSION=“1”
OS_MINOR_VERSION=“1”
RELEASE_ID=“14”
OS_VERSION=“1.1”
BRANCH_CODE=“TV Ship day60”
BUILD_DESC=“OS 1.1 (TV Ship day60/101)”
BUILD_FINGERPRINT=“4.0.249302.0(3072cab629675a74)/101N:user/release-keys”
BUILD_VARIANT=“user”
BUILD_TAGS=“release-keys”
BUILD_DATE=“Sat Mar 14 22:24:12 UTC 2026”
BUILD_TIMESTAMP=“1773527052”
VERSION_NUMBER=“1401010010120”
7. Example Code Snippet / Screenshots / Screengrabs
Minimal reproducible example:
import React, { useRef } from 'react';
import { View, StyleSheet } from 'react-native';
import { Button } from '@amazon-devices/kepler-ui-components';
const BugDemo = () => {
const btnRef = useRef(null);
return (
<View style={styles.container}>
{/* Bug: after pressing OK and releasing, focusedStyle disappears */}
<Button
ref={btnRef}
label="Watch Now"
variant="primary"
mode="contained"
hasTVPreferredFocus={true}
style={styles.buttonStyle}
focusedStyle={styles.buttonFocused}
pressedStyle={styles.buttonFocused}
onPress={() => console.log('pressed')}
/>
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: 'black',
justifyContent: 'center',
alignItems: 'center',
},
buttonStyle: {
backgroundColor: '#1E1A33',
height: 85,
borderColor: '#898989',
borderWidth: 5,
borderRadius: 15,
width: 400,
},
buttonFocused: {
backgroundColor: '#00AD50', // green — should persist after OK release
borderColor: '#ffffff',
borderWidth: 5,
borderRadius: 15,
},
});
export default BugDemo;>