@comparaonline/ui-wizard-form-history-listener

An utility intended to be used in conjunction with WizardForm to manage the URL changes.

Usage no npm install needed!

<script type="module">
  import comparaonlineUiWizardFormHistoryListener from 'https://cdn.skypack.dev/@comparaonline/ui-wizard-form-history-listener';
</script>

README

@comparaonline/ui-wizard-form-history-listener

An utility intended to be used in conjunction with WizardForm to manage the URL changes.

By convention, the navigation using the browser controls (back, forward and address input) is limited to backward only. The forward navigation is replaced to the current active step.

Installation

yarn add @comparaonline/ui-wizard-form-history-listener

Usage

import { QuoteFormHistoryListener } from '@comparaonline/ui-wizard-form-history-listener';

const QuoteForm: React.FunctionComponent<Props> = ({ handleSubmit }) => (
  <WizardFormManager<Partial<FormValues>>>
    {({ onSubmit, initialValues, ...props }) => (
      <>
        <WizardForm
          {...props}
          formProps={{
            onSubmit,
            initialValues            
          }}
        />

        <QuoteFormHistoryListener route="/:id/:stepId" {...props} />
      </>
    )}
  </WizardFormManager>
);