@ozen-ui/kit/__inner__/esm/components/StepperVertical/StepperVertical.js

React component library

import { __assign, __rest } from "tslib";
import './StepperVertical.css';
import './modules/StepperVerticalIconIndicator/StepperVerticalIconIndicator.css';
import './modules/StepperVerticalIndicator/StepperVerticalIndicator.css';
import './modules/StepperVerticalStep/StepperVerticalStep.css';
import './modules/StepperVerticalStepSubstepButton/StepperVerticalStepSubstepButton.css';
import './modules/StepperVerticalStepSubcontentButton/StepperVerticalStepSubcontentButton.css';
import React, { useRef, useMemo } from 'react';
import { useMultiRef } from '../../hooks/useMultiRef';
import { useThemeProps } from '../../hooks/useThemeProps';
import { cn, polymorphicComponentWithRef } from '../../utils';
import { Stack } from '../Stack';
import { STEPPER_VERTICAL_DEFAULT_ELLIPSIS, STEPPER_VERTICAL_DEFAULT_TAG, } from './constants';
import { useStepperVerticalStepsControl, useStepperVerticalStepsStructure, } from './hooks';
import { StepperVerticalContext } from './StepperVerticalContext';
export var cnStepperVertical = cn('StepperVertical');
export var StepperVertical = polymorphicComponentWithRef(function (inProps, ref) {
    var props = useThemeProps({ name: 'StepperVertical', props: inProps });
    var children = props.children, _a = props.as, as = _a === void 0 ? STEPPER_VERTICAL_DEFAULT_TAG : _a, _b = props.ellipsis, ellipsis = _b === void 0 ? STEPPER_VERTICAL_DEFAULT_ELLIPSIS : _b, className = props.className, fullWidth = props.fullWidth, other = __rest(props, ["children", "as", "ellipsis", "className", "fullWidth"]);
    var internalRef = useRef(null);
    var stepsControl = useStepperVerticalStepsControl();
    var structure = useStepperVerticalStepsStructure(internalRef, stepsControl, children);
    var memoizedContextValue = useMemo(function () { return ({
        ellipsis: ellipsis,
        stepsControl: stepsControl,
        structure: structure,
    }); }, [ellipsis, stepsControl, structure]);
    return (React.createElement(StepperVerticalContext.Provider, { value: memoizedContextValue },
        React.createElement(Stack, __assign({}, other, { ref: useMultiRef([internalRef, ref]), as: as, className: cnStepperVertical('', [className]), direction: "column", display: fullWidth ? 'block' : 'inline' }), children)));
});