'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } var rxjs = require('rxjs'); var lodash = require('lodash'); var grid = require('@rebass/grid'); var polished = require('polished'); var classNames = _interopDefault(require('classnames')); var React = require('react'); var styled = require('styled-components'); var styled__default = _interopDefault(styled); /*! ***************************************************************************** Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */ /* global Reflect, Promise */ var extendStatics = function(d, b) { extendStatics = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; return extendStatics(d, b); }; function __extends(d, b) { extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); } var __assign = function() { __assign = Object.assign || function __assign(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; function __rest(s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0) t[p[i]] = s[p[i]]; return t; } function __makeTemplateObject(cooked, raw) { if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; } return cooked; } var colors = { neutrals: { charcoal: { base: '#323232', light: '#595959', dark: '#000000', }, ash: { base: '#A6A6A6', light: '#D3D3D3', dark: '#808080', }, silver: { base: '#F1F1F1', light: '#FAFAFA', dark: '#E7E7E7', }, lavenderWhispers: { base: '#F7F5FC', light: '#FBFAFF', dark: '#F1EEFA', }, white: { base: '#FFFFFF', }, }, main: { grapePurchase: { base: '#602D6C', light: '#91609C', dark: '#4B2354', }, rx: { base: '#F23466', light: '#FF6B9C', dark: '#CC2D52', }, genie: { base: '#4C18F3', light: '#7855D9', dark: '#42199A', }, }, accent: { savvyCyan: { base: '#0998D6', light: '#66CCFF', dark: '#0074A6', }, tealBreaker: { base: '#00CCCD', light: '#00E0D1', dark: '#00BDBD', }, }, secondary: { dealEnvy: { base: '#14A382', light: '#00CDAD', dark: '#268068', }, flashPink: { base: '#DF206C', light: '#E665A1', dark: '#B81D5B', }, cyberMango: { base: '#EB663D', light: '#FA9F5A', dark: '#C74E30', }, goldMine: { base: '#F5A623', light: '#FFC761', dark: '#CC861D', }, fireSale: { base: '#EA4545', light: '#F16667', dark: '#CC3B3B', }, }, alert: { error: { base: '#CC3B3B', }, success: { base: '#268068', }, }, rx: { purple: { base: '#A678B5', }, }, }; var baseFontSize = 16; var variables = { baseFontSize: 16, fontFamily: 'Avenir Next, Segoe UI, Helvetica, Roboto, sans-serif', borderRadius: baseFontSize / 4 + "px", }; // VARIABLES var baseFontSize$1 = variables.baseFontSize, fontFamily = variables.fontFamily; var fonts = { baseFontSize: baseFontSize$1, fontFamily: fontFamily, paragraph: { base: { fontSize: baseFontSize$1 + "px", lineHeight: baseFontSize$1 * 1.5 + "px", fontWeight: 'normal', }, informational: { fontSize: baseFontSize$1 * 0.875 + "px", lineHeight: baseFontSize$1 * 1.125 + "px", fontWeight: 'normal', }, }, navigation: { base: { fontSize: baseFontSize$1 * .75 + "px", lineHeight: baseFontSize$1 + "px", fontWeight: '500', }, menu: { fontSize: baseFontSize$1 * .875 + "px", lineHeight: baseFontSize$1 + "px", small: { base: { fontSize: baseFontSize$1 * 0.75 + "px", fontWeight: '500', }, active: { fontWeight: '700', }, }, large: { base: { fontWeight: '600', }, active: { fontWeight: '700', }, }, }, }, heading: { h4: { fontSize: baseFontSize$1 * 1.5 + "px", lineHeight: baseFontSize$1 * 2 + "px", fontWeight: 'normal', }, h3: { fontSize: baseFontSize$1 * 1.75 + "px", lineHeight: baseFontSize$1 * 2 + "px", fontWeight: 'normal', }, h2: { fontSize: baseFontSize$1 * 2 + "px", lineHeight: baseFontSize$1 * 2.5 + "px", fontWeight: 'normal', }, h1: { fontSize: baseFontSize$1 * 2.25 + "px", lineHeight: baseFontSize$1 * 2.5 + "px", fontWeight: 'normal', }, }, typography: { caption: { fontSize: baseFontSize$1 * 0.75 + "px", lineHeight: baseFontSize$1 + "px", fontWeight: '500', }, ui: { fontSize: baseFontSize$1 * 0.875 + "px", lineHeight: baseFontSize$1 * 1.125 + "px", fontWeight: 'normal', }, body: { fontSize: baseFontSize$1 + "px", lineHeight: baseFontSize$1 * 1.5 + "px", fontWeight: 'normal', }, subHeading: { fontSize: baseFontSize$1 * 1.125 + "px", lineHeight: baseFontSize$1 * 1.5 + "px", fontWeight: 'normal', }, subHeadingLarge: { fontSize: baseFontSize$1 * 1.25 + "px", lineHeight: baseFontSize$1 * 1.5 + "px", fontWeight: 'normal', }, header: { small: { fontSize: baseFontSize$1 * 1.5 + "px", lineHeight: baseFontSize$1 * 2 + "px", fontWeight: 'normal', }, medium: { fontSize: baseFontSize$1 * 1.75 + "px", lineHeight: baseFontSize$1 * 2 + "px", fontWeight: 'normal', }, large: { fontSize: baseFontSize$1 * 2 + "px", lineHeight: baseFontSize$1 * 2.5 + "px", fontWeight: 'normal', }, extraLarge: { fontSize: baseFontSize$1 * 2.25 + "px", lineHeight: baseFontSize$1 * 2.5 + "px", fontWeight: 'normal', }, }, display: { small: { fontSize: baseFontSize$1 * 2.5 + "px", lineHeight: baseFontSize$1 * 3 + "px", fontWeight: 'normal', }, medium: { fontSize: baseFontSize$1 * 3 + "px", lineHeight: baseFontSize$1 * 3.25 + "px", fontWeight: 'normal', }, large: { fontSize: baseFontSize$1 * 3.5 + "px", lineHeight: baseFontSize$1 * 4 + "px", fontWeight: 'normal', }, extraLarge: { fontSize: baseFontSize$1 * 4 + "px", lineHeight: baseFontSize$1 * 4.5 + "px", fontWeight: 'normal', }, }, }, }; var base = variables.baseFontSize; var sizes = { xs: base / 4 + "px", sm: base / 2 + "px", md: base * 1 + "px", lg: base * 2 + "px", xl: base * 3 + "px", }; var sizes$1 = { padding: __assign({}, sizes), margin: __assign({}, sizes), border: { radius: { base: '3px', }, width: { base: '1px', }, style: { base: 'solid', }, }, }; var headingRules = function (hLevel) { return "\n " + hLevel + " {\n font-weight: " + fonts.heading["" + hLevel].fontWeight + ";\n line-height: " + fonts.heading["" + hLevel].lineHeight + ";\n font-size: " + fonts.heading["" + hLevel].fontSize + ";\n }\n"; }; var typography = styled.css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n\n p {\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n font-weight: ", ";\n }\n\n a {\n text-decoration: none;\n color: ", ";\n }\n"], ["\n ", "\n\n p {\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n font-weight: ", ";\n }\n\n a {\n text-decoration: none;\n color: ", ";\n }\n"])), Object.keys(fonts.heading).slice().map(headingRules), fonts.fontFamily, fonts.paragraph.base.fontSize, fonts.paragraph.base.lineHeight, fonts.paragraph.base.fontWeight, colors.accent.savvyCyan.dark); var GlobalCSS$$1 = styled.createGlobalStyle(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n html {\n color: ", ";\n font-size: ", "px;\n letter-spacing: 0;\n line-height: 1.357142857rem;\n }\n\n body {\n font-family: Avenir Next, Segoe UI, Helvetica, Roboto, sans-serif;\n height: 100vh;\n }\n\n ", "\n"], ["\n html {\n color: ", ";\n font-size: ", "px;\n letter-spacing: 0;\n line-height: 1.357142857rem;\n }\n\n body {\n font-family: Avenir Next, Segoe UI, Helvetica, Roboto, sans-serif;\n height: 100vh;\n }\n\n ", "\n"])), colors.neutrals.charcoal.base, fonts.baseFontSize, typography); var templateObject_1, templateObject_2; var NormalizeCSS = styled.createGlobalStyle(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n html {\n line-height: 1.15;\n -webkit-text-size-adjust: 100%;\n }\n\n body {\n margin: 0;\n }\n\n main {\n display: block;\n }\n\n hr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n }\n\n pre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n }\n\n a {\n background-color: transparent;\n }\n\n abbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n text-decoration: underline dotted; /* 2 */\n }\n\n b,\n strong {\n font-weight: bolder;\n }\n\n code,\n kbd,\n samp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n }\n\n small {\n font-size: 80%;\n }\n sub,\n sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n\n sub {\n bottom: -0.25em;\n }\n\n sup {\n top: -0.5em;\n }\n\n img {\n border-style: none;\n }\n button,\n input,\n optgroup,\n select,\n textarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n line-height: 1.15; /* 1 */\n margin: 0; /* 2 */\n }\n\n\n button,\n input { /* 1 */\n overflow: visible;\n }\n\n button,\n select { /* 1 */\n text-transform: none;\n }\n\n\n button,\n [type=\"button\"],\n [type=\"reset\"],\n [type=\"submit\"] {\n -webkit-appearance: button;\n }\n\n button::-moz-focus-inner,\n [type=\"button\"]::-moz-focus-inner,\n [type=\"reset\"]::-moz-focus-inner,\n [type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n }\n\n button:-moz-focusring,\n [type=\"button\"]:-moz-focusring,\n [type=\"reset\"]:-moz-focusring,\n [type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n }\n\n fieldset {\n padding: 0.35em 0.75em 0.625em;\n }\n\n legend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n }\n\n progress {\n vertical-align: baseline;\n }\n\n textarea {\n overflow: auto;\n }\n\n [type=\"checkbox\"],\n [type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n }\n\n [type=\"number\"]::-webkit-inner-spin-button,\n [type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n }\n\n\n [type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n }\n\n [type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n }\n\n details {\n display: block;\n }\n\n summary {\n display: list-item;\n }\n\n template {\n display: none;\n }\n\n /**\n * Add the correct display in IE 10.\n */\n\n [hidden] {\n display: none;\n }\n"], ["\n html {\n line-height: 1.15;\n -webkit-text-size-adjust: 100%;\n }\n\n body {\n margin: 0;\n }\n\n main {\n display: block;\n }\n\n hr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n }\n\n pre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n }\n\n a {\n background-color: transparent;\n }\n\n abbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n text-decoration: underline dotted; /* 2 */\n }\n\n b,\n strong {\n font-weight: bolder;\n }\n\n code,\n kbd,\n samp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n }\n\n small {\n font-size: 80%;\n }\n sub,\n sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n\n sub {\n bottom: -0.25em;\n }\n\n sup {\n top: -0.5em;\n }\n\n img {\n border-style: none;\n }\n button,\n input,\n optgroup,\n select,\n textarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n line-height: 1.15; /* 1 */\n margin: 0; /* 2 */\n }\n\n\n button,\n input { /* 1 */\n overflow: visible;\n }\n\n button,\n select { /* 1 */\n text-transform: none;\n }\n\n\n button,\n [type=\"button\"],\n [type=\"reset\"],\n [type=\"submit\"] {\n -webkit-appearance: button;\n }\n\n button::-moz-focus-inner,\n [type=\"button\"]::-moz-focus-inner,\n [type=\"reset\"]::-moz-focus-inner,\n [type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n }\n\n button:-moz-focusring,\n [type=\"button\"]:-moz-focusring,\n [type=\"reset\"]:-moz-focusring,\n [type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n }\n\n fieldset {\n padding: 0.35em 0.75em 0.625em;\n }\n\n legend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n }\n\n progress {\n vertical-align: baseline;\n }\n\n textarea {\n overflow: auto;\n }\n\n [type=\"checkbox\"],\n [type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n }\n\n [type=\"number\"]::-webkit-inner-spin-button,\n [type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n }\n\n\n [type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n }\n\n [type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n }\n\n details {\n display: block;\n }\n\n summary {\n display: list-item;\n }\n\n template {\n display: none;\n }\n\n /**\n * Add the correct display in IE 10.\n */\n\n [hidden] {\n display: none;\n }\n"]))); var templateObject_1$1; /* tslint:disable max-line-length */ var DefaultAvatar = function () { return (React.createElement("svg", { width: "36px", height: "36px", viewBox: "0 0 22 22", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, React.createElement("g", { id: "Page-1", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("path", { d: "M22,20.4267753 C22,21.2958994 21.296,22 20.4285714,22 L1.57142857,22 C0.704,22 0,21.2958994 0,20.4267753 L0,18.950993 C0,15.4242035 2.805,12.5590799 6.25428571,12.5590799 L6.292,12.5590799 L6.292,12.5575082 C7.60728571,13.550793 9.22585714,14.162166 11,14.162166 C12.7741429,14.162166 14.3927143,13.550793 15.708,12.5575082 L15.708,12.5590799 L15.7457143,12.5590799 C19.195,12.5590799 22,15.4242035 22,18.950993 L22,20.4267753 Z M11,0 C14.4712857,0 17.2857143,2.817974 17.2857143,6.29447064 C17.2857143,9.77096728 14.4712857,12.5889413 11,12.5889413 C7.52871429,12.5889413 4.71428571,9.77096728 4.71428571,6.29447064 C4.71428571,2.817974 7.52871429,0 11,0 Z", id: "Combined-Shape", fill: "#A6A6A6" })))); }; /* tslint:enable max-line-length */ var StyledAvatar = styled__default.div(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n border: solid 0.1875rem ", ";\n display: flex;\n justify-content: center;\n align-items: center;\n height: 2rem;\n width: 2rem;\n border-radius: 50%;\n\n .inner-border {\n flex: 0 0 1.625rem;\n width: 1.625rem;\n height: 1.625rem;\n font-family: ", ";\n font-size: .75rem;\n background-color: ", ";\n color: ", ";\n font-weight: bold;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n overflow: hidden;\n }\n\n svg {\n justify-self: baseline;\n height: 1.5rem;\n margin-bottom: -0.375rem;\n }\n"], ["\n border: solid 0.1875rem ", ";\n display: flex;\n justify-content: center;\n align-items: center;\n height: 2rem;\n width: 2rem;\n border-radius: 50%;\n\n .inner-border {\n flex: 0 0 1.625rem;\n width: 1.625rem;\n height: 1.625rem;\n font-family: ", ";\n font-size: .75rem;\n background-color: ", ";\n color: ", ";\n font-weight: bold;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n overflow: hidden;\n }\n\n svg {\n justify-self: baseline;\n height: 1.5rem;\n margin-bottom: -0.375rem;\n }\n"])), polished.rgba(colors.neutrals.white.base, .4), fonts.fontFamily, colors.neutrals.silver.base, colors.neutrals.charcoal.light); var DefaultProps = {}; var Avatar = function (_a) { if (_a === void 0) { _a = DefaultProps; } var className = _a.className, src = _a.src, label = _a.label, props = __rest(_a, ["className", "src", "label"]); return (React.createElement(StyledAvatar, __assign({ className: classNames(className) }, props), React.createElement("div", { className: "inner-border" }, label ? label.substr(0, 2).toUpperCase() : React.createElement(DefaultAvatar, null)))); }; Avatar.defaultProps = DefaultProps; var templateObject_1$2; var StyledList = styled__default.div(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n .title {\n margin: 0;\n padding: ", ";\n font-family: ", ";\n font-size: .75rem;\n font-weight: 600;\n color: ", ";\n line-height: .75rem;\n }\n"], ["\n .title {\n margin: 0;\n padding: ", ";\n font-family: ", ";\n font-size: .75rem;\n font-weight: 600;\n color: ", ";\n line-height: .75rem;\n }\n"])), sizes$1.padding.md, fonts.fontFamily, colors.neutrals.ash.dark); var DefaultProps$1 = {}; var List = function (_a) { if (_a === void 0) { _a = DefaultProps$1; } var className = _a.className, children = _a.children, title = _a.title, props = __rest(_a, ["className", "children", "title"]); return (React.createElement(StyledList, __assign({ className: classNames(className) }, props), title && React.createElement("p", { className: "title" }, title), children)); }; List.defaultProps = DefaultProps$1; var templateObject_1$3; var StyledItem = styled__default.a(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n display: flex;\n border-radius: ", ";\n padding: ", " ", ";\n cursor: pointer;\n color: ", ";\n font-family: ", ";\n font-weight: normal;\n text-decoration: none;\n line-height: 1.5rem;\n transition: background-color 500ms;\n\n &:hover {\n background-color: rgba(0, 0, 0, .05);\n }\n"], ["\n display: flex;\n border-radius: ", ";\n padding: ", " ", ";\n cursor: pointer;\n color: ", ";\n font-family: ", ";\n font-weight: normal;\n text-decoration: none;\n line-height: 1.5rem;\n transition: background-color 500ms;\n\n &:hover {\n background-color: rgba(0, 0, 0, .05);\n }\n"])), variables.borderRadius, sizes$1.padding.sm, sizes$1.padding.md, colors.neutrals.charcoal.base, fonts.fontFamily); var DefaultProps$2 = {}; var Item = function (_a) { if (_a === void 0) { _a = DefaultProps$2; } var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]); return (React.createElement(StyledItem, __assign({ className: classNames(className) }, props), children)); }; Item.defaultProps = DefaultProps$2; var templateObject_1$4; var StyledAutoComplete = styled__default.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n position: relative;\n border: solid 1px ", ";\n border-radius: .25rem;\n transition: border-color 500ms;\n display: flex;\n background: ", ";\n align-items: center;\n\n &:hover {\n border: solid thin ", ";\n }\n\n &:active,\n &:focus {\n border: solid thin ", ";\n }\n\n .auto-complete-input {\n flex: 1;\n font-family: ", ";\n font-weight: 500;\n border: none;\n border-radius: .25rem;\n background-color: transparent;\n line-height: 1rem;\n overflow: hidden;\n\n color: ", ";\n\n padding: ", ";\n\n width: ", ";\n\n font-size: ", ";\n }\n\n .auto-complete-results {\n z-index: 2;\n position: absolute;\n top: ", ";\n width: 100%;\n background-color: ", ";\n box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.12);\n border-radius: 0 0 .25rem .25rem;\n border-top: solid 1px ", ";\n transition: border-top-color 500ms;\n\n &:hover {\n border-top-color: ", ";\n }\n }\n\n .auto-complete-prefix {\n z-index: 1;\n flex: 0 0 1.5rem;\n }\n /* TODO: suffix */\n"], ["\n position: relative;\n border: solid 1px ", ";\n border-radius: .25rem;\n transition: border-color 500ms;\n display: flex;\n background: ", ";\n align-items: center;\n\n &:hover {\n border: solid thin ", ";\n }\n\n &:active,\n &:focus {\n border: solid thin ", ";\n }\n\n .auto-complete-input {\n flex: 1;\n font-family: ", ";\n font-weight: 500;\n border: none;\n border-radius: .25rem;\n background-color: transparent;\n line-height: 1rem;\n overflow: hidden;\n\n color: ", ";\n\n padding: ", ";\n\n width: ", ";\n\n font-size: ", ";\n }\n\n .auto-complete-results {\n z-index: 2;\n position: absolute;\n top: ", ";\n width: 100%;\n background-color: ", ";\n box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.12);\n border-radius: 0 0 .25rem .25rem;\n border-top: solid 1px ", ";\n transition: border-top-color 500ms;\n\n &:hover {\n border-top-color: ", ";\n }\n }\n\n .auto-complete-prefix {\n z-index: 1;\n flex: 0 0 1.5rem;\n }\n /* TODO: suffix */\n"])), colors.neutrals.ash.light, colors.neutrals.white.base, colors.neutrals.ash.base, colors.neutrals.ash.dark, fonts.fontFamily, colors.neutrals.charcoal.light, function (_a) { var _b = _a.size, size = _b === void 0 ? 'small' : _b; return size === 'large' ? '0.75rem 1rem' : '0.5rem 0.5rem'; }, function (_a) { var _b = _a.size, size = _b === void 0 ? 'small' : _b; return size === 'large' ? 'calc(100% - 2rem - 2px)' : 'calc(100% - 1rem - 2px)'; }, function (_a) { var _b = _a.size, size = _b === void 0 ? 'small' : _b; return size === 'large' ? '1rem' : '.75rem'; }, function (_a) { var _b = _a.size, size = _b === void 0 ? 'small' : _b; return size === 'large' ? 'calc(2.5rem - 2px)' : 'calc(2rem - 2px)'; }, colors.neutrals.white.base, colors.neutrals.ash.light, colors.neutrals.ash.base); var AutoComplete = /** @class */ (function (_super) { __extends(AutoComplete, _super); function AutoComplete() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.state = { isFocused: false, }; return _this; } AutoComplete.prototype.render = function () { var _this = this; var _a = this.props, className = _a.className, placeholder = _a.placeholder, children = _a.children, suffix = _a.suffix, prefix = _a.prefix, props = __rest(_a, ["className", "placeholder", "children", "suffix", "prefix"]); return (React.createElement(StyledAutoComplete, __assign({ className: classNames(className) }, props), prefix && React.cloneElement(prefix, { className: 'auto-complete-prefix', height: 16, width: 16, color: colors.neutrals.ash.dark, }), React.createElement("input", { onFocus: function () { return _this.setState(__assign({}, _this.state, { isFocused: true })); }, onBlur: function () { return _this.setState(__assign({}, _this.state, { isFocused: false })); }, placeholder: placeholder, className: "auto-complete-input", name: "auto-complete" }), suffix && React.cloneElement(suffix, { className: 'auto-complete-suffix' }), children, this.state.isFocused && !children && React.createElement(List, { title: "Recent Searches", className: "auto-complete-results" }, this.props.dataSource.map(function (item) { return React.createElement(Item, { key: item }, item); })))); }; AutoComplete.defaultProps = { placeholder: 'Search', }; return AutoComplete; }(React.Component)); var templateObject_1$5; // TODO: a11y var ButtonColorStyles = { primary: styled.css(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n border: solid thin ", ";\n background-color: ", ";\n color: ", ";\n\n &:hover {\n background-color: ", ";\n }\n "], ["\n border: solid thin ", ";\n background-color: ", ";\n color: ", ";\n\n &:hover {\n background-color: ", ";\n }\n "])), colors.accent.savvyCyan.base, colors.accent.savvyCyan.base, colors.neutrals.white.base, polished.darken(0.05, colors.accent.savvyCyan.base)), secondary: styled.css(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n border: solid thin ", ";\n background-color: ", ";\n color: ", ";\n\n &:hover {\n background-color: ", ";\n }\n "], ["\n border: solid thin ", ";\n background-color: ", ";\n color: ", ";\n\n &:hover {\n background-color: ", ";\n }\n "])), colors.accent.savvyCyan.light, colors.accent.savvyCyan.light, colors.neutrals.white.base, polished.darken(0.1, colors.accent.savvyCyan.light)), text: styled.css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n border: solid thin ", ";\n background-color: ", ";\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n "], ["\n border: solid thin ", ";\n background-color: ", ";\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n "])), colors.neutrals.white.base, colors.neutrals.white.base, colors.accent.savvyCyan.base, polished.darken(0.25, colors.accent.savvyCyan.base)), }; var ButtonSizeStyles = { sm: styled.css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n padding: ", ";\n font-size: ", "px;\n "], ["\n padding: ", ";\n font-size: ", "px;\n "])), sizes$1.padding.xs, fonts.baseFontSize * 0.75), md: styled.css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n padding: ", " ", ";\n font-size: ", "px;\n "], ["\n padding: ", " ", ";\n font-size: ", "px;\n "])), sizes$1.padding.sm, sizes$1.padding.md, fonts.baseFontSize), lg: styled.css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n padding: ", ";\n font-size: ", "px;\n "], ["\n padding: ", ";\n font-size: ", "px;\n "])), sizes$1.padding.md, fonts.baseFontSize * 1.5), }; var StyledButton = styled__default.button(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n\tposition: relative;\n\tmin-width: 2rem;\n\tborder-radius: ", ";\n\tfont-weight: 500;\n\tfont-family: ", ";\n\ttext-align: center;\n\tcursor: pointer;\n margin-right: ", ";\n\n\ttransition: 500ms ease background-color,\n\t 500ms ease border-color,\n 500ms ease color,\n 500ms ease fill;\n\n\t// These properties are deprecated but help make white text on colored backgrounds look more crisp in Chrome and\n\t// Firefox.\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n\n /* Variants are color schemes */\n ", "\n\n /* Sizes */\n ", "\n\n /* Disabled State */\n ", "\n\n"], ["\n\tposition: relative;\n\tmin-width: 2rem;\n\tborder-radius: ", ";\n\tfont-weight: 500;\n\tfont-family: ", ";\n\ttext-align: center;\n\tcursor: pointer;\n margin-right: ", ";\n\n\ttransition: 500ms ease background-color,\n\t 500ms ease border-color,\n 500ms ease color,\n 500ms ease fill;\n\n\t// These properties are deprecated but help make white text on colored backgrounds look more crisp in Chrome and\n\t// Firefox.\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n\n /* Variants are color schemes */\n ", "\n\n /* Sizes */\n ", "\n\n /* Disabled State */\n ", "\n\n"])), sizes$1.border.radius.base, fonts.fontFamily, sizes$1.padding.md, function (_a) { var _b = _a.variant, variant = _b === void 0 ? 'primary' : _b; return ButtonColorStyles[variant]; }, function (_a) { var _b = _a.size, size = _b === void 0 ? 'md' : _b; return ButtonSizeStyles[size]; }, function (_a) { var disabled = _a.disabled; return disabled && styled.css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n opacity: .5;\n cursor: not-allowed;\n "], ["\n opacity: .5;\n cursor: not-allowed;\n "]))); }); var DefaultProps$3 = {}; var Button = function (_a) { if (_a === void 0) { _a = DefaultProps$3; } var className = _a.className, props = __rest(_a, ["className"]); return React.createElement(StyledButton, __assign({ className: classNames(className) }, props)); }; Button.defaultProps = DefaultProps$3; var templateObject_1$6, templateObject_2$1, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8; var StyledBadge = styled__default.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n position: relative;\n font-family: ", ";\n display: inline-block;\n\n .badge {\n position: absolute;\n top: -.5rem;\n right: -.25rem;\n background-color: ", ";\n color: ", ";\n font-weight: 700;\n font-size: 0.75rem;\n padding: 1px ", ";\n border-radius: ", ";\n }\n"], ["\n position: relative;\n font-family: ", ";\n display: inline-block;\n\n .badge {\n position: absolute;\n top: -.5rem;\n right: -.25rem;\n background-color: ", ";\n color: ", ";\n font-weight: 700;\n font-size: 0.75rem;\n padding: 1px ", ";\n border-radius: ", ";\n }\n"])), fonts.fontFamily, colors.secondary.flashPink.base, colors.neutrals.white.base, sizes$1.padding.xs, variables.borderRadius); var Badge = function (_a) { var className = _a.className, children = _a.children, count = _a.count, props = __rest(_a, ["className", "children", "count"]); return (React.createElement(StyledBadge, __assign({ className: classNames(className) }, props), children, React.createElement("div", { className: "badge" }, count))); }; var templateObject_1$7; var StyledDropDown = styled__default.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n font-family: ", ";\n position: relative;\n cursor: pointer;\n line-height: 1rem;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n\n .drop-down-container {\n min-width: 10rem;\n position: absolute;\n left: 0;\n top: ", ";\n padding: ", " 0;\n z-index: 1;\n background-color: ", ";\n box-shadow: 0 .5rem .5rem 0 ", ";\n border-radius: ", ";\n border: 1px solid ", ";\n }\n\n .arrow-up {\n position: absolute;\n top: -.4rem;\n left: 1rem;\n width: 0;\n height: 0;\n border-left: .75rem solid transparent;\n border-right: .75rem solid transparent;\n border-bottom: .5rem solid white;\n }\n"], ["\n font-family: ", ";\n position: relative;\n cursor: pointer;\n line-height: 1rem;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n\n .drop-down-container {\n min-width: 10rem;\n position: absolute;\n left: 0;\n top: ", ";\n padding: ", " 0;\n z-index: 1;\n background-color: ", ";\n box-shadow: 0 .5rem .5rem 0 ", ";\n border-radius: ", ";\n border: 1px solid ", ";\n }\n\n .arrow-up {\n position: absolute;\n top: -.4rem;\n left: 1rem;\n width: 0;\n height: 0;\n border-left: .75rem solid transparent;\n border-right: .75rem solid transparent;\n border-bottom: .5rem solid white;\n }\n"])), fonts.fontFamily, function (props) { return lodash.get(props, 'forwardedRef.current.clientHeight', 16) + "px"; }, sizes$1.padding.xs, colors.neutrals.white.base, polished.rgba(colors.neutrals.charcoal.dark, 0.12), variables.borderRadius, colors.neutrals.silver.dark); var DropDown = /** @class */ (function (_super) { __extends(DropDown, _super); function DropDown(props) { var _this = _super.call(this, props) || this; // State _this.state = { isHidden: true }; _this.dropDownReference = React.createRef(); return _this; } DropDown.prototype.componentDidMount = function () { var _this = this; var dropDown = this.dropDownReference.current; var height = dropDown.clientHeight, width = dropDown.clientWidth; this.setState(__assign({}, this.state, { height: height, width: width })); /* Events */ /* // Subscribe to all window clicks this.windowClick$ = fromEvent(window, 'click') .pipe( takeWhile(() => { return !this.state.isHidden; }) ); // Subscribe to keyboard escape this.escapeKey$ = fromEvent(document, 'keyup') .pipe( takeWhile(() => !this.state.isHidden), filter((keyEvent: KeyboardEvent) => keyEvent.key === 'Escape') ); // Subscribe to element click/tap this.elementClick$ = fromEvent(dropDown, 'click'); */ // If hover is the trigger: // Subscribe to element mouseenter this.mouseOver$ = rxjs.fromEvent(dropDown, 'mouseenter') .subscribe(function (a) { _this.setState({ isHidden: false }); }); // Subscribe to element mouseleave this.mouseOut$ = rxjs.fromEvent(dropDown, 'mouseleave') .subscribe(function (a) { _this.setState({ isHidden: true }); }); /* Subs */ // this.windowClick$.subscribe((a: any) => { // console.log(1, a, this.dropDownReference); // // this.setState({ isHidden: true }); // }); // this.elementClick$.subscribe((a: any) => { // console.log(2, a, this.dropDownReference); // // this.setState({ isHidden: true }); // }); // const clickEvents$ = zip(this.windowClick$, this.elementClick$) // .subscribe((...a) => { // console.log(6, a); // }); // this.escapeKey$.subscribe((a: any) => { // this.setState({ isHidden: true }); // }); }; // componentDidUpdate(prevProps: Readonly, prevState: Readonly<{}>, snapshot?: any): void { // // } DropDown.prototype.componentWillUnmount = function () { this.mouseOver$.unsubscribe(); this.mouseOut$.unsubscribe(); }; DropDown.prototype.render = function () { var _a = this.props, children = _a.children, className = _a.className, overlay = _a.overlay, props = __rest(_a, ["children", "className", "overlay"]); return (React.createElement(StyledDropDown, __assign({ ref: this.dropDownReference, className: classNames(className) }, props), children, React.createElement("div", { hidden: this.state.isHidden, className: classNames('drop-down-container') }, React.createElement("div", { className: "arrow-up" }), overlay))); }; DropDown.defaultProps = { trigger: 'hover', }; return DropDown; }(React.Component)); var templateObject_1$8; var StyledContainer = styled__default(grid.Box)(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n max-width: 1140px;\n"], ["\n max-width: 1140px;\n"]))); var Container = /** @class */ (function (_super) { __extends(Container, _super); function Container() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.state = { currentBreakpoint: 'small', }; return _this; } Container.prototype.componentDidMount = function () { var _this = this; this.windowResize$ = rxjs.fromEvent(window, 'resize') // .pipe(debounceTime(150)) .subscribe(function () { return _this.assignBreakpoint(); }); this.assignBreakpoint(); }; Container.prototype.componentWillUnmount = function () { this.windowResize$.unsubscribe(); }; Container.prototype.assignBreakpoint = function () { var innerWidth = lodash.get(window || {}, 'innerWidth', 480); var currentBreakpoint = 'small'; if (innerWidth <= 480) { currentBreakpoint = 'xsmall'; } else if (innerWidth <= 576) { currentBreakpoint = 'small'; } else if (innerWidth <= 768) { currentBreakpoint = 'medium'; } else if (innerWidth <= 992) { currentBreakpoint = 'large'; } else if (innerWidth <= 1200) { currentBreakpoint = 'xlarge'; } else { currentBreakpoint = 'xxlarge'; } if (this.state.currentBreakpoint !== currentBreakpoint) { this.setState(__assign({}, this.state, { currentBreakpoint: currentBreakpoint })); if (this.props.whenBreakpoint) { this.props.whenBreakpoint(currentBreakpoint); } } }; Container.prototype.render = function () { var _a = this.props, className = _a.className, props = __rest(_a, ["className"]); return (React.createElement(StyledContainer, __assign({ mx: "auto", className: classNames(className) }, props))); }; Container.defaultProps = { breakpoint: 'small', }; return Container; }(React.Component)); var templateObject_1$9; // REACT /* tslint:disable max-line-length */ var Hamburger = (function (_a) { var _b = _a.color, color = _b === void 0 ? '#222222' : _b, height = _a.height, width = _a.width; return (React.createElement("svg", { width: width ? width + "px" : '26px', height: height ? height + "px" : '20px', viewBox: "0 0 26 20", version: "1.1" }, React.createElement("g", { id: "Page-1", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("path", { d: "M1.4625,4 L24.5375,4 C25.345125,4 26,3.105 26,2 C26,0.895 25.345125,0 24.5375,0 L1.4625,0 C0.654875,0 0,0.895 0,2 C0,3.105 0.654875,4 1.4625,4", id: "Top-Fill", fill: color }), React.createElement("path", { d: "M1.4625,12 L24.5375,12 C25.345125,12 26,11.105 26,10 C26,8.895 25.345125,8 24.5375,8 L1.4625,8 C0.654875,8 0,8.895 0,10 C0,11.105 0.654875,12 1.4625,12", id: "Center-Fill", fill: color }), React.createElement("path", { d: "M1.4625,20 L24.5375,20 C25.345125,20 26,19.105 26,18 C26,16.895 25.345125,16 24.5375,16 L1.4625,16 C0.654875,16 0,16.895 0,18 C0,19.105 0.654875,20 1.4625,20", id: "Bottom-Fill", fill: color })))); }); // REACT /* tslint:disable max-line-length */ var ChevronDown = (function (_a) { var _b = _a.color, color = _b === void 0 ? '#222222' : _b, _c = _a.height, height = _c === void 0 ? 10 : _c, _d = _a.width, width = _d === void 0 ? 10 : _d; return (React.createElement("svg", { transform: "rotate(90)", height: height, width: width, fill: color, preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 40 40" }, React.createElement("g", null, React.createElement("path", { d: "m23.3 20l-13.1-13.6c-0.3-0.3-0.3-0.9 0-1.2l2.4-2.4c0.3-0.3 0.9-0.4 1.2-0.1l16 16.7c0.1 0.1 0.2 0.4 0.2 0.6s-0.1 0.5-0.2 0.6l-16 16.7c-0.3 0.3-0.9 0.3-1.2 0l-2.4-2.5c-0.3-0.3-0.3-0.9 0-1.2z" })))); }); // REACT /* tslint:disable max-line-length */ var ChevronUp = (function (_a) { var _b = _a.color, color = _b === void 0 ? '#222222' : _b, _c = _a.height, height = _c === void 0 ? 8 : _c, _d = _a.width, width = _d === void 0 ? 16 : _d; return (React.createElement("svg", { transform: "rotate(270)", height: height, width: width, fill: color, preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 40 40" }, React.createElement("g", null, React.createElement("path", { d: "m23.3 20l-13.1-13.6c-0.3-0.3-0.3-0.9 0-1.2l2.4-2.4c0.3-0.3 0.9-0.4 1.2-0.1l16 16.7c0.1 0.1 0.2 0.4 0.2 0.6s-0.1 0.5-0.2 0.6l-16 16.7c-0.3 0.3-0.9 0.3-1.2 0l-2.4-2.5c-0.3-0.3-0.3-0.9 0-1.2z" })))); }); // REACT /* tslint:disable max-line-length */ var ChevronRight = (function (_a) { var _b = _a.color, color = _b === void 0 ? '#222222' : _b, _c = _a.height, height = _c === void 0 ? 10 : _c, _d = _a.width, width = _d === void 0 ? 10 : _d; return (React.createElement("svg", { height: height, width: width, fill: color, preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 40 40" }, React.createElement("g", null, React.createElement("path", { d: "m23.3 20l-13.1-13.6c-0.3-0.3-0.3-0.9 0-1.2l2.4-2.4c0.3-0.3 0.9-0.4 1.2-0.1l16 16.7c0.1 0.1 0.2 0.4 0.2 0.6s-0.1 0.5-0.2 0.6l-16 16.7c-0.3 0.3-0.9 0.3-1.2 0l-2.4-2.5c-0.3-0.3-0.3-0.9 0-1.2z" })))); }); // REACT /* tslint:disable max-line-length */ var Cart = (function (_a) { var _b = _a.color, color = _b === void 0 ? '#222222' : _b, width = _a.width, height = _a.height; return (React.createElement("svg", { width: width ? width + "px" : '22px', height: height ? height + "px" : '21px', viewBox: "0 0 22 21", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, React.createElement("g", { id: "Page-1", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("path", { d: "M16,20.5833333 C16.6903559,20.5833333 17.25,20.0236893 17.25,19.3333333 C17.25,18.6429774 16.6903559,18.0833333 16,18.0833333 C15.3096441,18.0833333 14.75,18.6429774 14.75,19.3333333 C14.75,20.0236893 15.3096441,20.5833333 16,20.5833333 Z M16,20.3055556 C15.4630565,20.3055556 15.0277778,19.8702768 15.0277778,19.3333333 C15.0277778,18.7963898 15.4630565,18.3611111 16,18.3611111 C16.5369435,18.3611111 16.9722222,18.7963898 16.9722222,19.3333333 C16.9722222,19.8702768 16.5369435,20.3055556 16,20.3055556 Z", id: "Cart", stroke: color, strokeWidth: "0.833333333", fill: color }), React.createElement("path", { d: "M9.33333333,20.5833333 C10.0236893,20.5833333 10.5833333,20.0236893 10.5833333,19.3333333 C10.5833333,18.6429774 10.0236893,18.0833333 9.33333333,18.0833333 C8.6429774,18.0833333 8.08333333,18.6429774 8.08333333,19.3333333 C8.08333333,20.0236893 8.6429774,20.5833333 9.33333333,20.5833333 Z M9.33333333,20.3055556 C8.79638983,20.3055556 8.36111111,19.8702768 8.36111111,19.3333333 C8.36111111,18.7963898 8.79638983,18.3611111 9.33333333,18.3611111 C9.87027684,18.3611111 10.3055556,18.7963898 10.3055556,19.3333333 C10.3055556,19.8702768 9.87027684,20.3055556 9.33333333,20.3055556 Z", id: "Wheel-1", stroke: color, strokeWidth: "0.833333333", fill: color }), React.createElement("path", { d: "M5.15183532,3.22222222 L19.8884603,3.22222222 C20.50211,3.22222222 20.9995714,3.71968361 20.9995714,4.33333333 C20.9995714,4.41446581 20.9906851,4.49535424 20.9730716,4.57455173 L19.2432877,12.3523295 C19.1302443,12.8606162 18.6793819,13.2222222 18.1586764,13.2222222 L6.69029686,13.2222222 L7.0321772,15.4444444 L18.2222222,15.4444444 C18.5290471,15.4444444 18.7777778,15.6931751 18.7777778,16 C18.7777778,16.3068249 18.5290471,16.5555556 18.2222222,16.5555556 L6.55555556,16.5555556 C6.2813494,16.5555556 6.04815518,16.3554938 6.00646017,16.0844762 L3.85671169,2.11111111 L1.55555556,2.11111111 C1.24873069,2.11111111 1,1.86238042 1,1.55555556 C1,1.24873069 1.24873069,1 1.55555556,1 L4.33333333,1 C4.60753949,1 4.8407337,1.20006174 4.88242872,1.47107934 L5.15183532,3.22222222 Z M6.52136168,12.1111111 L18.1586764,12.1111111 L19.8884603,4.33333333 L5.32416274,4.33333333 L6.52136168,12.1111111 Z", id: "Wheel-2", stroke: color, strokeWidth: "0.4", fill: color })))); }); // REACT /* tslint:disable max-line-length */ var Search = (function (_a) { var _b = _a.color, color = _b === void 0 ? '#222222' : _b, width = _a.width, height = _a.height; return (React.createElement("svg", { width: width ? width + "px" : '24px', height: height ? height + "px" : '24px', viewBox: "0 0 24 24", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, React.createElement("defs", null, React.createElement("path", { d: "M10.4998359,19.4996953 C5.53641349,19.4996953 1.49997656,15.4632584 1.49997656,10.4998359 C1.49997656,5.53641349 5.53641349,1.49997656 10.4998359,1.49997656 C15.4632584,1.49997656 19.4996953,5.53641349 19.4996953,10.4998359 C19.4996953,15.4632584 15.4632584,19.4996953 10.4998359,19.4996953 M23.7806284,22.720145 L18.4287121,17.3682286 C20.0276871,15.5277574 20.9996719,13.1292949 20.9996719,10.4998359 C20.9996719,4.70092655 16.2987453,0 10.4998359,0 C4.70092655,0 0,4.70092655 0,10.4998359 C0,16.2987453 4.70092655,20.9996719 10.4998359,20.9996719 C13.1292949,20.9996719 15.5277574,20.0276871 17.3682286,18.4287121 L22.720145,23.7806284 C23.0126404,24.0731239 23.489633,24.0731239 23.7806284,23.7806284 C24.0731239,23.489633 24.0731239,23.0126404 23.7806284,22.720145", id: "search-icon-path" })), React.createElement("g", { id: "Page-1", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("mask", { id: "mask-2", fill: "white" }, React.createElement("use", { xlinkHref: "#search-icon-path" })), React.createElement("use", { id: "Fill-1", fill: color, xlinkHref: "#search-icon-path" })))); }); var StyledIcon = styled__default.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n display: inline-flex;\n max-width: 1.5rem;\n justify-content: end;\n\n > svg {\n flex: 0 0 1.25rem;\n }\n"], ["\n display: inline-flex;\n max-width: 1.5rem;\n justify-content: end;\n\n > svg {\n flex: 0 0 1.25rem;\n }\n"]))); var DefaultProps$4 = { type: 'hamburger', color: '#222', }; var Icons = { 'hamburger': Hamburger, 'chevron-down': ChevronDown, 'chevron-up': ChevronUp, 'chevron-right': ChevronRight, 'cart': Cart, 'search': Search, }; var Icon = function (_a) { if (_a === void 0) { _a = DefaultProps$4; } var className = _a.className, type = _a.type, color = _a.color, width = _a.width, height = _a.height, props = __rest(_a, ["className", "type", "color", "width", "height"]); return (React.createElement(StyledIcon, __assign({ className: classNames(className) }, props), Icons[type]({ color: color, width: width, height: height }))); }; Icon.defaultProps = DefaultProps$4; var templateObject_1$a; var StyledMobileCTAElement = styled__default.a(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n display: inline-flex;\n font-family: ", ";\n font-size: 0.875rem;\n justify-content: center;\n align-content: center;\n color: ", ";\n cursor: pointer;\n\n .mobile-cta-image {\n min-width: 4rem;\n }\n\n .caret {\n padding: 0 0 0 .5rem;\n }\n\n > div {\n flex: 0 0 auto;\n display: flex;\n justify-content: center;\n flex-direction: column;\n }\n\n p {\n line-height: 1.125rem;\n padding: 0;\n margin: 0 0 0 0.375rem;\n }\n\n strong {\n color: ", ";\n }\n"], ["\n display: inline-flex;\n font-family: ", ";\n font-size: 0.875rem;\n justify-content: center;\n align-content: center;\n color: ", ";\n cursor: pointer;\n\n .mobile-cta-image {\n min-width: 4rem;\n }\n\n .caret {\n padding: 0 0 0 .5rem;\n }\n\n > div {\n flex: 0 0 auto;\n display: flex;\n justify-content: center;\n flex-direction: column;\n }\n\n p {\n line-height: 1.125rem;\n padding: 0;\n margin: 0 0 0 0.375rem;\n }\n\n strong {\n color: ", ";\n }\n"])), fonts.fontFamily, colors.neutrals.charcoal.base, colors.accent.savvyCyan.dark); /* tslint:disable max-line-length */ var MobileCTAImage = function () { return (React.createElement("svg", { width: "64px", height: "64px", viewBox: "0 0 64 64", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, React.createElement("defs", null, React.createElement("circle", { id: "app-dl-path-1", cx: "32", cy: "32", r: "32" }), React.createElement("polygon", { id: "app-dl-path-3", points: "3.17682895e-20 0.0666753015 3.17682895e-20 46.3103205 28.8347517 46.3103205 28.8347517 0.0666753015 0 0.0666753015" }), React.createElement("polygon", { id: "app-dl-path-5", points: "23.5117697 0.21238419 0.246128136 0.21238419 0.246128136 37.0848289 23.5117697 37.0848289 23.5117697 0.21238419" })), React.createElement("g", { stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("g", { id: "Illustrations-/-Grey-Circle-/-Hand-Holding-Phone" }, React.createElement("g", { id: "app-dl-asset-0" }, React.createElement("g", null, React.createElement("mask", { id: "app-dl-mask-2", fill: "white" }, React.createElement("use", { xlinkHref: "#app-dl-path-1" })), React.createElement("use", { id: "app-dl-asset-13", fill: "#F1F1F1", xlinkHref: "#app-dl-path-1" }), React.createElement("g", { id: "phone-and-hand", mask: "url(#app-dl-mask-2)" }, React.createElement("g", { transform: "translate(15.040000, 10.560000)" }, React.createElement("g", { id: "hand", strokeWidth: "1", fill: "none", transform: "translate(0.000000, 33.868290)" }, React.createElement("mask", { id: "app-dl-mask-4", fill: "white" }, React.createElement("use", { xlinkHref: "#app-dl-path-3" })), React.createElement("g", { id: "app-dl-asset-12" }), React.createElement("path", { d: "M28.3268731,6.8442934 C29.3576849,4.58295201 28.5003355,0.179072646 28.5003355,0.179072646 L15.7977333,0.0666753015 L16.7945559,3.35124018 L3.32426559,3.34017516 L4.46407742,14.9194311 L-0.000234408602,46.2893552 L25.4758785,46.3103205 L20.3265075,17.2227031 L20.4571903,15.3323312 C20.856271,14.9753386 27.2315989,9.24715062 28.3268731,6.8442934", id: "app-dl-asset-11", fill: "#DDAE7C", mask: "url(#app-dl-mask-4)" })), React.createElement("path", { d: "M30.4486812,6.44053652 C32.4804177,5.26531454 34.0480253,6.74336874 34.0480253,6.74336874 C34.8872081,7.58664001 34.8414984,8.8247579 33.8083425,10.1001475 C32.7019339,11.4652219 28.6419769,15.9005493 28.6419769,15.9005493 C27.7934177,16.735085 26.4250575,16.7275142 25.5852887,15.8842429 L24.4109016,14.4195832 C23.5717188,13.576312 23.5787511,12.2164788 24.4273102,11.3825255 C24.4273102,11.3825255 28.7615253,7.41658807 30.4486812,6.44053652", id: "app-dl-asset-10", fill: "#DDAE7C" }), React.createElement("path", { d: "M26.7635435,40.6000113 L8.06945753,40.5848697 C6.81947366,40.5837049 5.79803817,39.5663051 5.79862419,38.324693 L5.82558118,5.98337633 C5.82675323,4.74118185 6.8505328,3.72611153 8.09993065,3.7266939 L26.7946027,3.74241788 C28.0440005,3.74358262 29.066022,4.76040005 29.06485,6.00259453 L29.037893,38.3433289 C29.036721,39.5855233 28.0135274,40.601176 26.7635435,40.6000113", id: "app-dl-asset-9", fill: "#3F3F3F" }), React.createElement("g", { id: "phone", strokeWidth: "1", fill: "none", transform: "translate(5.555484, 0.090850)" }, React.createElement("mask", { id: "app-dl-mask-6", fill: "white" }, React.createElement("use", { xlinkHref: "#app-dl-path-5" })), React.createElement("g", { id: "app-dl-asset-8" }), React.createElement("path", { d: "M20.9303441,37.084828 L2.79708065,37.0696864 C1.39297312,37.0685217 0.244956989,35.9259124 0.246129032,34.5305547 L0.273086022,2.74714813 C0.274258065,1.35179043 1.42403226,0.210928266 2.82813978,0.212093006 L20.9614032,0.227234617 C22.3655108,0.228399356 23.5129409,1.37100863 23.5117688,2.76636633 L23.4853978,34.5497729 C23.4842258,35.9451306 22.3344516,37.0859928 20.9303441,37.084828", id: "app-dl-asset-7", fill: "#1C1C1C", mask: "url(#app-dl-mask-6)" })), React.createElement("polygon", { id: "app-dl-asset-6", fill: "#602D6C", points: "26.8972222 32.8598145 7.82222222 32.8440905 7.84683513 3.55555556 26.9218351 3.55555556" }), React.createElement("path", { d: "M17.4222222,17.2609404 C18.0612822,15.4428 18.6438521,13.7015718 18.9789625,12.6881984 C20.3674513,12.5224017 21.0793651,12.9690914 21.0793651,14.0537538 C21.0793651,15.1115694 20.2139968,16.1578663 18.3801158,16.8878978 C18.0355178,17.0250339 17.7124192,17.1502884 17.4222222,17.2609404 M15.0058249,20.5476333 C14.2963298,22.0562077 13.8581683,22.6918854 13.3000159,22.7811571 C13.047295,22.821585 12.8507937,22.700144 12.8507937,22.3178879 C12.8507937,21.8992152 13.2823186,20.3480107 15.5936508,19.1034761 C15.3590086,19.7214568 15.1528195,20.2352215 15.0058249,20.5476333 M22.6750674,22.0833189 C22.3422476,22.1854811 21.7568311,22.2689413 21.3131303,22.0808719 C20.8940795,21.9032022 20.6328244,21.4739284 20.3104301,20.662136 C20.0338901,19.9660518 19.6167831,18.7713039 19.329641,17.8894224 C22.3879253,16.8007695 23.8222222,15.416379 23.8222222,13.8648934 C23.8222222,12.4198523 22.6303616,11.4682313 19.98459,11.7991881 C18.8142872,11.9456586 17.9578085,12.1058497 17.0512346,12.2801985 C13.6629577,12.9318871 12.392376,14.3800743 12.392376,15.8695984 C12.392376,16.8781995 13.2864924,17.5763812 14.3217943,17.5763812 C15.0277221,17.5763812 15.0953993,17.1882694 14.8865365,17.0333219 C14.4472533,16.7075213 14.1842311,16.3816332 14.1842311,15.8228432 C14.1842311,14.9469045 14.8498707,13.8266153 17.2969399,13.2887996 C17.4550889,13.2540172 17.5901783,13.2241289 17.7106896,13.197474 C17.3048915,14.3318335 16.5843857,16.3331302 15.9291716,18.0565176 C12.1919066,19.537652 11.0222222,21.5660405 11.0222222,22.9739396 C11.0222222,24.025975 11.8589985,24.6310832 12.8472975,24.6310832 C14.353159,24.6310832 15.5379515,23.6328819 16.4864924,21.388196 C16.8531507,20.520647 17.2566517,19.4933438 17.6553816,18.441658 C17.9359857,19.3497573 18.3135997,20.5043045 18.5819229,21.2058071 C18.8540453,21.9174472 19.1008108,22.4284333 19.4708265,22.7936481 C19.9182381,23.2352443 20.4657519,23.4556491 21.1784827,23.4556491 C22.0963656,23.4556491 22.7274598,23.0061002 23.0043531,22.5175741 C23.1817628,22.2046202 22.9644183,21.9945277 22.6750674,22.0833189", id: "app-dl-asset-5", fill: "#FEFEFE" }), React.createElement("path", { d: "M8.1395457,25.5615378 L7.75101344,18.0606166 C7.75277151,16.074736 6.64929301,14.4953495 5.27097043,14.4941848 L4.67498656,14.4936024 C3.29725,14.4924377 2.13868548,16.159762 2.13692742,18.2108679 L1.63705108,25.0210988 C1.51750269,27.1962494 2.21662634,33.0240226 2.21662634,33.0240226 L4.59118548,47.3683697 C4.59118548,47.3683697 10.381078,47.0189479 16.5149651,46.6305073 L16.812078,45.8938097 C19.7380833,36.4105022 10.8282124,27.8712159 8.1395457,25.5615378", id: "app-dl-asset-4", fill: "#DDAE7C" }), React.createElement("path", { d: "M31.8508548,29.3768161 C31.8496828,31.0738413 30.6588871,32.4488161 29.1920753,32.4476514 C27.7246774,32.4464866 26.5368118,31.0697647 26.5379839,29.3721572 C26.5397419,27.675132 27.7299516,26.3001572 29.1967634,26.301322 C30.6641613,26.3024867 31.8520269,27.679791 31.8508548,29.3768161", id: "app-dl-asset-3", fill: "#DDAE7C" }), React.createElement("path", { d: "M31.855836,23.4095654 C31.854664,25.1065906 30.6638683,26.4815654 29.1970565,26.4804006 C27.7296586,26.4792359 26.541793,25.102514 26.5429651,23.4049065 C26.5447231,21.7078813 27.7349328,20.3329065 29.2017446,20.3340713 C30.6691425,20.335236 31.8570081,21.7125402 31.855836,23.4095654", id: "app-dl-asset-2", fill: "#DDAE7C" }), React.createElement("path", { d: "M31.8608758,17.3522221 C31.8597038,19.0492473 30.6689081,20.4242221 29.2020962,20.4230573 C27.7346984,20.4218926 26.5468328,19.0451707 26.5480048,17.3475632 C26.5497629,15.650538 27.7399726,14.2755632 29.2067844,14.2767279 C30.6741823,14.2778927 31.8620478,15.6551969 31.8608758,17.3522221", id: "app-dl-asset-1", fill: "#DDAE7C" }))))))))); }; /* tslint:enable max-line-length */ var MobileCTA = function (_a) { var href = _a.href, className = _a.className; return (React.createElement(StyledMobileCTAElement, { className: classNames(className), href: href, target: "_blank", rel: "noreferrer nofollow" }, React.createElement(MobileCTAImage, null), React.createElement("div", null, React.createElement("p", null, "Get Savings on the go!"), React.createElement("p", null, React.createElement("strong", null, "Download the App"))), React.createElement(Icon, { className: "caret", width: 24, height: 48, color: colors.accent.savvyCyan.dark, type: "chevron-right" }))); }; var templateObject_1$b; var reset = styled.css(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n margin: 0;\n padding: 0;\n"], ["\n margin: 0;\n padding: 0;\n"]))); var StyledFooterSectionElement = styled__default.section(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n width: 110px;\n\n h4 {\n ", ";\n margin-bottom: 0.75rem;\n font-weight: 700;\n font-size: 0.75rem;\n line-height: 1rem;\n color: ", ";\n }\n\n ul {\n list-style: none;\n ", ";\n }\n\n li {\n ", ";\n\n &:last-child {\n a {\n margin-bottom: 0;\n }\n }\n }\n\n a {\n display: block;\n margin-bottom: 0.75rem;\n }\n"], ["\n width: 110px;\n\n h4 {\n ", ";\n margin-bottom: 0.75rem;\n font-weight: 700;\n font-size: 0.75rem;\n line-height: 1rem;\n color: ", ";\n }\n\n ul {\n list-style: none;\n ", ";\n }\n\n li {\n ", ";\n\n &:last-child {\n a {\n margin-bottom: 0;\n }\n }\n }\n\n a {\n display: block;\n margin-bottom: 0.75rem;\n }\n"])), reset, colors.neutrals.charcoal.light, reset, reset); var FooterSection = function (_a) { var children = _a.children, title = _a.title; return (React.createElement(StyledFooterSectionElement, null, title && React.createElement("h4", null, title), children)); }; var templateObject_1$c, templateObject_2$2; var Fragment = React.Fragment; var StyledFooterElement = styled__default.footer(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n font-family: ", ";\n font-size: .75rem;\n margin: 0;\n background-color: ", ";\n border-bottom: solid 1rem ", ";\n color: ", ";\n font-weight: 500;\n box-shadow: 0 0 .5rem 0 rgba(0, 0, 0, 0.1);\n\n .footer-navigation-sections {\n display: flex;\n justify-content: space-between;\n\n > section {\n flex: 0 0 110px;\n }\n }\n\n .social-icons {\n margin: 1rem auto;\n display: block;\n }\n .footer-logo {\n display: block;\n margin: 0 auto;\n }\n\n a {\n text-decoration: none;\n color: ", ";\n font-weight: 500;\n }\n\n .legal-links {\n margin: 2.5rem 0 0 0;\n padding: 0;\n display: block;\n list-style: none;\n justify-content: space-between;\n\n li {\n display: inline-block;\n margin-right: 2rem;\n\n &:last-child {\n margin-right: 0;\n }\n }\n }\n\n .mobile {\n padding: ", ";\n .footer-navigation-sections {\n flex-wrap: wrap;\n margin-bottom: 1rem;\n\n > section {\n flex: 1 1 120px;\n margin-bottom: 1rem;\n }\n }\n\n .footer-logo,\n .mobile-cta {\n display: flex;\n margin: 0 auto;\n }\n\n hr {\n border: none;\n border-bottom: solid 1px ", ";\n margin: 1.5rem 0;\n }\n .legal-links {\n flex-wrap: wrap;\n justify-content: center;\n text-align: center;\n margin: .5rem 0 0 0;\n\n li {\n margin: 1rem 1rem 0 0;\n }\n }\n }\n"], ["\n font-family: ", ";\n font-size: .75rem;\n margin: 0;\n background-color: ", ";\n border-bottom: solid 1rem ", ";\n color: ", ";\n font-weight: 500;\n box-shadow: 0 0 .5rem 0 rgba(0, 0, 0, 0.1);\n\n .footer-navigation-sections {\n display: flex;\n justify-content: space-between;\n\n > section {\n flex: 0 0 110px;\n }\n }\n\n .social-icons {\n margin: 1rem auto;\n display: block;\n }\n .footer-logo {\n display: block;\n margin: 0 auto;\n }\n\n a {\n text-decoration: none;\n color: ", ";\n font-weight: 500;\n }\n\n .legal-links {\n margin: 2.5rem 0 0 0;\n padding: 0;\n display: block;\n list-style: none;\n justify-content: space-between;\n\n li {\n display: inline-block;\n margin-right: 2rem;\n\n &:last-child {\n margin-right: 0;\n }\n }\n }\n\n .mobile {\n padding: ", ";\n .footer-navigation-sections {\n flex-wrap: wrap;\n margin-bottom: 1rem;\n\n > section {\n flex: 1 1 120px;\n margin-bottom: 1rem;\n }\n }\n\n .footer-logo,\n .mobile-cta {\n display: flex;\n margin: 0 auto;\n }\n\n hr {\n border: none;\n border-bottom: solid 1px ", ";\n margin: 1.5rem 0;\n }\n .legal-links {\n flex-wrap: wrap;\n justify-content: center;\n text-align: center;\n margin: .5rem 0 0 0;\n\n li {\n margin: 1rem 1rem 0 0;\n }\n }\n }\n"])), fonts.fontFamily, colors.neutrals.white.base, colors.main.grapePurchase.base, colors.neutrals.ash.dark, colors.neutrals.charcoal.light, sizes$1.padding.md, colors.neutrals.silver.base); /* tslint:disable max-line-length */ var FooterLogo = function () { return (React.createElement("svg", { className: "footer-logo", width: "166px", height: "52px", viewBox: "0 0 166 52", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, React.createElement("g", { id: "Web-Final", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("g", { id: "footers", transform: "translate(-178.000000, -778.000000)" }, React.createElement("g", { id: "Footer", transform: "translate(0.000000, 746.000000)" }, React.createElement("g", { id: "RMN-Logo", transform: "translate(178.000000, 32.000000)" }, React.createElement("g", { id: "Stacked-Group" }, React.createElement("g", null, React.createElement("path", { d: "M9.406,47.4 L9.406,51 L7.354,51 L7.354,47.4 L4.162,42.504 L6.646,42.504 L8.458,45.648 L10.27,42.504 L12.67,42.504 L9.406,47.4 Z M22.162,46.716 C22.162,47.3880034 22.0460012,48.0019972 21.814,48.558 C21.5819988,49.1140028 21.2600021,49.589998 20.848,49.986 C20.4359979,50.382002 19.9460028,50.6879989 19.378,50.904 C18.8099972,51.1200011 18.1940033,51.228 17.53,51.228 C16.8659967,51.228 16.2520028,51.1200011 15.688,50.904 C15.1239972,50.6879989 14.6360021,50.382002 14.224,49.986 C13.8119979,49.589998 13.4900012,49.1140028 13.258,48.558 C13.0259988,48.0019972 12.91,47.3880034 12.91,46.716 C12.91,46.0359966 13.0259988,45.4220027 13.258,44.874 C13.4900012,44.3259973 13.8119979,43.8600019 14.224,43.476 C14.6360021,43.0919981 15.1239972,42.796001 15.688,42.588 C16.2520028,42.379999 16.8659967,42.276 17.53,42.276 C18.1940033,42.276 18.8099972,42.379999 19.378,42.588 C19.9460028,42.796001 20.4359979,43.0919981 20.848,43.476 C21.2600021,43.8600019 21.5819988,44.3259973 21.814,44.874 C22.0460012,45.4220027 22.162,46.0359966 22.162,46.716 Z M19.966,46.716 C19.966,46.3479982 19.9060006,46.0040016 19.786,45.684 C19.6659994,45.3639984 19.5000011,45.0900011 19.288,44.862 C19.0759989,44.6339989 18.8200015,44.4540007 18.52,44.322 C18.2199985,44.1899993 17.8900018,44.124 17.53,44.124 C17.1699982,44.124 16.8420015,44.1899993 16.546,44.322 C16.2499985,44.4540007 15.9940011,44.6339989 15.778,44.862 C15.5619989,45.0900011 15.3960006,45.3639984 15.28,45.684 C15.1639994,46.0040016 15.106,46.3479982 15.106,46.716 C15.106,47.1000019 15.1659994,47.4539984 15.286,47.778 C15.4060006,48.1020016 15.5719989,48.3799988 15.784,48.612 C15.9960011,48.8440012 16.2499985,49.0259993 16.546,49.158 C16.8420015,49.2900007 17.1699982,49.356 17.53,49.356 C17.8900018,49.356 18.2179985,49.2900007 18.514,49.158 C18.8100015,49.0259993 19.0659989,48.8440012 19.282,48.612 C19.4980011,48.3799988 19.6659994,48.1020016 19.786,47.778 C19.9060006,47.4539984 19.966,47.1000019 19.966,46.716 Z M30.718,47.796 C30.718,48.3080026 30.6320009,48.7739979 30.46,49.194 C30.2879991,49.6140021 30.0420016,49.9739985 29.722,50.274 C29.4019984,50.5740015 29.0160023,50.8079992 28.564,50.976 C28.1119977,51.1440008 27.6100028,51.228 27.058,51.228 C26.4979972,51.228 25.9940022,51.1440008 25.546,50.976 C25.0979978,50.8079992 24.7180016,50.5740015 24.406,50.274 C24.0939984,49.9739985 23.8540008,49.6140021 23.686,49.194 C23.5179992,48.7739979 23.434,48.3080026 23.434,47.796 L23.434,42.504 L25.474,42.504 L25.474,47.628 C25.474,47.8600012 25.5039997,48.079999 25.564,48.288 C25.6240003,48.496001 25.7159994,48.6819992 25.84,48.846 C25.9640006,49.0100008 26.127999,49.1399995 26.332,49.236 C26.536001,49.3320005 26.7819986,49.38 27.07,49.38 C27.3580014,49.38 27.603999,49.3320005 27.808,49.236 C28.012001,49.1399995 28.1779994,49.0100008 28.306,48.846 C28.4340006,48.6819992 28.5259997,48.496001 28.582,48.288 C28.6380003,48.079999 28.666,47.8600012 28.666,47.628 L28.666,42.504 L30.718,42.504 L30.718,47.796 Z M36.922,51 L35.086,47.628 L34.39,47.628 L34.39,51 L32.374,51 L32.374,42.504 L35.614,42.504 C36.022002,42.504 36.4199981,42.5459996 36.808,42.63 C37.1960019,42.7140004 37.5439985,42.855999 37.852,43.056 C38.1600015,43.256001 38.4059991,43.5199984 38.59,43.848 C38.7740009,44.1760016 38.866,44.5839976 38.866,45.072 C38.866,45.6480029 38.7100016,46.131998 38.398,46.524 C38.0859984,46.916002 37.6540028,47.1959992 37.102,47.364 L39.322,51 L36.922,51 Z M36.838,45.108 C36.838,44.907999 36.7960004,44.7460006 36.712,44.622 C36.6279996,44.4979994 36.5200007,44.4020003 36.388,44.334 C36.2559993,44.2659997 36.1080008,44.2200001 35.944,44.196 C35.7799992,44.1719999 35.6220008,44.16 35.47,44.16 L34.378,44.16 L34.378,46.14 L35.35,46.14 C35.5180008,46.14 35.6899991,46.1260001 35.866,46.098 C36.0420009,46.0699999 36.2019993,46.0200004 36.346,45.948 C36.4900007,45.8759996 36.6079995,45.7720007 36.7,45.636 C36.7920005,45.4999993 36.838,45.3240011 36.838,45.108 Z M44.818,44.712 C44.6419991,44.4879989 44.4120014,44.3100007 44.128,44.178 C43.8439986,44.0459993 43.5700013,43.98 43.306,43.98 C43.1699993,43.98 43.0320007,43.9919999 42.892,44.016 C42.7519993,44.0400001 42.6260006,44.0859997 42.514,44.154 C42.4019994,44.2220003 42.3080004,44.3099995 42.232,44.418 C42.1559996,44.5260005 42.118,44.6639992 42.118,44.832 C42.118,44.9760007 42.1479997,45.0959995 42.208,45.192 C42.2680003,45.2880005 42.3559994,45.3719996 42.472,45.444 C42.5880006,45.5160004 42.7259992,45.5819997 42.886,45.642 C43.0460008,45.7020003 43.225999,45.7639997 43.426,45.828 C43.7140014,45.9240005 44.0139984,46.0299994 44.326,46.146 C44.6380016,46.2620006 44.9219987,46.415999 45.178,46.608 C45.4340013,46.800001 45.6459992,47.0379986 45.814,47.322 C45.9820008,47.6060014 46.066,47.9599979 46.066,48.384 C46.066,48.8720024 45.9760009,49.2939982 45.796,49.65 C45.6159991,50.0060018 45.3740015,50.2999988 45.07,50.532 C44.7659985,50.7640012 44.418002,50.9359994 44.026,51.048 C43.633998,51.1600006 43.2300021,51.216 42.814,51.216 C42.205997,51.216 41.6180028,51.1100011 41.05,50.898 C40.4819972,50.6859989 40.0100019,50.384002 39.634,49.992 L40.978,48.624 C41.186001,48.8800013 41.4599983,49.0939991 41.8,49.266 C42.1400017,49.4380009 42.4779983,49.524 42.814,49.524 C42.9660008,49.524 43.1139993,49.5080002 43.258,49.476 C43.4020007,49.4439998 43.5279995,49.3920004 43.636,49.32 C43.7440005,49.2479996 43.8299997,49.1520006 43.894,49.032 C43.9580003,48.9119994 43.99,48.7680008 43.99,48.6 C43.99,48.4399992 43.9500004,48.3040006 43.87,48.192 C43.7899996,48.0799994 43.6760007,47.9780005 43.528,47.886 C43.3799993,47.7939995 43.1960011,47.7100004 42.976,47.634 C42.7559989,47.5579996 42.5060014,47.4760004 42.226,47.388 C41.9539986,47.2999996 41.6880013,47.1960006 41.428,47.076 C41.1679987,46.9559994 40.936001,46.8020009 40.732,46.614 C40.527999,46.4259991 40.3640006,46.1980013 40.24,45.93 C40.1159994,45.6619987 40.054,45.3360019 40.054,44.952 C40.054,44.4799976 40.149999,44.0760017 40.342,43.74 C40.534001,43.4039983 40.7859984,43.1280011 41.098,42.912 C41.4100016,42.6959989 41.761998,42.5380005 42.154,42.438 C42.546002,42.3379995 42.941998,42.288 43.342,42.288 C43.8220024,42.288 44.3119975,42.3759991 44.812,42.552 C45.3120025,42.7280009 45.7499981,42.9879983 46.126,43.332 L44.818,44.712 Z M52.45,44.256 L52.45,46.008 L55.738,46.008 L55.738,47.7 L52.45,47.7 L52.45,51 L50.422,51 L50.422,42.504 L56.014,42.504 L56.014,44.256 L52.45,44.256 Z M66.19,46.716 C66.19,47.3880034 66.0740012,48.0019972 65.842,48.558 C65.6099988,49.1140028 65.2880021,49.589998 64.876,49.986 C64.4639979,50.382002 63.9740028,50.6879989 63.406,50.904 C62.8379972,51.1200011 62.2220033,51.228 61.558,51.228 C60.8939967,51.228 60.2800028,51.1200011 59.716,50.904 C59.1519972,50.6879989 58.6640021,50.382002 58.252,49.986 C57.8399979,49.589998 57.5180012,49.1140028 57.286,48.558 C57.0539988,48.0019972 56.938,47.3880034 56.938,46.716 C56.938,46.0359966 57.0539988,45.4220027 57.286,44.874 C57.5180012,44.3259973 57.8399979,43.8600019 58.252,43.476 C58.6640021,43.0919981 59.1519972,42.796001 59.716,42.588 C60.2800028,42.379999 60.8939967,42.276 61.558,42.276 C62.2220033,42.276 62.8379972,42.379999 63.406,42.588 C63.9740028,42.796001 64.4639979,43.0919981 64.876,43.476 C65.2880021,43.8600019 65.6099988,44.3259973 65.842,44.874 C66.0740012,45.4220027 66.19,46.0359966 66.19,46.716 Z M63.994,46.716 C63.994,46.3479982 63.9340006,46.0040016 63.814,45.684 C63.6939994,45.3639984 63.5280011,45.0900011 63.316,44.862 C63.1039989,44.6339989 62.8480015,44.4540007 62.548,44.322 C62.2479985,44.1899993 61.9180018,44.124 61.558,44.124 C61.1979982,44.124 60.8700015,44.1899993 60.574,44.322 C60.2779985,44.4540007 60.0220011,44.6339989 59.806,44.862 C59.5899989,45.0900011 59.4240006,45.3639984 59.308,45.684 C59.1919994,46.0040016 59.134,46.3479982 59.134,46.716 C59.134,47.1000019 59.1939994,47.4539984 59.314,47.778 C59.4340006,48.1020016 59.5999989,48.3799988 59.812,48.612 C60.0240011,48.8440012 60.2779985,49.0259993 60.574,49.158 C60.8700015,49.2900007 61.1979982,49.356 61.558,49.356 C61.9180018,49.356 62.2459985,49.2900007 62.542,49.158 C62.8380015,49.0259993 63.0939989,48.8440012 63.31,48.612 C63.5260011,48.3799988 63.6939994,48.1020016 63.814,47.778 C63.9340006,47.4539984 63.994,47.1000019 63.994,46.716 Z M72.094,51 L70.258,47.628 L69.562,47.628 L69.562,51 L67.546,51 L67.546,42.504 L70.786,42.504 C71.194002,42.504 71.5919981,42.5459996 71.98,42.63 C72.3680019,42.7140004 72.7159985,42.855999 73.024,43.056 C73.3320015,43.256001 73.5779991,43.5199984 73.762,43.848 C73.9460009,44.1760016 74.038,44.5839976 74.038,45.072 C74.038,45.6480029 73.8820016,46.131998 73.57,46.524 C73.2579984,46.916002 72.8260028,47.1959992 72.274,47.364 L74.494,51 L72.094,51 Z M72.01,45.108 C72.01,44.907999 71.9680004,44.7460006 71.884,44.622 C71.7999996,44.4979994 71.6920007,44.4020003 71.56,44.334 C71.4279993,44.2659997 71.2800008,44.2200001 71.116,44.196 C70.9519992,44.1719999 70.7940008,44.16 70.642,44.16 L69.55,44.16 L69.55,46.14 L70.522,46.14 C70.6900008,46.14 70.8619991,46.1260001 71.038,46.098 C71.2140009,46.0699999 71.3739993,46.0200004 71.518,45.948 C71.6620007,45.8759996 71.7799995,45.7720007 71.872,45.636 C71.9640005,45.4999993 72.01,45.3240011 72.01,45.108 Z M82.138,44.256 L82.138,51 L80.086,51 L80.086,44.256 L77.686,44.256 L77.686,42.504 L84.538,42.504 L84.538,44.256 L82.138,44.256 Z M90.838,51 L90.838,47.448 L87.526,47.448 L87.526,51 L85.474,51 L85.474,42.504 L87.526,42.504 L87.526,45.72 L90.838,45.72 L90.838,42.504 L92.89,42.504 L92.89,51 L90.838,51 Z M94.642,51 L94.642,42.504 L100.354,42.504 L100.354,44.244 L96.622,44.244 L96.622,45.84 L100.15,45.84 L100.15,47.484 L96.622,47.484 L96.622,49.248 L100.57,49.248 L100.57,51 L94.642,51 Z M109.414,44.712 C109.237999,44.4879989 109.008001,44.3100007 108.724,44.178 C108.439999,44.0459993 108.166001,43.98 107.902,43.98 C107.765999,43.98 107.628001,43.9919999 107.488,44.016 C107.347999,44.0400001 107.222001,44.0859997 107.11,44.154 C106.997999,44.2220003 106.904,44.3099995 106.828,44.418 C106.752,44.5260005 106.714,44.6639992 106.714,44.832 C106.714,44.9760007 106.744,45.0959995 106.804,45.192 C106.864,45.2880005 106.951999,45.3719996 107.068,45.444 C107.184001,45.5160004 107.321999,45.5819997 107.482,45.642 C107.642001,45.7020003 107.821999,45.7639997 108.022,45.828 C108.310001,45.9240005 108.609998,46.0299994 108.922,46.146 C109.234002,46.2620006 109.517999,46.415999 109.774,46.608 C110.030001,46.800001 110.241999,47.0379986 110.41,47.322 C110.578001,47.6060014 110.662,47.9599979 110.662,48.384 C110.662,48.8720024 110.572001,49.2939982 110.392,49.65 C110.211999,50.0060018 109.970002,50.2999988 109.666,50.532 C109.361998,50.7640012 109.014002,50.9359994 108.622,51.048 C108.229998,51.1600006 107.826002,51.216 107.41,51.216 C106.801997,51.216 106.214003,51.1100011 105.646,50.898 C105.077997,50.6859989 104.606002,50.384002 104.23,49.992 L105.574,48.624 C105.782001,48.8800013 106.055998,49.0939991 106.396,49.266 C106.736002,49.4380009 107.073998,49.524 107.41,49.524 C107.562001,49.524 107.709999,49.5080002 107.854,49.476 C107.998001,49.4439998 108.123999,49.3920004 108.232,49.32 C108.340001,49.2479996 108.426,49.1520006 108.49,49.032 C108.554,48.9119994 108.586,48.7680008 108.586,48.6 C108.586,48.4399992 108.546,48.3040006 108.466,48.192 C108.386,48.0799994 108.272001,47.9780005 108.124,47.886 C107.975999,47.7939995 107.792001,47.7100004 107.572,47.634 C107.351999,47.5579996 107.102001,47.4760004 106.822,47.388 C106.549999,47.2999996 106.284001,47.1960006 106.024,47.076 C105.763999,46.9559994 105.532001,46.8020009 105.328,46.614 C105.123999,46.4259991 104.960001,46.1980013 104.836,45.93 C104.711999,45.6619987 104.65,45.3360019 104.65,44.952 C104.65,44.4799976 104.745999,44.0760017 104.938,43.74 C105.130001,43.4039983 105.381998,43.1280011 105.694,42.912 C106.006002,42.6959989 106.357998,42.5380005 106.75,42.438 C107.142002,42.3379995 107.537998,42.288 107.938,42.288 C108.418002,42.288 108.907998,42.3759991 109.408,42.552 C109.908003,42.7280009 110.345998,42.9879983 110.722,43.332 L109.414,44.712 Z M117.778,51 L117.118,49.332 L113.83,49.332 L113.206,51 L110.974,51 L114.538,42.504 L116.53,42.504 L120.058,51 L117.778,51 Z M115.498,44.772 L114.418,47.688 L116.554,47.688 L115.498,44.772 Z M124.978,51 L122.926,51 L119.71,42.504 L122.014,42.504 L123.982,48.528 L124.03,48.528 L125.986,42.504 L128.254,42.504 L124.978,51 Z M128.95,51 L128.95,42.504 L131.014,42.504 L131.014,51 L128.95,51 Z M138.166,51 L134.746,45.444 L134.71,45.444 L134.758,51 L132.766,51 L132.766,42.504 L135.106,42.504 L138.514,48.048 L138.55,48.048 L138.502,42.504 L140.494,42.504 L140.494,51 L138.166,51 Z M149.794,50.484 C149.377998,50.7000011 148.892003,50.8759993 148.336,51.012 C147.779997,51.1480007 147.174003,51.216 146.518,51.216 C145.837997,51.216 145.212003,51.1080011 144.64,50.892 C144.067997,50.6759989 143.576002,50.372002 143.164,49.98 C142.751998,49.587998 142.430001,49.1180027 142.198,48.57 C141.965999,48.0219973 141.85,47.4120034 141.85,46.74 C141.85,46.0599966 141.967999,45.4440028 142.204,44.892 C142.440001,44.3399972 142.765998,43.8700019 143.182,43.482 C143.598002,43.0939981 144.085997,42.796001 144.646,42.588 C145.206003,42.379999 145.809997,42.276 146.458,42.276 C147.130003,42.276 147.753997,42.377999 148.33,42.582 C148.906003,42.786001 149.373998,43.0599983 149.734,43.404 L148.438,44.88 C148.237999,44.6479988 147.974002,44.4580007 147.646,44.31 C147.317998,44.1619993 146.946002,44.088 146.53,44.088 C146.169998,44.088 145.838002,44.1539993 145.534,44.286 C145.229998,44.4180007 144.966001,44.6019988 144.742,44.838 C144.517999,45.0740012 144.344001,45.3539984 144.22,45.678 C144.095999,46.0020016 144.034,46.3559981 144.034,46.74 C144.034,47.132002 144.089999,47.4919984 144.202,47.82 C144.314001,48.1480016 144.479999,48.4299988 144.7,48.666 C144.920001,48.9020012 145.191998,49.0859993 145.516,49.218 C145.840002,49.3500007 146.209998,49.416 146.626,49.416 C146.866001,49.416 147.093999,49.3980002 147.31,49.362 C147.526001,49.3259998 147.725999,49.2680004 147.91,49.188 L147.91,47.64 L146.29,47.64 L146.29,45.984 L149.794,45.984 L149.794,50.484 Z M160.702,47.448 L160.702,44.34 L160.678,44.34 L159.514,47.448 L158.566,47.448 L157.414,44.34 L157.39,44.34 L157.39,47.448 L156.13,47.448 L156.13,42.504 L157.93,42.504 L159.07,45.624 L160.174,42.504 L161.974,42.504 L161.974,47.448 L160.702,47.448 Z M153.814,43.644 L153.814,47.448 L152.494,47.448 L152.494,43.644 L151.078,43.644 L151.078,42.504 L155.23,42.504 L155.23,43.644 L153.814,43.644 Z", id: "YOURS-FOR-THE-SAVING", fill: "#602D6C" }), React.createElement("g", { id: "Purple-Logo" }, React.createElement("path", { d: "M16.9320979,13.8839145 C18.4115061,9.86507328 19.7601214,6.01657027 20.5358687,3.7766361 C23.749991,3.41015082 25.3981468,4.39767789 25.3981468,6.79491003 C25.3981468,9.13291772 23.3947473,11.4456599 19.149572,13.0593906 C18.3517073,13.3625763 17.6038115,13.6394099 16.9320979,13.8839145 M8.73477189,22.1392206 C6.78805497,25.9282578 5.58582114,27.5252059 4.05459669,27.7492874 C3.36116387,27.8507531 2.82201631,27.5458204 2.82201631,26.5857774 C2.82201631,25.5339067 4.00581532,21.6377815 10.3473932,18.511886 C9.70359254,20.064125 9.1377854,21.3545341 8.73477189,22.1392206 M27.3387956,28.9961838 C26.0714734,28.8640826 25.0885314,28.6408287 24.1540185,27.8815975 C23.3022856,27.1893985 22.6397641,26.0548989 22.1005679,24.5866404 C20.9484056,21.4495877 19.8077874,17.5748999 19.248037,15.6088079 C26.640797,13.0150248 30.1015074,9.69706924 30.1015074,5.97355457 C30.1015074,2.55126428 27.2985318,0.297690885 21.0765175,1.08160347 C18.3245052,1.42826392 16.3101921,1.80773932 14.178185,2.2205906 C6.21018863,3.76401491 3.22222519,7.19359742 3.22222519,10.7213443 C3.22222519,13.1098236 5.32466799,14.763192 7.75935701,14.763192 C9.41946185,14.763192 9.57854584,13.844093 9.08749719,13.4772388 C8.05471827,12.7053864 7.43612086,11.9338145 7.43612086,10.6105588 C7.43612086,8.53592502 9.00133843,5.88296289 14.7562371,4.60906987 C15.1281839,4.52689228 15.4457888,4.45621393 15.7290428,4.39310827 C14.7748204,7.07944628 13.0803647,11.8188219 11.5393617,15.9002158 C2.75060449,19.4080493 0,24.2116525 0,27.5458753 C0,30.037287 1.96785493,31.4702063 4.29188907,31.4702063 C7.83312694,31.4702063 10.6194901,29.1064083 12.8500448,23.7903871 C13.6646112,21.8498178 14.5563263,19.5715631 15.4429732,17.2262762 C16.0075102,19.2978248 17.0459204,22.9198094 18.1533139,25.8358521 C18.7933102,27.5214745 19.3736148,28.7314204 20.2436494,29.5963887 C21.2958563,30.6422599 22.7115631,31.1642139 24.3877171,31.1642139 C26.379505,31.1642139 27.578407,30.4843556 27.89207,30.0067158 C28.2538805,29.4553125 28.0367942,29.0688254 27.3387956,28.9961838", id: "Fill-32", fill: "#602D6C" }), React.createElement("path", { d: "M112.176721,12.9583202 C113.85059,12.9583202 112.547744,17.4518987 108.177292,17.5862917 C109.263975,15.1884807 111.054322,12.9583202 112.176721,12.9583202 M112.083731,22.5613761 C111.387592,22.5613761 110.378954,23.6620547 108.578842,23.6620547 C107.354767,23.6620547 106.706727,22.8917217 106.706727,21.2831687 C106.706727,20.8874925 106.760586,20.4588669 106.857936,20.0120624 C106.999641,20.0194476 107.155458,20.0239924 107.330861,20.0239924 C113.139028,20.0239924 116.643341,16.7137192 116.643341,13.4719012 C116.643341,11.1285209 114.819324,9.95342226 113.055215,9.95342226 C108.693762,9.95342226 103.467967,15.0386994 102.570503,20.2384472 C101.335195,22.3503299 100.306107,23.1263438 99.6502905,23.0939625 C98.930246,23.0584568 98.9858335,22.0793499 99.6508666,20.2094745 C100.658353,17.3775349 102.099306,13.5443329 103.368024,10.5911057 C105.882708,4.73833602 107.458165,1.50077868 107.668418,0.81594355 C107.878959,0.131108424 107.507704,0.029419923 106.805517,0.131108424 C104.282481,0.495823605 102.864857,0.387602044 101.786519,2.15266446 C100.094414,4.92211384 92.8098677,16.1229034 92.8098677,16.1229034 C92.8098677,16.1229034 94.9708653,2.30406102 95.306118,0.874457045 C95.4852651,0.109804967 95.0618789,-0.13021398 94.3910854,0.0643575923 C93.574843,0.300967986 92.8579666,0.448387908 91.7658031,0.803445522 C90.8159204,1.11220362 90.6007711,1.43203952 89.9417864,2.93379121 C89.5981811,3.71690628 86.8113209,11.8738579 84.8418551,15.9928103 C82.753726,20.3600189 81.0976237,22.9164337 77.1733811,23.2359856 C76.1143396,23.3223356 76.0529918,23.8526496 76.3453299,24.514193 C76.9573677,25.8989177 78.4815579,26.7155502 79.873548,26.7155502 C82.3216993,26.7155502 84.0593107,25.0078651 85.730102,21.0465583 C87.1137396,17.7652579 89.1557858,12.0956979 90.6724875,7.84210766 C89.4115456,14.4615178 87.9017563,23.306429 87.6886231,25.6179961 C87.5624713,26.9876664 89.418458,27.0194795 90.1696085,25.6858831 C92.1408023,22.1867193 96.3591111,15.0460846 100.159794,8.56812947 C98.6140025,12.2184058 96.7934419,16.5762409 95.9443654,19.0164809 C95.3634335,20.810232 94.8498978,22.123377 94.8498978,23.7640273 C94.8498978,25.6574785 96.1839963,26.7899703 97.635894,26.7899703 C99.1425151,26.7899703 100.858813,26.0383843 102.692623,23.7509611 C103.242161,25.6631594 104.686858,26.8422348 107.138753,26.8422348 C110.331431,26.8422348 112.707578,24.6917218 112.707578,23.318927 C112.707578,22.8218464 112.467659,22.5613761 112.083731,22.5613761", id: "Fill-34", fill: "#602D6C" }), React.createElement("path", { d: "M139.377763,5.45861866 C141.076458,4.27115851 142.38655,4.18957301 142.787298,3.87077489 C143.40172,3.3818207 142.570443,0.925594302 140.189667,0.925594302 C136.390082,0.925594302 134.445329,5.5100287 132.920406,9.5566135 C131.949186,12.1332623 130.866647,15.324317 130.028431,17.8682758 C130.013974,17.9127008 130.005011,17.8816871 130.007613,17.8442472 C130.41877,12.1765697 131.116175,3.19769453 131.16128,2.19436055 C131.18499,1.67048107 131.148269,1.39610793 130.907994,1.27065625 C130.800434,1.19745283 130.546859,1.18152689 130.403734,1.18152689 C129.892536,1.18152689 129.41719,1.20052625 128.943001,1.21589338 C126.709397,1.21505518 123.634396,1.21421697 122.366808,1.21421697 C112.704627,1.21421697 113.427477,9.94777685 119.403126,9.94777685 C120.511399,9.94777685 120.542337,8.90784116 120.005404,8.64855574 C117.836857,7.60079678 117.390136,3.76041094 124.618628,3.76041094 C125.556019,3.76041094 126.125913,3.76348437 126.579862,3.767396 C125.678614,6.75141352 123.980207,11.7912738 121.837104,16.2273455 C119.548274,20.9654513 118.247146,22.7349066 114.680897,23.619774 C113.647801,23.8759859 113.719508,24.4331143 114.006334,25.0866365 C114.34376,25.8549931 115.644889,26.6932002 117.235157,26.6932002 C120.078267,26.6932002 121.572252,24.6907233 123.10209,20.6628585 C124.586533,16.7548573 125.837352,12.9720283 126.763177,10.0427737 C126.766936,10.0313182 126.761731,10.0064514 126.774164,10.0084072 C126.792958,10.0114806 126.772429,10.0452883 126.771851,10.0637288 C126.521167,16.3754288 126.27135,24.4138355 126.229425,25.8798599 C126.197909,26.9913226 126.653882,26.9918814 127.547324,26.6191586 C129.379023,25.8549931 129.994891,25.5909578 130.486718,24.1506385 C132.028699,19.6338195 133.504179,15.8389762 135.233524,11.6054712 C136.317797,8.95114853 137.965605,6.4457473 139.377763,5.45861866", id: "Fill-36", fill: "#602D6C" }), React.createElement("path", { d: "M138.407918,23.1398575 C135.416046,23.1398575 139.371536,12.9583202 142.059139,12.9583202 C144.544099,12.9583202 141.564702,23.1398575 138.407918,23.1398575 M143.581267,10.1815373 C136.240518,10.1815373 132.634767,18.8386638 132.634767,22.5585095 C132.634767,25.2070691 134.286484,26.8422348 137.077962,26.8422348 C143.219212,26.8422348 146.744848,18.3284194 146.744848,14.40283 C146.744848,11.7542704 145.535301,10.1815373 143.581267,10.1815373", id: "Fill-38", fill: "#602D6C" }), React.createElement("path", { d: "M164.270886,5.63541294 C163.640542,5.63541294 161.407893,5.69578885 158.027271,5.8113901 C158.57409,4.49857186 159.017152,3.43355235 159.309636,2.70961378 C159.526398,2.17309805 159.42004,1.8511886 158.839985,1.8511886 C158.322068,1.8511886 157.431031,2.03002718 156.347221,2.31616891 C154.907921,2.69616512 154.735089,2.9511174 153.93885,4.60644729 C153.769775,4.95811548 153.57151,5.41966208 153.343188,5.98049987 C150.060543,6.10439923 146.202178,6.26034647 141.968381,6.44605246 C140.308273,6.5190186 137.99441,8.56836564 139.993535,8.56836564 C143.973864,8.56836564 148.282516,8.7134395 152.227297,8.83419131 C151.612559,10.4371573 150.864008,12.4049539 149.95274,14.7275663 C148.810548,17.6387722 147.17096,21.1299875 147.17096,23.5264244 C147.17096,25.3148102 148.399278,26.8422348 150.566899,26.8422348 C153.276136,26.8422348 154.396073,25.259871 154.107057,24.3656781 C153.939428,23.8469032 153.456482,23.8649301 152.409088,23.8649301 C151.686547,23.8649301 151.433658,23.3762 151.433658,22.8276663 C151.433658,22.0041504 151.824408,21.1528788 152.277007,19.9854206 C153.807348,16.0375231 155.402427,12.1379837 156.720341,8.9555154 C157.820625,8.97869288 158.860794,8.99299997 159.815414,8.99299997 C162.152687,8.99299997 163.066556,8.9260428 163.885628,8.30597368 C164.573197,7.78548188 164.897184,7.49533417 165.282442,7.01833591 C165.684175,6.52130773 165.860475,5.63541294 164.270886,5.63541294", id: "Fill-40", fill: "#602D6C" }), React.createElement("path", { d: "M68.5884087,9.25594302 C69.8506757,9.25594302 71.1208209,8.21995007 71.4251539,6.94182751 C71.7291951,5.66396446 70.9527521,4.62797151 69.6901933,4.62797151 C68.4279263,4.62797151 67.1580729,5.66396446 66.8537399,6.94182751 C66.549407,8.21995007 67.3261417,9.25594302 68.5884087,9.25594302", id: "Fill-42", fill: "#602C6C" }), React.createElement("path", { d: "M49.7228548,23.1398575 C47.0815518,23.1398575 51.5488625,12.9583202 54.0639298,12.9583202 C55.0344012,12.9583202 55.3673548,13.6107812 55.4996542,14.1323568 C53.4415712,19.0557269 51.7464848,23.1398575 49.7228548,23.1398575 M33.0905439,12.9583202 C34.7956823,12.9583202 33.7592256,17.5862917 29.21219,17.5862917 C29.1940019,17.5862917 29.1784884,17.586031 29.1608352,17.586031 C30.2186897,15.1625383 31.9650189,12.9583202 33.0905439,12.9583202 M83.4999097,3.70237721 C84.5762687,3.70237721 81.6316726,11.4538224 76.1944405,15.7351031 C78.5391466,10.0564133 82.2143479,3.70237721 83.4999097,3.70237721 M74.5261432,23.889997 C73.923592,23.7906811 73.7597302,23.4005113 73.7597302,22.7265816 C73.7597302,21.8948814 73.9983359,20.7524641 74.3990784,19.4400747 C84.2670039,14.88431 90.7208561,0.925594302 83.378126,0.925594302 C78.5002212,0.925594302 72.3947908,11.636962 70.4534606,18.8739738 C69.3667987,20.5975312 67.5125739,23.2041494 66.2373272,23.2041494 C65.2311587,23.2041494 65.5031117,21.890625 66.2252532,19.9491399 C67.9141789,15.408982 70.3818789,10.738862 70.3818789,10.738862 C70.3818789,10.738862 69.1359549,10.2187301 67.4591032,10.50249 C66.3534678,10.6894878 65.8653324,11.2456571 65.3498866,12.2169672 C65.2863543,12.2952849 65.215635,12.4121939 65.135429,12.5821661 C61.9372506,19.3569331 59.9309507,23.2041494 58.1161102,23.2041494 C56.8402886,23.2041494 57.5736416,21.819685 58.2957831,19.8782 C59.9847088,15.338042 62.4521214,10.667922 62.4521214,10.667922 C62.4521214,10.667922 61.2064848,10.1477902 59.5296332,10.43155 C58.4751686,10.6097512 57.9824335,11.1253429 57.4917108,12.0152139 C57.1599627,11.0927105 56.439546,10.1628294 54.8819972,10.1628294 C50.1489807,10.1628294 46.5776575,16.1862003 45.5801134,20.4244377 C44.6049924,21.9124745 43.3441195,23.4879093 42.3767604,23.4879093 C41.4186005,23.4879093 41.4329744,22.6706809 42.1850134,20.7402625 C43.3889659,17.6504012 45.7175272,12.2992575 47.5737643,8.10415156 C52.2294496,8.20517008 56.6393423,8.30221595 59.1464267,8.30221595 C61.4712509,8.30221595 62.3802522,8.23581614 63.1949612,7.6209085 C63.8788683,7.10474929 64.2011297,6.81701678 64.5843361,6.34398907 C64.9839288,5.85109817 65.1592896,4.97257761 63.5781677,4.97257761 C62.7120003,4.97257761 56.3288675,5.18142487 48.7460944,5.46660354 C49.3147233,4.19280548 49.7738236,3.17297249 50.0429018,2.5796306 C50.2059011,2.22010684 49.9468846,1.82284302 49.3719312,1.87023092 C48.49139,1.94258969 48.1743032,2.05949875 47.2158558,2.29587073 C45.7784723,2.65057057 45.4205638,3.06713006 44.6285655,4.70896468 C44.5198993,4.93455378 44.3704114,5.2540674 44.1924633,5.64168339 C41.1707956,5.76057877 38.0973821,5.88685192 35.2137033,6.01312506 C33.562437,6.08548383 31.6921136,7.8811163 33.68059,7.8811163 C36.1695633,7.8811163 39.567538,7.93815204 43.127937,8.01022704 C42.5089997,9.41143329 41.8181932,11.0135415 41.2305908,12.4439751 C41.1650461,12.5628704 41.0963391,12.7013453 41.0233201,12.865926 C38.6157026,18.2928335 34.9383006,23.9844891 30.8776921,23.9844891 C29.2965702,23.9844891 28.625887,22.9524544 28.625887,21.640065 C28.625887,21.1335536 28.6980437,20.5844783 28.8242459,20.0166748 C28.977471,20.0254713 29.1496696,20.0308628 29.3445788,20.0308628 C35.1418341,20.0308628 38.567694,16.5111053 38.567694,13.2725539 C38.567694,11.1917427 36.8189732,9.97044024 35.0581784,9.97044024 C30.2788781,9.97044024 24.4574747,16.0936945 24.4574747,21.768892 C24.4574747,24.8193106 26.1222523,26.8422348 28.9492983,26.8422348 C32.747728,26.8422348 35.6914895,24.543496 37.7889196,22.0157631 C37.6762287,22.5943495 37.6095341,23.1547752 37.6095341,23.6854062 C37.6095341,25.4589054 38.6395632,26.7593769 40.3164148,26.7593769 C42.2128987,26.7593769 43.8555406,25.6197972 45.3837668,23.6445447 C45.6905044,25.6169596 46.8447234,26.7593769 48.5575096,26.7593769 C50.5632346,26.7593769 52.2998814,25.2429641 53.6711453,23.4481829 C53.7504889,25.0982466 54.3464281,26.7593769 56.5349883,26.7593769 C58.0979992,26.7593769 59.6946448,25.9342032 61.5948658,23.313397 C61.6477616,25.0281579 62.3681782,26.8303168 64.4405978,26.8303168 C66.4402858,26.8303168 68.2229288,25.4223004 69.8486096,23.2589151 C70.0003973,25.4154901 71.1753146,26.7003548 72.8613655,26.7003548 C74.5980123,26.7003548 76.045745,25.5897187 75.9635267,24.362741 C75.9112059,23.580415 75.1010966,23.9844891 74.5261432,23.889997", id: "Fill-44", fill: "#602D6C" })))))))))); }; var SocialIcons = function () { return (React.createElement("svg", { className: "social-icons", width: "128px", height: "20px", viewBox: "0 0 128 20", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, React.createElement("defs", null, React.createElement("polygon", { id: "social-icons-path-1", points: "0 20 20 20 20 0 0 0" }), React.createElement("path", { d: "M17.5,20 L2.5,20 C1.12,20 0,18.88 0,17.5 L0,2.5 C0,1.12 1.12,0 2.5,0 L17.5,0 C18.88,0 20,1.12 20,2.5 L20,17.5 C20,18.88 18.88,20 17.5,20 Z M7.68,15.08 C12.395,15.08 14.975,11.17 14.975,7.785 C14.975,7.675 14.975,7.565 14.97,7.455 C15.47,7.095 15.905,6.64 16.25,6.125 C15.79,6.33 15.295,6.465 14.775,6.53 C15.305,6.215 15.71,5.71 15.905,5.11 C15.41,5.405 14.86,5.615 14.275,5.73 C13.805,5.23 13.14,4.92 12.405,4.92 C10.99,4.92 9.84,6.07 9.84,7.485 C9.84,7.685 9.865,7.88 9.905,8.07 C7.775,7.965 5.885,6.94 4.62,5.39 C4.4,5.77 4.275,6.21 4.275,6.68 C4.275,7.57 4.73,8.355 5.415,8.815 C4.995,8.8 4.6,8.685 4.255,8.495 C4.255,8.505 4.255,8.515 4.255,8.53 C4.255,9.77 5.14,10.81 6.31,11.045 C6.095,11.105 5.87,11.135 5.635,11.135 C5.47,11.135 5.31,11.12 5.155,11.09 C5.48,12.11 6.43,12.85 7.55,12.87 C6.67,13.56 5.565,13.97 4.365,13.97 C4.16,13.97 3.955,13.96 3.755,13.935 C4.885,14.655 6.235,15.08 7.68,15.08 Z", id: "path-3" })), React.createElement("g", { id: "Web-Final", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("g", { id: "footers", transform: "translate(-197.000000, -857.000000)" }, React.createElement("g", { id: "Footer", transform: "translate(0.000000, 746.000000)" }, React.createElement("g", { id: "RMN-Logo", transform: "translate(178.000000, 32.000000)" }, React.createElement("g", { id: "Social-icon-group" }, React.createElement("g", { transform: "translate(19.000000, 79.000000)" }, React.createElement("g", { id: "Instagram_social", transform: "translate(108.000000, 0.000000)" }, React.createElement("mask", { id: "mask-2", fill: "white" }, React.createElement("use", { xlinkHref: "#social-icons-path-1" })), React.createElement("g", { id: "Clip-8" }), React.createElement("path", { d: "M10,0.159359375 C12.6725781,0.159359375 13.0076562,0.1706875 14.0572656,0.218578125 C15.1047266,0.266351563 15.8200391,0.43271875 16.4460156,0.676 C17.093125,0.927445313 17.6419141,1.26392969 18.1889844,1.811 C18.7360937,2.35810938 19.0725391,2.90689844 19.3240234,3.55396875 C19.5673047,4.17994531 19.7336719,4.89525781 19.7814453,5.94271875 C19.8293359,6.99232813 19.8406641,7.32744531 19.8406641,9.99998438 C19.8406641,12.6725625 19.8293359,13.0076797 19.7814453,14.0572891 C19.7336719,15.1047109 19.5673047,15.8200625 19.3240234,16.446 C19.0725391,17.0931094 18.7360937,17.6418984 18.1889844,18.1889688 C17.6419141,18.7360781 17.093125,19.0725234 16.4460156,19.3240469 C15.8200391,19.5672891 15.1047266,19.7336563 14.0572656,19.7814688 C13.0076562,19.8293203 12.6725781,19.8406484 10,19.8406484 C7.32746094,19.8406484 6.99230469,19.8293203 5.94273437,19.7814688 C4.89527344,19.7336563 4.17996094,19.5672891 3.55398437,19.3240469 C2.90691406,19.0725234 2.35808594,18.7360781 1.81101562,18.1889688 C1.26390625,17.6418984 0.927460937,17.0930703 0.675976562,16.446 C0.432695312,15.8200625 0.266367187,15.1047109 0.218554687,14.0572891 C0.170664062,13.0076797 0.159375,12.6725625 0.159375,9.99998438 C0.159375,7.32740625 0.170664062,6.99232813 0.218554687,5.94271875 C0.266367187,4.89525781 0.432695312,4.17994531 0.675976562,3.55396875 C0.927460937,2.90689844 1.26390625,2.35810938 1.81101562,1.811 C2.35808594,1.26392969 2.90691406,0.927445313 3.55398437,0.676 C4.17996094,0.43271875 4.89527344,0.266351563 5.94273437,0.218578125 C6.99230469,0.1706875 7.32746094,0.159359375 10,0.159359375 Z M10,1.93244531 C7.37242187,1.93244531 7.06121094,1.94244531 6.02351562,1.98978906 C5.06410156,2.03357813 4.54300781,2.19389063 4.19625,2.32865625 C3.73695312,2.50717188 3.40910156,2.72041406 3.06476562,3.06478906 C2.72042969,3.409125 2.50714844,3.7369375 2.32863281,4.19627344 C2.19390625,4.54303125 2.03359375,5.06408594 1.98980469,6.02353906 C1.94246094,7.06119531 1.93246094,7.37244531 1.93246094,9.99998438 C1.93246094,12.6275625 1.94246094,12.9388125 1.98980469,13.9764688 C2.03359375,14.9359219 2.19390625,15.4569766 2.32863281,15.8037344 C2.50714844,16.2630313 2.72042969,16.5908828 3.06476562,16.9352188 C3.40910156,17.2795938 3.73695312,17.4928359 4.19625,17.6713516 C4.54300781,17.8060781 5.06410156,17.9664297 6.02355469,18.0101797 C7.06105469,18.0575234 7.37222656,18.0675625 10,18.0675625 C12.6277734,18.0675625 12.9389453,18.0575234 13.9764453,18.0101797 C14.9358984,17.9664297 15.4569531,17.8060781 15.8037109,17.6713516 C16.2630469,17.4928359 16.5908984,17.2795938 16.9352344,16.9352188 C17.2795703,16.5908828 17.4928125,16.2630313 17.6713672,15.8037344 C17.8060937,15.4569766 17.9664062,14.9359219 18.0101953,13.9764297 C18.0575,12.9388125 18.0675391,12.6275625 18.0675391,9.99998438 C18.0675391,7.37244531 18.0575,7.06119531 18.0101953,6.02353906 C17.9664062,5.06408594 17.8060937,4.54303125 17.6713672,4.19627344 C17.4928125,3.7369375 17.2795703,3.409125 16.9352344,3.06475 C16.5908984,2.72041406 16.2630469,2.50717188 15.8037109,2.32865625 C15.4569531,2.19389063 14.9358984,2.03357813 13.9764453,1.98978906 C12.9387891,1.94244531 12.6275781,1.93244531 10,1.93244531 Z M10,13.2802188 C11.8116016,13.2802188 13.2802344,11.8115859 13.2802344,9.99998438 C13.2802344,8.18838281 11.8116016,6.71978906 10,6.71978906 C8.18839844,6.71978906 6.71976563,8.18838281 6.71976563,9.99998438 C6.71976563,11.8115859 8.18839844,13.2802188 10,13.2802188 Z M10,4.94670313 C12.7908594,4.94670313 15.0532813,7.209125 15.0532813,9.99998438 C15.0532813,12.7908828 12.7908594,15.0533047 10,15.0533047 C7.20914063,15.0533047 4.94667969,12.7908828 4.94667969,9.99998438 C4.94667969,7.209125 7.20914063,4.94670313 10,4.94670313 Z M16.433832,4.74704687 C16.433832,5.39923437 15.9051602,5.92790625 15.2529727,5.92790625 C14.6007852,5.92790625 14.0720742,5.39923437 14.0720742,4.74704687 C14.0720742,4.09485937 14.6007852,3.5661875 15.2529727,3.5661875 C15.9051602,3.5661875 16.433832,4.09485937 16.433832,4.74704687 Z", id: "Instagram", fill: "#323232" })), React.createElement("g", { id: "Pinterest_social", transform: "translate(36.000000, 0.000000)", fill: "#323232" }, React.createElement("path", { d: "M10,0 C4.47736626,0 0,4.45901639 0,9.95901639 C0,14.1803279 2.63374486,17.7868852 6.35390947,19.2377049 C6.26337449,18.4508197 6.18930041,17.2377049 6.38683128,16.3770492 C6.56790123,15.5983607 7.55555556,11.4262295 7.55555556,11.4262295 C7.55555556,11.4262295 7.25925926,10.8278689 7.25925926,9.95081967 C7.25925926,8.56557377 8.06584362,7.53278689 9.06995885,7.53278689 C9.92592593,7.53278689 10.3374486,8.17213115 10.3374486,8.93442623 C10.3374486,9.78688525 9.79423868,11.0655738 9.50617284,12.2540984 C9.26748971,13.2459016 10.0082305,14.057377 10.9876543,14.057377 C12.7654321,14.057377 14.1316872,12.1885246 14.1316872,9.5 C14.1316872,7.1147541 12.4115226,5.45081967 9.95061728,5.45081967 C7.10288066,5.45081967 5.43209877,7.57377049 5.43209877,9.7704918 C5.43209877,10.6229508 5.76131687,11.5409836 6.17283951,12.0409836 C6.25514403,12.1393443 6.26337449,12.2295082 6.23868313,12.3278689 C6.16460905,12.6393443 5.99176955,13.3196721 5.95884774,13.4590164 C5.91769547,13.6393443 5.81069959,13.6803279 5.62139918,13.5901639 C4.37037037,13.0081967 3.58847737,11.1967213 3.58847737,9.7295082 C3.58847737,6.59016393 5.87654321,3.70491803 10.1975309,3.70491803 C13.6625514,3.70491803 16.3621399,6.16393443 16.3621399,9.45901639 C16.3621399,12.8934426 14.1893004,15.6557377 11.1769547,15.6557377 C10.1646091,15.6557377 9.20987654,15.1311475 8.88888889,14.5081967 C8.88888889,14.5081967 8.38683128,16.4098361 8.26337449,16.8770492 C8.04115226,17.7459016 7.43209877,18.8278689 7.02057613,19.4918033 C7.95884774,19.7786885 8.94650206,19.9344262 9.98353909,19.9344262 C15.5061728,19.9344262 19.9835391,15.4754098 19.9835391,9.97540984 C20,4.45901639 15.5226337,0 10,0 Z", id: "Pinterest" })), React.createElement("g", { id: "Twitter_social", transform: "translate(72.000000, 0.000000)" }, React.createElement("mask", { id: "mask-4", fill: "white" }, React.createElement("use", { xlinkHref: "#path-3" })), React.createElement("use", { id: "Twitter", fill: "#323232", xlinkHref: "#path-3" })), React.createElement("g", { id: "Facebook_social", fill: "#323232" }, React.createElement("path", { d: "M18.8965517,0 L1.10344828,0 C0.494030621,-3.7316069e-17 7.46321381e-17,0.494030621 0,1.10344828 L0,18.8965517 C7.46321381e-17,19.5059694 0.494030621,20 1.10344828,20 L10.6896552,20 L10.6896552,12.2655172 L8.0862069,12.2655172 L8.0862069,9.23793103 L10.6896552,9.23793103 L10.6896552,7.01034483 C10.6896552,4.42758621 12.2689655,3.02068966 14.5724138,3.02068966 C15.3486461,3.01899684 16.1244303,3.05813135 16.8965517,3.13793103 L16.8965517,5.83793103 L15.3103448,5.83793103 C14.0551724,5.83793103 13.8103448,6.43103448 13.8103448,7.30689655 L13.8103448,9.23448276 L16.8103448,9.23448276 L16.4206897,12.262069 L13.7931034,12.262069 L13.7931034,20 L18.8965517,20 C19.5059694,20 20,19.5059694 20,18.8965517 L20,1.10344828 C20,0.494030621 19.5059694,3.7316069e-17 18.8965517,0 Z", id: "Facebook" })))))))))); }; /* tslint:enable max-line-length */ var Footer = /** @class */ (function (_super) { __extends(Footer, _super); function Footer() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.state = { currentBreakpoint: 'small', }; return _this; } Footer.prototype.render = function () { var currentBreakpoint = this.state.currentBreakpoint; var isDesktop = currentBreakpoint !== 'xsmall' && currentBreakpoint !== 'small' && currentBreakpoint !== 'large' && currentBreakpoint !== 'medium'; return (React.createElement(StyledFooterElement, null, isDesktop ? this.renderDesktopFooter() : this.renderMobileFooter())); }; Footer.prototype.updateBreakpoint = function (newBreakpoint) { this.setState(__assign({}, this.state, { currentBreakpoint: newBreakpoint })); }; Footer.prototype.renderDesktopFooter = function () { var _this = this; return (React.createElement(Container, { whenBreakpoint: function (breakpoint) { return _this.updateBreakpoint(breakpoint); }, py: "32px" }, React.createElement(grid.Flex, { className: "desktop" }, React.createElement(grid.Box, { flex: "0 1 220px", width: 2 / 8 }, React.createElement(FooterLogo, null), React.createElement(SocialIcons, null)), React.createElement(grid.Box, { className: "footer-navigation-sections", width: 4 / 8 }, this.renderDefaultLinks()), React.createElement(grid.Box, { width: 2 / 8 }, React.createElement(MobileCTA, null))), React.createElement(grid.Flex, null, React.createElement(grid.Box, { flex: "0 1 220px", width: 2 / 8 }), React.createElement(grid.Box, { width: 6 / 8 }, this.renderLegalLinks())))); }; Footer.prototype.renderMobileFooter = function () { var _this = this; return (React.createElement(Container, { whenBreakpoint: function (breakpoint) { return _this.updateBreakpoint(breakpoint); } }, React.createElement(grid.Flex, { className: "mobile" }, React.createElement(grid.Box, { width: 1 }, React.createElement(MobileCTA, { className: "mobile-cta" }), React.createElement("hr", null), React.createElement("div", { className: "footer-navigation-sections" }, this.renderDefaultLinks()), React.createElement("hr", null), React.createElement(FooterLogo, null), React.createElement(SocialIcons, null), this.renderLegalLinks())))); }; Footer.prototype.renderDefaultLinks = function () { var items = [ { title: 'Find Deals', key: 1, children: [ { label: 'Seasonal/Ideas', href: '#', key: 1 }, { label: 'Browse Categories', href: '#', key: 2 }, { label: 'Exclusive Deals', href: '#', key: 3 }, { label: 'Deal Squad', href: '#', key: 4 }, ], }, { title: 'Connect', key: 2, children: [ { label: 'Help', href: '#', key: 1 }, { label: 'Facebook', href: '#', key: 2 }, { label: 'Twitter', href: '#', key: 3 }, { label: 'Instagram', href: '#', key: 4 }, ], }, { title: 'Account', key: 3, children: [ { label: 'My Account', href: '#', key: 1 }, { label: 'Community', href: '#', key: 2 }, { label: 'Submit a Coupon', href: '#', key: 3 }, ], }, { title: 'Connect', key: 4, children: [ { label: 'About', href: '#', key: 1 }, { label: 'Blog', href: '#', key: 2 }, { label: 'Careers', href: '#', key: 3 }, { label: 'Contact', href: '#', key: 4 }, ], }, ]; return (React.createElement(Fragment, null, items.map(function (_a) { var title = _a.title, sectionKey = _a.key, children = _a.children; return (React.createElement(FooterSection, { key: sectionKey, title: title }, React.createElement("ul", null, children.map(function (_a) { var key = _a.key, href = _a.href, label = _a.label; return (React.createElement("li", { key: key }, React.createElement("a", { href: href }, label))); })))); }))); }; Footer.prototype.renderLegalLinks = function () { var currentYear = new Date().getFullYear(); return (React.createElement("ul", { className: "legal-links" }, React.createElement("li", null, React.createElement("a", null, "Terms of Use")), React.createElement("li", null, React.createElement("a", null, "Privacy Policy")), React.createElement("li", null, React.createElement("a", null, "Sitemap")), React.createElement("li", null, React.createElement("a", null, "Ad Choices")), React.createElement("li", null, "\u00A9 ", currentYear, " RetailMeNot, Inc."))); }; return Footer; }(React.Component)); var templateObject_1$d; var StyledMenu = styled__default.nav(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n margin: 0;\n padding: 0;\n display: flex;\n width: 100%;\n min-width: 250px;\n /* TODO: for mobile */\n //overflow-y: hidden;\n //overflow-x: auto;\n\n background: ", ";\n font-size: ", ";\n font-family: ", ";\n border-radius: ", ";\n\n /* TODO: use React.clone to append a run-time class here instead of using a * selector */\n > * > a,\n > a {\n display: inline-block;\n line-height: 1.125rem;\n color: ", ";\n transition: background-color 500ms, color: 500ms;\n margin: 0 0.125rem;\n\n &:hover {\n color: ", ";\n background-color: rgba(255, 255, 255, .1);\n }\n\n &:active,\n &.active {\n color: ", ";\n background-color: rgba(255, 255, 255, .1); // TODO: more or less opacity\n }\n\n &:focus {\n color: ", ";\n background-color: rgba(255, 255, 255, .1);\n }\n\n &:first-child {\n margin-left: 0;\n }\n\n &:last-child {\n margin-right: 0;\n }\n }\n\n /* Positioning */\n justify-content: ", ";\n\n /* Menu Sizes */\n ", ";\n"], ["\n margin: 0;\n padding: 0;\n display: flex;\n width: 100%;\n min-width: 250px;\n /* TODO: for mobile */\n //overflow-y: hidden;\n //overflow-x: auto;\n\n background: ", ";\n font-size: ", ";\n font-family: ", ";\n border-radius: ", ";\n\n /* TODO: use React.clone to append a run-time class here instead of using a * selector */\n > * > a,\n > a {\n display: inline-block;\n line-height: 1.125rem;\n color: ", ";\n transition: background-color 500ms, color: 500ms;\n margin: 0 0.125rem;\n\n &:hover {\n color: ", ";\n background-color: rgba(255, 255, 255, .1);\n }\n\n &:active,\n &.active {\n color: ", ";\n background-color: rgba(255, 255, 255, .1); // TODO: more or less opacity\n }\n\n &:focus {\n color: ", ";\n background-color: rgba(255, 255, 255, .1);\n }\n\n &:first-child {\n margin-left: 0;\n }\n\n &:last-child {\n margin-right: 0;\n }\n }\n\n /* Positioning */\n justify-content: ", ";\n\n /* Menu Sizes */\n ", ";\n"])), function (_a) { var _b = _a.bg, bg = _b === void 0 ? colors.main.grapePurchase.base : _b; return bg; }, fonts.navigation.menu.fontSize, fonts.fontFamily, variables.borderRadius, function (_a) { var _b = _a.color, color = _b === void 0 ? colors.neutrals.white.base : _b; return color; }, function (_a) { var _b = _a.color, color = _b === void 0 ? colors.neutrals.white.base : _b; return polished.lighten(20, color); }, function (_a) { var _b = _a.color, color = _b === void 0 ? colors.neutrals.white.base : _b; return polished.lighten(20, color); }, function (_a) { var _b = _a.color, color = _b === void 0 ? colors.neutrals.silver.dark : _b; return polished.lighten(20, color); }, function (_a) { var _b = _a.justify, justify = _b === void 0 ? 'flex-start' : _b; return justify; }, function (_a) { var _b = _a.size, size = _b === void 0 ? 'large' : _b; return MenuSizes[size]; }); var MenuSizes = { small: styled.css(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n > * > a,\n > a {\n font-size: ", ";\n line-height: ", ";\n font-weight: ", ";\n padding: .5rem .75rem;\n }\n "], ["\n > * > a,\n > a {\n font-size: ", ";\n line-height: ", ";\n font-weight: ", ";\n padding: .5rem .75rem;\n }\n "])), fonts.navigation.menu.small.base.fontSize, fonts.navigation.menu.small.base.fontSize, fonts.navigation.menu.small.base.fontWeight), large: styled.css(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n > * > a,\n > a {\n border-radius: ", ";\n font-weight: ", ";\n padding: 1rem .75rem;\n }\n "], ["\n > * > a,\n > a {\n border-radius: ", ";\n font-weight: ", ";\n padding: 1rem .75rem;\n }\n "])), variables.borderRadius, fonts.navigation.menu.large.base.fontWeight), }; var DefaultProps$5 = { size: 'large', }; var Menu = function (_a) { if (_a === void 0) { _a = DefaultProps$5; } var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]); return (React.createElement(StyledMenu, __assign({ className: classNames(className) }, props), children)); }; Menu.defaultProps = DefaultProps$5; var templateObject_1$e, templateObject_2$3, templateObject_3$1; var StyledItem$1 = styled__default.a(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n cursor: pointer;\n text-align: center;\n color: ", ";\n text-decoration: none;\n transition: color 250ms;\n\n // Disable Select\n user-select: none;\n -webkit-touch-callout: none;\n\n // TODO: this doesn't go here (Law of Demeter)\n /* Icons */\n svg {\n max-width: 8px;\n }\n"], ["\n cursor: pointer;\n text-align: center;\n color: ", ";\n text-decoration: none;\n transition: color 250ms;\n\n // Disable Select\n user-select: none;\n -webkit-touch-callout: none;\n\n // TODO: this doesn't go here (Law of Demeter)\n /* Icons */\n svg {\n max-width: 8px;\n }\n"])), colors.neutrals.silver.dark); var DefaultProps$6 = { path: '/', as: 'a', }; var Item$1 = function (_a) { if (_a === void 0) { _a = DefaultProps$6; } var className = _a.className, children = _a.children, label = _a.label, size = _a.size, active = _a.active, props = __rest(_a, ["className", "children", "label", "size", "active"]); return (React.createElement(StyledItem$1, __assign({ className: classNames(className, { active: active }) }, props), label ? label : children)); }; Item$1.defaultProps = DefaultProps$6; var templateObject_1$f; var StyledHeaderElement = styled__default.header(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n background-color: ", ";\n margin: 0;\n color: ", ";\n"], ["\n background-color: ", ";\n margin: 0;\n color: ", ";\n"])), colors.main.grapePurchase.base, colors.neutrals.white.base); /* tslint:disable max-line-length */ var LargeLogo = function () { return (React.createElement("svg", { width: "114px", height: "22px", viewBox: "0 0 114 22", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, React.createElement("g", { stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("g", { fill: "#FFFFFF" }, React.createElement("path", { d: "M18.8249268,20.2704754 C19.3055541,20.3212573 19.4550353,20.5914404 19.2059001,20.976912 C18.9899183,21.3108175 18.1643792,21.7860887 16.7928754,21.7860887 C15.6387106,21.7860887 14.6638843,21.4212043 13.9393565,20.6900631 C13.3402688,20.0853863 12.9406831,19.2395447 12.4999949,18.06117 C11.7374667,16.0226407 11.022439,13.4906057 10.6337105,12.0424402 C10.0231839,13.6819691 9.40916744,15.2746375 8.84827396,16.6312389 C7.31236033,20.3475305 5.39372851,22 2.95530567,22 C1.35502403,22 0,20.9982835 0,19.2566027 C0,16.9257345 1.89400912,13.5676609 7.94576475,11.115426 C9.00686742,8.26222999 10.1736344,4.94905616 10.8306921,3.07110735 C10.6356493,3.11522288 10.4169532,3.16463226 10.1608384,3.22208048 C6.19813467,4.11262584 5.12035837,5.96724244 5.12035837,7.41756477 C5.12035837,8.34261828 5.5463117,8.88200408 6.25746181,9.42158594 C6.59558771,9.67804418 6.48604578,10.3205623 5.34293207,10.3205623 C3.66645578,10.3205623 2.21875733,9.16473556 2.21875733,7.49501203 C2.21875733,5.02885624 4.2762069,2.6313246 9.7628037,1.55235694 C11.2308595,1.26374338 12.6178737,0.998462037 14.5128522,0.756120763 C18.797202,0.20810793 20.7272727,1.78352228 20.7272727,4.17595612 C20.7272727,6.77896807 18.3442994,9.09846424 13.2537985,10.9117103 C13.639231,12.2861539 14.424637,14.994847 15.217992,17.1878787 C15.5892713,18.2142999 16.0454699,19.007399 16.6319554,19.4912972 C17.2754416,20.022056 17.952275,20.1781269 18.8249268,20.2704754 Z M11.6590909,9.70588235 C12.1216189,9.53495554 12.6366044,9.3414284 13.1859975,9.12947916 C16.1091371,8.00136219 17.4886364,6.38458446 17.4886364,4.7501443 C17.4886364,3.07430186 16.3537505,2.38394745 14.1405726,2.64014775 C13.6064092,4.20602727 12.6777807,6.89641531 11.6590909,9.70588235 Z M6.01458249,15.4769514 C6.29208922,14.9283975 6.68169227,14.0263062 7.125,12.9411765 C2.75832123,15.1264084 1.94318182,17.8500878 1.94318182,18.5854233 C1.94318182,19.2565642 2.31442763,19.4697348 2.79191106,19.3988027 C3.84628042,19.2421532 4.67411366,18.1257684 6.01458249,15.4769514 Z M77.1785292,15.7720693 C77.4428938,15.7720693 77.608097,15.9541573 77.608097,16.3016534 C77.608097,17.2613384 75.9719316,18.7647059 73.7735203,18.7647059 C72.0851959,18.7647059 71.0904073,17.9404451 70.7120069,16.6036772 C69.4492839,18.202755 68.2674766,18.7281691 67.2300486,18.7281691 C66.230302,18.7281691 65.3116695,17.9364737 65.3116695,16.6128113 C65.3116695,15.4658756 65.6652795,14.5478901 66.0652972,13.2939256 C66.6499536,11.5880175 67.9035538,8.54156866 68.9679538,5.98975573 C66.3508824,10.5183251 63.4462426,15.5101565 62.0889195,17.9563306 C61.5716929,18.8886131 60.293699,18.8663733 60.3805645,17.9088726 C60.5273236,16.2929164 61.5669331,10.1096697 62.4351916,5.48221283 C61.3908223,8.45578676 59.9847116,12.4192282 59.0319676,14.7130997 C57.8814954,17.4823459 56.6850123,18.676144 54.9992661,18.676144 C54.0407707,18.676144 52.9912449,18.1052575 52.5698084,17.1372326 C52.3685105,16.6747649 52.4107533,16.3040362 53.1399872,16.2436712 C55.8421392,16.0202808 56.9824969,14.2331579 58.4203392,11.1801563 C59.7764724,8.3007042 61.6954465,2.59839219 61.9320459,2.05093688 C62.3858091,1.00110146 62.5339565,0.77751253 63.188026,0.561667799 C63.9400671,0.313456286 64.4336932,0.210398866 64.9957408,0.0449907134 C65.4576353,-0.0910291957 65.7491702,0.076761787 65.6258133,0.611310101 C65.3949652,1.61070894 63.9069471,11.271101 63.9069471,11.271101 C63.9069471,11.271101 68.9229344,3.44092135 70.0880825,1.50487155 C70.8306041,0.270962475 71.8067503,0.346617344 73.5440605,0.0916544778 C74.0275721,0.0205667005 74.2832106,0.0916544778 74.1382364,0.570404844 C73.9934605,1.04915521 72.9086333,3.31244707 71.1770745,7.40396565 C70.3034614,9.46848973 69.311251,12.1481812 68.6175169,14.1279163 C68.1595889,15.4350974 68.1213125,16.1195654 68.6171202,16.1443866 C69.0687019,16.1670235 69.7773102,15.6245324 70.6279179,14.1481703 C71.2458926,10.5131623 74.8442666,6.95817777 77.8474729,6.95817777 C79.0622018,6.95817777 80.3181818,7.7796586 80.3181818,9.41785458 C80.3181818,11.684125 77.9051849,13.9982506 73.9058017,13.9982506 C73.785023,13.9982506 73.6777302,13.9950734 73.5801553,13.9899106 C73.5131221,14.30226 73.4760356,14.601901 73.4760356,14.8785079 C73.4760356,16.0030053 73.9222626,16.541525 74.7651356,16.541525 C76.0046549,16.541525 76.6991823,15.7720693 77.1785292,15.7720693 Z M77.24256,9.05882353 C76.4696995,9.05882353 75.2369034,10.6178705 74.4886364,12.2941176 C77.4980389,12.200167 78.3951518,9.05882353 77.24256,9.05882353 Z M95.9726324,3.81597787 C95.0002496,4.50605374 93.8656039,6.25751436 93.1189955,8.11308209 C91.9282048,11.072615 90.9122201,13.7254909 89.8504434,16.8830812 C89.5117818,17.8899708 89.0877082,18.074551 87.8264378,18.6087592 C87.2112324,18.8693199 86.8972587,18.8689293 86.9189601,18.0919347 C86.947829,17.0670754 87.1198476,11.447635 87.2924634,7.03529022 C87.2928616,7.02239891 87.3069974,6.99876484 87.2940562,6.99661629 C87.2854951,6.99524903 87.2890788,7.01263277 87.2864906,7.02064101 C86.6489865,9.06840649 85.787699,11.7128835 84.7655424,14.4448652 C83.7121277,17.2606404 82.6834008,18.6605197 80.725694,18.6605197 C79.6306683,18.6605197 78.7347382,18.074551 78.5023937,17.537413 C78.3048909,17.0805526 78.2555152,16.6910787 78.9668837,16.5119676 C81.4225285,15.8933799 82.3184586,14.6563999 83.8944992,11.3441138 C85.3701956,8.24297184 86.539683,4.71973702 87.160264,2.63368824 C86.8476839,2.63095372 86.4552665,2.62880516 85.8097987,2.62880516 C80.8324092,2.62880516 81.1400119,5.31351869 82.6332287,6.04597964 C83.0029492,6.22723931 82.981646,6.95423121 82.2185126,6.95423121 C78.1038043,6.95423121 77.6060654,0.848827399 84.2592423,0.848827399 C85.1320773,0.848827399 87.2494588,0.849413368 88.7874721,0.849999337 C89.1139889,0.839256576 89.441302,0.825974618 89.793303,0.825974618 C89.8918553,0.825974618 90.0664621,0.837108024 90.1405257,0.888282629 C90.3059741,0.97598262 90.3312592,1.16778973 90.3149334,1.5340202 C90.2838745,2.2354248 89.8036559,8.51232214 89.520542,12.4744476 C89.5187502,12.5006208 89.5249221,12.5223017 89.5348769,12.4912453 C90.112055,10.7128302 90.8574688,8.48204709 91.5262309,6.68077913 C92.5762609,3.85191728 93.9153778,0.647058824 96.5316928,0.647058824 C98.1710458,0.647058824 98.7434455,2.36414261 98.3203674,2.70595772 C98.044421,2.92882117 97.1423189,2.98585546 95.9726324,3.81597787 Z M98.867078,7.11764706 C100.212585,7.11764706 101.045455,8.2171037 101.045455,10.0686426 C101.045455,12.8129198 98.6177747,18.7647059 94.3890371,18.7647059 C92.4668837,18.7647059 91.3295455,17.6216043 91.3295455,15.7700653 C91.3295455,13.1696182 93.8123911,7.11764706 98.867078,7.11764706 Z M95.3048172,16.1764706 C97.4785137,16.1764706 99.5300641,9.05882353 97.8189721,9.05882353 C95.9683446,9.05882353 93.2446768,16.1764706 95.3048172,16.1764706 Z M113.11352,3.93957014 C114.208078,3.93957014 114.086681,4.55887606 113.810057,4.90633549 C113.544776,5.23979253 113.321685,5.44262722 112.848239,5.80648946 C112.284243,6.2399636 111.654972,6.28677161 110.045575,6.28677161 C109.388243,6.28677161 108.672004,6.2767699 107.914371,6.26056713 C107.006884,8.48534766 105.908545,11.2114139 104.854784,13.971286 C104.543134,14.7874256 104.274072,15.3825274 104.274072,15.9582259 C104.274072,16.3416914 104.448206,16.6833499 104.945732,16.6833499 C105.666946,16.6833499 105.999493,16.6707477 106.114919,17.0334098 C106.313929,17.6585167 105.542764,18.7647059 103.677239,18.7647059 C102.184661,18.7647059 101.338866,17.6969232 101.338866,16.4467094 C101.338866,14.7714229 102.467853,12.3308054 103.254342,10.2956573 C103.881822,8.67197958 104.397259,7.29634429 104.820555,6.17575262 C102.104261,6.09133818 99.1374123,5.98992083 96.3966401,5.98992083 C95.0200846,5.98992083 96.6133625,4.55727579 97.7564787,4.50626707 C100.671783,4.37644486 103.328573,4.26742621 105.588934,4.1808114 C105.746152,3.78874434 105.882673,3.46608915 105.999095,3.2202471 C106.547368,2.06304917 106.666377,1.88481868 107.657449,1.61917325 C108.403738,1.41913903 109.017287,1.29411765 109.373914,1.29411765 C109.773328,1.29411765 109.846564,1.51915614 109.697306,1.89422029 C109.495908,2.40030685 109.190825,3.1448342 108.814297,4.06259118 C111.142122,3.98177735 112.679478,3.93957014 113.11352,3.93957014 Z M47.2285536,6.47058824 C46.3593828,6.47058824 45.8245393,5.7463526 46.0340967,4.85285047 C46.2436541,3.95952975 47.1180488,3.23529412 47.9872196,3.23529412 C48.8565913,3.23529412 49.3912338,3.95952975 49.1818774,4.85285047 C48.97232,5.7463526 48.0977244,6.47058824 47.2285536,6.47058824 Z M51.3171542,16.7008735 C51.7130552,16.7669305 52.2708797,16.4844528 52.3069067,17.0313565 C52.3635205,17.8891046 51.3666418,18.6655213 50.1708229,18.6655213 C49.0098433,18.6655213 48.2008196,17.7673059 48.0963018,16.2597006 C46.9768917,17.7720668 45.7494008,18.7563744 44.3724571,18.7563744 C42.9454321,18.7563744 42.4493681,17.4965321 42.4129452,16.2977875 C41.1044925,18.1299247 40.0050755,18.7067821 38.9288187,18.7067821 C37.4218216,18.7067821 37.0114702,17.5455293 36.9568359,16.3920128 C36.012612,17.6466975 34.8167931,18.7067821 33.4356926,18.7067821 C32.2563035,18.7067821 31.4615323,17.908148 31.2503191,16.5292842 C30.1980143,17.9101317 29.0669252,18.7067821 27.7610458,18.7067821 C26.6064006,18.7067821 25.897144,17.7976564 25.897144,16.5578494 C25.897144,16.1868991 25.9430685,15.7951201 26.0206651,15.3906455 C24.5764184,17.1577176 22.5494053,18.7647059 19.9338855,18.7647059 C17.9872404,18.7647059 16.8409091,17.3505324 16.8409091,15.2180643 C16.8409091,11.2506819 20.8494065,6.9700746 24.1403334,6.9700746 C25.3527802,6.9700746 26.556913,7.8238553 26.556913,9.27849608 C26.556913,11.5424829 24.197937,14.0030535 20.2060674,14.0030535 C20.071857,14.0030535 19.9532847,13.9992845 19.847777,13.993135 C19.7608768,14.3900716 19.7111912,14.7739159 19.7111912,15.1280048 C19.7111912,16.045462 20.1730097,16.7669305 21.2617374,16.7669305 C24.0577881,16.7669305 26.5899707,12.7880426 28.2478061,8.99423313 C28.2980855,8.87917904 28.3453957,8.7823749 28.3905284,8.69925824 C28.7951392,7.6992795 29.2708142,6.57928743 29.6970016,5.5997407 C27.2453848,5.54935495 24.90561,5.50948275 23.1917547,5.50948275 C21.8225311,5.50948275 23.110397,4.25420295 24.2474246,4.20361882 C26.233066,4.11534456 28.3493547,4.0270703 30.4300123,3.94395364 C30.5525437,3.67298142 30.6554779,3.44961779 30.7303032,3.29191433 C31.2756568,2.14415059 31.5221052,1.85294472 32.5118576,1.60498332 C33.1718245,1.43974184 33.3901639,1.35801376 33.9964863,1.30742963 C34.3923873,1.27430199 34.5707407,1.55201876 34.4585027,1.80335244 C34.2732211,2.21814227 33.9570941,2.9310809 33.5655481,3.82155989 C38.7868882,3.62219892 43.1821808,3.47619925 43.7786057,3.47619925 C44.8673334,3.47619925 44.7465836,4.09035005 44.4714324,4.43491722 C44.2075644,4.76559854 43.9856619,4.96674483 43.5147377,5.32757827 C42.953746,5.75744416 42.3278265,5.80386253 40.7270009,5.80386253 C39.0006747,5.80386253 35.9641142,5.73602029 32.758306,5.66540088 C31.4801397,8.59808999 29.8767407,12.3389349 29.047724,14.4989763 C28.5298855,15.8484814 28.519988,16.4197845 29.179757,16.4197845 C29.8458604,16.4197845 30.7140713,15.3184391 31.3855193,14.2781914 C32.0724075,11.3153502 34.5315465,7.10456887 37.7906033,7.10456887 C38.8630991,7.10456887 39.359163,7.75462448 39.5875979,8.3995225 C39.9254994,7.77743693 40.2647865,7.41700023 40.9908689,7.29242442 C42.1455141,7.0940553 43.0032336,7.4576659 43.0032336,7.4576659 C43.0032336,7.4576659 41.3042245,10.7224249 40.1412654,13.8963309 C39.6440138,15.2535724 39.1390421,16.2214154 40.0175464,16.2214154 C41.2672078,16.2214154 42.6487043,13.5319268 44.8509035,8.795864 C44.9061317,8.6770409 44.9548275,8.59531282 44.9985745,8.54056294 C45.3534998,7.86154544 45.6896197,7.47274196 46.4509373,7.34201671 C47.6055825,7.14364758 48.4634999,7.50725818 48.4634999,7.50725818 C48.4634999,7.50725818 46.7642929,10.7720172 45.6013338,13.9459232 C45.1040822,15.3031647 44.916821,16.2214154 45.6096477,16.2214154 C46.4877561,16.2214154 47.7645368,14.3991966 48.5127896,13.1943026 C49.8495493,8.13509646 54.0536218,0.647058824 57.4124457,0.647058824 C62.4684971,0.647058824 58.0245086,10.4052327 51.2296601,13.590049 C50.9537171,14.5075061 50.7894182,15.3061402 50.7894182,15.8875601 C50.7894182,16.3586868 50.90225,16.6314443 51.3171542,16.7008735 Z M34.238125,16.1764706 C35.6315546,16.1764706 36.7987559,13.3213615 38.2159091,9.87956187 C38.1248105,9.51494199 37.8955455,9.05882353 37.2272991,9.05882353 C35.495476,9.05882353 32.4193787,16.1764706 34.238125,16.1764706 Z M22.7854612,9.05882353 C22.010448,9.05882353 20.8079621,10.5997349 20.0795455,12.2939354 C20.0917011,12.2939354 20.1023833,12.2941176 20.1149073,12.2941176 C23.2459015,12.2941176 23.9595841,9.05882353 22.7854612,9.05882353 Z M57.4963035,2.58823529 C56.6110923,2.58823529 54.080425,7.03017612 52.4659091,11 C56.2098742,8.00706836 58.2374619,2.58823529 57.4963035,2.58823529 Z", id: "large-logo" }))))); }; var SmallLogo = function () { return (React.createElement("svg", { width: "24px", height: "24px", viewBox: "0 0 24 24", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, React.createElement("defs", null, React.createElement("path", { d: "M13.2765,10.2612361 C14.493,7.00173609 15.6015,3.87873609 16.239,2.06223609 C18.8805,1.76523609 20.2365,2.56623609 20.2365,4.51173609 C20.2365,6.40773609 18.5895,8.28423609 15.099,9.59373609 C14.4435,9.83823609 13.8285,10.0632361 13.2765,10.2612361 M7.041,17.0187361 C5.499,20.1387361 4.548,21.4527361 3.336,21.6372361 C2.787,21.7212361 2.361,21.4707361 2.361,20.6787361 C2.361,19.8132361 3.297,16.6062361 8.316,14.0337361 C7.8075,15.3102361 7.3605,16.3722361 7.041,17.0187361 M21.8505,19.2597361 C21.2265,19.4487361 20.127,19.6047361 19.296,19.2537361 C18.51,18.9237361 18.021,18.1242361 17.4165,16.6137361 C16.8975,15.3192361 16.116,13.0962361 15.5775,11.4552361 C21.3105,9.42873609 24,6.85323609 24,3.96723609 C24,1.27773609 21.765,-0.493763909 16.806,0.122736091 C14.6115,0.395736091 13.005,0.692736091 11.3055,1.01823609 C4.9515,2.23023609 2.5695,4.92423609 2.5695,7.69623609 C2.5695,9.57273609 4.245,10.8717361 6.1875,10.8717361 C7.5105,10.8717361 7.638,10.1502361 7.245,9.86073609 C6.423,9.25623609 5.9295,8.65023609 5.9295,7.60923609 C5.9295,5.98023609 7.1775,3.89523609 11.766,2.89473609 C12.0615,2.83023609 12.315,2.77473609 12.5415,2.72523609 C11.781,4.83573609 10.431,8.55873609 9.201,11.7657361 C2.193,14.5227361 0,18.2952361 0,20.9172361 C0,22.8732361 1.569,23.9997361 3.423,23.9997361 C6.246,23.9997361 8.4675,22.1427361 10.245,17.9667361 C10.9335,16.3512361 11.6895,14.4402361 12.438,12.4827361 C12.9645,14.1717361 13.6725,16.3212361 14.1765,17.6262361 C14.685,18.9507361 15.1485,19.9017361 15.8415,20.5812361 C16.6815,21.4032361 17.7075,21.8127361 19.044,21.8127361 C20.7645,21.8127361 21.948,20.9772361 22.467,20.0667361 C22.8,19.4847361 22.392,19.0947361 21.8505,19.2597361", id: "small-logo-path" })), React.createElement("g", { stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, React.createElement("mask", { id: "small-logo-mask-2", fill: "white" }, React.createElement("use", { xlinkHref: "#small-logo-path" })), React.createElement("use", { id: "Icons-/-RMN-Logo", fill: "#FFFFFF", xlinkHref: "#small-logo-path" })))); }; var Header = /** @class */ (function (_super) { __extends(Header, _super); function Header() { var _this = _super !== null && _super.apply(this, arguments) || this; _this.state = { breakpoint: 'small', }; return _this; } Header.prototype.render = function () { var _a = this.props, className = _a.className, disableSearch = _a.disableSearch, props = __rest(_a, ["className", "disableSearch"]); var breakpoint = this.state.breakpoint; var isDesktop = breakpoint !== 'xsmall' && breakpoint !== 'small' && breakpoint !== 'medium'; return (React.createElement(StyledHeaderElement, __assign({ className: classNames(className) }, props), isDesktop && React.createElement(Menu, { className: "secondary-navigation", size: "small", bg: colors.main.grapePurchase.dark, justify: "flex-end" }, React.createElement(Item$1, { path: "/" }, "Rx Saver"), React.createElement(Item$1, { path: "/" }, "Genie"), React.createElement(Item$1, { path: "/" }, "Everyday"), React.createElement(Item$1, { path: "/" }, "Get The App"), React.createElement(Item$1, { path: "/" }, "Blog")), isDesktop ? this.renderDesktopMenu(disableSearch) : this.renderMobileMenu(disableSearch))); }; Header.prototype.renderDesktopMenu = function (disableSearch) { var _this = this; var primary = this.props.primary; return (React.createElement(Container, { whenBreakpoint: function (breakpoint) { return _this.updateBreakpoint(breakpoint); } }, React.createElement(grid.Flex, { alignItems: "center", py: 4 }, React.createElement(grid.Box, { width: 1 / 6 }, React.createElement(grid.Flex, { justifyContent: "center" }, React.createElement(LargeLogo, null))), React.createElement(grid.Box, { width: 5 / 12, px: 2 }, !disableSearch && React.createElement(AutoComplete, { size: "large", prefix: React.createElement(Icon, { type: "search" }), placeholder: "Stores, brands, categories, etc\u2026", dataSource: [1, 2, 3, 4, 5] })), React.createElement(grid.Box, { width: 5 / 12 }, primary ? primary : React.createElement(Menu, null, React.createElement(DropDown, { overlay: React.createElement("div", null, "1") }, React.createElement(Item$1, { path: "/" }, "Categories \u00A0", React.createElement(Icon, { type: "chevron-down", color: "white" }))), React.createElement(DropDown, { overlay: React.createElement("div", null, "1") }, React.createElement(Item$1, { path: "/" }, "Stores \u00A0", React.createElement(Icon, { type: "chevron-down", color: "white" }))), React.createElement(DropDown, { overlay: React.createElement("div", null, "1") }, React.createElement(Item$1, { path: "/" }, "More \u00A0", React.createElement(Icon, { type: "chevron-down", color: "white" })))))))); }; Header.prototype.renderMobileMenu = function (disableSearch) { var _this = this; return (React.createElement(Container, { whenBreakpoint: function (breakpoint) { return _this.updateBreakpoint(breakpoint); } }, React.createElement(grid.Flex, { alignItems: "center", py: 2 }, React.createElement(grid.Box, { width: 1 / 6 }, React.createElement(grid.Flex, { justifyContent: "center" }, React.createElement(SmallLogo, null))), React.createElement(grid.Box, { flex: 1, width: 3 / 6 }, !disableSearch && React.createElement(AutoComplete, { prefix: React.createElement(Icon, { type: "search" }), placeholder: "Stores, brands, categories, etc\u2026", dataSource: [1, 2, 3, 4, 5] })), React.createElement(grid.Box, { flex: "0 0 120px", width: 2 / 6 }, React.createElement(grid.Flex, { justifyContent: "flex-end", alignItems: "center" }, React.createElement(grid.Box, { width: 1 / 2 }, React.createElement(grid.Flex, { justifyContent: "center" }, React.createElement(Avatar, null))), React.createElement(grid.Box, { width: 1 / 2 }, React.createElement(grid.Flex, { justifyContent: "center" }, React.createElement(Icon, { type: "hamburger", color: "white" })))))))); }; Header.prototype.updateBreakpoint = function (breakpoint) { this.setState(__assign({}, this.state, { breakpoint: breakpoint })); }; return Header; }(React.Component)); var templateObject_1$g; var StyledPageElement = styled__default.section(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: 100vh;\n max-width: 100vw;\n\n header {\n flex: 0 0 auto;\n max-width: 100vw;\n }\n\n footer {\n flex: 0 0 auto;\n max-width: 100vw;\n }\n"], ["\n display: flex;\n flex-direction: column;\n height: 100vh;\n max-width: 100vw;\n\n header {\n flex: 0 0 auto;\n max-width: 100vw;\n }\n\n footer {\n flex: 0 0 auto;\n max-width: 100vw;\n }\n"]))); var StyledBodyElement = styled__default.section(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n flex: 1 0 auto;\n background-color: ", ";\n max-width: 100vw;\n align-self: stretch;\n padding: ", " ", ";\n"], ["\n flex: 1 0 auto;\n background-color: ", ";\n max-width: 100vw;\n align-self: stretch;\n padding: ", " ", ";\n"])), colors.neutrals.silver.base, sizes$1.padding.lg, sizes$1.padding.xl); var Page$$1 = function (_a) { var children = _a.children; return (React.createElement(StyledPageElement, null, React.createElement(NormalizeCSS, null), React.createElement(GlobalCSS$$1, null), React.createElement(Header, null), React.createElement(StyledBodyElement, null, children), React.createElement(Footer, null))); }; var templateObject_1$h, templateObject_2$4; exports.Flex = grid.Flex; exports.Box = grid.Box; exports.Avatar = Avatar; exports.AutoComplete = AutoComplete; exports.Button = Button; exports.Badge = Badge; exports.DropDown = DropDown; exports.Container = Container; exports.Icon = Icon; exports.Page = Page$$1; exports.Footer = Footer; exports.Header = Header; exports.List = List; exports.ListItem = Item; exports.Menu = Menu; exports.MenuItem = Item$1; exports.colors = colors; exports.fonts = fonts; exports.sizes = sizes$1; exports.variables = variables; exports.GlobalCSS = GlobalCSS$$1; exports.NormalizeCSS = NormalizeCSS; //# sourceMappingURL=index.ts.map