metadata-based-explorer1
Version:
Box UI Elements
92 lines (90 loc) • 6.52 kB
JavaScript
import * as React from 'react';
import AccessibleSVG from '../accessible-svg';
import { bdlBoxBlue, white } from '../../styles/variables';
var NotificationErrorState = function NotificationErrorState(_ref) {
var _ref$className = _ref.className,
className = _ref$className === void 0 ? '' : _ref$className,
_ref$color = _ref.color,
color = _ref$color === void 0 ? bdlBoxBlue : _ref$color,
_ref$height = _ref.height,
height = _ref$height === void 0 ? 111 : _ref$height,
_ref$opacity = _ref.opacity,
opacity = _ref$opacity === void 0 ? 0.5 : _ref$opacity,
title = _ref.title,
_ref$width = _ref.width,
width = _ref$width === void 0 ? 140 : _ref$width;
return React.createElement(AccessibleSVG, {
className: "notification-error-state ".concat(className),
height: height,
title: title,
viewBox: "0 0 140 111",
width: width
}, React.createElement("g", {
fill: "none",
fillRule: "evenodd",
opacity: opacity
}, React.createElement("path", {
className: "fill-color",
d: "M70.5 1.134V.492a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644A.5.5 0 0 1 73 2c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644A.5.5 0 0 1 71 4a.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366h-.644A.5.5 0 0 1 69 2c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zM11 68.634v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644a.5.5 0 0 1 .49.5c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366H9.99a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm116.5 8v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644a.5.5 0 0 1 .49.5c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zM42 18.134v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644a.5.5 0 0 1 .49.5c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm60 1.5v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644a.5.5 0 0 1 .49.5c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm35.5 20v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644a.5.5 0 0 1 .49.5c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zM21.437 21.709v-.402a.313.313 0 0 1 .625 0v.402a.628.628 0 0 1 .23.229h.401c.17 0 .307.144.307.312a.308.308 0 0 1-.307.313h-.402a.628.628 0 0 1-.229.228v.402a.313.313 0 0 1-.625.004v-.406a.628.628 0 0 1-.228-.229h-.402a.313.313 0 0 1-.307-.312c0-.173.134-.313.307-.313h.402a.628.628 0 0 1 .229-.228zm-20.5 40v-.402a.313.313 0 0 1 .625 0v.402a.628.628 0 0 1 .23.228h.401c.17 0 .307.145.307.313a.308.308 0 0 1-.307.313h-.402a.628.628 0 0 1-.228.228v.402a.313.313 0 0 1-.625.004v-.406a.628.628 0 0 1-.23-.228H.308A.313.313 0 0 1 0 62.25c0-.173.134-.313.307-.313h.402a.628.628 0 0 1 .229-.228zm122.5-31.5v-.402a.313.313 0 0 1 .626 0v.402a.628.628 0 0 1 .228.229h.402c.17 0 .307.144.307.312a.308.308 0 0 1-.307.313h-.402a.628.628 0 0 1-.228.228v.402a.313.313 0 0 1-.626.004v-.406a.628.628 0 0 1-.228-.229h-.402a.313.313 0 0 1-.307-.312c0-.173.134-.313.307-.313h.402a.628.628 0 0 1 .228-.228z",
fill: color
}), React.createElement("path", {
className: "stroke-color",
d: "M21.258 56.838c-2.418-8.434 2.459-17.23 10.894-19.65 6.82-1.955 13.877.859 17.608 6.466a8.952 8.952 0 0 1 4.341-2.782 8.952 8.952 0 0 1 5.1.041c-.979-6.19 2.79-12.28 8.97-14.053 6.683-1.916 13.655 1.948 15.572 8.63",
stroke: color,
strokeLinecap: "round",
strokeLinejoin: "round",
strokeWidth: "2"
}), React.createElement("path", {
className: "stroke-color",
d: "M79.01 44.663c1.824-8.582 10.26-14.06 18.843-12.235 8.583 1.824 14.062 10.26 12.238 18.841a16.2 16.2 0 0 1-.046.207 8.98 8.98 0 0 1 3.04.123 8.992 8.992 0 0 1 6.927 10.665",
stroke: color,
strokeLinecap: "round",
strokeLinejoin: "round",
strokeWidth: "2"
}), React.createElement("path", {
className: "stroke-color",
d: "M45.94 64.22a1.476 1.476 0 0 1 1.465-1.445h45.09c.794 0 1.45.643 1.466 1.443l.484 23.557.317 15.466c.016.797-.585 1.671-1.354 1.944 0 0-10.988 4.315-23.458 4.315-12.47 0-23.457-4.315-23.457-4.315-.765-.277-1.37-1.152-1.354-1.948l.338-16.508.463-22.51z",
fill: white,
stroke: color,
strokeWidth: "2"
}), React.createElement("ellipse", {
cx: "69.95",
cy: "73.373",
fill: "#22A7F0",
fillOpacity: ".1",
rx: "23.022",
ry: "4.335"
}), React.createElement("path", {
className: "stroke-color",
d: "M69.95 74.818c22.516 0 40.768-4.314 40.768-9.634 0-5.321-18.252-9.634-40.768-9.634-22.515 0-40.768 4.313-40.768 9.634 0 5.32 18.253 9.634 40.768 9.634z",
fill: white,
stroke: color,
strokeWidth: "2"
}), React.createElement("ellipse", {
className: "stroke-color",
cx: "69.95",
cy: "63.498",
rx: "24.461",
ry: "4.094",
stroke: color,
strokeWidth: "2"
}), React.createElement("path", {
className: "fill-color",
d: "M47.851 78.191c.02-.799.28-.843.555-.108 0 0 1.539 3.427 2.327 9.531.42 3.256-1.805 10.46 0 12.545 1.629 1.882 5.079.521 8.378 2.297 3.299 1.775 8.168 4.876 6.167 4.671-8.724-.89-16.69-3.713-16.69-3.713-.754-.25-1.349-1.1-1.328-1.9l.591-23.323zm22.1-11.577c-8.349 0-22.063-1.483-22.063-2.759 1.918-1.157 12.744-2.259 22.062-2.259 9.319 0 20.698 1.438 22.063 2.26 0 1.275-13.715 2.758-22.063 2.758z",
fill: color,
fillOpacity: ".07"
}), React.createElement("path", {
className: "stroke-color",
d: "M87.423 16.189l31.04 86.976c.332.93-.161 1.962-1.097 2.302a1.811 1.811 0 0 1-2.32-1.058l-32.13-86.58c-.343-.926.394-2.047 1.642-2.5 1.25-.456 2.533-.07 2.865.86z",
fill: white,
stroke: color,
strokeWidth: "2"
}), React.createElement("path", {
className: "stroke-color",
d: "M91 26l-3.77 1.335",
stroke: color,
strokeLinecap: "square",
strokeWidth: "2"
})));
};
export default NotificationErrorState;