Answer.Header

The Answer.Header component provides a horizontal layout container for form navigation and action elements. It's designed to house back buttons, progress indicators, save actions, and other form-related controls at the top of journal entry screens.

Basic Example

import { Answer } from "@ovok/native";
import * as React from "react";
import { Text } from "react-native-paper";

const BasicAnswerHeader = () => (
  <Answer.Header>
    <Text>Header</Text>
  </Answer.Header>
);

export default BasicAnswerHeader;

Props

Extends ViewProps from React Native.

Primary Props

Prop	Type	Default	Description
style	StyleProp<ViewStyle>	undefined	Additional styles to apply to the header container
children	ReactNode	undefined	Navigation and action elements to display

Inherited Props

All standard View props are supported:

• testID
• accessibilityLabel
• accessibilityRole
• onLayout

Styling

Default Styles

const styles = StyleSheet.create({
  header: {
    flexDirection: "row",
    justifyContent: "space-between",
  },
});

Related Components

• Answer - Parent container component
• Answer.Question - Question display component
• Answer.Input - Text input component
• Answer.Actions - Bottom action container