@unstoppabledomains/ui-kit
Version:
A set of common Unstoppable Domains components
75 lines • 2.52 kB
JavaScript
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import SvgIcon from '@mui/material/SvgIcon';
import React from 'react';
import { makeStyles } from "../styles";
const useStyles = makeStyles()(() => ({
id: {}
}));
const ProfilePlaceholder = props => {
const {
classes
} = useStyles();
const uuid = classes.id;
const ids = Array.from({
length: 3
}).map((_, i) => `profile-placeholder-${uuid}-${i}`);
return /*#__PURE__*/React.createElement(SvgIcon, _extends({
viewBox: "0 0 132 132"
}, props), /*#__PURE__*/React.createElement("mask", {
id: ids[0],
style: {
maskType: 'alpha'
},
maskUnits: "userSpaceOnUse",
x: "6",
y: "6",
width: "120",
height: "120"
}, /*#__PURE__*/React.createElement("path", {
d: "M126 66C126 99.1371 99.1371 126 66 126C32.8629 126 6 99.1371 6 66C6 32.8629 32.8629 6 66 6C99.1371 6 126 32.8629 126 66Z",
fill: "#0D67FE"
})), /*#__PURE__*/React.createElement("g", {
mask: `url(#${ids[0]})`
}, /*#__PURE__*/React.createElement("ellipse", {
cx: "66",
cy: "48",
rx: "24",
ry: "24",
fill: `url(#${ids[1]})`,
fillOpacity: "0.32"
}), /*#__PURE__*/React.createElement("circle", {
cx: "66",
cy: "140",
r: "60",
fill: `url(#${ids[2]})`,
fillOpacity: "0.32"
})), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
id: ids[1],
x1: "66",
y1: "24",
x2: "66",
y2: "72",
gradientUnits: "userSpaceOnUse"
}, /*#__PURE__*/React.createElement("stop", {
stopColor: props.stopColor || 'white'
}), /*#__PURE__*/React.createElement("stop", {
offset: "1",
stopColor: props.stopColor || 'white',
stopOpacity: "0.4"
})), /*#__PURE__*/React.createElement("linearGradient", {
id: ids[2],
x1: "66",
y1: "80",
x2: "66",
y2: "200",
gradientUnits: "userSpaceOnUse"
}, /*#__PURE__*/React.createElement("stop", {
stopColor: props.stopColor || 'white'
}), /*#__PURE__*/React.createElement("stop", {
offset: "1",
stopColor: props.stopColor || 'white',
stopOpacity: "0.4"
}))));
};
ProfilePlaceholder.muiName = 'ProfilePlaceholderIcon';
export default ProfilePlaceholder;