@wulperstudio/cms/organisms/Blocks/BlockMap/index.js

Wulper Studio Library Components CMS

import _objectDestructuringEmpty from "@babel/runtime/helpers/esm/objectDestructuringEmpty";
import _extends from "@babel/runtime/helpers/esm/extends";
import React from 'react';
import { v4 } from 'uuid';
import { Icon } from '@iconify/react';
import { Box, Button, Stack, useTheme } from '@mui/material';
import { BoxTag } from './components';
import { GridCards } from '../../GridCards';
import { consts } from '../../../helpers/consts';
import { ICONS_NAME } from '../../../helpers/icons';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export var BlockMap = function BlockMap(_ref) {
  var background = _ref.background,
    href = _ref.href,
    tags = _ref.tags;
  var theme = useTheme();
  return /*#__PURE__*/_jsxs(Stack, {
    width: "100%",
    rowGap: "25px",
    children: [/*#__PURE__*/_jsx(Box, {
      component: "article",
      sx: {
        background: "url(".concat(background || consts.backgroundImageDefault, ") no-repeat center"),
        width: '100%',
        height: '100%',
        margin: '0 auto',
        borderRadius: '10px',
        minHeight: 400,
        position: 'relative',
        backgroundSize: 'cover'
      },
      children: /*#__PURE__*/_jsx(Box, {
        sx: {
          position: 'absolute',
          top: 20,
          right: 20,
          zIndex: 2,
          display: 'flex',
          justifyContent: 'center',
          alignItems: 'center',
          transition: 'color .2s',
          '&:hover': {
            cursor: 'pointer'
          }
        },
        children: /*#__PURE__*/_jsx(Button, {
          variant: "contained",
          color: "primary",
          component: "a",
          href: href,
          target: "_blank",
          disableElevation: true,
          sx: {
            textTransform: 'none'
          },
          endIcon: /*#__PURE__*/_jsx(Icon, {
            icon: ICONS_NAME.chevronRight,
            color: theme.palette.background["default"]
          }),
          children: "Google maps"
        })
      })
    }), tags && /*#__PURE__*/_jsx(GridCards, {
      sx: {
        width: '100%',
        p: '1rem',
        gap: '20px'
      },
      gridColumns: "repeat(auto-fill, minmax(200px, 1fr))",
      children: tags.map(function (_ref2) {
        var props = _extends({}, (_objectDestructuringEmpty(_ref2), _ref2));
        return /*#__PURE__*/_jsx(BoxTag, Object.assign({}, props), v4());
      })
    })]
  });
};