BTDeviceItem

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.

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 for the prebuilt list.