Skip to main content

Answer.Input

The Answer.Input component renders React Native's TextInput with the react-native-paper TextInputProps type and SDK placeholder styling.

Basic Example​

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

const BasicAnswerInput = () => (
  <Answer.Input placeholder="Enter your response" />
);

export default BasicAnswerInput;

Props​

The public type is TextInputProps from react-native-paper, but the rendered primitive is React Native's TextInput, not Paper's outlined/flat component. Native text-input props are forwarded; Paper-only visual props such as mode, label, left, right, and error do not add Paper behavior at runtime.

Primary Props​

PropTypeDefaultDescription
styleStyleProp<TextStyle>undefinedAdditional styles to apply to the input field
placeholderTextColorstringtheme.colors.onSurfaceDisabledColor for placeholder text (automatically themed)

Inherited Props​

The type includes the following common input props:

  • value
  • onChangeText
  • placeholder
  • multiline
  • numberOfLines
  • autoFocus
  • keyboardType
  • autoCapitalize
  • maxLength
  • editable

Component Behavior​

Theme Integration​

  • Placeholder Color: Automatically uses theme.colors.onSurfaceDisabled for consistent muted text
  • Text Color: Uses the platform input's inherited text color unless the app supplies one
  • Background: Uses the platform input's default background unless styled by the app

Styling​

Default Styles​

const styles = StyleSheet.create({
  input: {
    flex: 1,
  },
});

Theme Colors Used​

  • theme.colors.onSurfaceDisabled - Placeholder text color