@wulperstudio/cms/node/organisms/Blocks/RenderTabsVideo/index.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.RenderTabsVideo = exports.ButtonTabTemplate = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime/helpers/objectDestructuringEmpty"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireDefault(require("react"));
var _material = require("@mui/material");
var _BlockVideoCustom = require("../BlockVideoCustom");
var _styled = require("./styled");
var _ContentRowBlock = require("../../ContentRowBlock");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["expanded", "handleChange", "children"],
  _excluded2 = ["sx"],
  _excluded3 = ["variant", "variantAspectRatio", "containerProps", "srcVideo"],
  _excluded4 = ["component", "alt", "width", "height", "src", "sx"],
  _excluded5 = ["sx"],
  _excluded6 = ["sx"];
/* eslint-disable max-len */
var ButtonTabTemplate = exports.ButtonTabTemplate = function ButtonTabTemplate(_ref) {
  var expanded = _ref.expanded,
    handleChange = _ref.handleChange,
    children = _ref.children,
    rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styled.CustomButton, Object.assign({
    variant: "text",
    expanded: expanded,
    onClick: function onClick() {
      return handleChange == null ? void 0 : handleChange();
    }
  }, rest, {
    children: children
  }));
};
var RenderTabsVideo = exports.RenderTabsVideo = function RenderTabsVideo(_ref2) {
  var blockImageProps = _ref2.blockImageProps,
    blockVideoProps = _ref2.blockVideoProps,
    containerProps = _ref2.containerProps,
    firstBlockProps = _ref2.firstBlockProps,
    panel = _ref2.panel,
    renderChildren = _ref2.renderChildren,
    renderUrl = _ref2.renderUrl,
    tabProps = _ref2.tabProps,
    tabs = _ref2.tabs,
    title = _ref2.title,
    _ref2$variantBlock = _ref2.variantBlock,
    variantBlock = _ref2$variantBlock === void 0 ? 'video' : _ref2$variantBlock,
    renderCustomTabChildren = _ref2.renderCustomTabChildren;
  var theme = (0, _material.useTheme)();
  var isMqMd = (0, _material.useMediaQuery)(theme.breakpoints.down('md'));
  var _ref3 = tabProps || {},
    rest = (0, _extends2["default"])({}, ((0, _objectDestructuringEmpty2["default"])(_ref3), _ref3));
  var _ref4 = containerProps || {},
    sx = _ref4.sx,
    restContainerProps = (0, _objectWithoutProperties2["default"])(_ref4, _excluded2);
  var _ref5 = blockVideoProps || {},
    _ref5$variant = _ref5.variant,
    variantBlockVideo = _ref5$variant === void 0 ? 'videoPlayer' : _ref5$variant,
    _ref5$variantAspectRa = _ref5.variantAspectRatio,
    variantAspectRatio = _ref5$variantAspectRa === void 0 ? '16:9' : _ref5$variantAspectRa,
    containerPropsBlockVideo = _ref5.containerProps,
    _ref5$srcVideo = _ref5.srcVideo,
    srcVideo = _ref5$srcVideo === void 0 ? variantBlock === 'video' && renderUrl ? renderUrl[panel] : '' : _ref5$srcVideo,
    restBlockVideoProps = (0, _objectWithoutProperties2["default"])(_ref5, _excluded3);
  var _ref6 = blockImageProps || {},
    _ref6$component = _ref6.component,
    componentBlockImage = _ref6$component === void 0 ? 'img' : _ref6$component,
    _ref6$alt = _ref6.alt,
    altBlockImage = _ref6$alt === void 0 ? 'random img' : _ref6$alt,
    _ref6$width = _ref6.width,
    widthBlockImage = _ref6$width === void 0 ? 500 : _ref6$width,
    _ref6$height = _ref6.height,
    heightBlockImage = _ref6$height === void 0 ? 400 : _ref6$height,
    _ref6$src = _ref6.src,
    srcBlockImage = _ref6$src === void 0 ? variantBlock === 'image' && renderUrl ? renderUrl[panel] : '' : _ref6$src,
    sxBlockImage = _ref6.sx,
    restBlockImageProps = (0, _objectWithoutProperties2["default"])(_ref6, _excluded4);
  var _ref7 = (firstBlockProps == null ? void 0 : firstBlockProps.containerProps) || {},
    sxFirstBlockContainerProps = _ref7.sx,
    restFirstBlockContainerProps = (0, _objectWithoutProperties2["default"])(_ref7, _excluded5);
  var _ref8 = (firstBlockProps == null ? void 0 : firstBlockProps.contentTabsProps) || {},
    sxFirstBlockContentTabsProps = _ref8.sx,
    restFirstBlockContentTabsProps = (0, _objectWithoutProperties2["default"])(_ref8, _excluded6);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ContentRowBlock.ContentRowBlock, Object.assign({
    maxWidth: "lg",
    sx: Object.assign({
      gap: '2.5rem'
    }, sx),
    firstBoxProps: {
      sx: {
        display: 'flex',
        justifyContent: 'center',
        alignItems: 'center',
        flexDirection: 'column',
        gap: '2rem'
      }
    },
    secondBoxProps: {
      sx: {
        display: 'flex',
        justifyContent: 'center',
        alignItems: 'center'
      }
    },
    firstBox: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
      children: [isMqMd && title && title, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Stack, Object.assign({
        rowGap: "1rem",
        sx: Object.assign((0, _defineProperty2["default"])({
          width: 'fit-content'
        }, theme.breakpoints.down('md'), {
          width: '100%'
        }), sxFirstBlockContainerProps)
      }, restFirstBlockContainerProps, {
        children: [!isMqMd && title, /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, Object.assign({
          sx: Object.assign((0, _defineProperty2["default"])({
            display: 'flex',
            flexDirection: 'column',
            gap: '1rem',
            width: '100%'
          }, theme.breakpoints.down('md'), {
            display: 'grid',
            gridTemplateColumns: 'repeat(2, 1fr)'
          }), sxFirstBlockContentTabsProps)
        }, restFirstBlockContentTabsProps, {
          children: tabs.map(function (tab) {
            if (renderCustomTabChildren) {
              return renderCustomTabChildren == null ? void 0 : renderCustomTabChildren(tab);
            }
            return /*#__PURE__*/(0, _jsxRuntime.jsx)(ButtonTabTemplate, Object.assign({
              expanded: tab.expanded,
              handleChange: tab.handleChange
            }, rest, {
              children: tab.title
            }), tab.id);
          })
        }))]
      }))]
    }),
    secondBox: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
      children: [variantBlock === 'video' && renderUrl && /*#__PURE__*/(0, _jsxRuntime.jsx)(_BlockVideoCustom.BlockVideoCustom, Object.assign({
        variant: variantBlockVideo,
        variantAspectRatio: variantAspectRatio,
        srcVideo: srcVideo,
        containerProps: Object.assign({
          sx: Object.assign({
            margin: '0 auto',
            width: '100%'
          }, containerPropsBlockVideo == null ? void 0 : containerPropsBlockVideo.sx)
        }, containerPropsBlockVideo)
      }, restBlockVideoProps)), variantBlock === 'image' && renderUrl && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, Object.assign({
        component: componentBlockImage,
        src: srcBlockImage,
        alt: altBlockImage,
        width: widthBlockImage,
        height: heightBlockImage,
        sx: Object.assign({
          objectFit: 'cover',
          objectPosition: 'center'
        }, sxBlockImage)
      }, restBlockImageProps)), variantBlock === 'custom' && renderChildren && renderChildren[panel]]
    })
  }, restContainerProps));
};