react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
491 lines (481 loc) • 13.5 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _propTypes = require("prop-types");
var _propTypes2 = _interopRequireDefault(_propTypes);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var UndrawLiveCollaboration = function UndrawLiveCollaboration(props) {
return _react2.default.createElement(
"svg",
{
style: { height: props.height, width: '100%' },
className: props.class,
id: "f196eae1-e898-45a8-a656-bd14eee244bb",
"data-name": "Layer 1",
xmlnsXlink: "http://www.w3.org/1999/xlink",
viewBox: "0 0 862 703.19"
},
_react2.default.createElement(
"defs",
null,
_react2.default.createElement(
"linearGradient",
{
id: "6ecfc04c-7de9-42bf-8023-074f3c1ddce3",
x1: 232.86,
y1: 449.06,
x2: 232.86,
y2: 19.38,
gradientUnits: "userSpaceOnUse"
},
_react2.default.createElement("stop", { offset: 0, stopColor: "gray", stopOpacity: 0.25 }),
_react2.default.createElement("stop", { offset: 0.54, stopColor: "gray", stopOpacity: 0.12 }),
_react2.default.createElement("stop", { offset: 1, stopColor: "gray", stopOpacity: 0.1 })
),
_react2.default.createElement("linearGradient", {
id: "bdc54af5-8b94-492b-98e0-5080dd377cdf",
x1: 303.14,
y1: 548.35,
x2: 303.14,
y2: 118.67,
xlinkHref: "#6ecfc04c-7de9-42bf-8023-074f3c1ddce3"
}),
_react2.default.createElement("linearGradient", {
id: "8b482bc2-deb5-441e-9998-0daf288500a0",
x1: 730.3,
y1: 703.19,
x2: 730.3,
y2: 444.62,
xlinkHref: "#6ecfc04c-7de9-42bf-8023-074f3c1ddce3"
}),
_react2.default.createElement("linearGradient", {
id: "bb70749d-344b-49ee-9b57-98dd20ed6f29",
x1: 732.71,
y1: 258.57,
x2: 732.71,
y2: 0,
xlinkHref: "#6ecfc04c-7de9-42bf-8023-074f3c1ddce3"
})
),
_react2.default.createElement(
"title",
null,
"live collaboration"
),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", {
y: 19.38,
width: 465.71,
height: 429.68,
rx: 4.5,
ry: 4.5,
fill: "url(#6ecfc04c-7de9-42bf-8023-074f3c1ddce3)"
})
),
_react2.default.createElement("rect", {
x: 5.68,
y: 22.71,
width: 454.97,
height: 419.26,
rx: 4.5,
ry: 4.5,
fill: "#f5f5f5"
}),
_react2.default.createElement("rect", {
x: 40.75,
y: 91.77,
width: 76.73,
height: 69.06,
rx: 4.5,
ry: 4.5,
fill: props.primaryColor
}),
_react2.default.createElement("rect", {
x: 140.49,
y: 91.77,
width: 305.02,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 140.49,
y: 114.79,
width: 305.02,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 33.07,
y: 198.34,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 33.07,
y: 221.35,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 33.07,
y: 252.05,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 33.07,
y: 275.06,
width: 237.86,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 33.07,
y: 305.68,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 33.07,
y: 328.7,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 33.07,
y: 359.39,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 33.07,
y: 382.41,
width: 237.86,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", {
x: 70.29,
y: 118.67,
width: 465.71,
height: 429.68,
rx: 4.5,
ry: 4.5,
fill: "url(#bdc54af5-8b94-492b-98e0-5080dd377cdf)"
})
),
_react2.default.createElement("rect", {
x: 75.97,
y: 122,
width: 454.97,
height: 419.26,
rx: 4.5,
ry: 4.5,
fill: "#fff"
}),
_react2.default.createElement("rect", {
x: 111.03,
y: 191.06,
width: 76.73,
height: 69.06,
rx: 4.5,
ry: 4.5,
fill: props.primaryColor
}),
_react2.default.createElement("rect", {
x: 210.78,
y: 191.06,
width: 305.02,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 210.78,
y: 214.08,
width: 305.02,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 103.36,
y: 297.63,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 103.36,
y: 320.65,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 103.36,
y: 351.34,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 103.36,
y: 374.36,
width: 237.86,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 103.36,
y: 404.97,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 103.36,
y: 427.99,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 103.36,
y: 458.68,
width: 412.44,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 103.36,
y: 481.7,
width: 237.86,
height: 7.67,
rx: 3.44,
ry: 3.44,
fill: "#e0e0e0"
}),
_react2.default.createElement("line", {
x1: 536,
y1: 276.74,
x2: 540.36,
y2: 272.62,
fill: "none",
stroke: "#535461",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 549.5,
y1: 263.97,
x2: 709.45,
y2: 112.61,
fill: "none",
stroke: "#535461",
strokeMiterlimit: 10,
strokeDasharray: "12.58 12.58"
}),
_react2.default.createElement("line", {
x1: 714.02,
y1: 108.28,
x2: 718.37,
y2: 104.16,
fill: "none",
stroke: "#535461",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 537.63,
y1: 427.99,
x2: 542.1,
y2: 432,
fill: "none",
stroke: "#535461",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 551.36,
y1: 440.31,
x2: 713.39,
y2: 585.77,
fill: "none",
stroke: "#535461",
strokeMiterlimit: 10,
strokeDasharray: "12.44 12.44"
}),
_react2.default.createElement("line", {
x1: 718.02,
y1: 589.93,
x2: 722.48,
y2: 593.93,
fill: "none",
stroke: "#535461",
strokeMiterlimit: 10
}),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("circle", {
cx: 730.3,
cy: 573.91,
r: 129.29,
fill: "url(#8b482bc2-deb5-441e-9998-0daf288500a0)"
})
),
_react2.default.createElement("circle", { cx: 730.3, cy: 573.2, r: 126.56, fill: "#f5f5f5" }),
_react2.default.createElement("path", {
d: "M969.3,683c0,46.61-30.42,98.5-67.93,98.5s-67.93-51.9-67.93-98.5,30.42-70.27,67.93-70.27S969.3,636.38,969.3,683Z",
transform: "translate(-169 -98.4)",
fill: "#fdd835"
}),
_react2.default.createElement("path", {
d: "M899.66,798.54a126,126,0,0,0,69.57-20.82c-4.66-25.49-22.41-26.94-22.41-26.94H849s-16.75,1.38-22,24.82A126,126,0,0,0,899.66,798.54Z",
transform: "translate(-169 -98.4)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M709.61,621.29h39.14a0,0,0,0,1,0,0v33.34a17.54,17.54,0,0,1-17.54,17.54h-4.06a17.54,17.54,0,0,1-17.54-17.54V621.29A0,0,0,0,1,709.61,621.29Z",
opacity: 0.1
}),
_react2.default.createElement("path", {
d: "M713,619.84h32.45a3.35,3.35,0,0,1,3.35,3.35v30a17.54,17.54,0,0,1-17.54,17.54h-4.06a17.54,17.54,0,0,1-17.54-17.54v-30A3.35,3.35,0,0,1,713,619.84Z",
fill: "#fdb797"
}),
_react2.default.createElement("path", {
d: "M878.68,734.48a56.33,56.33,0,0,0,39.14.11v-4.81H878.68Z",
transform: "translate(-169 -98.4)",
opacity: 0.1
}),
_react2.default.createElement("circle", { cx: 729.33, cy: 582.59, r: 56.1, fill: "#fdb797" }),
_react2.default.createElement("ellipse", { cx: 674.38, cy: 580.2, rx: 5.22, ry: 9.79, fill: "#fdb797" }),
_react2.default.createElement("ellipse", { cx: 783.98, cy: 580.2, rx: 5.22, ry: 9.79, fill: "#fdb797" }),
_react2.default.createElement("path", {
d: "M848.61,650.56S880.37,694,953.07,679.15c0,0,8.12-9.88-11.65-40.23S866.61,613.51,848.61,650.56Z",
transform: "translate(-169 -98.4)",
opacity: 0.1
}),
_react2.default.createElement("path", {
d: "M848.61,649.86s31.76,43.41,104.46,28.59c0,0,8.12-9.88-11.65-40.23S866.61,612.8,848.61,649.86Z",
transform: "translate(-169 -98.4)",
fill: "#fdd835"
}),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("circle", {
cx: 732.71,
cy: 129.29,
r: 129.29,
fill: "url(#bb70749d-344b-49ee-9b57-98dd20ed6f29)"
})
),
_react2.default.createElement("circle", { cx: 732.97, cy: 128.46, r: 126.56, fill: "#f5f5f5" }),
_react2.default.createElement("path", {
d: "M902.07,353.92a126,126,0,0,0,69.57-20.82c-4.66-25.49-22.41-26.94-22.41-26.94H851.37s-16.75,1.38-22,24.82A126,126,0,0,0,902.07,353.92Z",
transform: "translate(-169 -98.4)",
fill: props.primaryColor
}),
_react2.default.createElement("circle", { cx: 731.74, cy: 125.79, r: 61.09, fill: "#333" }),
_react2.default.createElement("path", {
d: "M712,176.67h39.14a0,0,0,0,1,0,0V210a17.54,17.54,0,0,1-17.54,17.54h-4.06A17.54,17.54,0,0,1,712,210V176.67a0,0,0,0,1,0,0Z",
opacity: 0.1
}),
_react2.default.createElement("path", {
d: "M715.37,175.22h32.45a3.35,3.35,0,0,1,3.35,3.35v30a17.54,17.54,0,0,1-17.54,17.54h-4.06A17.54,17.54,0,0,1,712,208.57v-30A3.35,3.35,0,0,1,715.37,175.22Z",
fill: "#fdb797"
}),
_react2.default.createElement("path", {
d: "M881.1,289.86a56.33,56.33,0,0,0,39.14.11v-4.81H881.1Z",
transform: "translate(-169 -98.4)",
opacity: 0.1
}),
_react2.default.createElement("circle", { cx: 731.74, cy: 137.97, r: 56.1, fill: "#fdb797" }),
_react2.default.createElement("path", {
d: "M860.78,185.34s23.64,48,90.34,20.12l-15.53-24.35-27.53-9.88Z",
transform: "translate(-169 -98.4)",
opacity: 0.1
}),
_react2.default.createElement("path", {
d: "M860.78,184.64s23.64,48,90.34,20.12L935.59,180.4l-27.53-9.88Z",
transform: "translate(-169 -98.4)",
fill: "#333"
}),
_react2.default.createElement("path", {
d: "M860.57,181.39a32.41,32.41,0,0,1,8-13.07c11-10.91,29.13-13.21,38.41-25.65a7.26,7.26,0,0,1-3.33,10.24c8.88-.06,19.19-.84,24.22-8.16a16.63,16.63,0,0,1-2.8,17.56c7.88.36,16.29,5.71,16.8,13.58.34,5.24-2.95,10.21-7.26,13.22s-9.52,4.39-14.66,5.52C905,197.94,850.79,211.79,860.57,181.39Z",
transform: "translate(-169 -98.4)",
fill: "#333"
}),
_react2.default.createElement("ellipse", { cx: 675.61, cy: 137.92, rx: 5.22, ry: 9.79, fill: "#fdb797" }),
_react2.default.createElement("ellipse", { cx: 787.84, cy: 137.92, rx: 5.22, ry: 9.79, fill: "#fdb797" })
);
};
UndrawLiveCollaboration.propTypes = {
/**
* Hex color
*/
primaryColor: _propTypes2.default.string,
/**
* percentage
*/
height: _propTypes2.default.string,
/**
* custom class for svg
*/
class: _propTypes2.default.string
};
UndrawLiveCollaboration.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
exports.default = UndrawLiveCollaboration;