# Content

Canonical page: https://docs.ovok.com/native-sdk/guide/components/content

The content module contains small, composable presentation primitives. `ContentCard` and `ContentList` can render any app-owned content model. `ContentDetail` optionally reads selected fields from a FHIR `Composition`; it does not fetch or persist content.

## Public exports [#public-exports]

- `ContentCard` and its `Cover`, `CoverBadge`, `Content`, and `Title` children.
- `ContentList` and its `Section`, `Header`, `Title`, `HorizontalList`, and `ViewAll` children.
- The bare `Section`, `Title`, `HorizontalList`, and `ViewAll` child components are
  also named exports; `Header` is available through `ContentList.Header` but is not a
  separate named export. The compound properties remain available on `ContentList`.
- `ContentDetail` and its header, metadata, body, rich-content, footer, tags, and resource children.
- `CompositionContext`, `CompositionContextType`, and `useComposition` for custom composition-aware layouts.

See [Composition context](/native-sdk/guide/components/content/advanced-api/) for provider and hook usage.

## Choose a primitive [#choose-a-primitive]

| Need | Use |
| --- | --- |
| A preview with an image and title | `ContentCard` |
| Grouped sections or horizontal previews | `ContentList` |
| A scrollable Composition-backed detail view | `ContentDetail` |
| A custom composition consumer | `CompositionContext`/`useComposition` below `ContentDetail` or an app-owned provider |

## FHIR mapping used by ContentDetail [#fhir-mapping-used-by-contentdetail]

The detail primitives read only the fields they need:

- title: `composition.title`;
- body: the first section with `text.div`;
- author: `composition.meta.author.display`;
- date: top-level `composition.date`, formatted as `dd MMM yyyy`;
- reading time: a section coded `reading-time`, with HTML stripped from `text.div`;
- tags: `composition.meta.tag` unless `ContentDetail.Tags` receives `tags` explicitly;
- resource link: a section coded `resource-link`, with the URL extracted from its anchor HTML.

`ContentDetail.Title` and `ContentDetail.RichContent` throw clear errors when their required content cannot be obtained. `ContentDetail.Resource` and metadata helpers return `null` when their optional source data is absent.

## Integration boundaries [#integration-boundaries]

The module does not assume Expo Router, a CMS, a content endpoint, a patient/session model, or a specific localization catalog. Supply navigation, loading/error states, labels, and persistence from the host app. This supports using one card/detail primitive for a single device or feature as well as a complete content catalog.

See the focused pages for [cards](/native-sdk/guide/components/content/content-card/), [lists](/native-sdk/guide/components/content/content-list/), and [details](/native-sdk/guide/components/content/content-detail/).