Skip to main content

QuestionnaireForm.Navigation

QuestionnaireForm.Navigation is a react-native-keyboard-controller KeyboardAvoidingView with a row layout, padding behavior, and a keyboard offset of 100. It accepts KeyboardAvoidingViewProps except contentContainerStyle.

QuestionnaireNavigationProvider is also exported for custom navigation layouts, but its props are an internal implementation boundary: it requires the current page/item, enabled-item arrays, page arrays, Formik state, and several state setters. It is not a small standalone provider to configure from app data. It must be rendered inside QuestionnaireForm; its public context exposes isCurrentItemRequired, isCurrentItemAnswered, isLastItem, currentItemNumber, totalItems, showPrevious, isSubmitting, handleNext, and handlePrevious.

The compound buttons read state from the form and navigation contexts. Render the buttons that match your layout; buttons do not navigate through a router.

  • PreviousButton: outlined, hidden on the first item, calls the previous handler; its disabled state uses only the caller's disabled prop.
  • NextButton: contained, hidden on the last item, disabled for unanswered required items and while submitting.
  • SubmitButton: contained, shown on the last item (or in non-paged mode), submits the form, disables while submitting, and shows loading while submitting.

The buttons override caller onPress with the form action. NextButton and SubmitButton combine caller disabled with their own state; PreviousButton does not add a submitting/validation disabled state. Use children to replace translated button labels.