@guruhotel/aura-ui/esm/stepper/components/steps/index.js

⚛️ React UI library by GuruHotel

import*as e from"react";import{StepsProvider as t}from"../../context";import{Box as r}from"../../../box";import{StepsContainer as i}from"./step.styles";import{useMediaQuery as o}from"../../hooks";import{jsx as n}from"react/jsx-runtime";import{jsxs as s}from"react/jsx-runtime";export const Steps=e.forwardRef((({activeStep:l=0,state:a,responsive:c=!0,orientation:p="horizontal",onClickStep:m,labelOrientation:d="horizontal",children:h,size:u="md",colorScheme:S="guru",css:f,rounded:v=!0,variant:C="flat",errorIcon:x,successIcon:z},b)=>{const j=e.Children.toArray(h),k=j.length,y=!!m,E=o("(max-width: 43em)")&&c?"vertical":p;return s(t,{value:{activeStep:l,orientation:E,state:a,responsive:c,onClickStep:m,labelOrientation:d,clickable:y,stepCount:k,size:u,colorScheme:S,css:f,rounded:v,variant:C,errorIcon:x,successIcon:z},children:[n(i,{isVertical:"vertical"===E,ref:b,children:e.Children.map(h,((t,r)=>{var i;const o={index:r,isCompletedStep:null!=(i=e.isValidElement(t)&&t.props.isCompletedStep)?i:r<l,isCurrentStep:r===l,isLastStep:r===k-1};return e.isValidElement(t)?e.cloneElement(t,o):null}))}),"horizontal"===E&&n(r,{css:{my:"$8"},children:l<=j.length?e.Children.map(j[l],(t=>{if(e.isValidElement(t))return e.Children.map(t.props.children,(e=>e))})):null})]})}));Steps.displayName="Steps";