UNPKG

@yamada-ui/stepper

Version:

Yamada UI stepper component

77 lines (75 loc) 2.07 kB
"use client" // src/use-stepper.ts import { createDescendant } from "@yamada-ui/use-descendant"; import { createContext, mergeRefs } from "@yamada-ui/utils"; import { useCallback } from "react"; var { DescendantsContextProvider: StepperDescendantsContextProvider, useDescendant: useStepperDescendant, useDescendants: useStepperDescendants } = createDescendant(); var [StepperProvider, useStepperContext] = createContext({ name: "StepperContext", errorMessage: `useStepperContext returned is 'undefined'. Seems you forgot to wrap the components in "<Stepper />"` }); var useStepper = ({ index, orientation = "horizontal", showLastSeparator = false, ...rest }) => { const descendants = useStepperDescendants(); const getStepStatus = useCallback( (step) => { if (step < index) return "complete"; if (step > index) return "incomplete"; return "active"; }, [index] ); const getContainerProps = useCallback( (props = {}, ref = null) => ({ ...rest, ...props, ref, "data-orientation": orientation }), [orientation, rest] ); return { descendants, getStepStatus, index, orientation, showLastSeparator, getContainerProps }; }; var useStep = () => { var _a; const { getStepStatus, orientation } = useStepperContext(); const { descendants, index, register } = useStepperDescendant(); const isFirst = index === 0; const isLast = index === ((_a = descendants.lastValue()) == null ? void 0 : _a.index); const status = getStepStatus(index); const getStepProps = useCallback( (props = {}, ref = null) => ({ ...props, ref: mergeRefs(ref, register), "data-orientation": orientation, "data-status": status }), [orientation, register, status] ); return { index, isFirst, isLast, status, getStepProps }; }; export { StepperDescendantsContextProvider, useStepperDescendant, useStepperDescendants, StepperProvider, useStepperContext, useStepper, useStep }; //# sourceMappingURL=chunk-CGZP2FXU.mjs.map