@sberdevices/plasma-temple/dist/es/pages/ErrorPage/ErrorPage.js

SberDevices CanvasApp Templates.

import React from 'react';
import styled, { css } from 'styled-components';
import { mediaQuery } from '@sberdevices/plasma-ui/utils';
import { useFocusOnMount } from '../../hooks/useFocusOnMount';
import { THROTTLE_WAIT } from '../../hooks/useThrottledCallback';
import { StateLayout } from '../../components/StateLayout/StateLayout';
import { isSberBoxLike } from '../../utils/deviceFamily';
var iconWarn = "<svg width=\"160\" height=\"160\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M76.19 45.714a3.81 3.81 0 117.62 0V91.43a3.81 3.81 0 01-7.62 0V45.714zm-1.904 62.857a5.715 5.715 0 1111.429.001 5.715 5.715 0 01-11.43-.001z\" fill=\"#D63333\"/><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M80 152.381c39.975 0 72.381-32.406 72.381-72.381S119.975 7.619 80 7.619 7.619 40.025 7.619 80 40.025 152.381 80 152.381zM80 160c44.183 0 80-35.817 80-80S124.183 0 80 0 0 35.817 0 80s35.817 80 80 80z\" fill=\"#D63333\"/></svg>";
var StyledWarningIcon = /*#__PURE__*/styled.div.withConfig({
  componentId: "plasma-temple__sc-ln08i3-0"
})(["width:252px;height:252px;", " ", " background-image:url(", ");background-size:contain;"], /*#__PURE__*/mediaQuery('M')( /*#__PURE__*/css(["width:168px;height:168px;"])), /*#__PURE__*/mediaQuery('S')( /*#__PURE__*/css(["width:84px;height:84px;"])), iconWarn);
/** Компонент страницы для отображения состояния ошибки */

export var ErrorPage = function ErrorPage(_ref) {
  var header = _ref.header,
      error = _ref.error,
      buttons = _ref.buttons,
      className = _ref.className;
  var buttonRef = React.useRef(null);
  useFocusOnMount(buttonRef, {
    delay: THROTTLE_WAIT,
    prevent: !isSberBoxLike()
  });
  var buttonsToRender = React.useMemo(function () {
    if (typeof buttons === 'function') {
      return buttons(buttonRef);
    }

    if ( /*#__PURE__*/React.isValidElement(buttons)) {
      return buttons;
    }

    return null;
  }, [buttons]);
  return /*#__PURE__*/React.createElement(StateLayout, {
    className: className,
    header: header,
    title: error.status,
    text: error.message,
    button: buttonsToRender,
    image: /*#__PURE__*/React.createElement(StyledWarningIcon, null)
  });
};
//# sourceMappingURL=ErrorPage.js.map