UNPKG

@gssfed/vital-ui-kit-react

Version:
603 lines (536 loc) 1.05 MB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } var React = require('react'); var React__default = _interopDefault(React); var styled = require('styled-components'); var styled__default = _interopDefault(styled); var polished = require('polished'); var PropTypes = _interopDefault(require('prop-types')); var ClickOutside = _interopDefault(require('react-click-outside')); var ReactDOM = require('react-dom'); var ReactDOM__default = _interopDefault(ReactDOM); var popmotion = require('popmotion'); var PriorityNav = _interopDefault(require('react-priority-navigation')); var Trigger = _interopDefault(require('rc-trigger')); var ResizeObserver = _interopDefault(require('resize-observer-polyfill')); var reactVirtualized = require('react-virtualized'); var cn = _interopDefault(require('classnames')); // var trunTo = function trunTo(value) { var number = Number(value); if (!Number.isNaN(number)) { return number > 99 ? '99+' : number; } return value; }; var avatarSizes = { xsmall: { size: '16px', borderRadius: '2px' }, small: { size: '24px', borderRadius: '2px' }, medium: { size: '32px', borderRadius: '3px' }, large: { size: '48px', borderRadius: '4px' }, xlarge: { size: '64px', borderRadius: '4px' } }; var badgeSizes = { xlarge: { height: '17px' }, large: { height: '13px' }, medium: { height: '9px' }, small: { height: '7px' }, xsmall: { height: '5px' } }; // var badgeTransformStyle = function badgeTransformStyle(_ref) { var size = _ref.size, round = _ref.round, label = _ref.label; if (size === 'xlarge') { return styled.css(['padding:0 5px;border-radius:0.75rem;font-size:0.725rem;left:', ';right:', ';top:', ';'], round ? '70%' : 'auto', round ? 'auto' : '-12%', round ? 0 : 'calc(' + badgeSizes[size].height + ' / -2)'); } // circle badge style return styled.css(['padding:0;border-radius:50%;font-size:0;width:', ';height:', ';right:calc(', ' / -2);top:', ';left:', ';right:', ';&:before{content:\'\';position:absolute;top:calc(50% - (3px / 2));left:calc(50% - (3px / 2));background:', ';border-radius:50%;width:3px;height:3px;}'], badgeSizes[size].height, badgeSizes[size].height, badgeSizes[size].height, round ? 0 : 'calc(' + badgeSizes[size].height + ' / -2)', round ? '70%' : 'auto', round ? 'auto' : badgeSizes[size].height / -2, label ? '#fff' : 'transparent'); }; var Root = styled__default.span.withConfig({ displayName: 'AvatarBadge__Root' })(['position:absolute;background-color:', ';color:', ';vertical-align:middle;height:', ';line-height:', ';', ';'], function (_ref2) { var theme = _ref2.theme; return theme.avatar.badgeBg; }, function (_ref3) { var theme = _ref3.theme; return theme.white; }, function (_ref4) { var size = _ref4.size; return badgeSizes[size].height; }, function (_ref5) { var size = _ref5.size; return badgeSizes[size].height; }, function (props) { return badgeTransformStyle(props); }); var AvatarBadge = function AvatarBadge(_ref6) { var label = _ref6.label, size = _ref6.size, round = _ref6.round, style = _ref6.style; return React__default.createElement( Root, { label: label, size: size, round: round, style: style }, size === 'xlarge' ? trunTo(label) : null ); }; AvatarBadge.defaultProps = { round: false, size: 'medium', style: null }; var DEFAULT_AVATAR = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%22124px%22%20height%3D%22124px%22%20viewBox%3D%220%200%20124%20124%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%20%20%20%20%3Ctitle%3EGroup%2017%3C%2Ftitle%3E%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%20%20%20%20%3Cdefs%3E%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22Components-Avatars%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28-1459.000000%2C%20-1854.000000%29%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-17%22%20transform%3D%22translate%281459.000000%2C%201854.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-14%22%20fill%3D%22%237189B6%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Crect%20id%3D%22Rectangle-10%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22124%22%20height%3D%22124%22%3E%3C%2Frect%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Ccircle%20id%3D%22Oval-2%22%20fill%3D%22%23FFFFFF%22%20cx%3D%2262%22%20cy%3D%2241%22%20r%3D%2218%22%3E%3C%2Fcircle%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M28%2C102%20C28%2C82.117749%2043.2223185%2C66%2062%2C66%20C80.7776815%2C66%2096%2C82.117749%2096%2C102%20L28%2C102%20Z%22%20id%3D%22Combined-Shape-Copy-2%22%20fill%3D%22%23FFFFFF%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E"; var DEFAULT_AVATAR_OUTLINE = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%22124px%22%20height%3D%22124px%22%20viewBox%3D%220%200%20124%20124%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%20%20%20%20%3Ctitle%3EGroup%2019%3C%2Ftitle%3E%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%20%20%20%20%3Cdefs%3E%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22Components-Avatars%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28-1611.000000%2C%20-1854.000000%29%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-19%22%20transform%3D%22translate%281611.000000%2C%201854.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-18%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-15%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Crect%20id%3D%22Rectangle-10-Copy%22%20fill%3D%22%237189B6%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22124%22%20height%3D%22124%22%3E%3C%2Frect%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-16%22%20transform%3D%22translate%2830.000000%2C%2024.000000%29%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%224%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ccircle%20id%3D%22Oval-2-Copy-2%22%20cx%3D%2232%22%20cy%3D%2216%22%20r%3D%2216%22%3E%3C%2Fcircle%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M64%2C76%20C64%2C58.326888%2049.673112%2C44%2032%2C44%20C14.326888%2C44%200%2C58.326888%200%2C76%22%20id%3D%22Combined-Shape-Copy%22%20stroke-linecap%3D%22round%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E"; var DEFAULT_AVATAR_M = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%22124px%22%20height%3D%22124px%22%20viewBox%3D%220%200%20124%20124%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%20%20%20%20%3Ctitle%3EGroup%203%3C%2Ftitle%3E%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%20%20%20%20%3Cdefs%3E%20%20%20%20%20%20%20%20%3Crect%20id%3D%22path-1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22124%22%20height%3D%22124%22%20rx%3D%2262%22%3E%3C%2Frect%3E%20%20%20%20%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22Components-Avatars%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28-1459.000000%2C%20-2071.000000%29%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-3%22%20transform%3D%22translate%281459.000000%2C%202071.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-4%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cmask%20id%3D%22mask-2%22%20fill%3D%22white%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fmask%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20id%3D%22Mask%22%20fill%3D%22%230E86FE%22%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20mask%3D%22url%28%23mask-2%29%22%20id%3D%22Group%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20transform%3D%22translate%2827.000000%2C%2015.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M69.449%2C116.532%20L69.449%2C100.006%20C69.449%2C80.908%2053.823%2C65.282%2034.725%2C65.282%20L34.724%2C65.282%20C15.626%2C65.282%200%2C80.908%200%2C100.006%20L0%2C133.058%20L34.7245%2C133.058%20L69.449%2C133.058%20L69.449%2C116.532%20L69.449%2C116.532%20Z%22%20id%3D%22Fill-1%22%20fill%3D%22%23419FFE%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpolygon%20id%3D%22Fill-3%22%20fill%3D%22%23D8E2F5%22%20points%3D%2223.039%20133.058%2046.41%20133.058%2046.41%2069.378%2023.039%2069.378%22%3E%3C%2Fpolygon%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M36.4709%2C82.9664%20L36.4709%2C82.9664%20L35.3349%2C80.9994%20C35.0639%2C80.5294%2034.3849%2C80.5294%2034.1139%2C80.9994%20L31.4069%2C85.6884%20L30.7959%2C86.7464%20L30.7959%2C88.1804%20L30.7959%2C88.1804%20L30.7959%2C123.2934%20C30.7959%2C124.0854%2031.4379%2C124.7274%2032.2299%2C124.7274%20L37.2189%2C124.7274%20C38.0109%2C124.7274%2038.6529%2C124.0854%2038.6529%2C123.2934%20L38.6529%2C90.5244%20L38.6529%2C88.1804%20L38.6529%2C86.7464%20L38.6529%2C86.7464%20L36.4709%2C82.9664%20Z%22%20id%3D%22Fill-5%22%20fill%3D%22%23456296%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M34.7245%2C76.4383%20L34.7245%2C76.4383%20C17.1075%2C76.4383%202.6935%2C62.0243%202.6935%2C44.4083%20L2.6935%2C32.0303%20C2.6935%2C14.4133%2017.1075%2C0.0003%2034.7245%2C0.0003%20L34.7245%2C0.0003%20C52.3415%2C0.0003%2066.7555%2C14.4133%2066.7555%2C32.0303%20L66.7555%2C44.4083%20C66.7555%2C62.0243%2052.3415%2C76.4383%2034.7245%2C76.4383%22%20id%3D%22Fill-6%22%20fill%3D%22%23FACB94%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M23.0391%2C42.9643%20C22.0861%2C42.9643%2021.3131%2C42.1913%2021.3131%2C41.2383%20L21.3131%2C36.2373%20C21.3131%2C35.2843%2022.0861%2C34.5123%2023.0391%2C34.5123%20C23.9931%2C34.5123%2024.7651%2C35.2843%2024.7651%2C36.2373%20L24.7651%2C41.2383%20C24.7651%2C42.1913%2023.9931%2C42.9643%2023.0391%2C42.9643%22%20id%3D%22Fill-7%22%20fill%3D%22%23231F20%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M46.4091%2C42.9643%20C45.4551%2C42.9643%2044.6831%2C42.1913%2044.6831%2C41.2383%20L44.6831%2C36.2373%20C44.6831%2C35.2843%2045.4551%2C34.5123%2046.4091%2C34.5123%20C47.3641%2C34.5123%2048.1361%2C35.2843%2048.1361%2C36.2373%20L48.1361%2C41.2383%20C48.1361%2C42.1913%2047.3641%2C42.9643%2046.4091%2C42.9643%22%20id%3D%22Fill-8%22%20fill%3D%22%23231F20%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.7356%2C30.5067%20L2.7326%2C30.5067%20C3.5356%2C13.5907%2017.6186%2C-0.0003%2034.7246%2C-0.0003%20C51.8306%2C-0.0003%2065.9136%2C13.5907%2066.7156%2C30.5067%20L35.2526%2C30.5067%20L2.7356%2C30.5067%20Z%22%20id%3D%22Fill-9%22%20fill%3D%22%23182D54%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M42.9475%2C57.2694%20C42.9475%2C61.7214%2039.3385%2C65.3304%2034.8865%2C65.3304%20C30.4345%2C65.3304%2026.8255%2C61.7214%2026.8255%2C57.2694%20L42.9475%2C57.2694%20Z%22%20id%3D%22Fill-10%22%20fill%3D%22%23FAB075%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M10.6513%2C30.5071%20C10.6513%2C30.5071%2019.1471572%2C32.4999998%2023.0973001%2C32.4999998%20C27.4441572%2C32.4999998%2035.5423%2C30.5071%2035.5423%2C30.5071%20C28.6973%2C30.5051%2023.0973%2C24.9051%2023.0973%2C18.0591%20C23.0973%2C24.9051%2017.4973%2C30.5051%2010.6513%2C30.5071%20Z%22%20id%3D%22Fill-11%22%20fill%3D%22%23FACB94%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E"; var DEFAULT_AVATAR_F = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%22124px%22%20height%3D%22124px%22%20viewBox%3D%220%200%20124%20124%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%20%20%20%20%3Ctitle%3EGroup%205%3C%2Ftitle%3E%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%20%20%20%20%3Cdefs%3E%20%20%20%20%20%20%20%20%3Crect%20id%3D%22path-1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22124%22%20height%3D%22124%22%20rx%3D%2262%22%3E%3C%2Frect%3E%20%20%20%20%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22Components-Avatars%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28-1459.000000%2C%20-2238.000000%29%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-5%22%20transform%3D%22translate%281459.000000%2C%202238.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cmask%20id%3D%22mask-2%22%20fill%3D%22white%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fmask%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20id%3D%22Mask%22%20fill%3D%22%23FFB400%22%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20mask%3D%22url%28%23mask-2%29%22%20id%3D%22Group-2%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20transform%3D%22translate%2827.000000%2C%2013.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M69.0051%2C59.2468%20L0.4441%2C59.2468%20C1.3041%2C77.3738%2016.3951%2C91.9358%2034.7241%2C91.9358%20C53.0541%2C91.9358%2068.1451%2C77.3738%2069.0051%2C59.2468%22%20id%3D%22Fill-15%22%20fill%3D%22%23182D54%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M69.449%2C135.2409%20L69.449%2C102.1889%20C69.449%2C83.0909%2053.823%2C67.4649%2034.725%2C67.4649%20L34.724%2C67.4649%20C15.626%2C67.4649%200%2C83.0909%200%2C102.1889%20L0%2C135.2409%20L69.449%2C135.2409%20Z%22%20id%3D%22Fill-16%22%20fill%3D%22%23FFC333%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M43.0433%2C78.6213%20C43.0433%2C83.2153%2039.3193%2C86.9403%2034.7243%2C86.9403%20C30.1303%2C86.9403%2026.4053%2C83.2153%2026.4053%2C78.6213%20C26.4053%2C74.0273%2030.1303%2C70.3023%2034.7243%2C70.3023%20C39.3193%2C70.3023%2043.0433%2C74.0273%2043.0433%2C78.6213%22%20id%3D%22Fill-17%22%20fill%3D%22%23FFFFFF%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpolygon%20id%3D%22Fill-18%22%20fill%3D%22%23182D54%22%20points%3D%220.444%2059.247%2069.005%2059.247%2069.005%2032.69%200.444%2032.69%22%3E%3C%2Fpolygon%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M34.7245%2C78.6213%20L34.7245%2C78.6213%20C17.1075%2C78.6213%202.6935%2C64.2073%202.6935%2C46.5903%20L2.6935%2C34.2133%20C2.6935%2C16.5963%2017.1075%2C2.1833%2034.7245%2C2.1833%20L34.7245%2C2.1833%20C52.3415%2C2.1833%2066.7545%2C16.5963%2066.7545%2C34.2133%20L66.7545%2C46.5903%20C66.7545%2C64.2073%2052.3415%2C78.6213%2034.7245%2C78.6213%22%20id%3D%22Fill-19%22%20fill%3D%22%23FACB94%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M23.0391%2C45.6951%20C22.0861%2C45.6951%2021.3131%2C44.9221%2021.3131%2C43.9691%20L21.3131%2C38.9681%20C21.3131%2C38.0151%2022.0861%2C37.2431%2023.0391%2C37.2431%20C23.9931%2C37.2431%2024.7651%2C38.0151%2024.7651%2C38.9681%20L24.7651%2C43.9691%20C24.7651%2C44.9221%2023.9931%2C45.6951%2023.0391%2C45.6951%22%20id%3D%22Fill-20%22%20fill%3D%22%23231F20%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M46.4091%2C45.6951%20C45.4551%2C45.6951%2044.6831%2C44.9221%2044.6831%2C43.9691%20L44.6831%2C38.9681%20C44.6831%2C38.0151%2045.4551%2C37.2431%2046.4091%2C37.2431%20C47.3641%2C37.2431%2048.1361%2C38.0151%2048.1361%2C38.9681%20L48.1361%2C43.9691%20C48.1361%2C44.9221%2047.3641%2C45.6951%2046.4091%2C45.6951%22%20id%3D%22Fill-21%22%20fill%3D%22%23231F20%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M0.4439%2C32.6896%20L69.0049%2C32.6896%20C68.1449%2C14.5626%2053.0539%2C0.000599999999%2034.7249%2C0.000599999999%20C16.3949%2C0.000599999999%201.3039%2C14.5626%200.4439%2C32.6896%22%20id%3D%22Fill-22%22%20fill%3D%22%23633719%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M0.4439%2C32.6896%20L69.0049%2C32.6896%20C68.1449%2C14.5626%2053.0539%2C0.000599999999%2034.7249%2C0.000599999999%20C16.3949%2C0.000599999999%201.3039%2C14.5626%200.4439%2C32.6896%22%20id%3D%22Fill-23%22%20fill%3D%22%23182D54%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M36.1669%2C102.9104%20C36.1669%2C103.7074%2035.5209%2C104.3524%2034.7249%2C104.3524%20C33.9279%2C104.3524%2033.2819%2C103.7074%2033.2819%2C102.9104%20C33.2819%2C102.1134%2033.9279%2C101.4684%2034.7249%2C101.4684%20C35.5209%2C101.4684%2036.1669%2C102.1134%2036.1669%2C102.9104%22%20id%3D%22Fill-24%22%20fill%3D%22%23FFFFFF%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M36.1669%2C110.4241%20C36.1669%2C111.2211%2035.5209%2C111.8661%2034.7249%2C111.8661%20C33.9279%2C111.8661%2033.2819%2C111.2211%2033.2819%2C110.4241%20C33.2819%2C109.6271%2033.9279%2C108.9821%2034.7249%2C108.9821%20C35.5209%2C108.9821%2036.1669%2C109.6271%2036.1669%2C110.4241%22%20id%3D%22Fill-25%22%20fill%3D%22%23FFFFFF%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M42.9475%2C59.4524%20C42.9475%2C63.9044%2039.3385%2C67.5134%2034.8865%2C67.5134%20C30.4345%2C67.5134%2026.8255%2C63.9044%2026.8255%2C59.4524%20L42.9475%2C59.4524%20Z%22%20id%3D%22Fill-28%22%20fill%3D%22%23FAB075%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M20.7787%2C54.5959%20L14.3607%2C54.5959%20C13.2157%2C54.5959%2012.2787%2C53.6589%2012.2787%2C52.5139%20C12.2787%2C51.3689%2013.2157%2C50.4329%2014.3607%2C50.4329%20L20.7787%2C50.4329%20C21.9237%2C50.4329%2022.8607%2C51.3689%2022.8607%2C52.5139%20C22.8607%2C53.6589%2021.9237%2C54.5959%2020.7787%2C54.5959%22%20id%3D%22Fill-29%22%20fill%3D%22%23FAB094%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M55.0884%2C54.5959%20L48.6704%2C54.5959%20C47.5254%2C54.5959%2046.5884%2C53.6589%2046.5884%2C52.5139%20C46.5884%2C51.3689%2047.5254%2C50.4329%2048.6704%2C50.4329%20L55.0884%2C50.4329%20C56.2334%2C50.4329%2057.1704%2C51.3689%2057.1704%2C52.5139%20C57.1704%2C53.6589%2056.2334%2C54.5959%2055.0884%2C54.5959%22%20id%3D%22Fill-30%22%20fill%3D%22%23FAB094%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M16.5945%2C32.9975%20C16.5945%2C32.9975%2021.8972204%2C34.5000005%2024.7654995%2C34.5000005%20C27.3445537%2C34.5000005%2032.9365%2C32.9975%2032.9365%2C32.9975%20C28.4425%2C32.9965%2024.7655%2C29.3195%2024.7655%2C24.8255%20C24.7655%2C29.3195%2021.0885%2C32.9965%2016.5945%2C32.9975%20Z%22%20id%3D%22Fill-31%22%20fill%3D%22%23FACB94%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E"; var DEFAULT_AVATAR_M_O = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%22124px%22%20height%3D%22124px%22%20viewBox%3D%220%200%20124%20124%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%20%20%20%20%3Ctitle%3EGroup%207%3C%2Ftitle%3E%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%20%20%20%20%3Cdefs%3E%20%20%20%20%20%20%20%20%3Crect%20id%3D%22path-1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22124%22%20height%3D%22124%22%20rx%3D%2262%22%3E%3C%2Frect%3E%20%20%20%20%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22Components-Avatars%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28-1611.000000%2C%20-2071.000000%29%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-7%22%20transform%3D%22translate%281611.000000%2C%202071.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-4-Copy-2%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cmask%20id%3D%22mask-2%22%20fill%3D%22white%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fmask%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20id%3D%22Mask%22%20fill%3D%22%237189B6%22%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-4%22%20mask%3D%22url%28%23mask-2%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20transform%3D%22translate%2827.000000%2C%2015.000000%29%22%20id%3D%22Group%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M69.449%2C116.532%20L69.449%2C100.006%20C69.449%2C80.908%2053.823%2C65.282%2034.725%2C65.282%20L34.724%2C65.282%20C15.626%2C65.282%200%2C80.908%200%2C100.006%20L0%2C133.058%20L34.7245%2C133.058%20L69.449%2C133.058%20L69.449%2C116.532%20L69.449%2C116.532%20Z%22%20id%3D%22Fill-1%22%20fill%3D%22%2395ABD3%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpolygon%20id%3D%22Fill-3%22%20fill%3D%22%2395ABD3%22%20points%3D%2223.039%20133.058%2046.41%20133.058%2046.41%2069.378%2023.039%2069.378%22%3E%3C%2Fpolygon%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M36.4709%2C82.9664%20L36.4709%2C82.9664%20L35.3349%2C80.9994%20C35.0639%2C80.5294%2034.3849%2C80.5294%2034.1139%2C80.9994%20L31.4069%2C85.6884%20L30.7959%2C86.7464%20L30.7959%2C88.1804%20L30.7959%2C88.1804%20L30.7959%2C123.2934%20C30.7959%2C124.0854%2031.4379%2C124.7274%2032.2299%2C124.7274%20L37.2189%2C124.7274%20C38.0109%2C124.7274%2038.6529%2C124.0854%2038.6529%2C123.2934%20L38.6529%2C90.5244%20L38.6529%2C88.1804%20L38.6529%2C86.7464%20L38.6529%2C86.7464%20L36.4709%2C82.9664%20Z%22%20id%3D%22Fill-5%22%20fill%3D%22%2395ABD3%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M34.7245%2C76.4383%20L34.7245%2C76.4383%20C17.1075%2C76.4383%202.6935%2C62.0243%202.6935%2C44.4083%20L2.6935%2C32.0303%20C2.6935%2C14.4133%2017.1075%2C0.0003%2034.7245%2C0.0003%20L34.7245%2C0.0003%20C52.3415%2C0.0003%2066.7555%2C14.4133%2066.7555%2C32.0303%20L66.7555%2C44.4083%20C66.7555%2C62.0243%2052.3415%2C76.4383%2034.7245%2C76.4383%22%20id%3D%22Fill-6%22%20fill%3D%22%23D8E2F5%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M23.0391%2C42.9643%20C22.0861%2C42.9643%2021.3131%2C42.1913%2021.3131%2C41.2383%20L21.3131%2C36.2373%20C21.3131%2C35.2843%2022.0861%2C34.5123%2023.0391%2C34.5123%20C23.9931%2C34.5123%2024.7651%2C35.2843%2024.7651%2C36.2373%20L24.7651%2C41.2383%20C24.7651%2C42.1913%2023.9931%2C42.9643%2023.0391%2C42.9643%22%20id%3D%22Fill-7%22%20fill%3D%22%23D8E2F5%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M46.4091%2C42.9643%20C45.4551%2C42.9643%2044.6831%2C42.1913%2044.6831%2C41.2383%20L44.6831%2C36.2373%20C44.6831%2C35.2843%2045.4551%2C34.5123%2046.4091%2C34.5123%20C47.3641%2C34.5123%2048.1361%2C35.2843%2048.1361%2C36.2373%20L48.1361%2C41.2383%20C48.1361%2C42.1913%2047.3641%2C42.9643%2046.4091%2C42.9643%22%20id%3D%22Fill-8%22%20fill%3D%22%23D8E2F5%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.7356%2C30.5067%20L2.7326%2C30.5067%20C3.5356%2C13.5907%2017.6186%2C-0.0003%2034.7246%2C-0.0003%20C51.8306%2C-0.0003%2065.9136%2C13.5907%2066.7156%2C30.5067%20L35.2526%2C30.5067%20L2.7356%2C30.5067%20Z%22%20id%3D%22Fill-9%22%20fill%3D%22%2395ABD3%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M42.9475%2C57.2694%20C42.9475%2C61.7214%2039.3385%2C65.3304%2034.8865%2C65.3304%20C30.4345%2C65.3304%2026.8255%2C61.7214%2026.8255%2C57.2694%20L42.9475%2C57.2694%20Z%22%20id%3D%22Fill-10%22%20fill%3D%22%23D8E2F5%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M10.6513%2C30.5071%20C10.6513%2C30.5071%2019.1471572%2C32.4999998%2023.0973001%2C32.4999998%20C27.4441572%2C32.4999998%2035.5423%2C30.5071%2035.5423%2C30.5071%20C28.6973%2C30.5051%2023.0973%2C24.9051%2023.0973%2C18.0591%20C23.0973%2C24.9051%2017.4973%2C30.5051%2010.6513%2C30.5071%20Z%22%20id%3D%22Fill-11%22%20fill%3D%22%23D8E2F5%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E"; var DEFAULT_AVATAR_F_O = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20width%3D%22124px%22%20height%3D%22124px%22%20viewBox%3D%220%200%20124%20124%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%20%20%20%20%20%20%20%20%3Ctitle%3EGroup%207%20Copy%206%3C%2Ftitle%3E%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%20%20%20%20%3Cdefs%3E%20%20%20%20%20%20%20%20%3Crect%20id%3D%22path-1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22124%22%20height%3D%22124%22%20rx%3D%2262%22%3E%3C%2Frect%3E%20%20%20%20%3C%2Fdefs%3E%20%20%20%20%3Cg%20id%3D%22Components-Avatars%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28-1611.000000%2C%20-2238.000000%29%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-7-Copy-6%22%20transform%3D%22translate%281611.000000%2C%202238.000000%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-4-Copy-2%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cmask%20id%3D%22mask-2%22%20fill%3D%22white%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fmask%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cuse%20id%3D%22Mask%22%20fill%3D%22%23456296%22%20xlink%3Ahref%3D%22%23path-1%22%3E%3C%2Fuse%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20id%3D%22Group-4%22%20mask%3D%22url%28%23mask-2%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20transform%3D%22translate%2827.000000%2C%2015.000000%29%22%20id%3D%22Group%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cg%20fill%3D%22%2395ABD3%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M16.3294668%2C70.5902531%20C8.09643428%2C64.778548%202.6935%2C55.1935418%202.6935%2C44.4083%20L2.6935%2C32.0303%20C2.6935%2C14.4133%2017.1075%2C0.000300000002%2034.7245%2C0.000300000002%20C52.3415%2C0.000300000002%2066.7555%2C14.4133%2066.7555%2C32.0303%20L66.7555%2C44.4083%20C66.7555%2C55.1935418%2061.3525657%2C64.778548%2053.1195332%2C70.5902531%20C62.9088404%2C76.7483065%2069.449%2C87.6505618%2069.449%2C100.006%20L69.449%2C116.532%20L69.449%2C133.058%20L34.7245%2C133.058%20L0%2C133.058%20L0%2C100.006%20C0%2C87.6505618%206.54015956%2C76.7483065%2016.3294625%2C70.59025%20Z%22%20id%3D%22Combined-Shape%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpolygon%20id%3D%22Fill-3%22%20points%3D%2223.039%20133.058%2046.41%20133.058%2046.41%2069.378%2023.039%2069.378%22%3E%3C%2Fpolygon%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M23.0391%2C42.9643%20C22.0861%2C42.9643%2021.3131%2C42.1913%2021.3131%2C41.2383%20L21.3131%2C36.2373%20C21.3131%2C35.2843%2022.0861%2C34.5123%2023.0391%2C34.5123%20C23.9931%2C34.5123%2024.7651%2C35.2843%2024.7651%2C36.2373%20L24.7651%2C41.2383%20C24.7651%2C42.1913%2023.9931%2C42.9643%2023.0391%2C42.9643%22%20id%3D%22Fill-7%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M46.4091%2C42.9643%20C45.4551%2C42.9643%2044.6831%2C42.1913%2044.6831%2C41.2383%20L44.6831%2C36.2373%20C44.6831%2C35.2843%2045.4551%2C34.5123%2046.4091%2C34.5123%20C47.3641%2C34.5123%2048.1361%2C35.2843%2048.1361%2C36.2373%20L48.1361%2C41.2383%20C48.1361%2C42.1913%2047.3641%2C42.9643%2046.4091%2C42.9643%22%20id%3D%22Fill-8%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.7356%2C30.5067%20L2.7326%2C30.5067%20C3.5356%2C13.5907%2017.6186%2C-0.0003%2034.7246%2C-0.0003%20C51.8306%2C-0.0003%2065.9136%2C13.5907%2066.7156%2C30.5067%20L35.2526%2C30.5067%20L2.7356%2C30.5067%20Z%22%20id%3D%22Fill-9%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M42.9475%2C57.2694%20C42.9475%2C61.7214%2039.3385%2C65.3304%2034.8865%2C65.3304%20C30.4345%2C65.3304%2026.8255%2C61.7214%2026.8255%2C57.2694%20L42.9475%2C57.2694%20Z%22%20id%3D%22Fill-10%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M10.6513%2C30.5071%20C10.6513%2C30.5071%2019.1471572%2C32.4999998%2023.0973001%2C32.4999998%20C27.4441572%2C32.4999998%2035.5423%2C30.5071%2035.5423%2C30.5071%20C28.6973%2C30.5051%2023.0973%2C24.9051%2023.0973%2C18.0591%20C23.0973%2C24.9051%2017.4973%2C30.5051%2010.6513%2C30.5071%20Z%22%20id%3D%22Fill-11%22%3E%3C%2Fpath%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E"; var _extends = Object.assign || 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; }; function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } var Root$1 = styled__default.div.withConfig({ displayName: 'Avatar__Root' })(['position:relative;display:inline-block;']); var Image = styled__default.img.withConfig({ displayName: 'Avatar__Image' })(['width:', ';height:', ';border-radius:', ';background-color:', ';box-sizing:border-box;'], function (_ref) { var size = _ref.size; return avatarSizes[size].size; }, function (_ref2) { var size = _ref2.size; return avatarSizes[size].size; }, function (_ref3) { var size = _ref3.size, round = _ref3.round; return round ? '50%' : avatarSizes[size].borderRadius; }, function (_ref4) { var theme = _ref4.theme; return theme.grey200; }); /** * @render react * @name Avatar * @description Vital UI Kit Avatar Component * @example * <Avatar * badge="99+" * size="large" * gender="male" * round * /> */ var Avatar = function Avatar(_ref5) { var src = _ref5.src, round = _ref5.round, size = _ref5.size, badge = _ref5.badge, outline = _ref5.outline, gender = _ref5.gender, containerStyle = _ref5.containerStyle, imageStyle = _ref5.imageStyle, badgeStyle = _ref5.badgeStyle, props = _objectWithoutProperties(_ref5, ['src', 'round', 'size', 'badge', 'outline', 'gender', 'containerStyle', 'imageStyle', 'badgeStyle']); var renderBadge = function renderBadge() { if (!badge) { return null; } return React__default.createElement(AvatarBadge, { label: badge, size: size, round: round, style: badgeStyle }); }; var renderDefaultAvatar = function renderDefaultAvatar() { if (src) { return src; } if (outline && gender) { if (gender === 'female') return DEFAULT_AVATAR_F_O; if (gender === 'male') return DEFAULT_AVATAR_M_O; return DEFAULT_AVATAR_OUTLINE; } if (!outline && gender) { if (gender === 'female') return DEFAULT_AVATAR_F; if (gender === 'male') return DEFAULT_AVATAR_M; return DEFAULT_AVATAR; } if (outline && !gender) { return DEFAULT_AVATAR_OUTLINE; } return DEFAULT_AVATAR; }; return React__default.createElement( Root$1, _extends({ style: containerStyle }, props), React__default.createElement(Image, _extends({ src: renderDefaultAvatar(), size: size, round: round, style: imageStyle }, props)), renderBadge() ); }; Avatar.defaultProps = { badge: null, src: null, gender: undefined, round: false, size: 'medium', outline: false, imageStyle: null, containerStyle: null, badgeStyle: null }; var _extends$1 = Object.assign || 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; }; function _objectWithoutProperties$1(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } var Root$2 = styled__default.div.withConfig({ displayName: 'ButtonGroup__Root' })(['> button:not(:last-child){margin-right:', ';}> button{display:inline-block;}'], function (_ref) { var vertical = _ref.vertical, marginHorizontal = _ref.marginHorizontal; return vertical ? 0 : marginHorizontal; }); var ButtonGroup = function ButtonGroup(_ref2) { var children = _ref2.children, marginHorizontal = _ref2.marginHorizontal, props = _objectWithoutProperties$1(_ref2, ['children', 'marginHorizontal']); return React.createElement( Root$2, _extends$1({}, props, { marginHorizontal: marginHorizontal }), children ); }; ButtonGroup.defaultProps = { marginHorizontal: '5px', style: null }; var size = { xsmall: { fontSize: '0.8rem', borderRadius: '2px', padding: 'calc(0.2rem - 1px) 0.533rem', height: '1.2rem' }, small: { fontSize: '0.866rem', borderRadius: '3px', padding: 'calc(0.4rem - 1px) 0.8rem', height: '1.666rem' }, medium: { fontSize: '1rem', borderRadius: '4px', padding: 'calc(0.533rem - 1px) 1.066rem', height: '2.066rem' }, large: { fontSize: '1.2rem', borderRadius: '5px', padding: 'calc(0.666rem - 1px) 1.2rem', height: '2.532rem' }, xlarge: { fontSize: '1.4rem', borderRadius: '6px', padding: 'calc(0.8rem - 1px) 1.333rem', height: '3rem' } }; var natureColor = function natureColor(colors) { return { default: colors.secondary700, primary: colors.primary, success: colors.success, info: colors.info, alarm: colors.alarm, warning: colors.warning }; }; var ButtonElement = styled__default.button.withConfig({ displayName: 'styled__ButtonElement' })(['position:relative;background:', ';color:', ';cursor:pointer;border-width:1px;border-style:solid;border-color:', ';font-size:', ';border-radius:', ';padding:', ';line-height:1;font-weight:normal;margin:0;outline:none;padding:', ';box-sizing:border-box;vertical-align:middle;text-align:center;text-decoration:none;&:hover{background:', ';}&:active{background:', ';}', ';', ';', ' ', ' ', ' ', ' ', ' &[disabled]{color:', ';border-color:', ';background-color:', ';cursor:not-allowed;pointer-events:none;}'], function (_ref) { var theme = _ref.theme; return theme.button.default.bg; }, function (_ref2) { var theme = _ref2.theme, nature = _ref2.nature; return natureColor(theme)[nature]; }, function (_ref3) { var theme = _ref3.theme; return theme.borderColor; }, function (_ref4) { var size$$1 = _ref4.size; return size[size$$1].fontSize; }, function (_ref5) { var size$$1 = _ref5.size; return size[size$$1].borderRadius; }, function (_ref6) { var size$$1 = _ref6.size; return size[size$$1].padding; }, function (_ref7) { var size$$1 = _ref7.size; return size[size$$1].padding; }, function (_ref8) { var theme = _ref8.theme; return theme.button.default.hoverBg; }, function (_ref9) { var theme = _ref9.theme; return theme.button.default.activeBg; }, function (_ref10) { var subtle = _ref10.subtle, selected = _ref10.selected, theme = _ref10.theme, nature = _ref10.nature; return subtle && styled.css(['background:', ';color:', ';border:1px solid transparent;&:hover{background:', ';}'], selected ? theme.button.subtle.bg : 'transparent', nature === 'default' ? theme.button.subtle.color : natureColor(theme)[nature], theme.button.subtle.hoverBg); }, function (_ref11) { var flat = _ref11.flat, nature = _ref11.nature, theme = _ref11.theme; return flat && styled.css(['background:', ';color:', ';border-color:', ';&:hover{background:', ';border-color:', ';}&:active{background:', ';border-color:', ';}'], nature === 'default' ? theme.button.flat.bg : natureColor(theme)[nature], nature === 'default' ? natureColor(theme).default : theme.button.flat.color, nature === 'default' ? theme.button.flat.bg : natureColor(theme)[nature], nature === 'default' ? theme.button.flat.hoverBg : polished.lighten(0.1, natureColor(theme)[nature]), nature === 'default' ? theme.borderColor : polished.lighten(0.1, natureColor(theme)[nature]), nature === 'default' ? theme.button.flat.activeBg : polished.darken(0.12, natureColor(theme)[nature]), nature === 'default' ? theme.button.flat.activeBorderColor : polished.darken(0.12, natureColor(theme)[nature])); }, function (_ref12) { var light = _ref12.light, theme = _ref12.theme, nature = _ref12.nature; return light && styled.css(['background:', ';color:', ';&:hover{background:', ';}'], theme.button.light.bg, natureColor(theme)[nature], theme.button.light.hoverBg); }, function (_ref13) { var link = _ref13.link, theme = _ref13.theme; return link && styled.css(['background:', ';color:', ';border:1px solid transparent;&:hover{background:', ';color:', ';}'], theme.button.link.bg, theme.button.link.color, theme.button.link.hoverBg, theme.button.link.hoverColor); }, function (_ref14) { var link = _ref14.link, dark = _ref14.dark, theme = _ref14.theme; return link && dark && styled.css(['color:', ';&:hover{color:', ';}'], theme.button.link.darkColor, theme.button.link.hoverDarkColor); }, function (_ref15) { var underline = _ref15.underline; return underline && styled.css(['&:hover{text-decoration:underline;}']); }, function (_ref16) { var circle = _ref16.circle; return circle && styled.css(['display:flex;justify-content:center;align-items:center;padding:0;border-radius:100%;width:2.066rem;line-height:2.066rem;height:2.066rem;']); }, function (_ref17) { var theme = _ref17.theme; return theme.button.disabled.color; }, function (_ref18) { var theme = _ref18.theme; return theme.button.disabled.borderColor; }, function (_ref19) { var theme = _ref19.theme; return theme.button.disabled.bg; }); // // color palette var primary100 = '#D9ECFF'; var primary200 = '#A6D2FF'; var primary300 = '#73B9FE'; var primary400 = '#419FFE'; var primary500 = '#0E86FE'; var primary600 = '#016DD8'; var primary700 = '#0153A5'; var primary800 = '#003A73'; var primary900 = '#002040'; var secondary100 = '#F7F9FE'; var secondary200 = '#EEF2FC'; var secondary300 = '#D8E3F6'; var secondary400 = '#C4D2EB'; var secondary500 = '#95ACD4'; var secondary600 = '#7189B6'; var secondary700 = '#456297'; var secondary800 = '#2A487F'; var secondary900 = '#1E3768'; var grey100 = '#F8F8F8'; var grey200 = '#F0F0F0'; var grey300 = '#dddddd'; var grey400 = '#cccccc'; var grey500 = '#aaaaaa'; var grey600 = '#888888'; var grey700 = '#555555'; var grey800 = '#333333'; var grey900 = '#0D0D0D'; // default color var white = '#ffffff'; var primary = primary500; var secondary = secondary500; var info = '#00C3FF'; var success = '#2BCD86'; var alarm = '#EB5000'; var warning = '#FFB400'; var defaultTransition = 'all 120ms ease-out'; // ----- break point ----- // var bp = { desktop: '1440px', padLand: '1024px', padMiddle: ' 800px', padPortrait: ' 768px', phoneLand: ' 667px', phoneMiddle: ' 480px', phonePortrait: ' 320px' }; var defaultTheme = /*#__PURE__*/Object.freeze({ primary100: primary100, primary200: primary200, primary300: primary300, primary400: primary400, primary500: primary500, primary600: primary600, primary700: primary700, primary800: primary800, primary900: primary900, secondary100: secondary100, secondary200: secondary200, secondary300: secondary300, secondary400: secondary400, secondary500: secondary500, secondary600: secondary600, secondary700: secondary700, secondary800: secondary800, secondary900: secondary900, grey100: grey100, grey200: grey200, grey300: grey300, grey400: grey400, grey500: grey500, grey600: grey600, grey700: grey700, grey800: grey800, grey900: grey900, white: white, primary: primary, secondary: secondary, info: info, success: success, alarm: alarm, warning: warning, defaultTransition: defaultTransition, bp: bp }); var _extends$2 = Object.assign || 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; }; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); function _objectWithoutProperties$2(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** * @render react * @name Button * @description Button component with group * @example * <Button.Group> * <Button nature="default" size="xlarge">Default</Button> * <Button nature="primary" size="large">Default</Button> * <Button nature="success" size="medium">Default</Button> * <Button nature="info" size="small">Default</Button> * <Button nature="alarm" size="xsmall">Default</Button> * <Button nature="warning">Default</Button> * <Button flat>Default</Button> * <Button subtle>Default</Button> * <Button light>Default</Button> * <Button link>Default</Button> * </Button.Group> */ var Button = function (_React$Component) { _inherits(Button, _React$Component); function Button() { _classCallCheck(this, Button); return _possibleConstructorReturn(this, (Button.__proto__ || Object.getPrototypeOf(Button)).apply(this, arguments)); } _createClass(Button, [{ key: 'render', value: function render() { var _props = this.props, children = _props.children, onClick = _props.onClick, props = _objectWithoutProperties$2(_props, ['children', 'onClick']); return React.createElement( ButtonElement, _extends$2({ onClick: onClick }, props), children ); } }]); return Button; }(React.Component); Button.defaultProps = { children: '', nature: 'default', theme: defaultTheme, size: 'medium', circle: false, light: false, flat: false, link: false, subtle: false, selected: false, onClick: function onClick() {}, style: null }; Button.Group = ButtonGroup; var Button$1 = styled.withTheme(Button); var _extends$3 = Object.assign || 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; }; var primaryPaletteGenerator = function primaryPaletteGenerator(color) { return { primary100: polished.lighten(0.4, color), primary200: polished.lighten(0.3, color), primary300: polished.lighten(0.2, color), primary400: polished.lighten(0.1, color), primary500: color, primary600: polished.darken(0.1, color), primary700: polished.darken(0.2, color), primary800: polished.darken(0.3, color), primary900: polished.darken(0.4, color), primary: color }; }; var secondaryPaletteGenerator = function secondaryPaletteGenerator(hue) { return { secondary100: polished.toColorString({ hue: hue, saturation: 280.0000000000002 / 360, lightness: 353.64705882352945 / 360 }), secondary200: polished.toColorString({ hue: hue, saturation: 252.0000000000003 / 360, lightness: 345.88235294117646 / 360 }), secondary300: polished.toColorString({ hue: hue, saturation: 225.0000000000002 / 360, lightness: 326.11764705882354 / 360 }), secondary400: polished.toColorString({ hue: hue, saturation: 177.72151898734157 / 360, lightness: 304.2352941176471 / 360 }), secondary500: polished.toColorString({ hue: hue, saturation: 152.214765100671