rc-steps-modern
TypeScript icon, indicating that this package has built-in type declarations

6.0.1 • Public • Published

rc-steps


React steps component.

NPM version build status Test coverage npm download bundle size

Usage

npm install rc-steps

<Steps current={1}>
  <Steps.Step title="first" />
  <Steps.Step title="second" />
  <Steps.Step title="third" />
</Steps>

Example

https://steps.vercel.app/

API

name type default description
type string default diretypetion of Steps, could be `default` `navigation` `inline`
direction string horizontal direction of Steps, enum: `horizontal` or `vertical`
current number 0 index of current step
initial number 0 index initial
size string size of Steps, could be `small`
labelPlacement string placement of step title, could be `vertical`
status string wait status of current Steps, could be `error` `process` `finish` `wait`
icons { finish: ReactNode, error: ReactNode } specify the default finish icon and error icon
itemRender (item: StepProps, stepItem: React.ReactNode) => React.ReactNode custom step item renderer
onChange (current: number) => void Trigger when Step changed

Steps.Step

name type default description
title ReactNode title of step item
subTitle ReactNode subTitle of step item
description ReactNode description of step item
icon ReactNode set icon of step item
status string status of current Steps, could be `error` `process` `finish` `wait`
tailContent ReactNode content above tail
disabled bool false disabled step when onChange exist
render (stepItem: React.ReactNode) => React.ReactNode custom step item renderer

Development

npm install
npm start

License

rc-steps is released under the MIT license.

Package Sidebar

Install

npm i rc-steps-modern

Weekly Downloads

15

Version

6.0.1

License

MIT

Unpacked Size

41.3 kB

Total Files

20

Last publish

Collaborators

  • guoyunhe