@wulperstudio/cms/node/organisms/Stepper/Stepper.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Stepper = void 0;
var _react = _interopRequireDefault(require("react"));
var _uuid = require("uuid");
var _Box = _interopRequireDefault(require("@mui/material/Box"));
var _material = require("@mui/material");
var _TextForLinesOutput = require("../../components/TextForLinesOutput");
var _jsxRuntime = require("react/jsx-runtime");
var Stepper = exports.Stepper = function Stepper(_ref) {
  var activeStep = _ref.activeStep,
    steps = _ref.steps,
    title = _ref.title;
  var theme = (0, _material.useTheme)();
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box["default"], {
    sx: {
      width: '100%'
    },
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
      rowGap: 2,
      children: [title && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextForLinesOutput.TextForLinesOutput, {
          text: title,
          clines: 1,
          color: theme.palette.text.primary,
          fontSize: "25px",
          fontWeight: "600"
        })
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stepper, {
        activeStep: activeStep,
        orientation: "vertical",
        children: steps.map(function (step) {
          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Step, {
            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.StepLabel, {
              children: step.label
            })
          }, (0, _uuid.v4)());
        })
      })]
    })
  });
};