# @ovok/native/ui

Canonical page: https://docs.ovok.com/native-sdk/reference/ui

Ready-made measurement and device flows: pairing, manual entry, charts, calendars and ECG strips.

Import from `@ovok/native/ui`.

## Components [#components]

### Calendar [#calendar]

```ts
const Calendar: MemoExoticComponent<(__namedParameters) => Element>;
```

Month calendar with selectable, markable days.

***

### MeasurementTrendChart [#measurementtrendchart]

```ts
const MeasurementTrendChart: MemoExoticComponent<(__namedParameters) => Element>;
```

Line chart of measurement readings with optional normal range and threshold lines.

***

### Sparkline [#sparkline]

```ts
const Sparkline: MemoExoticComponent<(props) => Element>;
```

Compact `MeasurementTrendChart` with small default dimensions.

***

### BackgroundSyncSetting() [#backgroundsyncsetting]

```ts
function BackgroundSyncSetting(__namedParameters): Element;
```

Card with a switch to enable background Bluetooth sync and its current status.

#### Parameters [#parameters]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`BackgroundSyncSettingProps`](#backgroundsyncsettingprops) |

#### Returns [#returns]

`Element`

***

### BluetoothStateNotice() [#bluetoothstatenotice]

```ts
function BluetoothStateNotice(__namedParameters): Element | null;
```

Card that explains why Bluetooth is unavailable and offers the fixing action; renders nothing when Bluetooth is on.

#### Parameters [#parameters-1]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`BluetoothStateNoticeProps`](#bluetoothstatenoticeprops) |

#### Returns [#returns-1]

`Element` \| `null`

***

### EcgStripViewer() [#ecgstripviewer]

```ts
function EcgStripViewer(__namedParameters): Element;
```

Paged ECG strip on a millimetre grid.

#### Parameters [#parameters-2]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`EcgStripViewerProps`](#ecgstripviewerprops) |

#### Returns [#returns-2]

`Element`

***

### FlowFrame() [#flowframe]

```ts
function FlowFrame(__namedParameters): Element;
```

Layout primitive for host-owned, multi-step flows. It does not navigate or save data.

#### Parameters [#parameters-3]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`FlowFrameProps`](#flowframeprops) |

#### Returns [#returns-3]

`Element`

***

### HealthImportCard() [#healthimportcard]

```ts
function HealthImportCard<TType>(__namedParameters): Element;
```

Card with a switch to enable health data import and the access status per type.

#### Type Parameters [#type-parameters]

| Type Parameter |
| ------ |
| <a id="type-parameter-ttype-1"></a> `TType` *extends* `string` |

#### Parameters [#parameters-4]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`HealthImportCardProps`](#healthimportcardprops)\<`TType`\> |

#### Returns [#returns-4]

`Element`

***

### ManualEntryForm() [#manualentryform]

```ts
function ManualEntryForm(__namedParameters): Element;
```

Form to enter and save a measurement manually, validated against the field ranges.

#### Parameters [#parameters-5]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`ManualEntryFormProps`](#manualentryformprops) |

#### Returns [#returns-5]

`Element`

***

### NearbyDevicePrompt() [#nearbydeviceprompt]

```ts
function NearbyDevicePrompt(__namedParameters): Element;
```

Modal that asks whether a nearby device is the user's and pairs it on acceptance.

#### Parameters [#parameters-6]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`NearbyDevicePromptProps`](#nearbydevicepromptprops) |

#### Returns [#returns-6]

`Element`

***

### PairingFlow() [#pairingflow]

```ts
function PairingFlow(__namedParameters): Element;
```

Lists nearby Bluetooth devices and pairs the one the user selects.

#### Parameters [#parameters-7]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`PairingFlowProps`](#pairingflowprops) |

#### Returns [#returns-7]

`Element`

***

### PeriodCalendar() [#periodcalendar]

```ts
function PeriodCalendar(__namedParameters): Element;
```

`Calendar` that highlights date ranges, such as menstrual periods.

#### Parameters [#parameters-8]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`PeriodCalendarProps`](#periodcalendarprops) |

#### Returns [#returns-8]

`Element`

***

### PrerequisiteGate() [#prerequisitegate]

```ts
function PrerequisiteGate<T>(__namedParameters): Element;
```

Loads host-defined, account-scoped prerequisites before rendering children.
This is a UI gate only; backend authorization remains authoritative.

#### Type Parameters [#type-parameters-1]

| Type Parameter |
| ------ |
| <a id="type-parameter-t-1"></a> `T` |

#### Parameters [#parameters-9]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`PrerequisiteGateProps`](#prerequisitegateprops)\<`T`\> |

#### Returns [#returns-9]

`Element`

***

### SupportedDevicesCatalogList() [#supporteddevicescataloglist]

```ts
function SupportedDevicesCatalogList(__namedParameters): Element;
```

Scrollable catalog of supported devices with photo, measurements and manual link.

#### Parameters [#parameters-10]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`SupportedDevicesCatalogListProps`](#supporteddevicescataloglistprops) |

#### Returns [#returns-10]

`Element`

***

### UrineTestResult() [#urinetestresult]

```ts
function UrineTestResult(__namedParameters): Element;
```

Lists the analytes of a urine test with their values and usual ranges.

#### Parameters [#parameters-11]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters` | [`UrineTestResultProps`](#urinetestresultprops) |

#### Returns [#returns-11]

`Element`

## Hooks [#hooks]

### useOvokUi() [#useovokui]

```ts
function useOvokUi(__namedParameters?): object;
```

Resolves the theme and UI slots from the Paper theme, overrides and slot replacements.

#### Parameters [#parameters-12]

| Parameter | Type |
| ------ | ------ |
| `__namedParameters?` | [`OvokUiProps`](#ovokuiprops) |

#### Returns [#returns-12]

| Name | Type | Description |
| ------ | ------ | ------ |
| `slots` | [`ResolvedOvokUiSlots`](#resolvedovokuislots) | UI primitives with the react-native-paper defaults filled in. |
| `theme` | [`OvokTheme`](#ovoktheme) | Active theme with the override merged in. |

## Functions [#functions]

### mergeOvokTheme() [#mergeovoktheme]

```ts
function mergeOvokTheme(base, override?): OvokTheme;
```

Merges a theme override over a base theme, including colors and fonts.

#### Parameters [#parameters-13]

| Parameter | Type |
| ------ | ------ |
| `base` | [`OvokTheme`](#ovoktheme) |
| `override?` | [`OvokThemeOverride`](#ovokthemeoverride) |

#### Returns [#returns-13]

[`OvokTheme`](#ovoktheme)

## Interfaces [#interfaces]

### BackgroundSyncSettingProps [#backgroundsyncsettingprops]

Props of `BackgroundSyncSetting`.

#### Extends [#extends]

- [`OvokUiProps`](#ovokuiprops)
- [`UseBackgroundSyncOptions`](/native-sdk/reference/bt-management#usebackgroundsyncoptions)

#### Properties [#properties]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-canenable"></a> `canEnable?` | () => `Promise`\<`boolean`\> | Checked before turning sync on; resolve `false` to mark it restricted. | [`UseBackgroundSyncOptions`](/native-sdk/reference/bt-management#usebackgroundsyncoptions).[`canEnable`](/native-sdk/reference/bt-management#property-canenable) |
| <a id="property-description"></a> `description?` | `ReactNode` | Text under the heading; defaults to a platform-specific description. | - |
| <a id="property-enabled"></a> `enabled?` | `boolean` | Initial state; defaults to off. | [`UseBackgroundSyncOptions`](/native-sdk/reference/bt-management#usebackgroundsyncoptions).[`enabled`](/native-sdk/reference/bt-management#property-enabled-2) |
| <a id="property-onenabledchange"></a> `onEnabledChange?` | (`enabled`) => `void` \| `Promise`\<`void`\> | Called before the new state is applied, for example to persist it. | [`UseBackgroundSyncOptions`](/native-sdk/reference/bt-management#usebackgroundsyncoptions).[`onEnabledChange`](/native-sdk/reference/bt-management#property-onenabledchange) |
| <a id="property-reasonlabels"></a> `reasonLabels?` | `Partial`\<`Record`\<`string`, `string`\>\> | Overrides the reason texts. | - |
| <a id="property-slots"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-statuslabels"></a> `statusLabels?` | `Partial`\<`Record`\<`"blocked"` \| `"on"` \| `"off"` \| `"restricted"`, `string`\>\> | Overrides the status texts. | - |
| <a id="property-testid"></a> `testID?` | `string` | Test identifier of the card. | - |
| <a id="property-theme"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |
| <a id="property-title"></a> `title?` | `string` | Card heading. | - |

***

### BluetoothStateNoticeCopy [#bluetoothstatenoticecopy]

Texts shown for one Bluetooth state.

#### Properties [#properties-1]

| Property | Type | Description |
| ------ | ------ | ------ |
| <a id="property-action"></a> `action?` | `string` | Label of the action button. |
| <a id="property-body"></a> `body?` | `string` | Explanatory text. |
| <a id="property-heading"></a> `heading?` | `string` | Heading text. |

***

### BluetoothStateNoticeProps [#bluetoothstatenoticeprops]

Props of `BluetoothStateNotice`.

#### Extends [#extends-1]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-2]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-blemanager"></a> `bleManager?` | `BleManager` | BLE manager used to read the Bluetooth state. | - |
| <a id="property-copy"></a> `copy?` | `Partial`\<`Record`\< \| `"unsupported"` \| [`BluetoothPermissionStatus`](/native-sdk/reference/bt-management#bluetoothpermissionstatus) \| `"on"` \| `"off"` \| `"unauthorized"`, [`BluetoothStateNoticeCopy`](#bluetoothstatenoticecopy)\>\> | Per-state text overrides. | - |
| <a id="property-onopensettings"></a> `onOpenSettings?` | () => `void` \| `Promise`\<`void`\> | Opens the settings screen; defaults to the OS Bluetooth or app settings. | - |
| <a id="property-requestpermission"></a> `requestPermission?` | () => `Promise`\<`boolean`\> | Requests Bluetooth permission; resolves true when granted. | - |
| <a id="property-settingsaction"></a> `settingsAction?` | `string` | Label that forces the settings action button. | - |
| <a id="property-slots-1"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-testid-1"></a> `testID?` | `string` | Test identifier of the notice. | - |
| <a id="property-theme-1"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |
| <a id="property-title-1"></a> `title?` | `string` | Overrides the notice heading. | - |

***

### CalendarDayMarker [#calendardaymarker]

Highlight applied to a calendar day.

#### Properties [#properties-3]

| Property | Type | Description |
| ------ | ------ | ------ |
| <a id="property-backgroundcolor"></a> `backgroundColor?` | `string` | Background color of the day cell. |
| <a id="property-color"></a> `color?` | `string` | Text color of the day. |
| <a id="property-date"></a> `date` | `CalendarDateInput` | Day to mark. |
| <a id="property-label"></a> `label?` | `string` | Accessibility label for the marked day. |
| <a id="property-rangeposition"></a> `rangePosition?` | `"start"` \| `"end"` \| `"middle"` \| `"single"` | Position of the day within a highlighted range. |

***

### CalendarProps [#calendarprops]

Props of `Calendar`.

#### Extends [#extends-2]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-4]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-defaultselecteddate"></a> `defaultSelectedDate?` | `CalendarDateInput` | Initial selected date when uncontrolled. | - |
| <a id="property-defaultvisiblemonth"></a> `defaultVisibleMonth?` | `CalendarDateInput` | Initial visible month when uncontrolled. | - |
| <a id="property-getmarkerfordate"></a> `getMarkerForDate?` | (`date`) => [`CalendarDayMarker`](#calendardaymarker) \| `undefined` | Resolves the marker for a date. | - |
| <a id="property-isdatedisabled"></a> `isDateDisabled?` | (`date`) => `boolean` | Returns true for dates that cannot be selected. | - |
| <a id="property-labelfordate"></a> `labelForDate?` | (`date`) => `string` | Returns the accessibility label for a date. | - |
| <a id="property-locale"></a> `locale?` | `string` | BCP 47 locale for month and weekday names. | - |
| <a id="property-markers"></a> `markers?` | readonly [`CalendarDayMarker`](#calendardaymarker)[] | Day markers to display. | - |
| <a id="property-maxdate"></a> `maxDate?` | `CalendarDateInput` | Latest selectable date. | - |
| <a id="property-mindate"></a> `minDate?` | `CalendarDateInput` | Earliest selectable date. | - |
| <a id="property-nextmonthlabel"></a> `nextMonthLabel?` | `string` | Accessibility label of the next-month button. | - |
| <a id="property-ondateselect"></a> `onDateSelect?` | (`date`) => `void` | Called when the user selects a date. | - |
| <a id="property-onvisiblemonthchange"></a> `onVisibleMonthChange?` | (`month`) => `void` | Called when the visible month changes. | - |
| <a id="property-previousmonthlabel"></a> `previousMonthLabel?` | `string` | Accessibility label of the previous-month button. | - |
| <a id="property-selecteddate"></a> `selectedDate?` | `CalendarDateInput` \| `null` | Controlled selected date; `null` clears the selection. | - |
| <a id="property-slots-2"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-testid-2"></a> `testID?` | `string` | Test identifier prefix. | - |
| <a id="property-theme-2"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |
| <a id="property-visiblemonth"></a> `visibleMonth?` | `CalendarDateInput` | Controlled visible month. | - |
| <a id="property-weekstartson"></a> `weekStartsOn?` | `WeekStartsOn` | First day of the week. | - |

***

### EcgStripViewerProps [#ecgstripviewerprops]

Props of `EcgStripViewer`.

#### Extends [#extends-3]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-5]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-gain"></a> `gain?` | `number` | Gain in millimetres per millivolt. Standard ECG paper uses 10. | - |
| <a id="property-initialpage"></a> `initialPage?` | `number` | Page shown first, 0-based. | - |
| <a id="property-onpagechange"></a> `onPageChange?` | (`page`, `pageCount`) => `void` | Called when the page changes with the page index and page count. | - |
| <a id="property-pagedurationseconds"></a> `pageDurationSeconds?` | `number` | Seconds of ECG shown per page. | - |
| <a id="property-samplerate"></a> `sampleRate` | `number` | Samples per second. | - |
| <a id="property-samples"></a> `samples` | readonly `number`[] | ECG samples in millivolts, in chronological order. | - |
| <a id="property-slots-3"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-speed"></a> `speed?` | `number` | Speed in millimetres per second. Standard ECG paper uses 25. | - |
| <a id="property-testid-3"></a> `testID?` | `string` | Test identifier of the viewer. | - |
| <a id="property-theme-3"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |

***

### FlowFrameProps [#flowframeprops]

Props of `FlowFrame`.

#### Extends [#extends-4]

- [`OvokUiProps`](#ovokuiprops)
- `Omit`\<`ViewProps`, `"children"`\>

#### Properties [#properties-6]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-backlabel"></a> `backLabel?` | `string` | Label of the back button. | - |
| <a id="property-children"></a> `children?` | `ReactNode` | Main content. | - |
| <a id="property-contentstyle"></a> `contentStyle?` | `StyleProp`\<`ViewStyle`\> | Style of the layout container. | - |
| <a id="property-currentstep"></a> `currentStep?` | `number` | Current step, 1-based, for the progress bar. | - |
| <a id="property-footer"></a> `footer?` | `ReactNode` | Content pinned to the bottom. | - |
| <a id="property-handleandroidback"></a> `handleAndroidBack?` | `boolean` | Whether the Android back button calls `onBack`. | - |
| <a id="property-header"></a> `header?` | `ReactNode` | Extra content below the heading and progress bar. | - |
| <a id="property-keyboardbehavior"></a> `keyboardBehavior?` | `"height"` \| `"padding"` \| `"position"` | How the layout avoids the keyboard. | - |
| <a id="property-keyboardverticaloffset"></a> `keyboardVerticalOffset?` | `number` | Vertical offset for keyboard avoidance. | - |
| <a id="property-onback"></a> `onBack?` | () => `boolean` \| `void` | Called when the back button or Android back is pressed; return `false` to let Android handle it. | - |
| <a id="property-progressaccessibilitylabel"></a> `progressAccessibilityLabel?` | `string` | Accessibility label of the progress bar. | - |
| <a id="property-safeareaedges"></a> `safeAreaEdges?` | `Edge`[] | Safe area edges to respect. | - |
| <a id="property-slots-4"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-theme-4"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |
| <a id="property-title-2"></a> `title?` | `string` | Heading shown in the header. | - |
| <a id="property-totalsteps"></a> `totalSteps?` | `number` | Total steps for the progress bar. | - |

***

### HealthImportCardProps [#healthimportcardprops]

Props of `HealthImportCard`.

#### Extends [#extends-5]

- [`OvokUiProps`](#ovokuiprops)

#### Type Parameters [#type-parameters-2]

| Type Parameter | Default type |
| ------ | ------ |
| <a id="type-parameter-ttype"></a> `TType` *extends* `string` | `string` |

#### Properties [#properties-7]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-adapter"></a> `adapter` | [`HealthImportAdapter`](/native-sdk/reference/bt-management#healthimportadapter)\<`TType`\> | Platform adapter that reads and authorizes health data. | - |
| <a id="property-background"></a> `background?` | `boolean` | Whether to also enable background import. | - |
| <a id="property-labelfortype"></a> `labelForType?` | (`type`) => `string` | Returns the display label of a data type. | - |
| <a id="property-progress"></a> `progress?` | `Partial`\<`Record`\<`TType`, [`SyncProgress`](/native-sdk/reference/data-sync#syncprogress)\>\> | Sync progress per data type. | - |
| <a id="property-reasonlabels-1"></a> `reasonLabels?` | `Partial`\<`Record`\<`NonNullable`\<[`SyncPauseReason`](/native-sdk/reference/data-sync#syncpausereason) \| `undefined`\>, `string`\>\> | Overrides the progress reason texts. | - |
| <a id="property-slots-5"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-statuslabels-1"></a> `statusLabels?` | `Partial`\<`Record`\<`"started"` \| `"completed"` \| `"failed"` \| `"idle"` \| `"syncing"` \| `"paused"`, `string`\>\> | Overrides the progress status texts. | - |
| <a id="property-testid-4"></a> `testID?` | `string` | Test identifier of the card. | - |
| <a id="property-theme-5"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |
| <a id="property-title-3"></a> `title?` | `string` | Card heading. | - |
| <a id="property-types"></a> `types` | readonly `TType`[] | Health data types to import. | - |

***

### ManualEntryFormProps [#manualentryformprops]

Props of `ManualEntryForm`.

#### Extends [#extends-6]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-8]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-initialvalues"></a> `initialValues?` | `Partial`\<`Record`\<`string`, `number`\>\> | Prefilled values keyed by field. | - |
| <a id="property-labelforfield"></a> `labelForField?` | (`field`) => `string` | Returns the display label of a field. | - |
| <a id="property-labelforunit"></a> `labelForUnit?` | (`unit`) => `string` | Returns the display label of a unit. | - |
| <a id="property-measurementtypekey"></a> `measurementTypeKey` | `MeasurementTypeKey` | Measurement type whose fields the form shows. | - |
| <a id="property-onsaved"></a> `onSaved?` | (`input`) => `void` | Called after the measurement is saved. | - |
| <a id="property-recordedat"></a> `recordedAt?` | `Date` | Initial measurement time. | - |
| <a id="property-savemeasurement"></a> `saveMeasurement` | (`input`) => `Promise`\<`unknown`\> | Persists the entered measurement; a rejection is shown as the form error. | - |
| <a id="property-slots-6"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-testid-5"></a> `testID?` | `string` | Test identifier of the form. | - |
| <a id="property-theme-6"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |
| <a id="property-title-4"></a> `title?` | `string` | Form heading. | - |

***

### ManualEntrySaveInput [#manualentrysaveinput]

Measurement the user entered by hand.

#### Properties [#properties-9]

| Property | Type | Description |
| ------ | ------ | ------ |
| <a id="property-data"></a> `data` | `Record`\<`string`, `number`\> | Entered values keyed by field. |
| <a id="property-measurementtypekey-1"></a> `measurementTypeKey` | `MeasurementTypeKey` | Type of the measurement. |
| <a id="property-recordedat-1"></a> `recordedAt` | `Date` | When the measurement was taken. |

***

### MeasurementReading [#measurementreading]

One chart reading.

#### Properties [#properties-10]

| Property | Type | Description |
| ------ | ------ | ------ |
| <a id="property-at"></a> `at` | `number` | Timestamp of the reading, epoch milliseconds. |
| <a id="property-values"></a> `values` | `number`[] | Values of each plotted series at that time. |

***

### MeasurementTrendChartProps [#measurementtrendchartprops]

Props of `MeasurementTrendChart`.

#### Extends [#extends-7]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-11]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-height"></a> `height?` | `number` | Chart height in pixels. | - |
| <a id="property-normalrange"></a> `normalRange?` | readonly \[`number`, `number`\] | Shaded normal range as `[min, max]`. | - |
| <a id="property-readings"></a> `readings` | readonly [`MeasurementReading`](#measurementreading)[] | Readings to plot in time order. | - |
| <a id="property-slots-7"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-testid-6"></a> `testID?` | `string` | Test identifier of the chart. | - |
| <a id="property-theme-7"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |
| <a id="property-thresholds"></a> `thresholds?` | readonly `number`[] | Values drawn as dashed lines. | - |
| <a id="property-width"></a> `width?` | `number` | Chart width in pixels. | - |

***

### NearbyDevicePromptProps [#nearbydevicepromptprops]

Props of `NearbyDevicePrompt`.

#### Extends [#extends-8]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-12]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-declinedstoragekey"></a> `declinedStorageKey?` | `string` | Key under which declined devices are stored. | - |
| <a id="property-enabled-1"></a> `enabled?` | `boolean` | Whether the prompt may appear. | - |
| <a id="property-hint"></a> `hint?` | `string` | Extra text shown under the title; `{{name}}` is replaced by the device name. | - |
| <a id="property-labels"></a> `labels?` | `Record`\<`string`, `string`\> | Overrides the visible copy. | - |
| <a id="property-onerror"></a> `onError?` | (`error`, `device?`) => `void` | Called when pairing fails. | - |
| <a id="property-onpaired"></a> `onPaired?` | (`device`) => `void` | Called after the device is paired. | - |
| <a id="property-slots-8"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-storage"></a> `storage` | [`PairedDeviceStorage`](/native-sdk/reference/bt-management#paireddevicestorage) | Storage used to remember paired devices. | - |
| <a id="property-storagekey"></a> `storageKey?` | `string` | Key under which paired devices are stored. | - |
| <a id="property-testid-7"></a> `testID?` | `string` | Test identifier of the modal. | - |
| <a id="property-theme-8"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |

***

### OvokUiProps [#ovokuiprops]

Theme and slot customisation accepted by SDK UI components.

#### Extended by [#extended-by]

- [`BluetoothDevicePickerProps`](/native-sdk/reference/bt-management#bluetoothdevicepickerprops)
- [`EcgStripViewerProps`](#ecgstripviewerprops)
- [`FlowFrameProps`](#flowframeprops)
- [`ManualEntryFormProps`](#manualentryformprops)
- [`SupportedDevicesCatalogListProps`](#supporteddevicescataloglistprops)
- [`BluetoothStateNoticeProps`](#bluetoothstatenoticeprops)
- [`PairingFlowProps`](#pairingflowprops)
- [`NearbyDevicePromptProps`](#nearbydevicepromptprops)
- [`UrineTestResultProps`](#urinetestresultprops)
- [`HealthImportCardProps`](#healthimportcardprops)
- [`BackgroundSyncSettingProps`](#backgroundsyncsettingprops)
- [`MeasurementTrendChartProps`](#measurementtrendchartprops)
- [`CalendarProps`](#calendarprops)
- [`BluetoothDevicePickerProps`](/native-sdk/reference/next-bluetooth#bluetoothdevicepickerprops)

#### Properties [#properties-13]

| Property | Type | Description |
| ------ | ------ | ------ |
| <a id="property-slots-9"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. |
| <a id="property-theme-9"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. |

***

### OvokUiSlots [#ovokuislots]

Replaceable UI primitives.

#### Properties [#properties-14]

| Property | Type | Description |
| ------ | ------ | ------ |
| <a id="property-activityindicator"></a> `ActivityIndicator` | `ComponentType`\<`ViewProps` & `RefAttributes`\<`View`\> & `object`\> | Loading indicator primitive. |
| <a id="property-button"></a> `Button` | `ComponentType`\<`Omit`\<`Props`, `"ref"`\> & `RefAttributes`\<`View`\>\> | Button primitive. |
| <a id="property-card"></a> `Card` | `ComponentType`\<( \| `Omit`\<`OutlinedCardProps` & `$Omit`\<`Omit`\<`Props`, `"ref"`\> & `RefAttributes`\<`View`\>, `"mode"`\> & `object`, `"ref"`\> \| `Omit`\<`ElevatedCardProps` & `$Omit`\<`Omit`\<`Props`, `"ref"`\> & `RefAttributes`\<`View`\>, `"mode"`\> & `object`, `"ref"`\> \| `Omit`\<`ContainedCardProps` & `$Omit`\<`Omit`\<`Props`, `"ref"`\> & `RefAttributes`\<`View`\>, `"mode"`\> & `object`, `"ref"`\>) & `RefAttributes`\<`View`\>\> | Card primitive. |
| <a id="property-switch"></a> `Switch` | `ComponentType`\<`SwitchProps` & `RefAttributes`\<`Switch`\> & `object`\> | Switch primitive. |
| <a id="property-text"></a> `Text` | `ComponentType`\<`TextProps` & `object` & `object`\> | Text primitive. |
| <a id="property-textinput"></a> `TextInput` | `ComponentType`\<`TextInputProps` & `RefAttributes`\<`TextInput`\> & `object` & `RefAttributes`\<`TextInputHandles`\>\> | Text input primitive. |
| <a id="property-urineanalyterow"></a> `UrineAnalyteRow` | `ComponentType`\<[`UrineAnalyteRowProps`](#urineanalyterowprops)\> | Row used to render a urine test analyte. |

***

### PairingFlowProps [#pairingflowprops]

Props of `PairingFlow`.

#### Extends [#extends-9]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-15]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-getdeviceimage"></a> `getDeviceImage?` | (`device`) => `string` \| `undefined` | Returns an image URI for a device. | - |
| <a id="property-labels-1"></a> `labels?` | `Record`\<`string`, `string`\> | Override visible copy, including keys from `BluetoothErrorCode`. | - |
| <a id="property-onerror-1"></a> `onError?` | (`error`, `device?`) => `void` | Called when pairing fails. | - |
| <a id="property-onpaired-1"></a> `onPaired?` | (`device`) => `void` | Called after a device is paired. | - |
| <a id="property-onpairingcode"></a> `onPairingCode?` | (`code`, `device`) => `void` \| `Promise`\<`void`\> | Called with the code the user enters when the device requires one. | - |
| <a id="property-renderdevice"></a> `renderDevice?` | (`device`, `actions`) => `ReactNode` | Replaces the default device row; return `undefined` to keep the default. | - |
| <a id="property-renderempty"></a> `renderEmpty?` | (`state`) => `ReactNode` | Renders content when no device is found. | - |
| <a id="property-renderheader"></a> `renderHeader?` | (`state`) => `ReactNode` | Renders content above the device list. | - |
| <a id="property-slots-10"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-storage-1"></a> `storage` | [`PairedDeviceStorage`](/native-sdk/reference/bt-management#paireddevicestorage) | Storage used to remember paired devices. | - |
| <a id="property-storagekey-1"></a> `storageKey?` | `string` | Key under which paired devices are stored. | - |
| <a id="property-testid-8"></a> `testID?` | `string` | Test identifier of the root view. | - |
| <a id="property-theme-10"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |

***

### PeriodDateRange [#perioddaterange]

Inclusive date range of a period.

#### Properties [#properties-16]

| Property | Type | Description |
| ------ | ------ | ------ |
| <a id="property-enddate"></a> `endDate` | `CalendarDateInput` | Last day of the period. |
| <a id="property-startdate"></a> `startDate` | `CalendarDateInput` | First day of the period. |

***

### SupportedDevicesCatalogListProps [#supporteddevicescataloglistprops]

Props of `SupportedDevicesCatalogList`.

#### Extends [#extends-10]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-17]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-devices"></a> `devices?` | readonly [`SupportedDeviceDefinition`](/native-sdk/reference/bt-device#supporteddevicedefinition)[] | Devices to list; defaults to the supported device catalog. | - |
| <a id="property-labelformeasurementtype"></a> `labelForMeasurementType?` | (`type`) => `string` | Returns the display label of a measurement type. | - |
| <a id="property-onselect"></a> `onSelect?` | (`device`) => `void` | Called when the user selects a device. | - |
| <a id="property-rendercredit"></a> `renderCredit?` | (`device`) => `ReactNode` | Replaces the image credit line. | - |
| <a id="property-rendermanual"></a> `renderManual?` | (`device`) => `ReactNode` | Replaces the manual link. | - |
| <a id="property-rendermeasurementtypes"></a> `renderMeasurementTypes?` | (`device`) => `ReactNode` | Replaces the measured types line. | - |
| <a id="property-renderpairingtips"></a> `renderPairingTips?` | (`device`) => `ReactNode` | Replaces the pairing tips. | - |
| <a id="property-renderphoto"></a> `renderPhoto?` | (`device`) => `ReactNode` | Replaces the device photo. | - |
| <a id="property-slots-11"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-testid-9"></a> `testID?` | `string` | Test identifier of the list. | - |
| <a id="property-theme-11"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |

***

### UrineAnalyteRowProps [#urineanalyterowprops]

Props of a custom urine analyte row slot.

#### Properties [#properties-18]

| Property | Type | Description |
| ------ | ------ | ------ |
| <a id="property-accessibilitylabel"></a> `accessibilityLabel` | `string` | Screen reader label for the row. |
| <a id="property-analytekey"></a> `analyteKey` | `string` | Stable key of the analyte. |
| <a id="property-isoutsideusualrange"></a> `isOutsideUsualRange` | `boolean` | Whether the value is outside the usual range. |
| <a id="property-name"></a> `name` | `string` | Display name of the analyte. |
| <a id="property-rangelabel"></a> `rangeLabel?` | `string` | Formatted usual range, when known. |
| <a id="property-theme-12"></a> `theme` | [`OvokTheme`](#ovoktheme) | Resolved theme to render with. |
| <a id="property-value"></a> `value` | `string` | Formatted measured value. |

***

### UrineTestResultProps [#urinetestresultprops]

Props of `UrineTestResult`.

#### Extends [#extends-11]

- [`OvokUiProps`](#ovokuiprops)

#### Properties [#properties-19]

| Property | Type | Description | Inherited from |
| ------ | ------ | ------ | ------ |
| <a id="property-accessibilitylabelforanalyte"></a> `accessibilityLabelForAnalyte?` | (`key`, `fallback`) => `string` | Returns the screen reader label of an analyte row. | - |
| <a id="property-labelforanalyte"></a> `labelForAnalyte?` | (`key`, `fallback`) => `string` | Returns the display label of an analyte given its key and default label. | - |
| <a id="property-measurement"></a> `measurement` | `UrineAnalyzeMeasurement` | Urine analysis measurement to display. | - |
| <a id="property-showonlymeasured"></a> `showOnlyMeasured?` | `boolean` | Hides analytes that have no value. | - |
| <a id="property-slots-12"></a> `slots?` | `Partial`\<[`OvokUiSlots`](#ovokuislots)\> | Replace individual primitives without forking an SDK component. | [`OvokUiProps`](#ovokuiprops).[`slots`](#property-slots-9) |
| <a id="property-testid-10"></a> `testID?` | `string` | Test identifier of the card. | - |
| <a id="property-theme-13"></a> `theme?` | [`OvokThemeOverride`](#ovokthemeoverride) | A partial theme is merged with the active react-native-paper theme. | [`OvokUiProps`](#ovokuiprops).[`theme`](#property-theme-9) |

## Type Aliases [#type-aliases]

### OvokTheme [#ovoktheme]

```ts
type OvokTheme = MD3Theme & object;
```

React Native Paper MD3 theme extended with spacing and radius helpers.

#### Type Declaration [#type-declaration]

| Name | Type | Description |
| ------ | ------ | ------ |
| `borderRadius()` | (`value`) => `number` | Converts a radius unit to pixels. |
| `fontFamily?` | `string` | Font family applied to SDK text. |
| `spacing()` | (`value`) => `number` | Converts a spacing unit to pixels. |

***

### OvokThemeOverride [#ovokthemeoverride]

```ts
type OvokThemeOverride = Partial<Omit<OvokTheme, "colors" | "fonts">> & object;
```

Partial theme merged over the active theme.

#### Type Declaration [#type-declaration-1]

| Name | Type | Description |
| ------ | ------ | ------ |
| `colors?` | `Partial`\<[`OvokTheme`](#ovoktheme)\[`"colors"`\]\> | Color overrides. |
| `fonts?` | `Partial`\<[`OvokTheme`](#ovoktheme)\[`"fonts"`\]\> | Font overrides. |

***

### PairingFlowRenderState [#pairingflowrenderstate]

```ts
type PairingFlowRenderState = object;
```

State passed to the custom render callbacks.

#### Properties [#properties-20]

##### devices [#devices]

```ts
devices: readonly RuntimeDevice[];
```

Nearby devices found.

##### error? [#error]

```ts
error?: string;
```

Message of the last pairing error.

##### paired [#paired]

```ts
paired: readonly string[];
```

IDs of the remembered devices.

##### selected? [#selected]

```ts
selected?: RuntimeDevice;
```

Device being paired.

##### status [#status]

```ts
status: PairingFlowStatus;
```

Current pairing status.

***

### PairingFlowStatus [#pairingflowstatus]

```ts
type PairingFlowStatus = "idle" | "pairing" | "code-required" | "paired" | "error";
```

Stage of the pairing flow.

***

### PeriodCalendarProps [#periodcalendarprops]

```ts
type PeriodCalendarProps = Omit<CalendarProps, "markers" | "getMarkerForDate"> & object;
```

Props of `PeriodCalendar`: calendar props except markers.

#### Type Declaration [#type-declaration-2]

| Name | Type | Description |
| ------ | ------ | ------ |
| `labelForPeriodDate()?` | (`date`) => `string` | Returns the accessibility label of a period day. |
| `periodLabel?` | `string` | Accessibility label and legend text for period days. |
| `periods` | readonly [`PeriodDateRange`](#perioddaterange)[] | Date ranges to highlight; overlapping or adjacent ranges are merged. |
| `showLegend?` | `boolean` | Whether to show the legend. |

***

### PrerequisiteGateProps [#prerequisitegateprops]

```ts
type PrerequisiteGateProps<T> = object;
```

Props of `PrerequisiteGate`.

#### Type Parameters [#type-parameters-3]

| Type Parameter |
| ------ |
| <a id="type-parameter-t"></a> `T` |

#### Properties [#properties-21]

##### check [#check]

```ts
check: () => Promise<T | null | undefined>;
```

Load account-scoped requirements from the host's authorized data source.

###### Returns [#returns-14]

`Promise`\<`T` \| `null` \| `undefined`\>

##### children [#children]

```ts
children: React.ReactNode;
```

Content rendered once no requirement is pending.

##### onError? [#onerror]

```ts
onError?: (error) => void;
```

Check failures fail open; use this callback for logging or telemetry.

###### Parameters [#parameters-14]

| Parameter | Type |
| ------ | ------ |
| `error` | `unknown` |

###### Returns [#returns-15]

`void`

##### pending? [#pending]

```ts
pending?: React.ReactNode;
```

Shown while checking. Defaults to nothing, so protected children never flash.

##### renderRequired [#renderrequired]

```ts
renderRequired: (requirement, refresh) => React.ReactNode;
```

Render the required task and call refresh after its save succeeds.

###### Parameters [#parameters-15]

| Parameter | Type |
| ------ | ------ |
| `requirement` | `T` |
| `refresh` | () => `void` |

###### Returns [#returns-16]

`React.ReactNode`

##### scopeKey [#scopekey]

```ts
scopeKey: string;
```

Identifies the account scope; changing it re-runs the check.

***

### ResolvedOvokUiSlots [#resolvedovokuislots]

```ts
type ResolvedOvokUiSlots = Omit<OvokUiSlots, "UrineAnalyteRow"> & Partial<Pick<OvokUiSlots, "UrineAnalyteRow">>;
```

Slots after `useOvokUi` fills the react-native-paper defaults; only `UrineAnalyteRow` stays optional.