@wulperstudio/cms
Version:
Wulper Studio Library Components CMS
55 lines (54 loc) • 2.18 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.IntroductionBloq = void 0;
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _uuid = require("uuid");
var _material = require("@mui/material");
var _components = require("../../../components");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["title", "color", "backgroundColor"];
var IntroductionBloq = exports.IntroductionBloq = function IntroductionBloq(_ref) {
var title = _ref.title,
tagsProps = _ref.tagsProps,
_ref$rating = _ref.rating,
rating = _ref$rating === void 0 ? 5.0 : _ref$rating;
var theme = (0, _material.useTheme)();
var isMqMd = (0, _material.useMediaQuery)(theme.breakpoints.down('md'));
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
rowGap: "10px",
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.TextForLinesOutput, {
clines: 1,
text: title,
fontWeight: "700",
variant: "h1"
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, {
alignItems: isMqMd ? 'flex-start' : undefined,
direction: isMqMd ? 'column' : 'row',
justifyContent: "space-between",
rowGap: 1,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Stack, {
direction: "row",
columnGap: "10px",
flexWrap: "wrap",
rowGap: 2,
children: tagsProps.map(function (_ref2) {
var titleTag = _ref2.title,
color = _ref2.color,
backgroundColor = _ref2.backgroundColor,
props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.WTag, Object.assign({
backgroundColor: backgroundColor,
color: color,
title: titleTag
}, props), (0, _uuid.v4)());
})
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.WRanking, {
rating: rating
})]
})]
});
};