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

React component library

import { __assign, __rest } from "tslib";
import React from 'react';
import { ChevronUpIcon } from '@ozen-ui/icons';
import { useThemeProps } from '../../../../hooks/useThemeProps';
import { cn, polymorphicComponentWithRef, renderContent, } from '../../../../utils';
import { useStepperVerticalStepContext } from '../StepperVerticalStep';
import { StepperVerticalStepButton } from '../StepperVerticalStepButton';
import { STEPPER_VERTICAL_STEP_SUBCONTENT_BUTTON_DEFAULT_COLOR, STEPPER_VERTICAL_STEP_SUBCONTENT_BUTTON_DEFAULT_TAG, } from './constants';
export var cnStepperVerticalStepSubcontentButton = cn('StepperVerticalStepSubcontentButton');
export var StepperVerticalStepSubcontentButton = polymorphicComponentWithRef(function (inProps, ref) {
    var props = useThemeProps({
        name: 'StepperVerticalStepSubcontentButton',
        props: inProps,
    });
    var _a = props.color, color = _a === void 0 ? STEPPER_VERTICAL_STEP_SUBCONTENT_BUTTON_DEFAULT_COLOR : _a, className = props.className, _b = props.as, as = _b === void 0 ? STEPPER_VERTICAL_STEP_SUBCONTENT_BUTTON_DEFAULT_TAG : _b, onClick = props.onClick, text = props.text, other = __rest(props, ["color", "className", "as", "onClick", "text"]);
    var _c = useStepperVerticalStepContext(), hasSubcontent = _c.hasSubcontent, step = _c.step;
    if (!hasSubcontent) {
        return null;
    }
    return (React.createElement(StepperVerticalStepButton, __assign({}, other, { as: as, ref: ref, color: color, iconRight: React.createElement(ChevronUpIcon, { className: cnStepperVerticalStepSubcontentButton('Icon') }), className: cnStepperVerticalStepSubcontentButton({ open: step.isSubcontentOpen, closed: !step.isSubcontentOpen }, [className]), onClick: function (event) {
            step.toggleSubcontent();
            onClick === null || onClick === void 0 ? void 0 : onClick(event);
        } }), renderContent({
        content: text,
        props: { isOpen: step.isSubcontentOpen },
    })));
});
StepperVerticalStepSubcontentButton.displayName =
    'StepperVerticalStepSubcontentButton';