mirror of
https://github.com/langgenius/dify.git
synced 2026-06-20 09:11:08 +08:00
34 lines
670 B
TypeScript
34 lines
670 B
TypeScript
import { cn } from '@langgenius/dify-ui/cn'
|
|
import * as React from 'react'
|
|
|
|
export type Step = {
|
|
label: string
|
|
value: string
|
|
}
|
|
|
|
type StepIndicatorProps = {
|
|
currentStep: number
|
|
steps: Step[]
|
|
}
|
|
|
|
const StepIndicator = ({
|
|
currentStep,
|
|
steps,
|
|
}: StepIndicatorProps) => {
|
|
return (
|
|
<div className="flex gap-x-1">
|
|
{steps.map((step, index) => {
|
|
const isActive = index === currentStep - 1
|
|
return (
|
|
<div
|
|
key={step.value}
|
|
className={cn('size-1 rounded-lg bg-divider-solid', isActive && 'w-2 bg-state-accent-solid')}
|
|
/>
|
|
)
|
|
})}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default React.memo(StepIndicator)
|