"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.StepHorizontal = exports.StepHorizontalBase = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const box_1 = require("../box");
const core_1 = require("../core");
const stepIndicator_1 = require("../stepIndicator");
const utils_1 = require("../utils");
const consts_1 = require("./consts");
const context_1 = require("./context");
const stepHorizontalTail_1 = __importDefault(require("./stepHorizontalTail"));
const stepHorizontalTitle_1 = __importDefault(require("./stepHorizontalTitle"));
exports.StepHorizontalBase = core_1.styled.divBox `
  display: flex;
  flex-direction: column;
  position: relative;
  width: 100%;
`;
/**
 * Implements a Horizontal step component
 */
exports.StepHorizontal = (0, core_1.vui)(({ icon, number, size: propSize = 'md', description, title, className, variant, children }, ref) => {
    const context = (0, context_1.useStepperHorizontalContext)();
    const size = (context === null || context === void 0 ? void 0 : context.size) || propSize;
    return ((0, jsx_runtime_1.jsxs)(exports.StepHorizontalBase, { className: (0, utils_1.cs)(consts_1.stepClassName, consts_1.stepClassName + variant, className), ref: ref, children: [(0, jsx_runtime_1.jsx)(stepHorizontalTail_1.default, { size: size, variant: variant }), (0, jsx_runtime_1.jsx)(box_1.Box, { display: "block", textAlign: "center", children: (0, jsx_runtime_1.jsx)(stepIndicator_1.StepIndicator, { icon: icon, number: number, size: size, variant: variant }) }), (0, jsx_runtime_1.jsxs)(box_1.Box, { display: "block", textAlign: "center", children: [!!title && ((0, jsx_runtime_1.jsx)(stepHorizontalTitle_1.default, { size: size, variant: variant, children: title })), !!description && ((0, jsx_runtime_1.jsx)(box_1.Box, { color: "sandstone.45", display: "block", fontSize: `${size === 'md' ? 14 : 12}px`, textAlign: "center", children: description })), (0, jsx_runtime_1.jsx)(box_1.Box, { display: "block", children: children })] })] }));
});
exports.StepHorizontal.displayName = 'StepHorizontal';
exports.default = exports.StepHorizontal;
//# sourceMappingURL=stepHorizontal.js.map