# BTDeviceItem

Canonical page: https://docs.ovok.com/native-sdk/guide/components/bt-device/bt-device-item

`BTDeviceItem` is a themed, pressable container with compound layout parts. `BTDeviceList` uses these parts for its default row; apps can compose them in custom lists.

Import it from `@ovok/native/bt-device`.

~~~tsx
import { BTDeviceItem } from "@ovok/native/bt-device";
import { DeviceStatus } from "@ovok/native/bt-management";

<BTDeviceItem onPress={openDevice}>
  <BTDeviceItem.TopContainer>
    <BTDeviceItem.Content>
      <BTDeviceItem.Title>Blood pressure monitor</BTDeviceItem.Title>
      <BTDeviceItem.SubTitle>Manufacturer</BTDeviceItem.SubTitle>
      <BTDeviceItem.Status status={DeviceStatus.CONNECTED} />
    </BTDeviceItem.Content>
    <BTDeviceItem.Image uri={imageUri} />
  </BTDeviceItem.TopContainer>
  <BTDeviceItem.Divider />
  <BTDeviceItem.BottomContainer>
    <BTDeviceItem.SubTitle>Instructions</BTDeviceItem.SubTitle>
  </BTDeviceItem.BottomContainer>
</BTDeviceItem>;
~~~

The compound parts are `TopContainer`, `Content`, `Title`, `SubTitle`, `Status`, `Image`, `Divider`, and `BottomContainer`. Their names are properties on `BTDeviceItem`; import the parent component rather than importing those implementation files directly.

The root accepts React Native `TouchableOpacityProps` and children. It uses the active SDK app theme for surface, border, radius, shadow, and elevation. The parts provide the row structure; use normal React Native styles and accessibility props for product-specific behavior.

See [BTDeviceList](/native-sdk/guide/components/bt-device/bt-device-list/) for the prebuilt list.
