import { cs } from "../utils/styles.js";
import vui from "../core/vui.js";
import Box from "../box/box.js";
import { tailClassName, tailClassNameLeft, tailClassNameRight } from "./consts.js";
import { jsx, jsxs } from "react/jsx-runtime";

//#region src/stepperHorizontal/stepHorizontalTail.tsx
/**
* Implements Horizontal stepper tail (the Horizontal line) **
*/
const StepHorizontalTail = vui((props, ref) => {
	const { children, className, variant = "active", ...rest } = props;
	return /* @__PURE__ */ jsxs(Box, {
		className: cs(tailClassName),
		h: "16px",
		justifyContent: "space-between",
		position: "absolute",
		ref,
		w: "100%",
		...rest,
		children: [/* @__PURE__ */ jsx(Box, { className: cs(tailClassName, tailClassNameLeft, tailClassNameLeft + variant) }), /* @__PURE__ */ jsx(Box, { className: cs(tailClassName, tailClassNameRight, tailClassNameLeft + variant) })]
	});
});
StepHorizontalTail.displayName = "StepHorizontalTail";

//#endregion
export { StepHorizontalTail as default };
globalThis.__vuiVersion__ = "4.0.0"
//# sourceMappingURL=stepHorizontalTail.js.map