@ozen-ui/kit

Version:
React component library
84 lines (83 loc) • 3.71 kB
JavaScript
import { __read } from "tslib";
import { useCallback, useRef, useEffect } from 'react';
import { useControlled } from '../../../../hooks/useControlled';
import { useStoredValue } from '../../../../hooks/useStoredValue';
import { useUniqueId } from '../../../../hooks/useUniqueId';
import { useStepperVerticalContext } from '../../StepperVerticalContext';
export var useStepperVerticalCreateStep = function (params, root) {
    var id = useUniqueId();
    var _a = __read(useControlled({
        value: params.openSubsteps,
        defaultValue: false,
        name: 'StepperVerticalStep',
        state: 'openSubsteps',
    }), 2), isSubstepsOpenState = _a[0], setIsSubstepsOpenState = _a[1];
    var _b = __read(useControlled({
        value: params.openSubcontent,
        defaultValue: false,
        name: 'StepperVerticalStep',
        state: 'openSubcontent',
    }), 2), isSubcontentOpenState = _b[0], setIsSubcontentOpenState = _b[1];
    var isSubStepsOpen = !!isSubstepsOpenState;
    var isSubcontentOpen = !!isSubcontentOpenState;
    var setIsSubStepsOpen = useCallback(function (isOpen) {
        var _a;
        setIsSubstepsOpenState(isOpen);
        (_a = params.onOpenSubstepsChange) === null || _a === void 0 ? void 0 : _a.call(params, isOpen);
    }, [setIsSubstepsOpenState, params.onOpenSubstepsChange]);
    var toggleSubsteps = useCallback(function () {
        setIsSubStepsOpen(!isSubStepsOpen);
    }, [setIsSubStepsOpen, isSubStepsOpen]);
    var setIsSubcontentOpen = useCallback(function (isOpen) {
        var _a;
        setIsSubcontentOpenState(isOpen);
        (_a = params.onOpenSubcontentChange) === null || _a === void 0 ? void 0 : _a.call(params, isOpen);
    }, [setIsSubcontentOpenState, params.onOpenSubcontentChange]);
    var toggleSubcontent = useCallback(function () {
        setIsSubcontentOpen(!isSubcontentOpen);
    }, [setIsSubcontentOpen, isSubcontentOpen]);
    var stepperVerticalContext = useStepperVerticalContext();
    var ref = useRef(null);
    var step = useStoredValue(function () { return ({
        id: id,
        root: root !== null && root !== void 0 ? root : null,
        ref: ref,
        isSubStepsOpen: isSubStepsOpen,
        setIsSubStepsOpen: setIsSubStepsOpen,
        unregisterSubstep: function () { },
        registerSubstep: function () { },
        substeps: {},
        isSubcontentOpen: isSubcontentOpen,
        setIsSubcontentOpen: setIsSubcontentOpen,
        toggleSubcontent: toggleSubcontent,
        toggleSubsteps: toggleSubsteps,
    }); });
    var registerSubstep = useCallback(function (substep) {
        step.current.substeps[substep.id] = substep;
    }, []);
    var unregisterSubstep = useCallback(function (substep) {
        delete step.current.substeps[substep.id];
    }, []);
    step.current.isSubStepsOpen = isSubStepsOpen;
    step.current.isSubcontentOpen = isSubcontentOpen;
    step.current.setIsSubStepsOpen = setIsSubStepsOpen;
    step.current.setIsSubcontentOpen = setIsSubcontentOpen;
    step.current.toggleSubcontent = toggleSubcontent;
    step.current.toggleSubsteps = toggleSubsteps;
    step.current.root = root !== null && root !== void 0 ? root : null;
    step.current.registerSubstep = registerSubstep;
    step.current.unregisterSubstep = unregisterSubstep;
    useEffect(function () {
        stepperVerticalContext.stepsControl.initializeStep(step.current);
        if (root) {
            root.registerSubstep(step.current);
        }
        return function () {
            stepperVerticalContext.stepsControl.deleteStep(step.current);
            if (root) {
                root.unregisterSubstep(step.current);
            }
        };
    }, []);
    return step.current;
};