react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
380 lines (370 loc) • 16.1 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 UndrawChoose = function UndrawChoose(props) {
return _react2.default.createElement(
"svg",
{
style: { height: props.height, width: '100%' },
className: props.class,
id: "6670c59b-7363-437f-8bc4-669e571fa4b5",
"data-name": "Layer 1",
xmlnsXlink: "http://www.w3.org/1999/xlink",
viewBox: "0 0 567 785.72"
},
_react2.default.createElement(
"defs",
null,
_react2.default.createElement(
"linearGradient",
{
id: "aaad421b-74ad-4e3c-867c-11df00873b04",
x1: 378.18,
y1: 511.24,
x2: 697.95,
y2: 511.24,
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(
"title",
null,
"choose"
),
_react2.default.createElement("polygon", {
points: "528.76 115.47 474.5 99.07 471.16 173.27 528.26 190.48 528.76 115.47",
fill: "#f5f5f5"
}),
_react2.default.createElement("polygon", {
points: "146.81 0 146.81 75.5 471.16 173.27 474.5 99.07 146.81 0",
fill: "#f5f5f5"
}),
_react2.default.createElement("polygon", {
points: "528.76 115.47 474.5 99.07 471.16 173.27 528.26 190.48 528.76 115.47",
opacity: 0.1
}),
_react2.default.createElement("polygon", {
points: "528.76 257.59 474.5 241.19 471.16 315.39 528.26 332.6 528.76 257.59",
fill: "#3ad29f"
}),
_react2.default.createElement("polygon", {
points: "146.81 142.12 146.81 217.62 471.16 315.39 474.5 241.19 146.81 142.12",
fill: "#3ad29f"
}),
_react2.default.createElement("polygon", {
points: "528.76 257.59 474.5 241.19 471.16 315.39 528.26 332.6 528.76 257.59",
opacity: 0.1
}),
_react2.default.createElement("polyline", {
points: "488.29 283.75 497.17 297.07 514.94 274.86",
fill: "none",
stroke: "#fff",
strokeLinecap: "round",
strokeMiterlimit: 10,
strokeWidth: 7
}),
_react2.default.createElement(
"g",
{ opacity: 0.4 },
_react2.default.createElement("line", {
x1: 488.78,
y1: 128.3,
x2: 506.55,
y2: 159.39,
fill: "none",
stroke: "#fff",
strokeLinecap: "round",
strokeMiterlimit: 10,
strokeWidth: 7
}),
_react2.default.createElement("line", {
x1: 510.99,
y1: 132.74,
x2: 488.78,
y2: 154.95,
fill: "none",
stroke: "#fff",
strokeLinecap: "round",
strokeMiterlimit: 10,
strokeWidth: 7
})
),
_react2.default.createElement("polygon", {
points: "528.76 390.83 474.5 374.43 471.16 448.63 528.26 465.84 528.76 390.83",
fill: "#f5f5f5"
}),
_react2.default.createElement("polygon", {
points: "146.81 275.36 146.81 350.86 471.16 448.63 474.5 374.43 146.81 275.36",
fill: "#f5f5f5"
}),
_react2.default.createElement("polygon", {
points: "528.76 390.83 474.5 374.43 471.16 448.63 528.26 465.84 528.76 390.83",
opacity: 0.1
}),
_react2.default.createElement(
"g",
{ opacity: 0.4 },
_react2.default.createElement("line", {
x1: 488.78,
y1: 403.66,
x2: 506.55,
y2: 434.75,
fill: "none",
stroke: "#fff",
strokeLinecap: "round",
strokeMiterlimit: 10,
strokeWidth: 7
}),
_react2.default.createElement("line", {
x1: 510.99,
y1: 408.1,
x2: 488.78,
y2: 430.31,
fill: "none",
stroke: "#fff",
strokeLinecap: "round",
strokeMiterlimit: 10,
strokeWidth: 7
})
),
_react2.default.createElement("ellipse", { cx: 371.09, cy: 243.78, rx: 11.1, ry: 22.21, opacity: 0.3 }),
_react2.default.createElement("ellipse", {
cx: 371.09,
cy: 243.78,
rx: 93.27,
ry: 186.53,
fill: props.primaryColor,
opacity: 0.1
}),
_react2.default.createElement("ellipse", {
cx: 371.09,
cy: 243.78,
rx: 51.07,
ry: 102.15,
fill: "#fff",
opacity: 0.1
}),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("path", {
d: "M697.44,306.14c-4.56-13.68-31.67,4.81-31.67,4.81l-2.23,3-48.19,65.14-118.07-66V283.58a41,41,0,0,0,35.89-47.73c5.94-2.29,10.78-7.23,15.24-12,4.11-4.37,8.51-9.67,8.09-15.49a10.77,10.77,0,0,0-.16-2.78c-.94-4.91-5.38-8.49-10.08-10.2s-9.78-2-14.69-3c-11.7-2.29-22.27-8.4-33.68-11.86a76.62,76.62,0,0,0-15.91-3c-3.87-.32-7.9-.32-11.44,1.27-3.88,1.75-6.69,5.17-9.81,8.08a44.64,44.64,0,0,1-12.86,8.37c-7.07,3-15,4.23-21.37,8.47a12.61,12.61,0,0,0-4.31,4.32,11.74,11.74,0,0,0-1.15,6.14,30.79,30.79,0,0,0,.42,5.56c1.12,7.84,2.41,15.87,6.38,22.72,3.24,5.6,8.09,10.06,12.85,14.44l10.71,9.82c2.17,2,4.57,4.46,7.37,5.45-.18-1.3.56-2.67,1.66-4l-3.47,24.26A70.26,70.26,0,0,0,437,289.27c-9.12-.11-18.35,1.54-22.34,7.75a8.62,8.62,0,0,0-.61,1.18c-12.57,14.92-41.38,63.24-24.44,180.6-1.45,14.36-2.32,23.45-2.32,23.45l.1,1.44-.1,1.09.2.16,9.43,129.57-18.24,127.7h4.05V776.4h-4.56v22.8s63.34-4.05,73-18.24c8-11.77-31.82-7.15-45.61-5.23V767h.25v-4.81h4.81l18.24-86.65C447.61,643.13,438,562,438,562l22.8,13.68L479,671,465.34,812.38h4.05v9.88h-5.32v22.8s63.34-4.05,73-18.24c8-11.77-31.8-7.15-45.59-5.23l-1.53-9.21h2.79L511,684.68c9-34.6-3.27-136.12-4.89-149.12L528.69,386.2l-.32-.43.32-2.11L619.9,415.6s9.12,9.12,18.5-18c8.76-25.34,32.79-59.31,35.9-63.64l.33-.46S702,319.82,697.44,306.14Z",
transform: "translate(-316 -59.35)",
fill: "url(#aaad421b-74ad-4e3c-867c-11df00873b04)"
})
),
_react2.default.createElement("polygon", {
points: "70.81 691.85 70.81 714.05 93.02 714.05 93.02 682.97 70.81 691.85",
fill: "#fda57d"
}),
_react2.default.createElement("polygon", {
points: "155.2 736.26 155.2 762.91 177.4 758.47 172.96 731.82 155.2 736.26",
fill: "#fda57d"
}),
_react2.default.createElement("path", {
d: "M422.59,298.43s-53,39.72-26.89,195.17Z",
transform: "translate(-316 -59.35)",
fill: "#f55f44"
}),
_react2.default.createElement("path", {
d: "M422.59,298.43s-53,39.72-26.89,195.17Z",
transform: "translate(-316 -59.35)",
opacity: 0.05
}),
_react2.default.createElement("polygon", {
points: "175.43 749.83 173.21 736.51 155.44 740.95 155.44 749.83 175.43 749.83",
opacity: 0.05
}),
_react2.default.createElement("polygon", {
points: "71.06 700.98 93.27 700.98 93.27 687.65 71.06 696.54 71.06 700.98",
opacity: 0.05
}),
_react2.default.createElement("polygon", {
points: "146.81 212.69 142.37 243.78 182.34 265.98 182.34 221.57 146.81 212.69",
fill: "#fda57d"
}),
_react2.default.createElement("path", {
d: "M382.87,755.64l17.77-124.36-9.38-128.8,115.47,31.09S521,644.11,511.66,680.13L493.9,804.49H467.25l13.32-137.68L462.81,574,440.6,560.71s9.38,79-8.88,110.54L414,755.64Z",
transform: "translate(-316 -59.35)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M693.26,311.51c-4.44-13.32-30.84,4.69-30.84,4.69l-2.17,2.94,10.48,19.47.33-.45S697.7,324.83,693.26,311.51Z",
transform: "translate(-316 -59.35)",
fill: "#fda57d"
}),
_react2.default.createElement("path", {
d: "M462.31,300.65s-35.53-9.38-44.41,4.44S391.25,505,391.25,505s52.8,44.41,115.47,31.09l22.21-146.56Z",
transform: "translate(-316 -59.35)",
opacity: 0.05
}),
_react2.default.createElement("path", {
d: "M613.32,382.57,472.94,304.13a70.08,70.08,0,0,0-33.29-9c-8.88-.11-17.87,1.5-21.75,7.54-8.88,13.82-26.65,199.86-26.65,199.86s52.8,44.41,115.47,31.09L528.93,387l88.83,31.09s8.88,8.88,18-17.52c8.53-24.68,31.93-57.75,35-62l-10.48-19.47Z",
transform: "translate(-316 -59.35)",
fill: "#f55f44"
}),
_react2.default.createElement("path", {
d: "M462.21,278.93a39.89,39.89,0,0,0,31.44,15.3,40.37,40.37,0,0,0,4.44-.25v-8.63l-35.53-8.88Z",
transform: "translate(-316 -59.35)",
opacity: 0.05
}),
_react2.default.createElement("circle", { cx: 177.9, cy: 190.48, r: 39.97, fill: "#fda57d" }),
_react2.default.createElement("path", {
d: "M382.37,769.45v22.21s61.68-3.95,71.06-17.77-48.85-4.44-48.85-4.44Z",
transform: "translate(-316 -59.35)",
fill: "#333"
}),
_react2.default.createElement("path", {
d: "M466,814.11v22.21s61.68-3.95,71.06-17.77-48.85-4.44-48.85-4.44Z",
transform: "translate(-316 -59.35)",
fill: "#333"
}),
_react2.default.createElement("path", {
d: "M468.55,268.15l15.62-22.35c2.31-3.31,4.68-6.68,7.92-9.1s7.54-3.77,11.38-2.53c2.32.75,4.25,2.35,6.22,3.78,5.83,4.24,13,7.39,20.13,6.11,7.43-1.34,13.14-7.14,18.31-12.64,4.29-4.56,8.9-10.16,7.72-16.31-.92-4.78-5.24-8.26-9.82-9.93s-9.52-1.94-14.3-2.88c-11.39-2.23-21.69-8.18-32.8-11.55a74.61,74.61,0,0,0-15.5-3c-3.77-.31-7.7-.31-11.14,1.24-3.78,1.7-6.52,5-9.55,7.87A43.47,43.47,0,0,1,450.22,205c-6.88,2.94-14.57,4.12-20.81,8.25a12.28,12.28,0,0,0-4.19,4.21c-1.6,3-1.19,6.58-.71,9.92,1.09,7.63,2.34,15.45,6.21,22.12,3.16,5.45,7.87,9.8,12.52,14.06l10.43,9.57c2.11,1.94,4.45,4.34,7.18,5.31C460.36,275,466.58,271,468.55,268.15Z",
transform: "translate(-316 -59.35)",
opacity: 0.05
}),
_react2.default.createElement("path", {
d: "M468.55,266.67l15.62-22.35c2.31-3.31,4.68-6.68,7.92-9.1s7.54-3.77,11.38-2.53c2.32.75,4.25,2.35,6.22,3.78,5.83,4.24,13,7.39,20.13,6.11,7.43-1.34,13.14-7.14,18.31-12.64,4.29-4.56,8.9-10.16,7.72-16.31-.92-4.78-5.24-8.26-9.82-9.93s-9.52-1.94-14.3-2.88c-11.39-2.23-21.69-8.18-32.8-11.55a74.61,74.61,0,0,0-15.5-3c-3.77-.31-7.7-.31-11.14,1.24-3.78,1.7-6.52,5-9.55,7.87a43.47,43.47,0,0,1-12.52,8.15c-6.88,2.94-14.57,4.12-20.81,8.25a12.28,12.28,0,0,0-4.19,4.21c-1.6,3-1.19,6.58-.71,9.92,1.09,7.63,2.34,15.45,6.21,22.12,3.16,5.45,7.87,9.8,12.52,14.06l10.43,9.57c2.11,1.94,4.45,4.34,7.18,5.31C460.36,273.53,466.58,269.48,468.55,266.67Z",
transform: "translate(-316 -59.35)",
fill: "#333"
}),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", { x: 3.45, y: 110.29, width: 1.48, height: 8.39, fill: "#47e6b1" }),
_react2.default.createElement("rect", {
x: 319.45,
y: 169.64,
width: 1.48,
height: 8.39,
transform: "translate(178.03 -205.71) rotate(90)",
fill: "#47e6b1"
})
),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", { x: 528.45, y: 519.29, width: 1.48, height: 8.39, fill: "#47e6b1" }),
_react2.default.createElement("rect", {
x: 844.45,
y: 578.64,
width: 1.48,
height: 8.39,
transform: "translate(1112.03 -321.71) rotate(90)",
fill: "#47e6b1"
})
),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", { x: 491.99, y: 341.24, width: 1.48, height: 8.39, fill: "#47e6b1" }),
_react2.default.createElement("rect", {
x: 807.99,
y: 400.58,
width: 1.48,
height: 8.39,
transform: "translate(897.51 -463.3) rotate(90)",
fill: "#47e6b1"
})
),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", { x: 428.83, y: 511.98, width: 1.48, height: 8.39, fill: "#47e6b1" }),
_react2.default.createElement("rect", {
x: 744.83,
y: 571.32,
width: 1.48,
height: 8.39,
transform: "translate(1005.09 -229.4) rotate(90)",
fill: "#47e6b1"
})
),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", { x: 384.42, y: 619.06, width: 1.48, height: 8.39, fill: "#47e6b1" }),
_react2.default.createElement("rect", {
x: 700.42,
y: 678.41,
width: 1.48,
height: 8.39,
transform: "translate(1067.76 -77.9) rotate(90)",
fill: "#47e6b1"
})
),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", { x: 66.62, y: 240.07, width: 1.48, height: 8.39, fill: "#47e6b1" }),
_react2.default.createElement("rect", {
x: 382.62,
y: 299.42,
width: 1.48,
height: 8.39,
transform: "translate(370.97 -139.09) rotate(90)",
fill: "#47e6b1"
})
),
_react2.default.createElement("path", {
d: "M405.66,168.8a1.81,1.81,0,0,1-1-2.19.87.87,0,0,0,0-.2h0a.91.91,0,0,0-1.63-.6h0a.87.87,0,0,0-.1.18,1.81,1.81,0,0,1-2.19,1l-.2,0h0a.91.91,0,0,0-.6,1.63h0a.87.87,0,0,0,.18.1,1.81,1.81,0,0,1,1,2.19.87.87,0,0,0,0,.2h0a.91.91,0,0,0,1.63.6h0a.87.87,0,0,0,.1-.18,1.81,1.81,0,0,1,2.19-1l.2,0h0a.91.91,0,0,0,.6-1.63h0A.87.87,0,0,0,405.66,168.8Z",
transform: "translate(-316 -59.35)",
fill: "#4d8af0",
opacity: 0.5
}),
_react2.default.createElement("path", {
d: "M738.85,94.61a1.81,1.81,0,0,1-1-2.19.87.87,0,0,0,0-.2h0a.91.91,0,0,0-1.63-.6h0a.87.87,0,0,0-.1.18,1.81,1.81,0,0,1-2.19,1l-.2,0h0a.91.91,0,0,0-.6,1.63h0a.87.87,0,0,0,.18.1,1.81,1.81,0,0,1,1,2.19.87.87,0,0,0,0,.2h0a.91.91,0,0,0,1.63.6h0a.87.87,0,0,0,.1-.18,1.81,1.81,0,0,1,2.19-1l.2,0h0a.91.91,0,0,0,.6-1.63h0A.87.87,0,0,0,738.85,94.61Z",
transform: "translate(-316 -59.35)",
fill: "#4d8af0",
opacity: 0.5
}),
_react2.default.createElement("path", {
d: "M329.27,358.62a1.81,1.81,0,0,1-1-2.19.87.87,0,0,0,0-.2h0a.91.91,0,0,0-1.63-.6h0a.87.87,0,0,0-.1.18,1.81,1.81,0,0,1-2.19,1l-.2,0h0a.91.91,0,0,0-.6,1.63h0a.87.87,0,0,0,.18.1,1.81,1.81,0,0,1,1,2.19.87.87,0,0,0,0,.2h0a.91.91,0,0,0,1.63.6h0a.87.87,0,0,0,.1-.18,1.81,1.81,0,0,1,2.19-1l.2,0h0a.91.91,0,0,0,.6-1.63h0A.87.87,0,0,0,329.27,358.62Z",
transform: "translate(-316 -59.35)",
fill: "#4d8af0",
opacity: 0.5
}),
_react2.default.createElement("path", {
d: "M342.59,545.15a1.81,1.81,0,0,1-1-2.19.87.87,0,0,0,0-.2h0a.91.91,0,0,0-1.63-.6h0a.87.87,0,0,0-.1.18,1.81,1.81,0,0,1-2.19,1l-.2,0h0a.91.91,0,0,0-.6,1.63h0a.87.87,0,0,0,.18.1,1.81,1.81,0,0,1,1,2.19.87.87,0,0,0,0,.2h0a.91.91,0,0,0,1.63.6h0a.87.87,0,0,0,.1-.18,1.81,1.81,0,0,1,2.19-1l.2,0h0a.91.91,0,0,0,.6-1.63h0A.87.87,0,0,0,342.59,545.15Z",
transform: "translate(-316 -59.35)",
fill: "#4d8af0",
opacity: 0.5
}),
_react2.default.createElement("circle", { cx: 248.71, cy: 134.47, r: 2.96, fill: "#f55f44", opacity: 0.5 }),
_react2.default.createElement("circle", { cx: 328.65, cy: 520.86, r: 2.96, fill: "#4d8af0", opacity: 0.5 }),
_react2.default.createElement("circle", { cx: 510.74, cy: 214.41, r: 2.96, fill: "#4d8af0", opacity: 0.5 }),
_react2.default.createElement("circle", { cx: 564.04, cy: 347.65, r: 2.96, fill: "#47e6b1", opacity: 0.5 }),
_react2.default.createElement("circle", { cx: 365.66, cy: 11.6, r: 2.96, fill: "#f55f44", opacity: 0.5 })
);
};
UndrawChoose.propTypes = {
/**
* Hex color
*/
primaryColor: _propTypes2.default.string,
/**
* percentage
*/
height: _propTypes2.default.string,
/**
* custom class for svg
*/
class: _propTypes2.default.string
};
UndrawChoose.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
exports.default = UndrawChoose;