react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
247 lines (237 loc) • 19.1 kB
JavaScript
;
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 UndrawCalendar = function UndrawCalendar(props) {
return _react2.default.createElement(
'svg',
{ className: props.class, id: 'e9df7128-f90d-48f2-af2a-c80f8452c1a7', dataName: 'Layer 1', xmlns: 'http://www.w3.org/2000/svg',
xmlnsXlink: 'http://www.w3.org/1999/xlink', style: { height: props.height, width: '100%' },
viewBox: '0 0 882.5 686.51' },
_react2.default.createElement(
'defs',
null,
_react2.default.createElement(
'linearGradient',
{ id: '459c4fc8-d836-433f-a197-0a2a91cd58e2', x1: '435.61',
y1: '529', x2: '435.61', 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: '342ea0e6-6062-49b7-bc20-c734cb7a73a4', x1: '435.61',
y1: '488', x2: '435.61', y2: '95', xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2'
}),
_react2.default.createElement('linearGradient', { id: '763d00b7-5a07-4818-8ebb-d18341e18e84', x1: '171.55',
y1: '660.05', x2: '171.55', y2: '316.95', xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2'
}),
_react2.default.createElement('linearGradient', { id: '92069d5c-e5f8-43fe-b38d-e54af900eab7', x1: '171.55',
y1: '496.61', x2: '171.55', y2: '480.38', xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2'
}),
_react2.default.createElement('linearGradient', { id: 'cc2cb1f8-9965-47fb-9589-218376181648', x1: '194.61',
y1: '489.5', x2: '194.61', y2: '382.5', xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2'
}),
_react2.default.createElement('linearGradient', { id: '21b9629b-50a9-4ebb-aca6-e4e0185f53fc', x1: '187.61',
y1: '544.5', x2: '187.61', y2: '488.5', xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2'
}),
_react2.default.createElement('linearGradient', { id: 'fcd1d80a-fd87-48d8-ac9f-c26a469979c7', x1: '509.54',
y1: '778.88', x2: '509.54', y2: '769.85', gradientTransform: 'rotate(120 443.15 583.787)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: '103b5314-699c-4416-ba96-f0315aa2be6d', x1: '246.07',
y1: '679.17', x2: '246.07', y2: '670.14', gradientTransform: 'rotate(30 246.076 674.664)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: 'f7eccc56-af47-4388-bae2-3610c4149eb5', x1: '364.44',
y1: '766.03', x2: '364.44', y2: '756.99', gradientTransform: 'rotate(30 707.775 31.032)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: 'bcd8726a-d7c5-49b1-9a44-0b3978539435', x1: '643.63',
y1: '719.48', x2: '643.63', y2: '710.44', gradientTransform: 'rotate(120 529.496 505.511)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: '391a46f9-b208-48d2-be26-d2096ab99e61', x1: '627.41',
y1: '656.89', x2: '627.41', y2: '647.85', gradientTransform: 'rotate(120 539.293 488.854)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: '83f8f054-eb9c-442d-b51f-167d68b16295', x1: '643.63',
y1: '594.29', x2: '643.63', y2: '585.26', gradientTransform: 'rotate(120 555.95 479.058)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: 'ae1ae34d-eb1b-4711-a510-1c391231e596', x1: '690', y1: '547.93',
x2: '690', y2: '538.89', gradientTransform: 'rotate(120 575.548 479.06)', xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2'
}),
_react2.default.createElement('linearGradient', { id: '9891a10d-f6cd-4be8-8439-1a188b457eca', x1: '818.66',
y1: '549.09', x2: '818.66', y2: '540.05', gradientTransform: 'rotate(120 602.492 506.489)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: 'fc0ab291-1c38-49b0-9137-a4534010b0cb', x1: '863.87',
y1: '596.61', x2: '863.87', y2: '587.58', gradientTransform: 'rotate(120 602.004 526.087)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: '28dee737-f47b-4c6f-813e-2c0be0b581eb', x1: '877.78',
y1: '656.89', x2: '877.78', y2: '647.85', gradientTransform: 'rotate(120 592.206 541.764)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' }),
_react2.default.createElement('linearGradient', { id: '228de15d-ea7a-43bb-9b48-ae33db5c4fe2', x1: '863.87',
y1: '717.16', x2: '863.87', y2: '708.13', gradientTransform: 'rotate(120 576.527 551.565)',
xlinkHref: '#459c4fc8-d836-433f-a197-0a2a91cd58e2' })
),
_react2.default.createElement('rect', { x: '35.61', width: '800', height: '529', fill: 'url(#459c4fc8-d836-433f-a197-0a2a91cd58e2)'
}),
_react2.default.createElement('rect', { x: '42.61', y: '62.5', width: '784', height: '450.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '42.61', y: '11', width: '784', height: '51.5', fill: props.primaryColor }),
_react2.default.createElement('rect', { x: '53.61', y: '95', width: '764', height: '393', fill: 'url(#342ea0e6-6062-49b7-bc20-c734cb7a73a4)'
}),
_react2.default.createElement('rect', { x: '63.11', y: '102', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '156.11', y: '102', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '249.11', y: '102', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '342.11', y: '102', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '435.11', y: '102', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '528.11', y: '102', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '621.11', y: '102', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '714.11', y: '102', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '63.11', y: '177', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '156.11', y: '177', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '249.11', y: '177', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '342.11', y: '177', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '435.11', y: '177', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '528.11', y: '177', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '621.11', y: '177', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '714.11', y: '177', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '63.11', y: '251', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '156.11', y: '251', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '249.11', y: '251', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '342.11', y: '251', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '435.11', y: '251', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '528.11', y: '251', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '621.11', y: '251', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '714.11', y: '251', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '63.11', y: '325', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '156.11', y: '325', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '249.11', y: '325', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '342.11', y: '325', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '435.11', y: '325', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '528.11', y: '325', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '621.11', y: '325', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '714.11', y: '325', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '63.11', y: '400', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '156.11', y: '400', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '249.11', y: '400', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '342.11', y: '400', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.5'
}),
_react2.default.createElement('rect', { x: '435.11', y: '400', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '528.11', y: '400', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '621.11', y: '400', width: '92', height: '73.5', fill: props.primaryColor, opacity: '0.2'
}),
_react2.default.createElement('rect', { x: '714.11', y: '400', width: '92', height: '73.5', fill: '#fff' }),
_react2.default.createElement('rect', { x: '70.61', y: '258', width: '28', height: '28', fill: props.accentColor }),
_react2.default.createElement('rect', { x: '348.61', y: '110', width: '28', height: '28', fill: props.accentColor }),
_react2.default.createElement('rect', { x: '345.61', y: '258', width: '28', height: '28', fill: props.accentColor }),
_react2.default.createElement('rect', { x: '440.61', y: '329', width: '28', height: '28', fill: props.accentColor }),
_react2.default.createElement('rect', { x: '625.61', y: '258', width: '28', height: '28', fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '171.55', cy: '488.5', r: '171.55', fill: 'url(#763d00b7-5a07-4818-8ebb-d18341e18e84)'
}),
_react2.default.createElement('circle', { cx: '171.55', cy: '488.5', r: '166.92', fill: props.primaryColor }),
_react2.default.createElement('circle', { cx: '171.55', cy: '488.5', r: '135.62', fill: '#fff' }),
_react2.default.createElement('circle', { cx: '171.55', cy: '488.5', r: '8.11', fill: 'url(#92069d5c-e5f8-43fe-b38d-e54af900eab7)'
}),
_react2.default.createElement('line', { x1: '216.76', y1: '384.18', x2: '172.71', y2: '488.5', fill: props.primaryColor }),
_react2.default.createElement('polygon', { points: '174.61 489.5 169.61 487.82 214.61 382.5 219.61 384.85 174.61 489.5',
fill: 'url(#cc2cb1f8-9965-47fb-9589-218376181648)' }),
_react2.default.createElement('rect', { x: '320.31', y: '554.57', width: '113.24', height: '3.48', transform: 'rotate(-67.11 195.363 633.663)',
fill: '#2196f3' }),
_react2.default.createElement('line', { x1: '172.71', y1: '489.66', x2: '201.69', y2: '542.98', fill: props.primaryColor }),
_react2.default.createElement('polygon', { points: '199.61 544.5 170.61 490.5 174.61 488.5 204.61 541.5 199.61 544.5',
fill: 'url(#21b9629b-50a9-4ebb-aca6-e4e0185f53fc)' }),
_react2.default.createElement('rect', { x: '367.66', y: '605.95', width: '3.48', height: '60.69', transform: 'rotate(-28.52 42.332 934.805)',
fill: '#2196f3' }),
_react2.default.createElement('circle', { cx: '297.9', cy: '491.98', r: '3.48', fill: props.primaryColor }),
_react2.default.createElement('circle', { cx: '244.91', cy: '545.99', r: '4.52', transform: 'rotate(-60 49.913 643.788)',
fill: 'url(#fcd1d80a-fd87-48d8-ac9f-c26a469979c7)' }),
_react2.default.createElement('circle', { cx: '246.07', cy: '674.66', r: '4.52', transform: 'rotate(-30 -68.919 954.653)',
fill: 'url(#103b5314-699c-4416-ba96-f0315aa2be6d)' }),
_react2.default.createElement('circle', { cx: '45.21', cy: '491.98', r: '4.52', fill: 'url(#f7eccc56-af47-4388-bae2-3610c4149eb5)'
}),
_react2.default.createElement('circle', { cx: '291.04', cy: '499.63', r: '4.52', transform: 'rotate(-30 -23.94 779.625)',
fill: 'url(#bcd8726a-d7c5-49b1-9a44-0b3978539435)' }),
_react2.default.createElement('circle', { cx: '353.63', cy: '483.41', r: '4.52', transform: 'rotate(-30 38.649 763.396)',
fill: 'url(#391a46f9-b208-48d2-be26-d2096ab99e61)' }),
_react2.default.createElement('circle', { cx: '416.23', cy: '499.63', r: '4.52', transform: 'rotate(-30 101.258 779.632)',
fill: 'url(#83f8f054-eb9c-442d-b51f-167d68b16295)' }),
_react2.default.createElement('circle', { cx: '462.59', cy: '546', r: '4.52', transform: 'rotate(-30 147.616 825.994)',
fill: 'url(#ae1ae34d-eb1b-4711-a510-1c391231e596)' }),
_react2.default.createElement('circle', { cx: '461.43', cy: '674.66', r: '4.52', transform: 'rotate(-30 146.464 954.645)',
fill: 'url(#9891a10d-f6cd-4be8-8439-1a188b457eca)' }),
_react2.default.createElement('circle', { cx: '413.91', cy: '719.87', r: '4.52', transform: 'rotate(-30 98.926 999.867)',
fill: 'url(#fc0ab291-1c38-49b0-9137-a4534010b0cb)' }),
_react2.default.createElement('circle', { cx: '353.63', cy: '733.78', r: '4.52', transform: 'rotate(-30 38.659 1013.779)',
fill: 'url(#28dee737-f47b-4c6f-813e-2c0be0b581eb)' }),
_react2.default.createElement('circle', { cx: '293.36', cy: '719.87', r: '4.52', transform: 'rotate(-30 -21.614 999.869)',
fill: 'url(#228de15d-ea7a-43bb-9b48-ae33db5c4fe2)' }),
_react2.default.createElement('circle', { cx: '171.55', cy: '363.31', r: '3.48', fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '416.34', cy: '500.06', r: '3.48', transform: 'rotate(-60 221.336 597.855)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '462.16', cy: '545.88', r: '3.48', transform: 'rotate(-30 147.187 825.879)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '461.43', cy: '674.66', r: '3.48', transform: 'rotate(-60 266.428 772.453)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '413.91', cy: '719.63', r: '3.48', transform: 'rotate(-30 98.93 999.628)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '291.15', cy: '500.06', r: '3.48', transform: 'rotate(-30 -23.816 780.059)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '245.33', cy: '545.88', r: '3.48', transform: 'rotate(-60 50.337 643.674)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '479.98', cy: '612.07', r: '4.52', transform: 'rotate(-30 165.014 892.055)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '246.07', cy: '674.66', r: '3.48', transform: 'rotate(-30 -68.919 954.653)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '293.58', cy: '719.63', r: '3.48', transform: 'rotate(-60 98.584 817.427)',
fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '45.21', cy: '491.98', r: '3.48', fill: props.accentColor }),
_react2.default.createElement('circle', { cx: '171.55', cy: '613.68', r: '3.48', fill: props.accentColor }),
_react2.default.createElement('path', { d: 'M225.08,621.22a135.64,135.64,0,0,1,253.28-67.48A135.64,135.64,0,1,0,236.08,674.8,135.16,135.16,0,0,1,225.08,621.22Z',
transform: 'translate(-182.19 -119.97)', fill: props.primaryColor, opacity: '0.2' }),
_react2.default.createElement('circle', { cx: '171.55', cy: '488.5', r: '5.8', fill: props.accentColor })
);
};
UndrawCalendar.propTypes = {
/**
* Hex color
*/
primaryColor: _propTypes2.default.string,
/**
* Hex color
*/
accentColor: _propTypes2.default.string,
/**
* percentage
*/
height: _propTypes2.default.string,
/**
* custom class for svg
*/
class: _propTypes2.default.string
};
UndrawCalendar.defaultProps = {
primaryColor: '#6c68fb',
accentColor: '#43d1a0',
height: '100%',
class: ''
};
exports.default = UndrawCalendar;