Run a first use-device example
Run a first use-device example: Reactive Expo hook for window, platform, locale, direction, and color scheme
Start with the smallest workflow described by the README for use-device. Complete installation and configuration first.
Use
import { Text, View } from 'react-native';
import { useDevice } from '@kyna-code/use-device';
export function EnvironmentSummary() {
const device = useDevice();
return (
<View>
<Text>{device.width} × {device.height}</Text>
<Text>{device.platform}</Text>
<Text>{device.languageTag}</Text>
<Text>{device.theme}</Text>
</View>
);
}The returned snapshot updates when the app window, font scale, system theme, or
locale changes. width and height are the app-window dimensions in logical
pixels, not the physical screen size, so they behave correctly with split-screen
and resizable web or desktop windows.
App-specific decisions—such as breakpoints, supported interface languages, and theme color tokens—belong in the consuming app and can be derived from this hook.
Expected result
Render EnvironmentSummary inside an Expo screen. It should display the app-window width and height, platform, locale tag, and theme. Resize the window or change the system theme and confirm the snapshot updates. Width and height are logical pixels; choose your own breakpoints instead of treating them as physical screen measurements.
Verify the repository source
For contributors working in the repository checkout, the root manifest provides this check. If you installed a library into another application, use that application’s scripts instead:
npm run typecheckRead any errors before continuing. Build and type checks verify source consistency; exercise the README example to verify the behavior you need.
Next task
Read the usage guide for the documented components, configuration, and source layout.
Source and help
The catalog identifies the license as MIT. Read the repository license before redistributing source or assets.
Source captured: 2026-10-11