@zohodesk/dot/es/errorstate/WillBack/WillBack.js

In this Library, we Provide Some Basic Components to Build Your Application

import React from 'react';
import { defaultProps } from "./props/defaultProps";
import { propTypes } from "./props/propTypes";
import { Container, Box } from '@zohodesk/components/lib/Layout';
import WillBeRightBack from '@zohodesk/svg/lib/errorstate/version1/WillBeRightBack';
import { ResponsiveReceiver } from '@zohodesk/components/lib/Responsive/CustomResponsive';
import commonStyle from "../EmptyStates.module.css";
import style from "./WillBack.module.css";
export default class WillBack extends React.Component {
  constructor(props) {
    super(props);
    this.responsiveFunc = this.responsiveFunc.bind(this);
  }

  responsiveFunc(_ref) {
    let {
      mediaQueryOR
    } = _ref;
    return {
      tablet: mediaQueryOR([{
        minWidth: 481,
        maxWidth: 768
      }]),
      uptoMobile: mediaQueryOR([{
        maxWidth: 480
      }])
    };
  }

  render() {
    let {
      dataId,
      customClass
    } = this.props;
    return /*#__PURE__*/React.createElement(ResponsiveReceiver, {
      query: this.responsiveFunc
    }, _ref2 => {
      let {
        tablet,
        uptoMobile
      } = _ref2;
      return /*#__PURE__*/React.createElement(Container, {
        className: `${uptoMobile || tablet ? commonStyle.tabletContainer : commonStyle.container} ${customClass}`,
        dataId: dataId,
        scroll: "vertical"
      }, /*#__PURE__*/React.createElement(Box, {
        className: commonStyle.top
      }, /*#__PURE__*/React.createElement("div", {
        className: uptoMobile || tablet ? '' : `${commonStyle.header} ${style.header} `
      }, /*#__PURE__*/React.createElement("div", {
        className: uptoMobile ? style.mobileTitle : tablet ? style.tabletTitle : style.title
      }, "We'll be right back !"))), /*#__PURE__*/React.createElement(Box, {
        className: uptoMobile ? style.mobileImageContainer : tablet ? style.tabletImageContainer : style.imageContainer
      }, /*#__PURE__*/React.createElement(WillBeRightBack, {
        isFluid: true,
        dataId: `${dataId}_svg`
      })), /*#__PURE__*/React.createElement(Box, {
        className: `${uptoMobile || tablet ? '' : commonStyle.footerWidth} ${commonStyle.footer}`
      }, /*#__PURE__*/React.createElement("div", {
        className: uptoMobile || tablet ? commonStyle.tabletBtmText : commonStyle.btmText
      }, "Our Service is temporarity unavailable. We are currently working to restore it."), /*#__PURE__*/React.createElement("div", {
        className: `${uptoMobile || tablet ? commonStyle.tabletBtmText : commonStyle.btmText} ${style.bottomSpace} `
      }, "Please try again later or report this issue"), /*#__PURE__*/React.createElement("div", {
        className: uptoMobile || tablet ? commonStyle.tabletBtmText : commonStyle.btmText
      }, "2013, Zoho Corp, All rights reserved.")));
    });
  }

}
WillBack.propTypes = propTypes;
WillBack.defaultProps = defaultProps; // if (__DOCS__) {
//   WillBack.docs = {
//     componentGroup: 'errorStates'
//   };
// }