import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Box } from '../box';
import { vui } from '../core';
import { cs } from '../utils';
import { tailClassName, tailClassNameLeft, tailClassNameRight } from './consts';
/**
 * Implements Horizontal stepper tail (the Horizontal line) **
 */
export const StepHorizontalTail = vui((props, ref) => {
    const { children, className, variant = 'active', ...rest } = props;
    return (_jsxs(Box, { className: cs(tailClassName), h: "16px", justifyContent: "space-between", position: "absolute", ref: ref, w: "100%", ...rest, children: [_jsx(Box, { className: cs(tailClassName, tailClassNameLeft, tailClassNameLeft + variant) }), _jsx(Box, { className: cs(tailClassName, tailClassNameRight, tailClassNameLeft + variant) })] }));
});
StepHorizontalTail.displayName = 'StepHorizontalTail';
export default StepHorizontalTail;
//# sourceMappingURL=stepHorizontalTail.js.map