@wulperstudio/cms/node/layouts/TagTitleDescription/TagTitleDescription.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.TagTitleDescription = void 0;
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _material = require("@mui/material");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["description", "tag", "title", "stackProps"];
var TagTitleDescription = exports.TagTitleDescription = function TagTitleDescription(_ref) {
  var description = _ref.description,
    tag = _ref.tag,
    title = _ref.title,
    stackProps = _ref.stackProps,
    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
  var theme = (0, _material.useTheme)();
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Container, Object.assign({
    component: "section",
    maxWidth: "xl"
  }, props, {
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, Object.assign({
      justifyContent: "center",
      alignItems: "center",
      rowGap: "15px"
    }, stackProps, {
      children: [tag && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
        sx: {
          backgroundColor: tag.backgroundColor || theme.palette.primary.light,
          borderRadius: '10px',
          color: tag.color || theme.palette.primary.main,
          p: '8px 16px'
        },
        children: tag.title
      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
        children: [title, description]
      })]
    }))
  }));
};