Components

Steps

Create numbered step-by-step guides

Steps help users follow a sequence of instructions with clear visual indicators.

Basic Usage

Install the package

Run the installation command in your terminal:

pnpm add @barodoc/core @barodoc/theme-docs

Configure your project

Create a barodoc.config.json file in your project root with your settings.

Start development

Run the development server to see your documentation:

pnpm dev

<Steps client:load>
  <Step title="Install the package">
    Run the installation command in your terminal:
    \`\`\`bash
    pnpm add @barodoc/core @barodoc/theme-docs
    \`\`\`
  </Step>
  <Step title="Configure your project">
    Create a `barodoc.config.json` file in your project root.
  </Step>
  <Step title="Start development">
    Run the development server:
    \`\`\`bash
    pnpm dev
    \`\`\`
  </Step>
</Steps>

Props

Steps

classNamestring

Additional CSS classes

Step

titlestringrequired

The step heading text

childrenReactNode

Step content (supports MDX)