Steps

A set of state controlled layered sections of content—known as step panels—that are displayed one at a time.

Anatomy

Import all parts and piece them together.

import * as Steps from '@nox-ui/react-steps';
import { useSteps } from '@nox-ui/react-steps/use-steps';

export default () => {
  const bindings = useSteps(); // Add use steps helper if you need it
  return (
    <Steps.Root {...bindings}>
      <Steps.List>
        <Steps.Trigger />
      </Steps.List>
      <Steps.Content />
    </Steps.Root>
  );
};