Using multiple useStep's

[IlirBajrami]

I'm trying to use two useStep hooks in one function.
I tried this:

const steps = [
  { id: "name", Component: NameField },
  { id: "email", Component: EmailField },
  { id: "phoneNumber", Component: PhoneNumberField },
  { id: "message", Component: MessageField },
  { id: "review", Component: ReviewForm },
  { id: "confirmation", Component: ConfirmationForm },
];
const steps2 = [
  { id: "website", Component: WebsiteField },
  { id: "services", Component: ServicesField },
  { id: "overview", Component: OverviewField },
  { id: "budget", Component: BudgetField },
  { id: "reviewComplete", Component: ReviewCompleteForm },
];

const MultiStepForm = () => {

  const [formData, setForm] = useForm(defaultData);
  const { step, navigation, index } = useStep({ initialStep: 0, steps });
  const { step: quoteStep, navigation: quoteNavigation, index: quoteIndex } = useStep({ initialStep: 0, steps: steps2 });

}

but i get this Error:

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Can we use multiple useStep hooks in the same function?