# Journal components

Canonical page: https://docs.ovok.com/native-sdk/guide/modules/journal

The journal module provides UI primitives for a daily prompt, an answer flow, and
previous entries. Use it when the app owns the prompt and persistence model. For a
FHIR `Questionnaire` that needs answer rules, conditional items, or response creation,
use the [questionnaire form guide](/native-sdk/guide/modules/questionnaire-response-form) instead.

## Build the journal screen [#build-the-journal-screen]

Use `TodayQuestionCard` to introduce the current prompt, `Answer` for the response
screen, and `PastJournalCard` for saved entries. Their compound children let the app
control presentation while the screen keeps the actual prompt and answer data.

```tsx
import { Answer } from "@ovok/native/journal";
import { Button } from "react-native-paper";

<Answer>
  <Answer.Header>Today's check-in</Answer.Header>
  <Answer.Question>{question.text}</Answer.Question>
  <Answer.Input value={value} onChangeText={setValue} />
  <Answer.Actions>
    <Button onPress={() => saveAnswer(value)}>Save</Button>
  </Answer.Actions>
</Answer>
```

Keep draft state, validation rules, retry behavior, and persistence in the screen or
your form layer. Show a clear success or failure state after saving; rendering an
answer form does not submit it automatically.

## References [#references]

- [Answer form](/native-sdk/guide/components/journal/answer/)
- [Today's question card](/native-sdk/guide/components/journal/today-question-card/)
- [Past journal card](/native-sdk/guide/components/journal/past-journal-card/)
- [Journal component index](/native-sdk/guide/components/journal/)

## API reference [#api-reference]

Every export of `@ovok/native/journal`, with signatures, props and types, is in the [`journal` API reference](/native-sdk/reference/journal).