\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default PostcodeSelector;\r\n","import React, { useRef } from 'react';\r\nimport { AvForm } from 'availity-reactstrap-validation';\r\nimport { Button } from 'reactstrap';\r\n\r\nimport { hasValidPostcodeAddress } from '../../utilities/addressUtilities';\r\nimport PostcodeSelector from '../common/postcodeSelector';\r\nimport SuburbSelector from '../common/suburbSelector';\r\n\r\nconst AddressPostcodeSelector = ({ selectedAddress, onChange, onNext }) => {\r\n const formRef = useRef(null);\r\n\r\n const handleSubmit = () => {\r\n if (formRef.current) {\r\n formRef.current.submit();\r\n }\r\n };\r\n\r\n const hasSelectedpostcode = hasValidPostcodeAddress(selectedAddress);\r\n\r\n return (\r\n \r\n
\r\n
\r\n \r\n {/* */}\r\n
\r\n\r\n
\r\n \r\n Next\r\n \r\n
\r\n
\r\n \r\n );\r\n};\r\nexport default AddressPostcodeSelector;\r\n","/******************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n if (typeof b !== \"function\" && b !== null)\r\n throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n t[p[i]] = s[p[i]];\r\n }\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {\r\n function accept(f) { if (f !== void 0 && typeof f !== \"function\") throw new TypeError(\"Function expected\"); return f; }\r\n var kind = contextIn.kind, key = kind === \"getter\" ? \"get\" : kind === \"setter\" ? \"set\" : \"value\";\r\n var target = !descriptorIn && ctor ? contextIn[\"static\"] ? ctor : ctor.prototype : null;\r\n var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});\r\n var _, done = false;\r\n for (var i = decorators.length - 1; i >= 0; i--) {\r\n var context = {};\r\n for (var p in contextIn) context[p] = p === \"access\" ? {} : contextIn[p];\r\n for (var p in contextIn.access) context.access[p] = contextIn.access[p];\r\n context.addInitializer = function (f) { if (done) throw new TypeError(\"Cannot add initializers after decoration has completed\"); extraInitializers.push(accept(f || null)); };\r\n var result = (0, decorators[i])(kind === \"accessor\" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);\r\n if (kind === \"accessor\") {\r\n if (result === void 0) continue;\r\n if (result === null || typeof result !== \"object\") throw new TypeError(\"Object expected\");\r\n if (_ = accept(result.get)) descriptor.get = _;\r\n if (_ = accept(result.set)) descriptor.set = _;\r\n if (_ = accept(result.init)) initializers.push(_);\r\n }\r\n else if (_ = accept(result)) {\r\n if (kind === \"field\") initializers.push(_);\r\n else descriptor[key] = _;\r\n }\r\n }\r\n if (target) Object.defineProperty(target, contextIn.name, descriptor);\r\n done = true;\r\n};\r\n\r\nexport function __runInitializers(thisArg, initializers, value) {\r\n var useValue = arguments.length > 2;\r\n for (var i = 0; i < initializers.length; i++) {\r\n value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);\r\n }\r\n return useValue ? value : void 0;\r\n};\r\n\r\nexport function __propKey(x) {\r\n return typeof x === \"symbol\" ? x : \"\".concat(x);\r\n};\r\n\r\nexport function __setFunctionName(f, name, prefix) {\r\n if (typeof name === \"symbol\") name = name.description ? \"[\".concat(name.description, \"]\") : \"\";\r\n return Object.defineProperty(f, \"name\", { configurable: true, value: prefix ? \"\".concat(prefix, \" \", name) : name });\r\n};\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (g && (g = 0, op[0] && (_ = 0)), _) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport var __createBinding = Object.create ? (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n var desc = Object.getOwnPropertyDescriptor(m, k);\r\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\r\n desc = { enumerable: true, get: function() { return m[k]; } };\r\n }\r\n Object.defineProperty(o, k2, desc);\r\n}) : (function(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n o[k2] = m[k];\r\n});\r\n\r\nexport function __exportStar(m, o) {\r\n for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);\r\n}\r\n\r\nexport function __values(o) {\r\n var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n if (m) return m.call(o);\r\n if (o && typeof o.length === \"number\") return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spreadArrays() {\r\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n r[k] = a[j];\r\n return r;\r\n}\r\n\r\nexport function __spreadArray(to, from, pack) {\r\n if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n if (ar || !(i in from)) {\r\n if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n ar[i] = from[i];\r\n }\r\n }\r\n return to.concat(ar || Array.prototype.slice.call(from));\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nvar __setModuleDefault = Object.create ? (function(o, v) {\r\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\r\n}) : function(o, v) {\r\n o[\"default\"] = v;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\r\n __setModuleDefault(result, mod);\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, state, kind, f) {\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a getter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot read private member from an object whose class did not declare it\");\r\n return kind === \"m\" ? f : kind === \"a\" ? f.call(receiver) : f ? f.value : state.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, state, value, kind, f) {\r\n if (kind === \"m\") throw new TypeError(\"Private method is not writable\");\r\n if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a setter\");\r\n if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot write private member to an object whose class did not declare it\");\r\n return (kind === \"a\" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;\r\n}\r\n\r\nexport function __classPrivateFieldIn(state, receiver) {\r\n if (receiver === null || (typeof receiver !== \"object\" && typeof receiver !== \"function\")) throw new TypeError(\"Cannot use 'in' operator on non-object\");\r\n return typeof state === \"function\" ? receiver === state : state.has(receiver);\r\n}\r\n","export const COMMON_MIME_TYPES = new Map([\n // https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types\n ['aac', 'audio/aac'],\n ['abw', 'application/x-abiword'],\n ['arc', 'application/x-freearc'],\n ['avif', 'image/avif'],\n ['avi', 'video/x-msvideo'],\n ['azw', 'application/vnd.amazon.ebook'],\n ['bin', 'application/octet-stream'],\n ['bmp', 'image/bmp'],\n ['bz', 'application/x-bzip'],\n ['bz2', 'application/x-bzip2'],\n ['cda', 'application/x-cdf'],\n ['csh', 'application/x-csh'],\n ['css', 'text/css'],\n ['csv', 'text/csv'],\n ['doc', 'application/msword'],\n ['docx', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'],\n ['eot', 'application/vnd.ms-fontobject'],\n ['epub', 'application/epub+zip'],\n ['gz', 'application/gzip'],\n ['gif', 'image/gif'],\n ['heic', 'image/heic'],\n ['heif', 'image/heif'],\n ['htm', 'text/html'],\n ['html', 'text/html'],\n ['ico', 'image/vnd.microsoft.icon'],\n ['ics', 'text/calendar'],\n ['jar', 'application/java-archive'],\n ['jpeg', 'image/jpeg'],\n ['jpg', 'image/jpeg'],\n ['js', 'text/javascript'],\n ['json', 'application/json'],\n ['jsonld', 'application/ld+json'],\n ['mid', 'audio/midi'],\n ['midi', 'audio/midi'],\n ['mjs', 'text/javascript'],\n ['mp3', 'audio/mpeg'],\n ['mp4', 'video/mp4'],\n ['mpeg', 'video/mpeg'],\n ['mpkg', 'application/vnd.apple.installer+xml'],\n ['odp', 'application/vnd.oasis.opendocument.presentation'],\n ['ods', 'application/vnd.oasis.opendocument.spreadsheet'],\n ['odt', 'application/vnd.oasis.opendocument.text'],\n ['oga', 'audio/ogg'],\n ['ogv', 'video/ogg'],\n ['ogx', 'application/ogg'],\n ['opus', 'audio/opus'],\n ['otf', 'font/otf'],\n ['png', 'image/png'],\n ['pdf', 'application/pdf'],\n ['php', 'application/x-httpd-php'],\n ['ppt', 'application/vnd.ms-powerpoint'],\n ['pptx', 'application/vnd.openxmlformats-officedocument.presentationml.presentation'],\n ['rar', 'application/vnd.rar'],\n ['rtf', 'application/rtf'],\n ['sh', 'application/x-sh'],\n ['svg', 'image/svg+xml'],\n ['swf', 'application/x-shockwave-flash'],\n ['tar', 'application/x-tar'],\n ['tif', 'image/tiff'],\n ['tiff', 'image/tiff'],\n ['ts', 'video/mp2t'],\n ['ttf', 'font/ttf'],\n ['txt', 'text/plain'],\n ['vsd', 'application/vnd.visio'],\n ['wav', 'audio/wav'],\n ['weba', 'audio/webm'],\n ['webm', 'video/webm'],\n ['webp', 'image/webp'],\n ['woff', 'font/woff'],\n ['woff2', 'font/woff2'],\n ['xhtml', 'application/xhtml+xml'],\n ['xls', 'application/vnd.ms-excel'],\n ['xlsx', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],\n ['xml', 'application/xml'],\n ['xul', 'application/vnd.mozilla.xul+xml'],\n ['zip', 'application/zip'],\n ['7z', 'application/x-7z-compressed'],\n\n // Others\n ['mkv', 'video/x-matroska'],\n ['mov', 'video/quicktime'],\n ['msg', 'application/vnd.ms-outlook']\n]);\n\n\nexport function toFileWithPath(file: FileWithPath, path?: string): FileWithPath {\n const f = withMimeType(file);\n if (typeof f.path !== 'string') { // on electron, path is already set to the absolute path\n const {webkitRelativePath} = file;\n Object.defineProperty(f, 'path', {\n value: typeof path === 'string'\n ? path\n // If is set,\n // the File will have a {webkitRelativePath} property\n // https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory\n : typeof webkitRelativePath === 'string' && webkitRelativePath.length > 0\n ? webkitRelativePath\n : file.name,\n writable: false,\n configurable: false,\n enumerable: true\n });\n }\n\n return f;\n}\n\nexport interface FileWithPath extends File {\n readonly path?: string;\n}\n\nfunction withMimeType(file: FileWithPath) {\n const {name} = file;\n const hasExtension = name && name.lastIndexOf('.') !== -1;\n\n if (hasExtension && !file.type) {\n const ext = name.split('.')\n .pop()!.toLowerCase();\n const type = COMMON_MIME_TYPES.get(ext);\n if (type) {\n Object.defineProperty(file, 'type', {\n value: type,\n writable: false,\n configurable: false,\n enumerable: true\n });\n }\n }\n\n return file;\n}\n","import {FileWithPath, toFileWithPath} from './file';\n\n\nconst FILES_TO_IGNORE = [\n // Thumbnail cache files for macOS and Windows\n '.DS_Store', // macOs\n 'Thumbs.db' // Windows\n];\n\n\n/**\n * Convert a DragEvent's DataTrasfer object to a list of File objects\n * NOTE: If some of the items are folders,\n * everything will be flattened and placed in the same list but the paths will be kept as a {path} property.\n *\n * EXPERIMENTAL: A list of https://developer.mozilla.org/en-US/docs/Web/API/FileSystemHandle objects can also be passed as an arg\n * and a list of File objects will be returned.\n *\n * @param evt\n */\nexport async function fromEvent(evt: Event | any): Promise<(FileWithPath | DataTransferItem)[]> {\n if (isObject(evt) && isDataTransfer(evt.dataTransfer)) {\n return getDataTransferFiles(evt.dataTransfer, evt.type);\n } else if (isChangeEvt(evt)) {\n return getInputFiles(evt);\n } else if (Array.isArray(evt) && evt.every(item => 'getFile' in item && typeof item.getFile === 'function')) {\n return getFsHandleFiles(evt)\n }\n return [];\n}\n\nfunction isDataTransfer(value: any): value is DataTransfer {\n return isObject(value);\n}\n\nfunction isChangeEvt(value: any): value is Event {\n return isObject(value) && isObject(value.target);\n}\n\nfunction isObject(v: any): v is T {\n return typeof v === 'object' && v !== null\n}\n\nfunction getInputFiles(evt: Event) {\n return fromList((evt.target as HTMLInputElement).files).map(file => toFileWithPath(file));\n}\n\n// Ee expect each handle to be https://developer.mozilla.org/en-US/docs/Web/API/FileSystemFileHandle\nasync function getFsHandleFiles(handles: any[]) {\n const files = await Promise.all(handles.map(h => h.getFile()));\n return files.map(file => toFileWithPath(file));\n}\n\n\nasync function getDataTransferFiles(dt: DataTransfer, type: string) {\n // IE11 does not support dataTransfer.items\n // See https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/items#Browser_compatibility\n if (dt.items) {\n const items = fromList(dt.items)\n .filter(item => item.kind === 'file');\n // According to https://html.spec.whatwg.org/multipage/dnd.html#dndevents,\n // only 'dragstart' and 'drop' has access to the data (source node)\n if (type !== 'drop') {\n return items;\n }\n const files = await Promise.all(items.map(toFilePromises));\n return noIgnoredFiles(flatten(files));\n }\n\n return noIgnoredFiles(fromList(dt.files)\n .map(file => toFileWithPath(file)));\n}\n\nfunction noIgnoredFiles(files: FileWithPath[]) {\n return files.filter(file => FILES_TO_IGNORE.indexOf(file.name) === -1);\n}\n\n// IE11 does not support Array.from()\n// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from#Browser_compatibility\n// https://developer.mozilla.org/en-US/docs/Web/API/FileList\n// https://developer.mozilla.org/en-US/docs/Web/API/DataTransferItemList\nfunction fromList(items: DataTransferItemList | FileList | null): T[] {\n if (items === null) {\n return [];\n }\n\n const files = [];\n\n // tslint:disable: prefer-for-of\n for (let i = 0; i < items.length; i++) {\n const file = items[i];\n files.push(file);\n }\n\n return files as any;\n}\n\n// https://developer.mozilla.org/en-US/docs/Web/API/DataTransferItem\nfunction toFilePromises(item: DataTransferItem) {\n if (typeof item.webkitGetAsEntry !== 'function') {\n return fromDataTransferItem(item);\n }\n\n const entry = item.webkitGetAsEntry();\n\n // Safari supports dropping an image node from a different window and can be retrieved using\n // the DataTransferItem.getAsFile() API\n // NOTE: FileSystemEntry.file() throws if trying to get the file\n if (entry && entry.isDirectory) {\n return fromDirEntry(entry) as any;\n }\n\n return fromDataTransferItem(item);\n}\n\nfunction flatten(items: any[]): T[] {\n return items.reduce((acc, files) => [\n ...acc,\n ...(Array.isArray(files) ? flatten(files) : [files])\n ], []);\n}\n\nfunction fromDataTransferItem(item: DataTransferItem) {\n const file = item.getAsFile();\n if (!file) {\n return Promise.reject(`${item} is not a File`);\n }\n const fwp = toFileWithPath(file);\n return Promise.resolve(fwp);\n}\n\n// https://developer.mozilla.org/en-US/docs/Web/API/FileSystemEntry\nasync function fromEntry(entry: any) {\n return entry.isDirectory ? fromDirEntry(entry) : fromFileEntry(entry);\n}\n\n// https://developer.mozilla.org/en-US/docs/Web/API/FileSystemDirectoryEntry\nfunction fromDirEntry(entry: any) {\n const reader = entry.createReader();\n\n return new Promise((resolve, reject) => {\n const entries: Promise[] = [];\n\n function readEntries() {\n // https://developer.mozilla.org/en-US/docs/Web/API/FileSystemDirectoryEntry/createReader\n // https://developer.mozilla.org/en-US/docs/Web/API/FileSystemDirectoryReader/readEntries\n reader.readEntries(async (batch: any[]) => {\n if (!batch.length) {\n // Done reading directory\n try {\n const files = await Promise.all(entries);\n resolve(files);\n } catch (err) {\n reject(err);\n }\n } else {\n const items = Promise.all(batch.map(fromEntry));\n entries.push(items);\n\n // Continue reading\n readEntries();\n }\n }, (err: any) => {\n reject(err);\n });\n }\n\n readEntries();\n });\n}\n\n// https://developer.mozilla.org/en-US/docs/Web/API/FileSystemFileEntry\nasync function fromFileEntry(entry: any) {\n return new Promise((resolve, reject) => {\n entry.file((file: FileWithPath) => {\n const fwp = toFileWithPath(file, entry.fullPath);\n resolve(fwp);\n }, (err: any) => {\n reject(err);\n });\n });\n}\n\n// Infinite type recursion\n// https://github.com/Microsoft/TypeScript/issues/3496#issuecomment-128553540\ninterface FileArray extends Array {}\ntype FileValue = FileWithPath\n | FileArray[];\n","function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\n\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\n\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nimport accepts from \"attr-accept\"; // Error codes\n\nexport var FILE_INVALID_TYPE = \"file-invalid-type\";\nexport var FILE_TOO_LARGE = \"file-too-large\";\nexport var FILE_TOO_SMALL = \"file-too-small\";\nexport var TOO_MANY_FILES = \"too-many-files\";\nexport var ErrorCode = {\n FileInvalidType: FILE_INVALID_TYPE,\n FileTooLarge: FILE_TOO_LARGE,\n FileTooSmall: FILE_TOO_SMALL,\n TooManyFiles: TOO_MANY_FILES\n}; // File Errors\n\nexport var getInvalidTypeRejectionErr = function getInvalidTypeRejectionErr(accept) {\n accept = Array.isArray(accept) && accept.length === 1 ? accept[0] : accept;\n var messageSuffix = Array.isArray(accept) ? \"one of \".concat(accept.join(\", \")) : accept;\n return {\n code: FILE_INVALID_TYPE,\n message: \"File type must be \".concat(messageSuffix)\n };\n};\nexport var getTooLargeRejectionErr = function getTooLargeRejectionErr(maxSize) {\n return {\n code: FILE_TOO_LARGE,\n message: \"File is larger than \".concat(maxSize, \" \").concat(maxSize === 1 ? \"byte\" : \"bytes\")\n };\n};\nexport var getTooSmallRejectionErr = function getTooSmallRejectionErr(minSize) {\n return {\n code: FILE_TOO_SMALL,\n message: \"File is smaller than \".concat(minSize, \" \").concat(minSize === 1 ? \"byte\" : \"bytes\")\n };\n};\nexport var TOO_MANY_FILES_REJECTION = {\n code: TOO_MANY_FILES,\n message: \"Too many files\"\n}; // Firefox versions prior to 53 return a bogus MIME type for every file drag, so dragovers with\n// that MIME type will always be accepted\n\nexport function fileAccepted(file, accept) {\n var isAcceptable = file.type === \"application/x-moz-file\" || accepts(file, accept);\n return [isAcceptable, isAcceptable ? null : getInvalidTypeRejectionErr(accept)];\n}\nexport function fileMatchSize(file, minSize, maxSize) {\n if (isDefined(file.size)) {\n if (isDefined(minSize) && isDefined(maxSize)) {\n if (file.size > maxSize) return [false, getTooLargeRejectionErr(maxSize)];\n if (file.size < minSize) return [false, getTooSmallRejectionErr(minSize)];\n } else if (isDefined(minSize) && file.size < minSize) return [false, getTooSmallRejectionErr(minSize)];else if (isDefined(maxSize) && file.size > maxSize) return [false, getTooLargeRejectionErr(maxSize)];\n }\n\n return [true, null];\n}\n\nfunction isDefined(value) {\n return value !== undefined && value !== null;\n}\n/**\n *\n * @param {object} options\n * @param {File[]} options.files\n * @param {string|string[]} [options.accept]\n * @param {number} [options.minSize]\n * @param {number} [options.maxSize]\n * @param {boolean} [options.multiple]\n * @param {number} [options.maxFiles]\n * @param {(f: File) => FileError|FileError[]|null} [options.validator]\n * @returns\n */\n\n\nexport function allFilesAccepted(_ref) {\n var files = _ref.files,\n accept = _ref.accept,\n minSize = _ref.minSize,\n maxSize = _ref.maxSize,\n multiple = _ref.multiple,\n maxFiles = _ref.maxFiles,\n validator = _ref.validator;\n\n if (!multiple && files.length > 1 || multiple && maxFiles >= 1 && files.length > maxFiles) {\n return false;\n }\n\n return files.every(function (file) {\n var _fileAccepted = fileAccepted(file, accept),\n _fileAccepted2 = _slicedToArray(_fileAccepted, 1),\n accepted = _fileAccepted2[0];\n\n var _fileMatchSize = fileMatchSize(file, minSize, maxSize),\n _fileMatchSize2 = _slicedToArray(_fileMatchSize, 1),\n sizeMatch = _fileMatchSize2[0];\n\n var customErrors = validator ? validator(file) : null;\n return accepted && sizeMatch && !customErrors;\n });\n} // React's synthetic events has event.isPropagationStopped,\n// but to remain compatibility with other libs (Preact) fall back\n// to check event.cancelBubble\n\nexport function isPropagationStopped(event) {\n if (typeof event.isPropagationStopped === \"function\") {\n return event.isPropagationStopped();\n } else if (typeof event.cancelBubble !== \"undefined\") {\n return event.cancelBubble;\n }\n\n return false;\n}\nexport function isEvtWithFiles(event) {\n if (!event.dataTransfer) {\n return !!event.target && !!event.target.files;\n } // https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer/types\n // https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types#file\n\n\n return Array.prototype.some.call(event.dataTransfer.types, function (type) {\n return type === \"Files\" || type === \"application/x-moz-file\";\n });\n}\nexport function isKindFile(item) {\n return _typeof(item) === \"object\" && item !== null && item.kind === \"file\";\n} // allow the entire document to be a drag target\n\nexport function onDocumentDragOver(event) {\n event.preventDefault();\n}\n\nfunction isIe(userAgent) {\n return userAgent.indexOf(\"MSIE\") !== -1 || userAgent.indexOf(\"Trident/\") !== -1;\n}\n\nfunction isEdge(userAgent) {\n return userAgent.indexOf(\"Edge/\") !== -1;\n}\n\nexport function isIeOrEdge() {\n var userAgent = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window.navigator.userAgent;\n return isIe(userAgent) || isEdge(userAgent);\n}\n/**\n * This is intended to be used to compose event handlers\n * They are executed in order until one of them calls `event.isPropagationStopped()`.\n * Note that the check is done on the first invoke too,\n * meaning that if propagation was stopped before invoking the fns,\n * no handlers will be executed.\n *\n * @param {Function} fns the event hanlder functions\n * @return {Function} the event handler to add to an element\n */\n\nexport function composeEventHandlers() {\n for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) {\n fns[_key] = arguments[_key];\n }\n\n return function (event) {\n for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {\n args[_key2 - 1] = arguments[_key2];\n }\n\n return fns.some(function (fn) {\n if (!isPropagationStopped(event) && fn) {\n fn.apply(void 0, [event].concat(args));\n }\n\n return isPropagationStopped(event);\n });\n };\n}\n/**\n * canUseFileSystemAccessAPI checks if the [File System Access API](https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API)\n * is supported by the browser.\n * @returns {boolean}\n */\n\nexport function canUseFileSystemAccessAPI() {\n return \"showOpenFilePicker\" in window;\n}\n/**\n * Convert the `{accept}` dropzone prop to the\n * `{types}` option for https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker\n *\n * @param {AcceptProp} accept\n * @returns {{accept: string[]}[]}\n */\n\nexport function pickerOptionsFromAccept(accept) {\n if (isDefined(accept)) {\n var acceptForPicker = Object.entries(accept).filter(function (_ref2) {\n var _ref3 = _slicedToArray(_ref2, 2),\n mimeType = _ref3[0],\n ext = _ref3[1];\n\n var ok = true;\n\n if (!isMIMEType(mimeType)) {\n console.warn(\"Skipped \\\"\".concat(mimeType, \"\\\" because it is not a valid MIME type. Check https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types for a list of valid MIME types.\"));\n ok = false;\n }\n\n if (!Array.isArray(ext) || !ext.every(isExt)) {\n console.warn(\"Skipped \\\"\".concat(mimeType, \"\\\" because an invalid file extension was provided.\"));\n ok = false;\n }\n\n return ok;\n }).reduce(function (agg, _ref4) {\n var _ref5 = _slicedToArray(_ref4, 2),\n mimeType = _ref5[0],\n ext = _ref5[1];\n\n return _objectSpread(_objectSpread({}, agg), {}, _defineProperty({}, mimeType, ext));\n }, {});\n return [{\n // description is required due to https://crbug.com/1264708\n description: \"Files\",\n accept: acceptForPicker\n }];\n }\n\n return accept;\n}\n/**\n * Convert the `{accept}` dropzone prop to an array of MIME types/extensions.\n * @param {AcceptProp} accept\n * @returns {string}\n */\n\nexport function acceptPropAsAcceptAttr(accept) {\n if (isDefined(accept)) {\n return Object.entries(accept).reduce(function (a, _ref6) {\n var _ref7 = _slicedToArray(_ref6, 2),\n mimeType = _ref7[0],\n ext = _ref7[1];\n\n return [].concat(_toConsumableArray(a), [mimeType], _toConsumableArray(ext));\n }, []) // Silently discard invalid entries as pickerOptionsFromAccept warns about these\n .filter(function (v) {\n return isMIMEType(v) || isExt(v);\n }).join(\",\");\n }\n\n return undefined;\n}\n/**\n * Check if v is an exception caused by aborting a request (e.g window.showOpenFilePicker()).\n *\n * See https://developer.mozilla.org/en-US/docs/Web/API/DOMException.\n * @param {any} v\n * @returns {boolean} True if v is an abort exception.\n */\n\nexport function isAbort(v) {\n return v instanceof DOMException && (v.name === \"AbortError\" || v.code === v.ABORT_ERR);\n}\n/**\n * Check if v is a security error.\n *\n * See https://developer.mozilla.org/en-US/docs/Web/API/DOMException.\n * @param {any} v\n * @returns {boolean} True if v is a security error.\n */\n\nexport function isSecurityError(v) {\n return v instanceof DOMException && (v.name === \"SecurityError\" || v.code === v.SECURITY_ERR);\n}\n/**\n * Check if v is a MIME type string.\n *\n * See accepted format: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers.\n *\n * @param {string} v\n */\n\nexport function isMIMEType(v) {\n return v === \"audio/*\" || v === \"video/*\" || v === \"image/*\" || v === \"text/*\" || /\\w+\\/[-+.\\w]+/g.test(v);\n}\n/**\n * Check if v is a file extension.\n * @param {string} v\n */\n\nexport function isExt(v) {\n return /^.*\\.[\\w]+$/.test(v);\n}\n/**\n * @typedef {Object.} AcceptProp\n */\n\n/**\n * @typedef {object} FileError\n * @property {string} message\n * @property {ErrorCode|string} code\n */\n\n/**\n * @typedef {\"file-invalid-type\"|\"file-too-large\"|\"file-too-small\"|\"too-many-files\"} ErrorCode\n */","var _excluded = [\"children\"],\n _excluded2 = [\"open\"],\n _excluded3 = [\"refKey\", \"role\", \"onKeyDown\", \"onFocus\", \"onBlur\", \"onClick\", \"onDragEnter\", \"onDragOver\", \"onDragLeave\", \"onDrop\"],\n _excluded4 = [\"refKey\", \"onChange\", \"onClick\"];\n\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\n\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\n\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* eslint prefer-template: 0 */\nimport React, { forwardRef, Fragment, useCallback, useEffect, useImperativeHandle, useMemo, useReducer, useRef } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { fromEvent } from \"file-selector\";\nimport { acceptPropAsAcceptAttr, allFilesAccepted, composeEventHandlers, fileAccepted, fileMatchSize, canUseFileSystemAccessAPI, isAbort, isEvtWithFiles, isIeOrEdge, isPropagationStopped, isSecurityError, onDocumentDragOver, pickerOptionsFromAccept, TOO_MANY_FILES_REJECTION } from \"./utils/index\";\n/**\n * Convenience wrapper component for the `useDropzone` hook\n *\n * ```jsx\n * \n * {({getRootProps, getInputProps}) => (\n *
\n * \n *
Drag 'n' drop some files here, or click to select files
\n *
\n * )}\n * \n * ```\n */\n\nvar Dropzone = /*#__PURE__*/forwardRef(function (_ref, ref) {\n var children = _ref.children,\n params = _objectWithoutProperties(_ref, _excluded);\n\n var _useDropzone = useDropzone(params),\n open = _useDropzone.open,\n props = _objectWithoutProperties(_useDropzone, _excluded2);\n\n useImperativeHandle(ref, function () {\n return {\n open: open\n };\n }, [open]); // TODO: Figure out why react-styleguidist cannot create docs if we don't return a jsx element\n\n return /*#__PURE__*/React.createElement(Fragment, null, children(_objectSpread(_objectSpread({}, props), {}, {\n open: open\n })));\n});\nDropzone.displayName = \"Dropzone\"; // Add default props for react-docgen\n\nvar defaultProps = {\n disabled: false,\n getFilesFromEvent: fromEvent,\n maxSize: Infinity,\n minSize: 0,\n multiple: true,\n maxFiles: 0,\n preventDropOnDocument: true,\n noClick: false,\n noKeyboard: false,\n noDrag: false,\n noDragEventsBubbling: false,\n validator: null,\n useFsAccessApi: true,\n autoFocus: false\n};\nDropzone.defaultProps = defaultProps;\nDropzone.propTypes = {\n /**\n * Render function that exposes the dropzone state and prop getter fns\n *\n * @param {object} params\n * @param {Function} params.getRootProps Returns the props you should apply to the root drop container you render\n * @param {Function} params.getInputProps Returns the props you should apply to hidden file input you render\n * @param {Function} params.open Open the native file selection dialog\n * @param {boolean} params.isFocused Dropzone area is in focus\n * @param {boolean} params.isFileDialogActive File dialog is opened\n * @param {boolean} params.isDragActive Active drag is in progress\n * @param {boolean} params.isDragAccept Dragged files are accepted\n * @param {boolean} params.isDragReject Some dragged files are rejected\n * @param {File[]} params.acceptedFiles Accepted files\n * @param {FileRejection[]} params.fileRejections Rejected files and why they were rejected\n */\n children: PropTypes.func,\n\n /**\n * Set accepted file types.\n * Checkout https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker types option for more information.\n * Keep in mind that mime type determination is not reliable across platforms. CSV files,\n * for example, are reported as text/plain under macOS but as application/vnd.ms-excel under\n * Windows. In some cases there might not be a mime type set at all (https://github.com/react-dropzone/react-dropzone/issues/276).\n */\n accept: PropTypes.objectOf(PropTypes.arrayOf(PropTypes.string)),\n\n /**\n * Allow drag 'n' drop (or selection from the file dialog) of multiple files\n */\n multiple: PropTypes.bool,\n\n /**\n * If false, allow dropped items to take over the current browser window\n */\n preventDropOnDocument: PropTypes.bool,\n\n /**\n * If true, disables click to open the native file selection dialog\n */\n noClick: PropTypes.bool,\n\n /**\n * If true, disables SPACE/ENTER to open the native file selection dialog.\n * Note that it also stops tracking the focus state.\n */\n noKeyboard: PropTypes.bool,\n\n /**\n * If true, disables drag 'n' drop\n */\n noDrag: PropTypes.bool,\n\n /**\n * If true, stops drag event propagation to parents\n */\n noDragEventsBubbling: PropTypes.bool,\n\n /**\n * Minimum file size (in bytes)\n */\n minSize: PropTypes.number,\n\n /**\n * Maximum file size (in bytes)\n */\n maxSize: PropTypes.number,\n\n /**\n * Maximum accepted number of files\n * The default value is 0 which means there is no limitation to how many files are accepted.\n */\n maxFiles: PropTypes.number,\n\n /**\n * Enable/disable the dropzone\n */\n disabled: PropTypes.bool,\n\n /**\n * Use this to provide a custom file aggregator\n *\n * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)\n */\n getFilesFromEvent: PropTypes.func,\n\n /**\n * Cb for when closing the file dialog with no selection\n */\n onFileDialogCancel: PropTypes.func,\n\n /**\n * Cb for when opening the file dialog\n */\n onFileDialogOpen: PropTypes.func,\n\n /**\n * Set to true to use the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API\n * to open the file picker instead of using an `` click event.\n */\n useFsAccessApi: PropTypes.bool,\n\n /**\n * Set to true to focus the root element on render\n */\n autoFocus: PropTypes.bool,\n\n /**\n * Cb for when the `dragenter` event occurs.\n *\n * @param {DragEvent} event\n */\n onDragEnter: PropTypes.func,\n\n /**\n * Cb for when the `dragleave` event occurs\n *\n * @param {DragEvent} event\n */\n onDragLeave: PropTypes.func,\n\n /**\n * Cb for when the `dragover` event occurs\n *\n * @param {DragEvent} event\n */\n onDragOver: PropTypes.func,\n\n /**\n * Cb for when the `drop` event occurs.\n * Note that this callback is invoked after the `getFilesFromEvent` callback is done.\n *\n * Files are accepted or rejected based on the `accept`, `multiple`, `minSize` and `maxSize` props.\n * `accept` must be a valid [MIME type](http://www.iana.org/assignments/media-types/media-types.xhtml) according to [input element specification](https://www.w3.org/wiki/HTML/Elements/input/file) or a valid file extension.\n * If `multiple` is set to false and additional files are dropped,\n * all files besides the first will be rejected.\n * Any file which does not have a size in the [`minSize`, `maxSize`] range, will be rejected as well.\n *\n * Note that the `onDrop` callback will always be invoked regardless if the dropped files were accepted or rejected.\n * If you'd like to react to a specific scenario, use the `onDropAccepted`/`onDropRejected` props.\n *\n * `onDrop` will provide you with an array of [File](https://developer.mozilla.org/en-US/docs/Web/API/File) objects which you can then process and send to a server.\n * For example, with [SuperAgent](https://github.com/visionmedia/superagent) as a http/ajax library:\n *\n * ```js\n * function onDrop(acceptedFiles) {\n * const req = request.post('/upload')\n * acceptedFiles.forEach(file => {\n * req.attach(file.name, file)\n * })\n * req.end(callback)\n * }\n * ```\n *\n * @param {File[]} acceptedFiles\n * @param {FileRejection[]} fileRejections\n * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)\n */\n onDrop: PropTypes.func,\n\n /**\n * Cb for when the `drop` event occurs.\n * Note that if no files are accepted, this callback is not invoked.\n *\n * @param {File[]} files\n * @param {(DragEvent|Event)} event\n */\n onDropAccepted: PropTypes.func,\n\n /**\n * Cb for when the `drop` event occurs.\n * Note that if no files are rejected, this callback is not invoked.\n *\n * @param {FileRejection[]} fileRejections\n * @param {(DragEvent|Event)} event\n */\n onDropRejected: PropTypes.func,\n\n /**\n * Cb for when there's some error from any of the promises.\n *\n * @param {Error} error\n */\n onError: PropTypes.func,\n\n /**\n * Custom validation function. It must return null if there's no errors.\n * @param {File} file\n * @returns {FileError|FileError[]|null}\n */\n validator: PropTypes.func\n};\nexport default Dropzone;\n/**\n * A function that is invoked for the `dragenter`,\n * `dragover` and `dragleave` events.\n * It is not invoked if the items are not files (such as link, text, etc.).\n *\n * @callback dragCb\n * @param {DragEvent} event\n */\n\n/**\n * A function that is invoked for the `drop` or input change event.\n * It is not invoked if the items are not files (such as link, text, etc.).\n *\n * @callback dropCb\n * @param {File[]} acceptedFiles List of accepted files\n * @param {FileRejection[]} fileRejections List of rejected files and why they were rejected\n * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)\n */\n\n/**\n * A function that is invoked for the `drop` or input change event.\n * It is not invoked if the items are files (such as link, text, etc.).\n *\n * @callback dropAcceptedCb\n * @param {File[]} files List of accepted files that meet the given criteria\n * (`accept`, `multiple`, `minSize`, `maxSize`)\n * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)\n */\n\n/**\n * A function that is invoked for the `drop` or input change event.\n *\n * @callback dropRejectedCb\n * @param {File[]} files List of rejected files that do not meet the given criteria\n * (`accept`, `multiple`, `minSize`, `maxSize`)\n * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)\n */\n\n/**\n * A function that is used aggregate files,\n * in a asynchronous fashion, from drag or input change events.\n *\n * @callback getFilesFromEvent\n * @param {(DragEvent|Event)} event A drag event or input change event (if files were selected via the file dialog)\n * @returns {(File[]|Promise)}\n */\n\n/**\n * An object with the current dropzone state.\n *\n * @typedef {object} DropzoneState\n * @property {boolean} isFocused Dropzone area is in focus\n * @property {boolean} isFileDialogActive File dialog is opened\n * @property {boolean} isDragActive Active drag is in progress\n * @property {boolean} isDragAccept Dragged files are accepted\n * @property {boolean} isDragReject Some dragged files are rejected\n * @property {File[]} acceptedFiles Accepted files\n * @property {FileRejection[]} fileRejections Rejected files and why they were rejected\n */\n\n/**\n * An object with the dropzone methods.\n *\n * @typedef {object} DropzoneMethods\n * @property {Function} getRootProps Returns the props you should apply to the root drop container you render\n * @property {Function} getInputProps Returns the props you should apply to hidden file input you render\n * @property {Function} open Open the native file selection dialog\n */\n\nvar initialState = {\n isFocused: false,\n isFileDialogActive: false,\n isDragActive: false,\n isDragAccept: false,\n isDragReject: false,\n acceptedFiles: [],\n fileRejections: []\n};\n/**\n * A React hook that creates a drag 'n' drop area.\n *\n * ```jsx\n * function MyDropzone(props) {\n * const {getRootProps, getInputProps} = useDropzone({\n * onDrop: acceptedFiles => {\n * // do something with the File objects, e.g. upload to some server\n * }\n * });\n * return (\n *
\n * \n *
Drag and drop some files here, or click to select files
\n *
\n * )\n * }\n * ```\n *\n * @function useDropzone\n *\n * @param {object} props\n * @param {import(\"./utils\").AcceptProp} [props.accept] Set accepted file types.\n * Checkout https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker types option for more information.\n * Keep in mind that mime type determination is not reliable across platforms. CSV files,\n * for example, are reported as text/plain under macOS but as application/vnd.ms-excel under\n * Windows. In some cases there might not be a mime type set at all (https://github.com/react-dropzone/react-dropzone/issues/276).\n * @param {boolean} [props.multiple=true] Allow drag 'n' drop (or selection from the file dialog) of multiple files\n * @param {boolean} [props.preventDropOnDocument=true] If false, allow dropped items to take over the current browser window\n * @param {boolean} [props.noClick=false] If true, disables click to open the native file selection dialog\n * @param {boolean} [props.noKeyboard=false] If true, disables SPACE/ENTER to open the native file selection dialog.\n * Note that it also stops tracking the focus state.\n * @param {boolean} [props.noDrag=false] If true, disables drag 'n' drop\n * @param {boolean} [props.noDragEventsBubbling=false] If true, stops drag event propagation to parents\n * @param {number} [props.minSize=0] Minimum file size (in bytes)\n * @param {number} [props.maxSize=Infinity] Maximum file size (in bytes)\n * @param {boolean} [props.disabled=false] Enable/disable the dropzone\n * @param {getFilesFromEvent} [props.getFilesFromEvent] Use this to provide a custom file aggregator\n * @param {Function} [props.onFileDialogCancel] Cb for when closing the file dialog with no selection\n * @param {boolean} [props.useFsAccessApi] Set to true to use the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API\n * to open the file picker instead of using an `` click event.\n * @param {boolean} autoFocus Set to true to auto focus the root element.\n * @param {Function} [props.onFileDialogOpen] Cb for when opening the file dialog\n * @param {dragCb} [props.onDragEnter] Cb for when the `dragenter` event occurs.\n * @param {dragCb} [props.onDragLeave] Cb for when the `dragleave` event occurs\n * @param {dragCb} [props.onDragOver] Cb for when the `dragover` event occurs\n * @param {dropCb} [props.onDrop] Cb for when the `drop` event occurs.\n * Note that this callback is invoked after the `getFilesFromEvent` callback is done.\n *\n * Files are accepted or rejected based on the `accept`, `multiple`, `minSize` and `maxSize` props.\n * `accept` must be an object with keys as a valid [MIME type](http://www.iana.org/assignments/media-types/media-types.xhtml) according to [input element specification](https://www.w3.org/wiki/HTML/Elements/input/file) and the value an array of file extensions (optional).\n * If `multiple` is set to false and additional files are dropped,\n * all files besides the first will be rejected.\n * Any file which does not have a size in the [`minSize`, `maxSize`] range, will be rejected as well.\n *\n * Note that the `onDrop` callback will always be invoked regardless if the dropped files were accepted or rejected.\n * If you'd like to react to a specific scenario, use the `onDropAccepted`/`onDropRejected` props.\n *\n * `onDrop` will provide you with an array of [File](https://developer.mozilla.org/en-US/docs/Web/API/File) objects which you can then process and send to a server.\n * For example, with [SuperAgent](https://github.com/visionmedia/superagent) as a http/ajax library:\n *\n * ```js\n * function onDrop(acceptedFiles) {\n * const req = request.post('/upload')\n * acceptedFiles.forEach(file => {\n * req.attach(file.name, file)\n * })\n * req.end(callback)\n * }\n * ```\n * @param {dropAcceptedCb} [props.onDropAccepted]\n * @param {dropRejectedCb} [props.onDropRejected]\n * @param {(error: Error) => void} [props.onError]\n *\n * @returns {DropzoneState & DropzoneMethods}\n */\n\nexport function useDropzone() {\n var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n\n var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),\n accept = _defaultProps$props.accept,\n disabled = _defaultProps$props.disabled,\n getFilesFromEvent = _defaultProps$props.getFilesFromEvent,\n maxSize = _defaultProps$props.maxSize,\n minSize = _defaultProps$props.minSize,\n multiple = _defaultProps$props.multiple,\n maxFiles = _defaultProps$props.maxFiles,\n onDragEnter = _defaultProps$props.onDragEnter,\n onDragLeave = _defaultProps$props.onDragLeave,\n onDragOver = _defaultProps$props.onDragOver,\n onDrop = _defaultProps$props.onDrop,\n onDropAccepted = _defaultProps$props.onDropAccepted,\n onDropRejected = _defaultProps$props.onDropRejected,\n onFileDialogCancel = _defaultProps$props.onFileDialogCancel,\n onFileDialogOpen = _defaultProps$props.onFileDialogOpen,\n useFsAccessApi = _defaultProps$props.useFsAccessApi,\n autoFocus = _defaultProps$props.autoFocus,\n preventDropOnDocument = _defaultProps$props.preventDropOnDocument,\n noClick = _defaultProps$props.noClick,\n noKeyboard = _defaultProps$props.noKeyboard,\n noDrag = _defaultProps$props.noDrag,\n noDragEventsBubbling = _defaultProps$props.noDragEventsBubbling,\n onError = _defaultProps$props.onError,\n validator = _defaultProps$props.validator;\n\n var acceptAttr = useMemo(function () {\n return acceptPropAsAcceptAttr(accept);\n }, [accept]);\n var pickerTypes = useMemo(function () {\n return pickerOptionsFromAccept(accept);\n }, [accept]);\n var onFileDialogOpenCb = useMemo(function () {\n return typeof onFileDialogOpen === \"function\" ? onFileDialogOpen : noop;\n }, [onFileDialogOpen]);\n var onFileDialogCancelCb = useMemo(function () {\n return typeof onFileDialogCancel === \"function\" ? onFileDialogCancel : noop;\n }, [onFileDialogCancel]);\n /**\n * @constant\n * @type {React.MutableRefObject}\n */\n\n var rootRef = useRef(null);\n var inputRef = useRef(null);\n\n var _useReducer = useReducer(reducer, initialState),\n _useReducer2 = _slicedToArray(_useReducer, 2),\n state = _useReducer2[0],\n dispatch = _useReducer2[1];\n\n var isFocused = state.isFocused,\n isFileDialogActive = state.isFileDialogActive;\n var fsAccessApiWorksRef = useRef(typeof window !== \"undefined\" && window.isSecureContext && useFsAccessApi && canUseFileSystemAccessAPI()); // Update file dialog active state when the window is focused on\n\n var onWindowFocus = function onWindowFocus() {\n // Execute the timeout only if the file dialog is opened in the browser\n if (!fsAccessApiWorksRef.current && isFileDialogActive) {\n setTimeout(function () {\n if (inputRef.current) {\n var files = inputRef.current.files;\n\n if (!files.length) {\n dispatch({\n type: \"closeDialog\"\n });\n onFileDialogCancelCb();\n }\n }\n }, 300);\n }\n };\n\n useEffect(function () {\n window.addEventListener(\"focus\", onWindowFocus, false);\n return function () {\n window.removeEventListener(\"focus\", onWindowFocus, false);\n };\n }, [inputRef, isFileDialogActive, onFileDialogCancelCb, fsAccessApiWorksRef]);\n var dragTargetsRef = useRef([]);\n\n var onDocumentDrop = function onDocumentDrop(event) {\n if (rootRef.current && rootRef.current.contains(event.target)) {\n // If we intercepted an event for our instance, let it propagate down to the instance's onDrop handler\n return;\n }\n\n event.preventDefault();\n dragTargetsRef.current = [];\n };\n\n useEffect(function () {\n if (preventDropOnDocument) {\n document.addEventListener(\"dragover\", onDocumentDragOver, false);\n document.addEventListener(\"drop\", onDocumentDrop, false);\n }\n\n return function () {\n if (preventDropOnDocument) {\n document.removeEventListener(\"dragover\", onDocumentDragOver);\n document.removeEventListener(\"drop\", onDocumentDrop);\n }\n };\n }, [rootRef, preventDropOnDocument]); // Auto focus the root when autoFocus is true\n\n useEffect(function () {\n if (!disabled && autoFocus && rootRef.current) {\n rootRef.current.focus();\n }\n\n return function () {};\n }, [rootRef, autoFocus, disabled]);\n var onErrCb = useCallback(function (e) {\n if (onError) {\n onError(e);\n } else {\n // Let the user know something's gone wrong if they haven't provided the onError cb.\n console.error(e);\n }\n }, [onError]);\n var onDragEnterCb = useCallback(function (event) {\n event.preventDefault(); // Persist here because we need the event later after getFilesFromEvent() is done\n\n event.persist();\n stopPropagation(event);\n dragTargetsRef.current = [].concat(_toConsumableArray(dragTargetsRef.current), [event.target]);\n\n if (isEvtWithFiles(event)) {\n Promise.resolve(getFilesFromEvent(event)).then(function (files) {\n if (isPropagationStopped(event) && !noDragEventsBubbling) {\n return;\n }\n\n var fileCount = files.length;\n var isDragAccept = fileCount > 0 && allFilesAccepted({\n files: files,\n accept: acceptAttr,\n minSize: minSize,\n maxSize: maxSize,\n multiple: multiple,\n maxFiles: maxFiles,\n validator: validator\n });\n var isDragReject = fileCount > 0 && !isDragAccept;\n dispatch({\n isDragAccept: isDragAccept,\n isDragReject: isDragReject,\n isDragActive: true,\n type: \"setDraggedFiles\"\n });\n\n if (onDragEnter) {\n onDragEnter(event);\n }\n }).catch(function (e) {\n return onErrCb(e);\n });\n }\n }, [getFilesFromEvent, onDragEnter, onErrCb, noDragEventsBubbling, acceptAttr, minSize, maxSize, multiple, maxFiles, validator]);\n var onDragOverCb = useCallback(function (event) {\n event.preventDefault();\n event.persist();\n stopPropagation(event);\n var hasFiles = isEvtWithFiles(event);\n\n if (hasFiles && event.dataTransfer) {\n try {\n event.dataTransfer.dropEffect = \"copy\";\n } catch (_unused) {}\n /* eslint-disable-line no-empty */\n\n }\n\n if (hasFiles && onDragOver) {\n onDragOver(event);\n }\n\n return false;\n }, [onDragOver, noDragEventsBubbling]);\n var onDragLeaveCb = useCallback(function (event) {\n event.preventDefault();\n event.persist();\n stopPropagation(event); // Only deactivate once the dropzone and all children have been left\n\n var targets = dragTargetsRef.current.filter(function (target) {\n return rootRef.current && rootRef.current.contains(target);\n }); // Make sure to remove a target present multiple times only once\n // (Firefox may fire dragenter/dragleave multiple times on the same element)\n\n var targetIdx = targets.indexOf(event.target);\n\n if (targetIdx !== -1) {\n targets.splice(targetIdx, 1);\n }\n\n dragTargetsRef.current = targets;\n\n if (targets.length > 0) {\n return;\n }\n\n dispatch({\n type: \"setDraggedFiles\",\n isDragActive: false,\n isDragAccept: false,\n isDragReject: false\n });\n\n if (isEvtWithFiles(event) && onDragLeave) {\n onDragLeave(event);\n }\n }, [rootRef, onDragLeave, noDragEventsBubbling]);\n var setFiles = useCallback(function (files, event) {\n var acceptedFiles = [];\n var fileRejections = [];\n files.forEach(function (file) {\n var _fileAccepted = fileAccepted(file, acceptAttr),\n _fileAccepted2 = _slicedToArray(_fileAccepted, 2),\n accepted = _fileAccepted2[0],\n acceptError = _fileAccepted2[1];\n\n var _fileMatchSize = fileMatchSize(file, minSize, maxSize),\n _fileMatchSize2 = _slicedToArray(_fileMatchSize, 2),\n sizeMatch = _fileMatchSize2[0],\n sizeError = _fileMatchSize2[1];\n\n var customErrors = validator ? validator(file) : null;\n\n if (accepted && sizeMatch && !customErrors) {\n acceptedFiles.push(file);\n } else {\n var errors = [acceptError, sizeError];\n\n if (customErrors) {\n errors = errors.concat(customErrors);\n }\n\n fileRejections.push({\n file: file,\n errors: errors.filter(function (e) {\n return e;\n })\n });\n }\n });\n\n if (!multiple && acceptedFiles.length > 1 || multiple && maxFiles >= 1 && acceptedFiles.length > maxFiles) {\n // Reject everything and empty accepted files\n acceptedFiles.forEach(function (file) {\n fileRejections.push({\n file: file,\n errors: [TOO_MANY_FILES_REJECTION]\n });\n });\n acceptedFiles.splice(0);\n }\n\n dispatch({\n acceptedFiles: acceptedFiles,\n fileRejections: fileRejections,\n type: \"setFiles\"\n });\n\n if (onDrop) {\n onDrop(acceptedFiles, fileRejections, event);\n }\n\n if (fileRejections.length > 0 && onDropRejected) {\n onDropRejected(fileRejections, event);\n }\n\n if (acceptedFiles.length > 0 && onDropAccepted) {\n onDropAccepted(acceptedFiles, event);\n }\n }, [dispatch, multiple, acceptAttr, minSize, maxSize, maxFiles, onDrop, onDropAccepted, onDropRejected, validator]);\n var onDropCb = useCallback(function (event) {\n event.preventDefault(); // Persist here because we need the event later after getFilesFromEvent() is done\n\n event.persist();\n stopPropagation(event);\n dragTargetsRef.current = [];\n\n if (isEvtWithFiles(event)) {\n Promise.resolve(getFilesFromEvent(event)).then(function (files) {\n if (isPropagationStopped(event) && !noDragEventsBubbling) {\n return;\n }\n\n setFiles(files, event);\n }).catch(function (e) {\n return onErrCb(e);\n });\n }\n\n dispatch({\n type: \"reset\"\n });\n }, [getFilesFromEvent, setFiles, onErrCb, noDragEventsBubbling]); // Fn for opening the file dialog programmatically\n\n var openFileDialog = useCallback(function () {\n // No point to use FS access APIs if context is not secure\n // https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts#feature_detection\n if (fsAccessApiWorksRef.current) {\n dispatch({\n type: \"openDialog\"\n });\n onFileDialogOpenCb(); // https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker\n\n var opts = {\n multiple: multiple,\n types: pickerTypes\n };\n window.showOpenFilePicker(opts).then(function (handles) {\n return getFilesFromEvent(handles);\n }).then(function (files) {\n setFiles(files, null);\n dispatch({\n type: \"closeDialog\"\n });\n }).catch(function (e) {\n // AbortError means the user canceled\n if (isAbort(e)) {\n onFileDialogCancelCb(e);\n dispatch({\n type: \"closeDialog\"\n });\n } else if (isSecurityError(e)) {\n fsAccessApiWorksRef.current = false; // CORS, so cannot use this API\n // Try using the input\n\n if (inputRef.current) {\n inputRef.current.value = null;\n inputRef.current.click();\n } else {\n onErrCb(new Error(\"Cannot open the file picker because the https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API is not supported and no was provided.\"));\n }\n } else {\n onErrCb(e);\n }\n });\n return;\n }\n\n if (inputRef.current) {\n dispatch({\n type: \"openDialog\"\n });\n onFileDialogOpenCb();\n inputRef.current.value = null;\n inputRef.current.click();\n }\n }, [dispatch, onFileDialogOpenCb, onFileDialogCancelCb, useFsAccessApi, setFiles, onErrCb, pickerTypes, multiple]); // Cb to open the file dialog when SPACE/ENTER occurs on the dropzone\n\n var onKeyDownCb = useCallback(function (event) {\n // Ignore keyboard events bubbling up the DOM tree\n if (!rootRef.current || !rootRef.current.isEqualNode(event.target)) {\n return;\n }\n\n if (event.key === \" \" || event.key === \"Enter\" || event.keyCode === 32 || event.keyCode === 13) {\n event.preventDefault();\n openFileDialog();\n }\n }, [rootRef, openFileDialog]); // Update focus state for the dropzone\n\n var onFocusCb = useCallback(function () {\n dispatch({\n type: \"focus\"\n });\n }, []);\n var onBlurCb = useCallback(function () {\n dispatch({\n type: \"blur\"\n });\n }, []); // Cb to open the file dialog when click occurs on the dropzone\n\n var onClickCb = useCallback(function () {\n if (noClick) {\n return;\n } // In IE11/Edge the file-browser dialog is blocking, therefore, use setTimeout()\n // to ensure React can handle state changes\n // See: https://github.com/react-dropzone/react-dropzone/issues/450\n\n\n if (isIeOrEdge()) {\n setTimeout(openFileDialog, 0);\n } else {\n openFileDialog();\n }\n }, [noClick, openFileDialog]);\n\n var composeHandler = function composeHandler(fn) {\n return disabled ? null : fn;\n };\n\n var composeKeyboardHandler = function composeKeyboardHandler(fn) {\n return noKeyboard ? null : composeHandler(fn);\n };\n\n var composeDragHandler = function composeDragHandler(fn) {\n return noDrag ? null : composeHandler(fn);\n };\n\n var stopPropagation = function stopPropagation(event) {\n if (noDragEventsBubbling) {\n event.stopPropagation();\n }\n };\n\n var getRootProps = useMemo(function () {\n return function () {\n var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},\n _ref2$refKey = _ref2.refKey,\n refKey = _ref2$refKey === void 0 ? \"ref\" : _ref2$refKey,\n role = _ref2.role,\n onKeyDown = _ref2.onKeyDown,\n onFocus = _ref2.onFocus,\n onBlur = _ref2.onBlur,\n onClick = _ref2.onClick,\n onDragEnter = _ref2.onDragEnter,\n onDragOver = _ref2.onDragOver,\n onDragLeave = _ref2.onDragLeave,\n onDrop = _ref2.onDrop,\n rest = _objectWithoutProperties(_ref2, _excluded3);\n\n return _objectSpread(_objectSpread(_defineProperty({\n onKeyDown: composeKeyboardHandler(composeEventHandlers(onKeyDown, onKeyDownCb)),\n onFocus: composeKeyboardHandler(composeEventHandlers(onFocus, onFocusCb)),\n onBlur: composeKeyboardHandler(composeEventHandlers(onBlur, onBlurCb)),\n onClick: composeHandler(composeEventHandlers(onClick, onClickCb)),\n onDragEnter: composeDragHandler(composeEventHandlers(onDragEnter, onDragEnterCb)),\n onDragOver: composeDragHandler(composeEventHandlers(onDragOver, onDragOverCb)),\n onDragLeave: composeDragHandler(composeEventHandlers(onDragLeave, onDragLeaveCb)),\n onDrop: composeDragHandler(composeEventHandlers(onDrop, onDropCb)),\n role: typeof role === \"string\" && role !== \"\" ? role : \"presentation\"\n }, refKey, rootRef), !disabled && !noKeyboard ? {\n tabIndex: 0\n } : {}), rest);\n };\n }, [rootRef, onKeyDownCb, onFocusCb, onBlurCb, onClickCb, onDragEnterCb, onDragOverCb, onDragLeaveCb, onDropCb, noKeyboard, noDrag, disabled]);\n var onInputElementClick = useCallback(function (event) {\n event.stopPropagation();\n }, []);\n var getInputProps = useMemo(function () {\n return function () {\n var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},\n _ref3$refKey = _ref3.refKey,\n refKey = _ref3$refKey === void 0 ? \"ref\" : _ref3$refKey,\n onChange = _ref3.onChange,\n onClick = _ref3.onClick,\n rest = _objectWithoutProperties(_ref3, _excluded4);\n\n var inputProps = _defineProperty({\n accept: acceptAttr,\n multiple: multiple,\n type: \"file\",\n style: {\n display: \"none\"\n },\n onChange: composeHandler(composeEventHandlers(onChange, onDropCb)),\n onClick: composeHandler(composeEventHandlers(onClick, onInputElementClick)),\n tabIndex: -1\n }, refKey, inputRef);\n\n return _objectSpread(_objectSpread({}, inputProps), rest);\n };\n }, [inputRef, accept, multiple, onDropCb, disabled]);\n return _objectSpread(_objectSpread({}, state), {}, {\n isFocused: isFocused && !disabled,\n getRootProps: getRootProps,\n getInputProps: getInputProps,\n rootRef: rootRef,\n inputRef: inputRef,\n open: composeHandler(openFileDialog)\n });\n}\n/**\n * @param {DropzoneState} state\n * @param {{type: string} & DropzoneState} action\n * @returns {DropzoneState}\n */\n\nfunction reducer(state, action) {\n /* istanbul ignore next */\n switch (action.type) {\n case \"focus\":\n return _objectSpread(_objectSpread({}, state), {}, {\n isFocused: true\n });\n\n case \"blur\":\n return _objectSpread(_objectSpread({}, state), {}, {\n isFocused: false\n });\n\n case \"openDialog\":\n return _objectSpread(_objectSpread({}, initialState), {}, {\n isFileDialogActive: true\n });\n\n case \"closeDialog\":\n return _objectSpread(_objectSpread({}, state), {}, {\n isFileDialogActive: false\n });\n\n case \"setDraggedFiles\":\n return _objectSpread(_objectSpread({}, state), {}, {\n isDragActive: action.isDragActive,\n isDragAccept: action.isDragAccept,\n isDragReject: action.isDragReject\n });\n\n case \"setFiles\":\n return _objectSpread(_objectSpread({}, state), {}, {\n acceptedFiles: action.acceptedFiles,\n fileRejections: action.fileRejections\n });\n\n case \"reset\":\n return _objectSpread({}, initialState);\n\n default:\n return state;\n }\n}\n\nfunction noop() {}\n\nexport { ErrorCode } from \"./utils\";","import React from 'react';\r\nimport { useSelector } from 'react-redux';\r\n\r\nconst Sheet = ({ children, className, style }) => {\r\n const { staticContentUrl } = useSelector(state => state.config.applicationSettings);\r\n\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n};\r\n\r\nexport default Sheet;\r\n","var _path;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgPlus(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 69 71\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-general-icon-0\",\n d: \"M69 41.8025H41.5415V70.499H27.3169V41.8025H0V29.0562H27.3169V0.499023H41.5415V29.0562H69V41.8025Z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgPlus);\nexport default __webpack_public_path__ + \"static/media/plus.50aba57be9081adeefc28f2d02a7391e.svg\";\nexport { ForwardRef as ReactComponent };","import React from 'react';\r\n\r\nconst UploadBillAcceptedIcons = () => {\r\n const getIcon = (icon, label, accepted) => {\r\n return (\r\n
By choosing to use a SmartMe Certified Finance Expert (\"SCFE\"), you agree with SmartMe that:
\r\n
\r\n
\r\n you consent to SmartMe providing your personal information and other details to the SCFE (which may be\r\n provided via a mortgage broker aggregator) for the purpose of the SCFE providing you with more\r\n information about Home Loans and (at your election) providing you with assistance to apply for a Home\r\n Loan;\r\n
\r\n
a SCFE may be a third party
\r\n
SmartMe will have no involvement in or knowledge of the interactions between you and the SCFE.
\r\n
\r\n we will have no liability to you in relation to your dealings with the SCFE including any advice or\r\n recommendations they may make;\r\n
\r\n
\r\n each SCFE is providing credit services under their own Australian Credit Licence, or as a Credit\r\n Representative under an Australian Credit Licence. SCFEs are not SmartMe's Credit Representatives.\r\n SmartMe does not provide credit assistance;{' '}\r\n
\r\n
we may contact you to seek your response to a survey in relation to your dealings with the SCFE;
\r\n
\r\n we (or one of our related companies) may receive a commission or other payment in relation to the\r\n referral\r\n
\r\n
\"We\" and \"us\" means SmartMe Australia Pty Limited (ABN: 68 603 327 377)
\r\n \r\n );\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n // Load content here in framed mode as we need to establish the height of the dialog for frame resizing.\r\n if (pageMode === pageModes.FRAMED) {\r\n getContent();\r\n }\r\n }, []);\r\n\r\n const onDialogToggle = event => {\r\n // Prevent checkbox from being toggled in cases where dialog button is being used in the label\r\n event.stopPropagation();\r\n\r\n setDialogOpen(!dialogOpen);\r\n };\r\n\r\n const handleModal = () => {\r\n if (pageMode === pageModes.FRAMED) {\r\n dispatch(postFrameDialogMessage(frameHost, 'Terms and Conditions', dialogOpen, ref.current, frameHeight));\r\n } else if (dialogOpen) {\r\n getContent();\r\n }\r\n\r\n if (dialogOpen && onOpen) {\r\n onOpen();\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n
\r\n {!forceRequireEmailAddress && anonymousMode === anonymousModes.OPTIONAL\r\n ? 'Enter your email address to get your comparison results in your inbox.'\r\n : 'A copy of your comparison results will be sent to this email address.'}\r\n
\r\n onSolarInstallationEmailChange(!solarInstallationEmail)}\r\n label={\r\n agentSolarServiceType.affiliateSettings.checkboxLabel ||\r\n 'Email me information about quality solar installers in my area.'\r\n }\r\n />\r\n
\r\n \r\n )}\r\n\r\n
\r\n onTermsAndConditionsChange(!termsAndConditions)}\r\n label={}\r\n validatorName=\"submit-common-terms\"\r\n validationMessage=\"Please accept the terms and conditions\"\r\n />\r\n
\r\n \r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default SubmitCommon;\r\n","export const comparisonResponseStatus = {\r\n NONE: 0,\r\n SUCCESS: 1,\r\n VERIFY: 2\r\n};\r\n","import * as types from './actions';\r\nimport axios from 'axios';\r\nimport timeAxios from '../utilities/timeAxios';\r\nimport { apiTiming } from '../utilities/googleAnalyticsEvents';\r\nimport { getAttemptCount } from '../utilities/commonUtilities';\r\nimport { sleep } from '../utilities/compareUtilities';\r\nimport { setAjaxCallStart, setAjaxCallEnd } from './ajaxCallActions';\r\nimport { setServerMessageClear } from './serverMessageActions';\r\nimport { setUserBill } from './comparisonActions';\r\nimport { contextTypes } from '../enums/submissionTypes';\r\nimport { comparisonResponseStatus } from '../enums/comparisonResponseStatus';\r\nimport { billTypes } from '../enums/billTypes';\r\n\r\nexport function setComparisonSuccess(comparison) {\r\n return { type: types.SET_COMPARISON, comparison };\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Submit bill (un-authenticated) action\r\n// --------------------------------------------------------------------------\r\nexport function submitBillUnauthenticated(data, onComplete, onError, onVerify, serviceType) {\r\n const start = Date.now();\r\n\r\n const polling = (dispatch, responseData, start) => {\r\n dispatch(getComparisonUnauthenticated({ ...data, ...responseData }, start, onComplete, onError, onVerify));\r\n };\r\n\r\n return submitBill('', data.bill, start, polling, onError, onVerify, serviceType);\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// Submit bill (with token) action\r\n// ----------------------------------------------------------------------------\r\nexport function submitBillWithToken(accessToken, data, onComplete, onError, onVerify, serviceType) {\r\n const config = {\r\n headers: {\r\n Authorization: `Bearer ${accessToken}`\r\n }\r\n };\r\n\r\n const path = `/token/submit`;\r\n const start = Date.now();\r\n\r\n const polling = (dispatch, responseData, start, onVerify) => {\r\n dispatch(getComparisonWithToken({ ...data, ...responseData }, start, onComplete, onError, onVerify, config));\r\n };\r\n\r\n return submitBill(path, data.bill, start, polling, onError, onVerify, serviceType, config);\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Submit bill (with key) action\r\n// --------------------------------------------------------------------------\r\nexport function submitBillWithKey(data, onComplete, onError, onVerify, serviceType) {\r\n const path = `/${data.access.id}/?key=${data.access.key}`;\r\n const start = Date.now();\r\n\r\n const polling = (dispatch, responseData, start, onVerify) => {\r\n // if the access key has been cleared in the response, we need to treat as unauthenticated (customer has changed from original access key)\r\n if (responseData.accessKey) {\r\n dispatch(getComparisonWithKey({ ...data, ...responseData }, start, onComplete, onError, onVerify));\r\n } else {\r\n dispatch(getComparisonUnauthenticated({ ...data, ...responseData }, start, onComplete, onError, onVerify));\r\n }\r\n };\r\n\r\n return submitBill(path, data.bill, start, polling, onError, onVerify, serviceType);\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Submit bill action\r\n// --------------------------------------------------------------------------\r\nfunction submitBill(path, bill, start, polling, onError, onVerify, serviceType, config) {\r\n return dispatch => {\r\n dispatch(setServerMessageClear());\r\n\r\n dispatch(setAjaxCallStart(contextTypes.BILL_COMPARISON, serviceType));\r\n\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'submit', 'bill');\r\n });\r\n\r\n axios\r\n .post(`/api/compare/bill${path}`, bill, config)\r\n .then(response => {\r\n if (response.data) {\r\n dispatch(setComparisonAccessKey(response.data));\r\n\r\n polling(dispatch, response.data, start, onVerify);\r\n }\r\n })\r\n .catch(error => {\r\n if (onError) onError(error);\r\n dispatch(setAjaxCallEnd());\r\n });\r\n };\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Get bill comparison with an access token issued by an external authentication provider.\r\n// --------------------------------------------------------------------------\r\nexport function pollComparisonWithToken(accessToken, requestKey, onComplete, onError, onVerify) {\r\n return dispatch => {\r\n dispatch(setAjaxCallStart(contextTypes.BILL_COMPARISON));\r\n\r\n const path = `/token/?token=${encodeURIComponent(requestKey)}`;\r\n const start = Date.now();\r\n\r\n const config = {\r\n headers: {\r\n Authorization: `Bearer ${accessToken}`\r\n }\r\n };\r\n\r\n dispatch(getComparison(path, start, onComplete, onError, onVerify, config));\r\n };\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Get bill comparison (with token) action\r\n// --------------------------------------------------------------------------\r\nfunction getComparisonWithToken(data, start, onComplete, onError, onVerify, config) {\r\n const path = `/token?token=${data.requestKey}`;\r\n\r\n return getComparison(path, start, onComplete, onError, onVerify, config);\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Get bill comparison (with key) action\r\n// --------------------------------------------------------------------------\r\nfunction getComparisonWithKey(data, start, onComplete, onError, onVerify) {\r\n const path = `/${data.access.id}/${data.requestKey}?key=${data.access.key}`;\r\n\r\n return getComparison(path, start, onComplete, onError, onVerify);\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Get bill comparison (un-authenticated) action\r\n// --------------------------------------------------------------------------\r\nfunction getComparisonUnauthenticated(data, start, onComplete, onError, onVerify) {\r\n const path = `?token=${data.requestKey}`;\r\n\r\n return getComparison(path, start, onComplete, onError, onVerify);\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Get bill comparison action\r\n// --------------------------------------------------------------------------\r\nfunction getComparison(path, start, onComplete, onError, onVerify, config) {\r\n return dispatch => {\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'get', 'comparison');\r\n });\r\n\r\n let timer = 0;\r\n let attempts = 0;\r\n const attemptIntervals = [3000, 1000];\r\n const attemptLimit = getAttemptCount(attemptIntervals, 120);\r\n\r\n let fn = () => {\r\n axios\r\n .get(`/api/compare/bill${path}`, config)\r\n .then(response => {\r\n const data = response.data;\r\n\r\n if (data) {\r\n clearTimeout(timer);\r\n timer = 0;\r\n\r\n sleep(start, 'Bill Polling').then(() => {\r\n dispatch(setComparisonAccessKey(data));\r\n\r\n if (data.comparisonResponseStatus === comparisonResponseStatus.SUCCESS) {\r\n dispatch(setUserBill(data));\r\n dispatch(setComparison(data));\r\n } else if (data.comparisonResponseStatus === comparisonResponseStatus.VERIFY) {\r\n const serviceType =\r\n data.verifyData && data.verifyData.billType\r\n ? billTypes.getByCode(data.verifyData.billType)\r\n : billTypes.NONE;\r\n\r\n onVerify(serviceType, data.verifyData);\r\n }\r\n\r\n dispatch(setAjaxCallEnd());\r\n\r\n if (onComplete) {\r\n if (data.comparisonResponseStatus === comparisonResponseStatus.SUCCESS) {\r\n onComplete(\r\n { hasOffers: data.comparison.hasOffers, hasBetterOffers: data.comparison.hasBetterOffers },\r\n data.userBill\r\n );\r\n }\r\n }\r\n });\r\n }\r\n })\r\n .catch(error => {\r\n const notReady = error.response.status === 404;\r\n\r\n if (notReady && attempts < attemptLimit) {\r\n const maxIntervals = attemptIntervals.length - 1;\r\n const interval = attempts <= maxIntervals ? attemptIntervals[attempts] : attemptIntervals[maxIntervals];\r\n attempts++;\r\n clearTimeout(timer);\r\n timer = setTimeout(fn, interval);\r\n } else {\r\n clearTimeout(timer);\r\n timer = 0;\r\n if (onError) onError(error);\r\n dispatch(setAjaxCallEnd());\r\n }\r\n });\r\n };\r\n\r\n fn();\r\n };\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Set comparison access key action\r\n// --------------------------------------------------------------------------\r\nfunction setComparisonAccessKey(data) {\r\n const accessId = data.accessKey ? data.accessKey.accessId : null;\r\n const accessKey = data.accessKey ? data.accessKey.accessKey : null;\r\n const accessTrustLevel = data.accessKey ? data.accessKey.accessTrustLevel : null;\r\n\r\n return dispatch =>\r\n dispatch(\r\n setComparisonSuccess({\r\n accessId,\r\n accessKey,\r\n accessTrustLevel\r\n })\r\n );\r\n}\r\n\r\n// --------------------------------------------------------------------------\r\n// Set comparison action\r\n// --------------------------------------------------------------------------\r\nfunction setComparison(data) {\r\n return dispatch => {\r\n const userBill = data.userBill;\r\n const comparison = data.comparison;\r\n const hasOffers = comparison.hasOffers;\r\n\r\n // Leave previous comparison offers there if there are no offers on the current comparison; so that we don't have a empty screen on the compare page...\r\n if (!hasOffers) {\r\n delete comparison.offers;\r\n }\r\n\r\n dispatch(\r\n setComparisonSuccess({\r\n ...comparison,\r\n submissionId: userBill.submissionId,\r\n sorting: data.sorting,\r\n isLoaded: true\r\n })\r\n );\r\n };\r\n}\r\n","import React from 'react';\r\nimport { useDispatch } from 'react-redux';\r\n\r\nimport { setServerMessageClear } from '../../actions/serverMessageActions';\r\n\r\nconst ServerMessage = ({ serverMessage, target, paddingLevel, showCloseIcon, onClose }) => {\r\n const dispatch = useDispatch();\r\n\r\n const showClose = showCloseIcon === undefined || showCloseIcon === true;\r\n const hasMessage =\r\n serverMessage &&\r\n serverMessage.messages &&\r\n serverMessage.messages.length > 0 &&\r\n serverMessage.code &&\r\n ((!serverMessage.target && !target) || serverMessage.target === target);\r\n\r\n const alertClass = `sm-server-message${paddingLevel ? ` ${paddingLevel.tag}-padding` : ''} alert ${\r\n serverMessage.code >= 200 && serverMessage.code <= 299 ? 'alert-success' : 'alert-danger'\r\n }`;\r\n\r\n const clearMessage = () => {\r\n dispatch(setServerMessageClear(target));\r\n if (onClose) onClose();\r\n };\r\n\r\n return hasMessage ? (\r\n
\r\n );\r\n\r\n default:\r\n return (\r\n setInfoPopover(!infoPopoverOpen)}\r\n >\r\n info\r\n \r\n );\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n {getButton()}\r\n setInfoPopover(false)}\r\n >\r\n \r\n {heading} clear\r\n \r\n \r\n {bodyIsHtml ? (\r\n \r\n ) : (\r\n body\r\n )}\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default InfoPopover;\r\n","let getElementOffset = function(elementId) {\r\n var el = document.getElementById(elementId);\r\n const rect = el.getBoundingClientRect();\r\n\r\n return {\r\n left: rect.left + window.scrollX,\r\n top: rect.top + window.scrollY\r\n };\r\n};\r\nexport { getElementOffset };\r\n","import React from 'react';\r\nimport { customerCommissionTypes } from '../../enums/customerCommissionTypes';\r\n\r\nconst CustomerCommissionTerms = ({ serviceType, commissionType }) => {\r\n const commissionName = commissionType.Name;\r\n\r\n return (\r\n <>\r\n {commissionName} will be issued to the email address you used in your retailer application, between 60 and 90 days\r\n after your {serviceType.Name.toLowerCase()} application has been successfully approved by the retailer. To be\r\n eligible for the {commissionName} offer, you will need to be an active billing customer with the retailer on the\r\n day the {commissionName} is due to be issued. Limited numbers may apply.\r\n {commissionType === customerCommissionTypes.COLES_GIFT_CARD && (\r\n
\r\n {commissionName} redeemable at: Coles Supermarkets and Coles Central. This card cannot be redeemed at Coles\r\n Online, Coles Express or Liquorland. Conditions and exclusions apply. For full Terms of Use visit{' '}\r\n \r\n giftcards.com.au\r\n {' '}\r\n or phone 1300 304 990.\r\n
\r\n setmobilePhoneNumber(e.target.value)}\r\n validate={{\r\n required: { value: true, errorMessage: 'Mobile phone number is required' },\r\n pattern: {\r\n value: mobilePhoneNumberRegex,\r\n errorMessage: `Please enter a valid mobile phone number for ${countryName} (no spaces or hyphens)`\r\n }\r\n }}\r\n />\r\n
\r\n
\r\n \r\n
\r\n \r\n )}\r\n\r\n
\r\n {onClose && submitted && (\r\n \r\n )}\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default RegistrationControl;\r\n","import axios from 'axios';\r\nimport { push } from 'connected-react-router';\r\nimport { setAjaxCallStart, setAjaxCallEnd } from './ajaxCallActions';\r\nimport {\r\n generalServerMessage,\r\n setServerMessage,\r\n setServerMessageClear,\r\n sessionExpiredServerMessage,\r\n displayErrorMessage\r\n} from './serverMessageActions';\r\nimport * as serverMessageTargets from './serverMessageTargets';\r\nimport { goDashboard, goHome, setUserBillsSuccess, setUserBillSuccess } from './comparisonActions';\r\nimport { setUser } from './userActions';\r\nimport timeAxios from '../utilities/timeAxios';\r\nimport { apiTiming } from '../utilities/googleAnalyticsEvents';\r\nimport { popUp } from '../utilities/commonUtilities';\r\nimport { contextTypes, submissionTypes } from '../enums/submissionTypes';\r\nimport { openSubmitDialog } from './dialogOptionsActions';\r\nimport { billTypes } from '../enums/billTypes';\r\nimport { uploadSubTypes } from '../enums/uploadBillTypes';\r\n\r\n// ----------------------------------------------------------------------------\r\n// Gets a customer dashboard with an internal BSC access key and auto-opens the service card\r\n// ----------------------------------------------------------------------------\r\nexport function openServiceCardWithKey(accessKey) {\r\n return dispatch => {\r\n dispatch(setAjaxCallStart(contextTypes.CUSTOMER_DASHBOARD));\r\n\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'load', 'service-cards');\r\n });\r\n\r\n axios\r\n .get(`/api/servicecard/open/${accessKey.id}/?key=${accessKey.key}`)\r\n .then(response => {\r\n if (response.data) {\r\n const data = response.data;\r\n\r\n if (data.messages && data.messages[0] && data.messages[0].message) {\r\n dispatch(customerHomeError(data.messages[0].message));\r\n } else {\r\n const services = [...data.services];\r\n\r\n if (data.autoOpen && data.autoOpen.addressLocked) {\r\n const submissionId = data.autoOpen.submissionId;\r\n const submission = data.services.find(e => e.submissionId === submissionId);\r\n const serviceType = billTypes.getById(data.autoOpen.serviceTypeId);\r\n const submissionType = submissionTypes.getById(data.autoOpen.submissionTypeId);\r\n\r\n submission.addressLocked = true;\r\n\r\n dispatch(openServiceCard(submissionId, submission, serviceType, submissionType));\r\n }\r\n\r\n dispatch(setUser({ ...data.user, accessId: accessKey.id, accessKey: accessKey.key, loaded: true }));\r\n dispatch(setUserBillsSuccess({ loaded: true, data: services }));\r\n dispatch(goHome());\r\n dispatch(setAjaxCallEnd());\r\n }\r\n } else {\r\n dispatch(customerHomeError());\r\n }\r\n })\r\n .catch(e => {\r\n dispatch(customerHomeError());\r\n });\r\n };\r\n}\r\n\r\nconst openServiceCard = (submissionId, submission, serviceType, submissionType) => {\r\n return dispatch => {\r\n const backButtonVisible = false;\r\n const buttonText = 'Submit';\r\n\r\n dispatch(\r\n openSubmitDialog(serviceType, submissionType.uploadBillType, uploadSubTypes.NONE, {\r\n submissionId,\r\n submission: submission.estimate,\r\n backButtonVisible,\r\n buttonText\r\n })\r\n );\r\n };\r\n};\r\n\r\n// ----------------------------------------------------------------------------\r\n// Gets a customer dashboard with an internal access key.\r\n// ----------------------------------------------------------------------------\r\nexport function getCustomerDashboardWithKey(accessKey, launchDefaultComparisons) {\r\n return dispatch => {\r\n dispatch(setAjaxCallStart(contextTypes.CUSTOMER_DASHBOARD));\r\n\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'load', 'comparison');\r\n });\r\n\r\n axios\r\n .get(`/api/servicecard/${accessKey.id}/?key=${accessKey.key}`)\r\n .then(response => {\r\n if (response.data) {\r\n const data = response.data;\r\n\r\n if (data.messages && data.messages[0] && data.messages[0].message) {\r\n dispatch(customerHomeError(data.messages[0].message));\r\n } else {\r\n dispatch(setUser({ ...data.user, accessId: accessKey.id, accessKey: accessKey.key, loaded: true }));\r\n dispatch(setUserBillsSuccess({ loaded: true, data: [...data.services] }));\r\n dispatch(push(`/dashboard${!launchDefaultComparisons ? '?start=true' : ''}`));\r\n dispatch(setAjaxCallEnd());\r\n }\r\n } else {\r\n dispatch(customerHomeError());\r\n }\r\n })\r\n .catch(() => {\r\n dispatch(customerHomeError());\r\n });\r\n };\r\n}\r\n\r\nfunction customerHomeError(message) {\r\n return dispatch => {\r\n dispatch(goHome());\r\n\r\n dispatch(\r\n displayErrorMessage(\r\n serverMessageTargets.HOME,\r\n message || 'An error occured processing your request. Please try again later.',\r\n true\r\n )\r\n );\r\n dispatch(setAjaxCallEnd());\r\n };\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// Get service cards using an access token issued by a known authentication provider (if available).\r\n// ----------------------------------------------------------------------------\r\nexport function getServiceCards(accessToken) {\r\n return dispatch => {\r\n dispatch(setServerMessageClear());\r\n dispatch(setAjaxCallStart());\r\n dispatch(setUserBillsSuccess({ loaded: false }));\r\n\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'home', 'getServiceCards');\r\n });\r\n\r\n const config = accessToken\r\n ? {\r\n headers: {\r\n Authorization: `Bearer ${accessToken}`\r\n }\r\n }\r\n : undefined;\r\n\r\n const path = accessToken ? '/api/servicecard' : '/api/servicecard/empty';\r\n\r\n axios\r\n .get(path, config)\r\n .then(response => {\r\n if (response.data) {\r\n var data = response.data;\r\n dispatch(setUserBillsSuccess({ loaded: true, data: [...data] }));\r\n } else {\r\n dispatch(goHome());\r\n }\r\n })\r\n .catch(error => {\r\n if (error.response && error.response.data) {\r\n dispatch(\r\n setServerMessage({\r\n ...error.response.data,\r\n scrollTo: true,\r\n target: serverMessageTargets.DASHBOARD\r\n })\r\n );\r\n }\r\n })\r\n .then(function() {\r\n dispatch(setAjaxCallEnd());\r\n });\r\n };\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// View bill with an access token issued by a known authentication provider.\r\n// ----------------------------------------------------------------------------\r\nexport function viewBillWithToken(accessToken, id) {\r\n return dispatch => {\r\n dispatch(setServerMessageClear());\r\n dispatch(setAjaxCallStart());\r\n\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'dashboard', 'viewBill');\r\n });\r\n\r\n const config = {\r\n headers: {\r\n Authorization: `Bearer ${accessToken}`\r\n }\r\n };\r\n\r\n axios\r\n .get(`/api/user/bill/view/${id}`, config)\r\n .then(response => {\r\n if (response.data) {\r\n if (!popUp(response.data, '_blank')) {\r\n dispatch(\r\n setServerMessage({\r\n code: response.status,\r\n messages: [{ field: '', message: 'Please enable pop-ups to view this bill.' }],\r\n scrollTo: true,\r\n target: serverMessageTargets.DASHBOARD\r\n })\r\n );\r\n }\r\n }\r\n })\r\n .catch(error => {\r\n if (error.response && error.response.data) {\r\n dispatch(\r\n setServerMessage({\r\n ...error.response.data,\r\n scrollTo: true,\r\n target: serverMessageTargets.DASHBOARD\r\n })\r\n );\r\n }\r\n })\r\n .then(function() {\r\n dispatch(setAjaxCallEnd());\r\n });\r\n };\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// View bill with an internal access key.\r\n// ----------------------------------------------------------------------------\r\nexport function viewBillWithKey(accessKey) {\r\n return dispatch => {\r\n dispatch(setServerMessageClear());\r\n dispatch(setAjaxCallStart());\r\n\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'dashboard2.0', 'viewBill');\r\n });\r\n\r\n axios\r\n .get(`/api/user/bill/view/key/${accessKey.id}/?key=${accessKey.key}`)\r\n .then(response => {\r\n if (response.data) {\r\n if (!popUp(response.data, '_blank')) {\r\n dispatch(\r\n setServerMessage({\r\n code: response.status,\r\n messages: [{ field: '', message: 'Please enable pop-ups to view this bill.' }],\r\n scrollTo: true,\r\n target: serverMessageTargets.DASHBOARD\r\n })\r\n );\r\n }\r\n }\r\n })\r\n .catch(error => {\r\n if (error.response && error.response.data) {\r\n dispatch(\r\n setServerMessage({\r\n ...error.response.data,\r\n scrollTo: true,\r\n target: serverMessageTargets.DASHBOARD\r\n })\r\n );\r\n }\r\n })\r\n .then(function() {\r\n dispatch(setAjaxCallEnd());\r\n });\r\n };\r\n}\r\n\r\nfunction resetComparison(id, errorMessages, reductionLoaded) {\r\n return dispatch => {\r\n dispatch(\r\n setUserBillSuccess({\r\n id,\r\n errorMessages,\r\n reductionLoaded,\r\n bestOffer: null,\r\n reductionPercentage: 0,\r\n reductionAmountAnnual: 0,\r\n nextCompareDateUtc: null,\r\n expirySeconds: 0\r\n })\r\n );\r\n };\r\n}\r\n\r\nfunction getReductionAmount(path, submissionId, config) {\r\n return dispatch => {\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'dashboard2.0', 'getReductionAmount');\r\n });\r\n\r\n dispatch(resetComparison(submissionId, null, false));\r\n\r\n axios\r\n .get(path, config)\r\n .then(response => {\r\n if (response.data) {\r\n var data = response.data;\r\n\r\n dispatch(\r\n setUserBillSuccess({\r\n id: submissionId,\r\n reductionLoaded: true,\r\n ...data\r\n })\r\n );\r\n }\r\n })\r\n .catch(error => {\r\n let errorMessages =\r\n error.response && error.response.data\r\n ? error.response.data.messages\r\n : [{ field: '', message: 'Error getting comparison' }];\r\n\r\n dispatch(resetComparison(submissionId, errorMessages, true));\r\n });\r\n };\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// Get reduction amount for service card with an internal access key.\r\n// ----------------------------------------------------------------------------\r\nexport function getReductionAmountWithKey(accessKey, submissionId) {\r\n return getReductionAmount(`/api/compare/reduction/${accessKey.id}/?key=${accessKey.key}`, submissionId, null);\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// Get reduction amount for service card with an access token issued by a known authentication provider.\r\n// ----------------------------------------------------------------------------\r\nexport function getReductionAmountWithToken(accessToken, submissionId, submissionType) {\r\n const config = {\r\n headers: {\r\n Authorization: `Bearer ${accessToken}`\r\n }\r\n };\r\n\r\n return getReductionAmount(`/api/compare/reduction/${submissionType}/${submissionId}`, submissionId, config);\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// Delete user bill\r\n// ----------------------------------------------------------------------------\r\nexport function deleteServiceCard(comparisonReady, userBill, isAuthenticated, getAccessToken, onDeleteComplete) {\r\n return dispatch => {\r\n const target = serverMessageTargets.ESTIMATE_DIALOG;\r\n\r\n if (!userBill) {\r\n dispatch(sessionExpiredServerMessage(target));\r\n return;\r\n }\r\n\r\n const accessKey = userBill.accessKey;\r\n const deleted = true;\r\n\r\n if (accessKey) {\r\n const access = { key: accessKey.accessKey, id: accessKey.accessId, trustLevel: accessKey.accessTrustLevel };\r\n\r\n dispatch(\r\n deleteOrRestoreServiceCardWithKey(access, deleted, comparisonReady, userBill.submissionId, onDeleteComplete)\r\n );\r\n } else if (isAuthenticated) {\r\n const fn = async () => {\r\n dispatch(\r\n deleteOrRestoreServiceCardWithToken(\r\n await getAccessToken(),\r\n deleted,\r\n comparisonReady,\r\n userBill.submissionId,\r\n submissionTypes.ESTIMATE,\r\n onDeleteComplete\r\n )\r\n );\r\n };\r\n fn();\r\n } else {\r\n dispatch(sessionExpiredServerMessage(target));\r\n }\r\n };\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// Delete / restore service card with an internal access key.\r\n// ----------------------------------------------------------------------------\r\nexport function deleteOrRestoreServiceCardWithKey(access, deleted, comparisonReady, submissionId, onComplete) {\r\n const action = deleted ? 'delete' : 'restore';\r\n\r\n return dispatch => {\r\n // Delete / restore only on user front-end if we have a >= low-trust access key.\r\n if (access.trustLevel >= 2) {\r\n deleteOrRestoreServiceCard(\r\n dispatch,\r\n `/api/servicecard/${action}/${access.id}/?key=${access.key}`,\r\n null,\r\n comparisonReady,\r\n onComplete\r\n );\r\n } else {\r\n onComplete({ submissionId }, comparisonReady);\r\n }\r\n };\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// Delete / restore service card with an access token issued by a known authentication provider.\r\n// ----------------------------------------------------------------------------\r\nexport function deleteOrRestoreServiceCardWithToken(\r\n accessToken,\r\n deleted,\r\n comparisonReady,\r\n submissionId,\r\n submissionType,\r\n onComplete\r\n) {\r\n return dispatch => {\r\n const action = deleted ? 'delete' : 'restore';\r\n\r\n const config = {\r\n headers: {\r\n Authorization: `Bearer ${accessToken}`\r\n }\r\n };\r\n\r\n deleteOrRestoreServiceCard(\r\n dispatch,\r\n `/api/servicecard/${action}/${submissionType}/${submissionId}`,\r\n config,\r\n comparisonReady,\r\n onComplete\r\n );\r\n };\r\n}\r\n\r\nfunction deleteOrRestoreServiceCard(dispatch, path, config, comparisonReady, onComplete) {\r\n dispatch(setServerMessageClear());\r\n dispatch(setAjaxCallStart());\r\n\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'service-card', 'delete');\r\n });\r\n\r\n axios\r\n .delete(path, config)\r\n .then(response => {\r\n onComplete(response.data, comparisonReady);\r\n })\r\n .catch(error => {\r\n dispatch(generalServerMessage(error.response, serverMessageTargets.DASHBOARD, true));\r\n })\r\n .then(function() {\r\n dispatch(setAjaxCallEnd());\r\n });\r\n}\r\n\r\n// ----------------------------------------------------------------------------\r\n// Refresh dashboard card.\r\n// ----------------------------------------------------------------------------\r\nexport function refreshBill(accessToken, id, target) {\r\n return dispatch => {\r\n dispatch(setServerMessageClear());\r\n dispatch(setAjaxCallStart());\r\n\r\n timeAxios(axios, timeInMs => {\r\n apiTiming(timeInMs, 'dashboard', 'refreshBill');\r\n });\r\n\r\n const config = {\r\n headers: {\r\n Authorization: `Bearer ${accessToken}`\r\n }\r\n };\r\n\r\n axios\r\n .get(`/api/compare/refresh/${id}`, config)\r\n .then(response => {\r\n dispatch(\r\n setServerMessage({\r\n code: response.status,\r\n messages: [{ field: '', message: 'Comparison emailed' }],\r\n scrollTo: true,\r\n target\r\n })\r\n );\r\n })\r\n .catch(error => {\r\n if (error.response && error.response.data) {\r\n dispatch(\r\n setServerMessage({\r\n ...error.response.data,\r\n scrollTo: true,\r\n target\r\n })\r\n );\r\n }\r\n })\r\n .then(function() {\r\n dispatch(setAjaxCallEnd());\r\n });\r\n };\r\n}\r\n","var _path;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgElectricity(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 30 30\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M13.1701 0.000365832C13.0443 0.000365832 12.9236 0.0599722 12.8479 0.161267L0.64318 16.4357C0.551028 16.5585 0.536401 16.7227 0.606612 16.8591C0.675726 16.9948 0.816515 17.0786 0.970833 17.0756L8.60559 16.9528C8.60376 16.9528 0.655979 29.2767 0.655979 29.2767C0.551759 29.4365 0.575529 29.6482 0.710832 29.7817C0.847964 29.9148 1.0586 29.9331 1.21621 29.8281L29.4551 10.9117C29.6024 10.8118 29.6675 10.629 29.6145 10.4593C29.5615 10.2893 29.4032 10.1744 29.2258 10.177L17.2617 10.3547L28.5672 0.707965C28.6952 0.598625 28.7424 0.420537 28.6839 0.263293C28.6253 0.103854 28.4739 0 28.3061 0H13.1701V0.000365832ZM13.8115 1.68617H24.8244L13.4564 11.3848C13.3277 11.4942 13.2809 11.6719 13.3405 11.8321C13.4001 11.9893 13.5533 12.0932 13.7226 12.0906L24.9279 11.9261L5.34442 25.0856L11.3285 15.8469C11.4089 15.7215 11.4144 15.565 11.3435 15.4344C11.2714 15.3057 11.1336 15.2249 10.9847 15.2275C10.9847 15.2275 3.58877 15.3481 3.57195 15.3481C3.57121 15.3452 3.56902 15.3452 3.56902 15.3452C3.57816 15.3269 13.8115 1.68617 13.8115 1.68617Z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgElectricity);\nexport default __webpack_public_path__ + \"static/media/electricity.3cb1b67a9acbb2dd9d6817c982c42cd7.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgGas(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 27 35\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M21.6194 10.1379C21.4337 9.86411 21.0801 9.7637 20.7816 9.89925C20.4818 10.0345 20.3206 10.3671 20.3996 10.6887C20.7438 12.0984 20.6649 13.7148 20.4533 15.1285C19.857 13.5646 18.8163 12.1623 17.688 10.6419L17.1885 9.96618C15.2782 7.36612 16.8343 1.55153 16.8503 1.4933C16.9226 1.22891 16.8317 0.946445 16.6194 0.775428C16.4052 0.603742 16.1133 0.577303 15.8746 0.706821C15.5091 0.904611 7.40423 5.38921 6.6945 13.8731C6.27595 13.2349 5.90318 12.2627 6.00533 10.8762C6.02722 10.579 5.85675 10.3015 5.58281 10.1897C5.3082 10.0773 4.99446 10.1576 4.80542 10.3872C4.57061 10.6723 -0.932114 17.4558 0.166309 24.8684C0.748022 28.7921 3.07686 32.1281 7.08916 34.7834C7.3558 34.9601 7.70802 34.9267 7.93685 34.7008C8.16437 34.4759 8.20682 34.1211 8.03834 33.848C5.51316 29.758 7.42412 25.9993 8.69434 24.2128C8.93844 24.9424 9.39877 25.7965 10.267 26.4866C10.4819 26.6566 10.7751 26.682 11.0126 26.5498C11.2514 26.4186 11.3893 26.1563 11.3635 25.8832C11.3588 25.8289 10.9356 20.8219 14.7436 18.4093C14.8305 20.1228 15.2212 23.3453 16.8761 25.2483C19.8278 28.6425 18.7513 31.7807 17.3278 33.8152C17.1421 34.0809 17.1673 34.4421 17.3875 34.6793C17.5195 34.8216 17.7006 34.8959 17.883 34.8959C18.0051 34.8959 18.1284 34.8627 18.2379 34.7948C18.5271 34.6161 25.3219 30.3413 26.1981 23.6847C26.9384 18.0619 21.8369 10.4588 21.6194 10.1379ZM24.8516 23.504C24.3674 27.1817 21.7527 30.1368 19.784 31.8838C20.4095 29.8115 20.3293 27.1405 17.8976 24.344C15.9674 22.1248 16.0795 17.3531 16.0808 17.3052C16.0875 17.0703 15.974 16.848 15.781 16.7168C15.5873 16.5853 15.3413 16.5636 15.1283 16.6576C11.3761 18.3206 10.3446 21.8259 10.0786 24.0421C9.77486 23.3216 9.77817 22.6998 9.77884 22.6599C9.78547 22.3798 9.62296 22.1235 9.36759 22.013C9.11288 21.9026 8.81573 21.9601 8.61939 22.1583C8.56898 22.2091 4.26218 26.6462 5.77715 32.0743C3.35943 29.9528 1.92737 27.4715 1.51082 24.6727C0.789146 19.8236 3.27519 15.1057 4.78154 12.7731C5.29096 15.0602 6.91007 16.013 6.99563 16.0619C7.20855 16.1844 7.47056 16.1807 7.68082 16.0525C7.89042 15.925 8.01579 15.6931 8.00915 15.4458C7.82011 8.88017 12.7458 4.52643 15.186 2.77877C14.8166 4.9123 14.4942 8.60105 16.0968 10.7824L16.6009 11.4638C18.4773 13.9923 19.9591 15.9893 19.5433 18.8892C19.4928 19.2369 19.7117 19.5666 20.0494 19.6522C20.391 19.7386 20.7339 19.5518 20.8533 19.2225C20.9083 19.0706 21.8728 16.3601 21.9842 13.4123C23.4076 16.0421 25.2808 20.2426 24.8516 23.504Z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgGas);\nexport default __webpack_public_path__ + \"static/media/gas.b7a18eb60f3c0db6dcfdcdae98b91729.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgHealth(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 35 30\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M33.5354 14.3679H31.7933C32.1986 13.1783 32.4048 12.0432 32.4048 10.9352C32.4048 7.51604 29.6815 4.68829 26.1974 4.33482V0.881701C26.1974 0.575815 25.9628 0.31751 25.6428 0.276725C25.3228 0.23594 25.0242 0.42627 24.9389 0.725359L23.9008 4.43678C21.6894 4.84463 20.3313 6.16335 19.151 8.13462C17.7218 5.7419 16.0224 4.30763 12.8441 4.30763C9.01154 4.30763 5.89717 7.28493 5.89717 10.9488C5.89717 12.5326 6.30957 14.1912 7.1486 15.9517H0.827438C0.471917 15.9517 0.1875 16.2236 0.1875 16.5635C0.1875 16.9034 0.471917 17.1753 0.827438 17.1753H7.78854C8.3716 18.2017 9.09686 19.2553 9.96433 20.3565C12.0832 23.0551 14.8421 25.7673 17.608 28.4115H11.6068C11.2513 28.4115 10.9669 28.6834 10.9669 29.0233C10.9669 29.3631 11.2513 29.635 11.6068 29.635H26.7023C27.0578 29.635 27.3422 29.3631 27.3422 29.0233C27.3422 28.6834 27.0578 28.4115 26.7023 28.4115H20.7011C23.467 25.7673 26.2259 23.0483 28.3448 20.3497C29.6602 18.6775 30.6486 17.1005 31.3169 15.5982H33.5354C33.8909 15.5982 34.1753 15.3264 34.1753 14.9865C34.1753 14.6466 33.8909 14.3679 33.5354 14.3679ZM31.125 10.9352C31.125 12.0704 30.8832 13.2123 30.4424 14.3679H26.1974V5.56517C28.9705 5.91864 31.125 8.18899 31.125 10.9352ZM7.16994 10.9352C7.16994 7.95108 9.71547 5.51758 12.8369 5.51758C15.4891 5.51758 16.9397 6.57119 18.5751 9.69804C18.6817 9.90196 18.9021 10.0379 19.151 10.0379C19.3928 10.0379 19.6132 9.90876 19.7198 9.69804C20.9073 7.42768 21.9952 6.25171 23.5168 5.77589L20.2673 17.352L18.2551 14.028C18.1413 13.8377 17.928 13.7221 17.7005 13.7221C17.4729 13.7221 17.2596 13.8377 17.1459 14.028L15.6527 16.4955L13.5338 12.988C13.42 12.7977 13.2067 12.6821 12.9792 12.6821C12.7516 12.6821 12.5383 12.7977 12.4245 12.988L10.6469 15.9313H8.55647C7.689 14.2523 7.16994 12.587 7.16994 10.9352ZM19.151 28.1464C15.354 24.5165 11.5428 20.8187 9.26751 17.1549H11.0238C11.2513 17.1549 11.4646 17.0393 11.5784 16.849L12.9934 14.5107L15.1123 18.0182C15.226 18.2085 15.4394 18.324 15.6669 18.324C15.8944 18.324 16.1077 18.2085 16.2215 18.0182L17.7147 15.5507L19.9403 19.2349C20.054 19.4252 20.2673 19.5408 20.4949 19.5408C20.5233 19.5408 20.5518 19.5408 20.5802 19.534C20.8362 19.5 21.0495 19.3233 21.1135 19.0854L24.9176 5.52438C24.9176 5.52438 24.9176 5.52438 24.9247 5.52438V14.9661C24.9247 15.306 25.2091 15.5779 25.5646 15.5779H29.9162C27.847 19.7651 23.4884 23.9999 19.151 28.1464Z\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M22.423 21.061H15.8743C15.5188 21.061 15.2344 21.3329 15.2344 21.6728C15.2344 22.0127 15.5188 22.2846 15.8743 22.2846H22.423C22.7785 22.2846 23.0629 22.0127 23.0629 21.6728C23.0629 21.3329 22.7785 21.061 22.423 21.061Z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgHealth);\nexport default __webpack_public_path__ + \"static/media/health.0d3909da4ad5d1eef0e1f7f01a41333d.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2, _path3, _path4, _path5, _path6, _path7, _path8;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgHomeInsurance(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 28 28\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M13.0634 18.8503H12.1641V19.7538H13.0634V18.8503Z\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M26.7785 8.52285L23.4034 6.53518V3.49134H23.8531C23.9723 3.49134 24.0867 3.44375 24.171 3.35903C24.2553 3.27431 24.3027 3.15941 24.3027 3.0396V1.23263C24.3027 1.11282 24.2553 0.997914 24.171 0.913196C24.0867 0.828478 23.9723 0.780884 23.8531 0.780884H19.3565C19.2373 0.780884 19.1229 0.828478 19.0386 0.913196C18.9543 0.997914 18.9069 1.11282 18.9069 1.23263V3.0396C18.9069 3.15941 18.9543 3.27431 19.0386 3.35903C19.1229 3.44375 19.2373 3.49134 19.3565 3.49134H19.8062V4.41651L13.7386 0.843224C13.6696 0.802562 13.5911 0.781125 13.5111 0.781125C13.4311 0.781125 13.3525 0.802562 13.2835 0.843224L0.243651 8.52285C0.176062 8.56269 0.120009 8.61958 0.0810464 8.68788C0.0420838 8.75618 0.0215647 8.83353 0.0215229 8.91226V11.171C0.0215652 11.2505 0.0425122 11.3286 0.0822458 11.3974C0.121979 11.4662 0.179091 11.5233 0.247806 11.5628C0.31652 11.6023 0.394402 11.6229 0.473575 11.6225C0.552749 11.622 0.630407 11.6006 0.698698 11.5604L1.82013 10.8999V22.7157C1.54763 22.8731 1.32111 23.0997 1.16327 23.3727C1.00543 23.6458 0.921819 23.9557 0.920826 24.2715C0.920799 24.3513 0.926208 24.431 0.937013 24.51C0.59073 24.7056 0.318786 25.011 0.163783 25.3784C0.0087798 25.7459 -0.0205267 26.1546 0.0804543 26.5405C0.181435 26.9265 0.406999 27.2679 0.721811 27.5113C1.03662 27.7547 1.4229 27.8863 1.82013 27.8855H25.202C25.5992 27.8863 25.9855 27.7547 26.3003 27.5113C26.6151 27.2679 26.8407 26.9265 26.9417 26.5405C27.0427 26.1546 27.0134 25.7459 26.8584 25.3784C26.7033 25.011 26.4314 24.7056 26.0851 24.51C26.0959 24.431 26.1013 24.3513 26.1013 24.2715C26.1003 23.9557 26.0167 23.6458 25.8589 23.3727C25.701 23.0997 25.4745 22.8731 25.202 22.7157V10.8999L26.3234 11.5604C26.3917 11.6006 26.4694 11.622 26.5486 11.6225C26.6277 11.6229 26.7056 11.6023 26.7743 11.5628C26.843 11.5233 26.9002 11.4662 26.9399 11.3974C26.9796 11.3286 27.0006 11.2505 27.0006 11.171V8.91226C27.0006 8.83353 26.98 8.75618 26.9411 8.68788C26.9021 8.61958 26.8461 8.56269 26.7785 8.52285ZM19.8062 1.68437H23.4034V2.58786H19.8062V1.68437ZM20.7055 3.49134H22.5041V6.00529L20.7055 4.94595V3.49134ZM1.82013 26.982C1.60251 26.9823 1.39221 26.903 1.22844 26.7591C1.06468 26.6151 0.958624 26.4162 0.930061 26.1994C0.901498 25.9827 0.952373 25.7629 1.0732 25.5811C1.19403 25.3992 1.37656 25.2677 1.58676 25.2111C1.64803 25.1944 1.70508 25.1649 1.75417 25.1244C1.80326 25.084 1.84326 25.0336 1.87155 24.9765C1.89984 24.9194 1.91577 24.8569 1.9183 24.7932C1.92083 24.7294 1.9099 24.6659 1.88623 24.6067C1.84021 24.4927 1.81793 24.3705 1.82076 24.2475C1.82358 24.1246 1.85145 24.0035 1.90264 23.8918C1.95384 23.7801 2.02728 23.6801 2.11843 23.598C2.20957 23.5159 2.3165 23.4534 2.43261 23.4144C2.54871 23.3754 2.67154 23.3608 2.79351 23.3713C2.91548 23.3818 3.03401 23.4174 3.14178 23.4757C3.24955 23.5341 3.34428 23.614 3.42012 23.7105C3.49597 23.8071 3.55132 23.9182 3.58276 24.0371C3.59939 24.0986 3.6288 24.1559 3.66906 24.2053C3.70932 24.2546 3.75952 24.2948 3.81635 24.3232C3.87319 24.3516 3.93537 24.3676 3.9988 24.3701C4.06224 24.3727 4.12549 24.3617 4.1844 24.3379C4.30198 24.2922 4.4278 24.2716 4.55375 24.2777C4.67971 24.2837 4.80302 24.3161 4.91576 24.3729C5.02849 24.4296 5.12816 24.5094 5.20835 24.6072C5.28853 24.705 5.34747 24.8185 5.38137 24.9405C5.39799 25.0021 5.4274 25.0594 5.46767 25.1087C5.50793 25.1581 5.55813 25.1982 5.61496 25.2267C5.67179 25.2551 5.73397 25.2711 5.79741 25.2736C5.86084 25.2762 5.9241 25.2652 5.983 25.2414C6.10615 25.1912 6.23884 25.169 6.37155 25.1764C6.50425 25.1839 6.63366 25.2208 6.75047 25.2845C6.86727 25.3482 6.96857 25.4371 7.04707 25.5449C7.12557 25.6526 7.17932 25.7765 7.20445 25.9076C7.22959 26.0388 7.22548 26.1739 7.19242 26.3032C7.15937 26.4325 7.09819 26.5529 7.01329 26.6556C6.92839 26.7584 6.82188 26.8409 6.70142 26.8973C6.58096 26.9538 6.44955 26.9827 6.31664 26.982H1.82013ZM8.11525 26.0785H18.9069C18.9087 26.3966 18.9951 26.7085 19.1569 26.982H7.86524C8.02708 26.7085 8.11339 26.3966 8.11525 26.0785ZM15.7593 23.368H11.2628V15.2367H15.7593V23.368ZM16.6586 24.2715V25.175H10.3635V24.2715H16.6586ZM25.4354 25.2111C25.6456 25.2677 25.8281 25.3992 25.9489 25.5811C26.0698 25.7629 26.1206 25.9827 26.0921 26.1994C26.0635 26.4162 25.9575 26.6151 25.7937 26.7591C25.6299 26.903 25.4196 26.9823 25.202 26.982H20.7055C20.5726 26.9827 20.4412 26.9538 20.3207 26.8973C20.2003 26.8409 20.0937 26.7584 20.0088 26.6556C19.9239 26.5529 19.8628 26.4325 19.8297 26.3032C19.7967 26.1739 19.7925 26.0388 19.8177 25.9076C19.8428 25.7765 19.8966 25.6526 19.9751 25.5449C20.0536 25.4371 20.1549 25.3482 20.2717 25.2845C20.3885 25.2208 20.5179 25.1839 20.6506 25.1764C20.7833 25.169 20.916 25.1912 21.0391 25.2414C21.098 25.2652 21.1613 25.2762 21.2247 25.2736C21.2882 25.2711 21.3503 25.2551 21.4072 25.2267C21.464 25.1982 21.5142 25.1581 21.5545 25.1087C21.5947 25.0594 21.6241 25.0021 21.6408 24.9405C21.6746 24.8185 21.7335 24.7049 21.8137 24.6071C21.8939 24.5093 21.9935 24.4294 22.1063 24.3727C22.219 24.3159 22.3424 24.2835 22.4683 24.2775C22.5943 24.2715 22.7202 24.2921 22.8377 24.3379C22.8966 24.3617 22.9599 24.3727 23.0233 24.3701C23.0868 24.3676 23.1489 24.3516 23.2058 24.3232C23.2626 24.2948 23.3128 24.2546 23.3531 24.2053C23.3933 24.1559 23.4227 24.0986 23.4394 24.0371C23.4708 23.9182 23.5262 23.8071 23.602 23.7105C23.6779 23.614 23.7726 23.5341 23.8804 23.4757C23.9881 23.4174 24.1067 23.3818 24.2286 23.3713C24.3506 23.3608 24.4734 23.3754 24.5895 23.4144C24.7056 23.4534 24.8126 23.5159 24.9037 23.598C24.9949 23.6801 25.0683 23.7801 25.1195 23.8918C25.1707 24.0035 25.1986 24.1246 25.2014 24.2475C25.2042 24.3705 25.1819 24.4927 25.1359 24.6067C25.1122 24.6659 25.1013 24.7294 25.1038 24.7932C25.1064 24.8569 25.1223 24.9194 25.1506 24.9765C25.1789 25.0336 25.2189 25.084 25.268 25.1244C25.317 25.1649 25.3741 25.1944 25.4354 25.2111ZM24.3027 22.4645C23.9848 22.4656 23.6728 22.5512 23.3986 22.7128C23.1243 22.8743 22.8976 23.106 22.7415 23.3843C22.3863 23.3385 22.0256 23.4 21.7053 23.5609C21.385 23.7218 21.1196 23.9748 20.9429 24.2878C20.8642 24.2769 20.7849 24.2715 20.7055 24.2715C20.3912 24.2725 20.0827 24.3565 19.8109 24.5151C19.5391 24.6737 19.3135 24.9012 19.1569 25.175H17.5579V23.8198C17.5579 23.7 17.5106 23.5851 17.4262 23.5003C17.3419 23.4156 17.2275 23.368 17.1083 23.368H16.6586V14.7849C16.6586 14.6651 16.6113 14.5502 16.5269 14.4655C16.4426 14.3808 16.3282 14.3332 16.209 14.3332H10.8132C10.6939 14.3332 10.5795 14.3808 10.4952 14.4655C10.4109 14.5502 10.3635 14.6651 10.3635 14.7849V23.368H9.91386C9.7946 23.368 9.68023 23.4156 9.5959 23.5003C9.51158 23.5851 9.4642 23.7 9.4642 23.8198V25.175H7.86524C7.7086 24.9012 7.48308 24.6737 7.21127 24.5151C6.93947 24.3565 6.63095 24.2725 6.31664 24.2715C6.23723 24.2715 6.1579 24.2769 6.07923 24.2878C5.90236 23.975 5.63694 23.7221 5.31669 23.5612C4.99643 23.4004 4.6358 23.3388 4.28062 23.3843C4.12453 23.106 3.89781 22.8743 3.62356 22.7128C3.34932 22.5512 3.03735 22.4656 2.71943 22.4645V10.3705L13.5111 4.01491L24.3027 10.3705V22.4645ZM25.1386 9.81574L13.7386 3.10194C13.6696 3.06128 13.5911 3.03984 13.5111 3.03984C13.4311 3.03984 13.3525 3.06128 13.2835 3.10194L1.88353 9.81574L1.82013 9.85279L0.920826 10.3827V9.17111L13.5111 1.7562L26.1013 9.17111V10.3827L25.202 9.85279L25.1386 9.81574Z\"\n })), _path3 || (_path3 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M9.18347 1.07591L2.88965 4.7854L3.34444 5.56431L9.63826 1.85483L9.18347 1.07591Z\"\n })), _path4 || (_path4 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M1.90975 5.36016L1.14258 5.81226L1.59742 6.59114L2.36459 6.13905L1.90975 5.36016Z\"\n })), _path5 || (_path5 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M10.8115 9.8158V12.0745C10.8115 12.1943 10.8589 12.3092 10.9432 12.3939C11.0275 12.4787 11.1419 12.5263 11.2612 12.5263H15.7577C15.8769 12.5263 15.9913 12.4787 16.0756 12.3939C16.16 12.3092 16.2073 12.1943 16.2073 12.0745V9.8158C16.2073 9.09695 15.9231 8.40753 15.4171 7.89922C14.9112 7.39091 14.225 7.10535 13.5094 7.10535C12.7939 7.10535 12.1077 7.39091 11.6017 7.89922C11.0958 8.40753 10.8115 9.09695 10.8115 9.8158ZM13.0598 8.07298V9.36406H11.7747C11.8551 9.05341 12.0166 8.76997 12.2425 8.543C12.4684 8.31603 12.7506 8.15377 13.0598 8.07298ZM11.7108 10.2675H13.0598V11.6228H11.7108V10.2675ZM13.9591 11.6228V10.2675H15.308V11.6228H13.9591ZM15.2442 9.36406H13.9591V8.07298C14.2683 8.15377 14.5504 8.31603 14.7763 8.543C15.0023 8.76997 15.1638 9.05341 15.2442 9.36406Z\"\n })), _path6 || (_path6 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M18.4565 19.7538H22.953C23.0723 19.7538 23.1866 19.7062 23.271 19.6215C23.3553 19.5368 23.4027 19.4219 23.4027 19.3021V14.7846C23.4027 14.6648 23.3553 14.5499 23.271 14.4652C23.1866 14.3805 23.0723 14.3329 22.953 14.3329H18.4565C18.3372 14.3329 18.2229 14.3805 18.1385 14.4652C18.0542 14.5499 18.0068 14.6648 18.0068 14.7846V19.3021C18.0068 19.4219 18.0542 19.5368 18.1385 19.6215C18.2229 19.7062 18.3372 19.7538 18.4565 19.7538ZM18.9061 18.8503V17.9468H22.5034V18.8503H18.9061ZM22.5034 15.2364V17.0433H18.9061V15.2364H22.5034Z\"\n })), _path7 || (_path7 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M8.56628 14.3329H4.06977C3.95051 14.3329 3.83614 14.3805 3.75182 14.4652C3.66749 14.5499 3.62012 14.6648 3.62012 14.7846V19.3021C3.62012 19.4219 3.66749 19.5368 3.75182 19.6215C3.83614 19.7062 3.95051 19.7538 4.06977 19.7538H8.56628C8.68554 19.7538 8.79991 19.7062 8.88423 19.6215C8.96856 19.5368 9.01593 19.4219 9.01593 19.3021V14.7846C9.01593 14.6648 8.96856 14.5499 8.88423 14.4652C8.79991 14.3805 8.68554 14.3329 8.56628 14.3329ZM8.11663 15.2364V17.0433H4.51942V15.2364H8.11663ZM4.51942 18.8503V17.9468H8.11663V18.8503H4.51942Z\"\n })), _path8 || (_path8 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M27.0009 14.3329H26.1016V20.6573H27.0009V14.3329Z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgHomeInsurance);\nexport default __webpack_public_path__ + \"static/media/home-insurance.5ec255ecdc231686afc37695d4a39929.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2, _path3, _path4;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgHomeLoan(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 32 31\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M0.5625 6.88917V10.9544H4.68716V24.8748H3.86208V26.5248H2.21229V28.1746H0.5625V30.7524H31.1875V28.1746H29.5377V26.5248H27.8879V24.8748H27.0628V10.9544H31.1875V6.88917L15.875 0.0837402L0.5625 6.88917ZM5.61519 10.9544H7.98674V24.8748H5.61519V10.9544ZM22.8352 24.8748H22.0103V26.5248H18.8137V24.8748H17.9888V10.9544H22.8352V24.8748ZM13.8643 25.8029H17.8857V26.5248H13.8643V25.8029ZM17.0608 24.8748H14.6892V10.9544H17.0608V24.8748ZM13.7612 24.8748H12.9363V26.5248H9.73967V24.8748H8.91477V10.9544H13.7612V24.8748ZM4.79011 25.8029H8.81164V26.5248H4.79011V25.8029ZM30.2595 29.1026V29.8244H1.49053V29.1026H2.21229H29.5377H30.2595ZM28.6097 27.4528V28.1746H3.14032V27.4528H3.86208H9.73967H12.9363H18.8137H22.0103H27.8879H28.6097ZM22.9384 26.5248V25.8029H26.9599V26.5248H22.9384ZM26.1348 24.8748H23.7633V10.9544H26.1348V24.8748ZM30.2595 10.0263H27.0628H22.8352H17.9888H13.7612H8.91477H4.68716H1.49053V7.49239L15.875 1.09914L30.2595 7.49239V10.0263Z\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M12.9287 6.36268C12.9287 7.98492 14.2486 9.30482 15.8709 9.30482C17.4931 9.30482 18.813 7.98492 18.813 6.36268C18.813 4.74044 17.4931 3.42053 15.8709 3.42053C14.2486 3.42053 12.9287 4.74044 12.9287 6.36268ZM17.885 6.36268C17.885 7.47323 16.9814 8.37679 15.8709 8.37679C14.7603 8.37679 13.8567 7.47323 13.8567 6.36268C13.8567 5.25212 14.7603 4.34856 15.8709 4.34856C16.9814 4.34856 17.885 5.25212 17.885 6.36268Z\"\n })), _path3 || (_path3 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M11.3894 9.30354V4.78918L2.36035 9.30354H11.3894ZM10.4614 8.37551H6.29179L10.4614 6.29071V8.37551Z\"\n })), _path4 || (_path4 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M20.3613 4.78918V9.30354H29.3904L20.3613 4.78918ZM21.2894 6.29071L25.459 8.37551H21.2894V6.29071Z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgHomeLoan);\nexport default __webpack_public_path__ + \"static/media/home-loan.ba04b93e38e56f1464391f6ca83f7bed.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgInternet(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 39 29\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M19.1458 0.187866C11.7865 0.187866 5.06748 3.13381 0.416946 8.06634C0.340031 8.14793 0.280237 8.24359 0.24098 8.34787C0.201722 8.45215 0.183768 8.56299 0.188144 8.67408C0.19252 8.78517 0.21914 8.89432 0.266483 8.99531C0.313827 9.0963 0.380967 9.18714 0.464071 9.26265C0.547175 9.33817 0.644614 9.39687 0.750826 9.43541C0.857038 9.47396 0.969942 9.49158 1.08309 9.48729C1.19624 9.48299 1.30742 9.45685 1.41029 9.41037C1.51315 9.36389 1.60568 9.29798 1.68259 9.21639C6.0042 4.63272 12.2556 1.87989 19.1458 1.87989C26.0361 1.87988 32.2875 4.63272 36.6091 9.21639C36.7644 9.38116 36.9801 9.47861 37.2086 9.48729C37.4371 9.49596 37.6598 9.41516 37.8276 9.26265C37.9954 9.11015 38.0947 8.89843 38.1035 8.67408C38.1124 8.44973 38.0301 8.23112 37.8747 8.06634C33.2242 3.13381 26.5052 0.187866 19.1458 0.187866ZM19.1458 7.37896C13.8661 7.37896 8.90761 9.59594 5.58725 13.1556C5.49711 13.2344 5.42482 13.3309 5.37505 13.4388C5.32528 13.5467 5.29914 13.6637 5.29831 13.7822C5.29749 13.9006 5.322 14.0179 5.37027 14.1265C5.41853 14.2351 5.48948 14.3325 5.57851 14.4125C5.66754 14.4925 5.77268 14.5532 5.88712 14.5908C6.00156 14.6283 6.12276 14.6419 6.24288 14.6306C6.363 14.6193 6.47936 14.5833 6.58444 14.5251C6.68952 14.4668 6.78098 14.3876 6.8529 14.2925C9.83432 11.0962 14.3592 9.07098 19.1458 9.07098C23.9324 9.07098 28.4573 11.0961 31.4388 14.2925C31.5982 14.4318 31.8045 14.5081 32.0179 14.5066C32.2313 14.5052 32.4366 14.4261 32.5941 14.2847C32.7515 14.1433 32.85 13.9496 32.8703 13.741C32.8907 13.5324 32.8316 13.3239 32.7044 13.1556C29.3841 9.59593 24.4256 7.37896 19.1458 7.37896ZM19.1458 14.147C15.8261 14.147 12.7998 15.5406 10.7441 17.8087C10.6681 17.892 10.6095 17.9892 10.5717 18.0948C10.534 18.2003 10.5177 18.3121 10.524 18.4238C10.5302 18.5355 10.5588 18.6449 10.6082 18.7458C10.6575 18.8466 10.7265 18.937 10.8114 19.0116C10.8963 19.0863 10.9953 19.1438 11.1028 19.1808C11.2103 19.2179 11.3242 19.2338 11.438 19.2277C11.5518 19.2216 11.6632 19.1935 11.7659 19.1451C11.8686 19.0966 11.9606 19.0288 12.0367 18.9455C13.769 17.0343 16.319 15.8391 19.1458 15.8391C21.9727 15.8391 24.5227 17.0343 26.255 18.9455C26.4086 19.1138 26.6239 19.2153 26.8537 19.2277C27.0835 19.2401 27.3088 19.1624 27.4803 19.0116C27.6517 18.8609 27.7551 18.6494 27.7677 18.4238C27.7803 18.1982 27.7011 17.977 27.5476 17.8087C25.4918 15.5406 22.4656 14.147 19.1458 14.147ZM19.1458 21.3381C17.0144 21.3381 15.2681 23.0526 15.2681 25.1452C15.2681 27.2378 17.0144 28.9522 19.1458 28.9522C21.2772 28.9522 23.0236 27.2378 23.0236 25.1452C23.0236 23.0526 21.2772 21.3381 19.1458 21.3381ZM19.1458 23.0302C20.3458 23.0302 21.3001 23.9671 21.3001 25.1452C21.3001 26.3233 20.3458 27.2602 19.1458 27.2602C17.9458 27.2602 16.9915 26.3233 16.9915 25.1452C16.9915 23.9671 17.9458 23.0302 19.1458 23.0302Z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgInternet);\nexport default __webpack_public_path__ + \"static/media/internet.85f66168183b9dcedfca72224863d3a2.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2, _path3, _path4, _path5, _path6, _path7;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgVehicleInsurance(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 44 22\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M43.4809 14.4291C43.4809 14.2375 43.428 14.0922 43.428 14.0129C43.4313 13.9821 43.4313 13.9511 43.428 13.9204C43.2062 12.966 42.7926 12.0667 42.2122 11.2773C40.6396 9.05715 37.3358 7.58365 32.4396 6.87003C31.3295 5.78638 25.0192 0.123658 14.381 0.685305C5.07744 1.26017 4.87922 2.48258 4.80653 2.94511C4.78191 3.13551 4.81166 3.329 4.89233 3.50321C4.97301 3.67742 5.10132 3.82526 5.26246 3.92964C4.23575 5.25675 3.33539 6.67696 2.57316 8.17173C2.03346 9.20154 1.66733 10.3133 1.48951 11.4623C0.914648 12.0702 -0.710825 14.0459 0.353001 16.1802C0.58001 16.6007 0.916805 16.9519 1.32754 17.1962C1.73827 17.4406 2.20757 17.569 2.68549 17.5678H5.24924C5.40215 18.5506 5.90143 19.4465 6.65693 20.0935C7.41243 20.7406 8.37437 21.0962 9.36909 21.0962C10.3638 21.0962 11.3257 20.7406 12.0812 20.0935C12.8368 19.4465 13.336 18.5506 13.4889 17.5678H29.3472C29.5001 18.5506 29.9994 19.4465 30.7549 20.0935C31.5104 20.7406 32.4723 21.0962 33.4671 21.0962C34.4618 21.0962 35.4237 20.7406 36.1792 20.0935C36.9347 19.4465 37.434 18.5506 37.5869 17.5678H42.7937C42.915 17.568 43.0341 17.5348 43.1378 17.4719C43.2416 17.409 43.326 17.3187 43.3818 17.2109C43.7254 16.5568 43.6263 15.5194 43.4809 14.4291ZM41.2277 12.1627C41.5596 12.6571 41.8261 13.1924 42.0206 13.7552H40.0383C39.9902 13.7634 39.9411 13.7634 39.893 13.7552V12.1627H41.2277ZM3.43215 9.48004C4.14623 9.95649 4.71362 10.6223 5.07084 11.4029L2.87711 11.198C3.00315 10.608 3.18912 10.0323 3.43215 9.48004ZM9.379 19.7681C8.81416 19.7694 8.26162 19.6031 7.79133 19.2902C7.32105 18.9774 6.95415 18.532 6.73709 18.0106C6.52003 17.4891 6.46255 16.9149 6.57195 16.3608C6.68134 15.8066 6.95268 15.2974 7.35163 14.8975C7.75057 14.4977 8.25918 14.2251 8.81307 14.1145C9.36697 14.0038 9.94125 14.0599 10.4632 14.2758C10.9852 14.4916 11.4314 14.8575 11.7453 15.3271C12.0593 15.7966 12.2269 16.3488 12.2269 16.9136C12.2295 17.2901 12.1576 17.6634 12.0153 18.0121C11.873 18.3607 11.6632 18.6777 11.3979 18.9449C11.1325 19.212 10.817 19.4241 10.4694 19.5687C10.1217 19.7134 9.74892 19.7879 9.37239 19.7879L9.379 19.7681ZM33.477 19.7681C32.9127 19.7681 32.3611 19.6008 31.8918 19.2875C31.4225 18.9741 31.0566 18.5287 30.8404 18.0075C30.6242 17.4863 30.5672 16.9127 30.6769 16.3591C30.7865 15.8056 31.0577 15.297 31.4562 14.8975C31.8548 14.498 32.3628 14.2257 32.916 14.1148C33.4693 14.0039 34.0431 14.0595 34.5648 14.2745C35.0865 14.4895 35.5327 14.8544 35.8472 15.3229C36.1616 15.7915 36.3301 16.3427 36.3315 16.907C36.3341 17.2844 36.262 17.6586 36.1194 18.008C35.9768 18.3574 35.7664 18.6751 35.5005 18.9429C35.2346 19.2107 34.9183 19.4232 34.5698 19.5682C34.2214 19.7133 33.8478 19.7879 33.4704 19.7879L33.477 19.7681ZM42.2915 16.2528H37.5935C37.4406 15.2699 36.9413 14.3741 36.1858 13.7271C35.4303 13.08 34.4684 12.7244 33.4737 12.7244C32.4789 12.7244 31.517 13.08 30.7615 13.7271C30.006 14.3741 29.5067 15.2699 29.3538 16.2528H13.4955C13.3338 15.2769 12.831 14.3901 12.0765 13.7503C11.322 13.1106 10.3649 12.7594 9.3757 12.7594C8.38648 12.7594 7.42939 13.1106 6.6749 13.7503C5.92042 14.3901 5.41754 15.2769 5.25585 16.2528H2.68549C2.45168 16.2587 2.22076 16.2002 2.01799 16.0837C1.81521 15.9671 1.64839 15.7971 1.53576 15.5921C0.875002 14.2706 1.919 12.949 2.37493 12.4601L5.7316 12.8037H5.79767C5.96001 12.8048 6.11709 12.7462 6.23896 12.639C6.36083 12.5317 6.43896 12.3834 6.45844 12.2222C6.68309 10.3853 4.93208 8.91839 4.00701 8.25763C4.80257 6.80606 5.72929 5.43035 6.7756 4.14769C6.84166 4.06791 6.88804 3.97372 6.911 3.87271C6.93395 3.77171 6.93284 3.66672 6.90775 3.56622C6.88335 3.46486 6.8353 3.37071 6.76755 3.29147C6.69979 3.21223 6.61425 3.15015 6.5179 3.1103H6.47826C7.79978 2.64777 11.3547 2.20506 14.4603 2.01344C25.3033 1.42536 31.5872 7.8876 31.64 7.96029C31.7437 8.0687 31.8812 8.13861 32.0299 8.15852C36.2191 8.73999 38.6375 9.81042 39.959 10.8544H39.7212C39.4175 10.882 39.1337 11.0169 38.9206 11.2349C38.7074 11.4528 38.579 11.7396 38.5582 12.0438V13.9071C38.5755 14.0817 38.6273 14.251 38.7107 14.4053C38.794 14.5596 38.9073 14.6958 39.0438 14.8059C39.1804 14.916 39.3374 14.9978 39.5059 15.0465C39.6744 15.0953 39.8509 15.11 40.0251 15.0899H42.2254C42.2785 15.4752 42.3006 15.8641 42.2915 16.2528Z\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M18.8326 3.5469C18.6574 3.5469 18.4893 3.61652 18.3654 3.74044C18.2415 3.86435 18.1719 4.03242 18.1719 4.20767V8.17223C18.1719 8.34748 18.2415 8.51554 18.3654 8.63946C18.4893 8.76338 18.6574 8.83299 18.8326 8.83299H27.5877C27.7009 8.83378 27.8124 8.80548 27.9115 8.7508C28.0106 8.69612 28.0941 8.61689 28.1537 8.52071C28.2134 8.42453 28.2474 8.31463 28.2524 8.20154C28.2575 8.08846 28.2334 7.97598 28.1824 7.87489C28.0833 7.65684 25.7574 3.20992 18.8326 3.5469ZM19.4934 7.51147V4.86843C23.2333 4.86843 25.3279 6.43443 26.2992 7.51147H19.4934Z\"\n })), _path3 || (_path3 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M15.8202 3.5009C13.8088 3.53749 11.8031 3.72745 9.82053 4.06915C9.70988 4.08959 9.60628 4.13795 9.51955 4.20964C9.43283 4.28134 9.36584 4.37399 9.32496 4.47882L7.95718 7.928C7.91727 8.02805 7.90243 8.13635 7.91394 8.24345C7.92546 8.35056 7.96299 8.45322 8.02326 8.54251C8.08387 8.63218 8.16558 8.70559 8.26121 8.75628C8.35684 8.80698 8.46345 8.8334 8.57169 8.83324H15.8731C16.0483 8.83324 16.2164 8.76363 16.3403 8.63971C16.4642 8.51579 16.5339 8.34772 16.5339 8.17248V4.16166C16.5342 4.07025 16.5155 3.97978 16.479 3.89596C16.4426 3.81214 16.3891 3.7368 16.322 3.6747C16.255 3.6126 16.1757 3.56509 16.0894 3.53517C16.003 3.50526 15.9114 3.49358 15.8202 3.5009ZM15.2123 7.51172H9.54301L10.4152 5.31138C12.0027 5.05267 13.6049 4.89377 15.2123 4.83564V7.51172Z\"\n })), _path4 || (_path4 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M10.0321 10.1339H8.71057C8.53532 10.1339 8.36725 10.2035 8.24334 10.3274C8.11942 10.4514 8.0498 10.6194 8.0498 10.7947C8.0498 10.9699 8.11942 11.138 8.24334 11.2619C8.36725 11.3858 8.53532 11.4554 8.71057 11.4554H10.0321C10.2073 11.4554 10.3754 11.3858 10.4993 11.2619C10.6232 11.138 10.6928 10.9699 10.6928 10.7947C10.6928 10.6194 10.6232 10.4514 10.4993 10.3274C10.3754 10.2035 10.2073 10.1339 10.0321 10.1339Z\"\n })), _path5 || (_path5 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M22.0868 10.1339H20.7653C20.59 10.1339 20.4219 10.2035 20.298 10.3274C20.1741 10.4514 20.1045 10.6194 20.1045 10.7947C20.1045 10.9699 20.1741 11.138 20.298 11.2619C20.4219 11.3858 20.59 11.4554 20.7653 11.4554H22.0868C22.262 11.4554 22.4301 11.3858 22.554 11.2619C22.6779 11.138 22.7475 10.9699 22.7475 10.7947C22.7475 10.6194 22.6779 10.4514 22.554 10.3274C22.4301 10.2035 22.262 10.1339 22.0868 10.1339Z\"\n })), _path6 || (_path6 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M10.0352 16.2521H8.70703V17.5736H10.0352V16.2521Z\"\n })), _path7 || (_path7 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M34.1367 16.2521H32.8086V17.5736H34.1367V16.2521Z\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgVehicleInsurance);\nexport default __webpack_public_path__ + \"static/media/vehicle-insurance.467ea47db44ad7b347565bf3cc67e766.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgMobilePhone(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 27 35\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, /*#__PURE__*/React.createElement(\"g\", {\n style: {},\n transform: \"matrix(0.262763, 0, 0, 0.278283, 3.72138, 0.45357)\"\n }, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M12.47,0h46.36c3.43,0,6.55,1.4,8.81,3.66c2.26,2.26,3.66,5.38,3.66,8.81v97.94c0,3.43-1.4,6.55-3.66,8.81 c-2.26,2.26-5.38,3.66-8.81,3.66H12.47c-3.43,0-6.55-1.4-8.81-3.66C1.4,116.96,0,113.84,0,110.41V12.47c0-3.43,1.4-6.55,3.66-8.81 C5.92,1.4,9.04,0,12.47,0L12.47,0z M28.93,113c-0.83,0-1.5-0.67-1.5-1.5c0-0.83,0.67-1.5,1.5-1.5h13.72c0.83,0,1.5,0.67,1.5,1.5 c0,0.83-0.67,1.5-1.5,1.5H28.93L28.93,113z M27.65,7.16c1.31,0,2.38,1.07,2.38,2.38c0,1.31-1.07,2.38-2.38,2.38 c-1.31,0-2.38-1.07-2.38-2.38C25.27,8.23,26.34,7.16,27.65,7.16L27.65,7.16z M35.65,7.16c1.31,0,2.38,1.07,2.38,2.38 c0,1.31-1.07,2.38-2.38,2.38c-1.32,0-2.38-1.07-2.38-2.38C33.27,8.23,34.34,7.16,35.65,7.16L35.65,7.16z M43.65,7.16 c1.31,0,2.38,1.07,2.38,2.38c0,1.31-1.07,2.38-2.38,2.38c-1.32,0-2.38-1.07-2.38-2.38C41.27,8.23,42.34,7.16,43.65,7.16L43.65,7.16 z M3,99.29h65.31V19.21H3V99.29L3,99.29z M68.31,102.29H3v8.12c0,2.6,1.07,4.97,2.78,6.69c1.72,1.72,4.09,2.78,6.69,2.78h46.36 c2.6,0,4.97-1.07,6.69-2.78c1.72-1.72,2.78-4.09,2.78-6.69V102.29L68.31,102.29z M3,16.21h65.31v-3.74c0-2.6-1.07-4.97-2.78-6.69 C63.81,4.06,61.44,3,58.83,3H12.47C9.87,3,7.5,4.06,5.78,5.78C4.06,7.5,3,9.87,3,12.47V16.21L3,16.21z\",\n className: \"sm-service-type-outline-0\"\n }))));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgMobilePhone);\nexport default __webpack_public_path__ + \"static/media/mobile-phone.026bc16d6c909746ce5f8b029d0736b3.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgSolarInstallation(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0 0 27 35\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M 25.315 30.082 L 18.368 30.082 L 20.762 25.26 L 25.2 25.26 C 25.535 25.26 25.805 24.944 25.805 24.553 L 25.805 9.597 C 25.805 9.207 25.535 8.891 25.2 8.891 L 8.15 8.891 C 7.817 8.891 7.547 9.207 7.547 9.597 L 7.547 24.553 C 7.547 24.944 7.817 25.26 8.15 25.26 L 12.59 25.26 L 14.984 30.082 L 1.105 30.082 C 0.771 30.082 0.5 30.399 0.5 30.789 C 0.5 31.179 0.771 31.496 1.105 31.496 L 25.315 31.496 C 25.65 31.496 25.92 31.179 25.92 30.789 C 25.92 30.399 25.65 30.082 25.315 30.082 Z M 20.071 10.304 L 24.596 10.304 L 24.596 13.876 L 20.071 13.876 L 20.071 10.304 Z M 20.071 15.289 L 24.596 15.289 L 24.596 18.861 L 20.071 18.861 L 20.071 15.289 Z M 20.071 20.275 L 24.596 20.275 L 24.596 23.846 L 20.425 23.846 C 20.418 23.846 20.41 23.846 20.403 23.846 L 20.071 23.846 L 20.071 20.275 Z M 14.489 10.304 L 18.862 10.304 L 18.862 13.876 L 14.489 13.876 L 14.489 10.304 Z M 14.489 15.289 L 18.862 15.289 L 18.862 18.861 L 14.489 18.861 L 14.489 15.289 Z M 14.489 20.275 L 18.862 20.275 L 18.862 23.846 L 14.489 23.846 L 14.489 20.275 Z M 13.281 23.846 L 12.949 23.846 C 12.941 23.846 12.934 23.846 12.926 23.846 L 8.755 23.846 L 8.755 20.275 L 13.281 20.275 L 13.281 23.846 Z M 13.281 18.861 L 8.755 18.861 L 8.755 15.289 L 13.281 15.289 L 13.281 18.861 Z M 13.281 13.876 L 8.755 13.876 L 8.755 10.304 L 13.281 10.304 L 13.281 13.876 Z M 16.382 30.082 L 13.988 25.26 L 19.363 25.26 L 16.97 30.082 L 16.382 30.082 Z M 0.633 6.949 C 0.716 6.571 1.045 6.342 1.369 6.439 L 2.769 6.856 C 3.021 6.162 3.41 5.569 3.887 5.11 L 3.149 3.656 C 2.978 3.32 3.073 2.886 3.36 2.686 C 3.647 2.488 4.018 2.598 4.188 2.933 L 4.927 4.389 C 5.5 4.118 6.131 4.002 6.774 4.075 L 7.13 2.438 C 7.213 2.059 7.543 1.831 7.865 1.927 C 8.189 2.024 8.383 2.409 8.301 2.788 L 7.945 4.424 C 8.52 4.71 9.025 5.15 9.424 5.712 L 10.689 4.864 C 10.979 4.67 11.348 4.787 11.514 5.125 C 11.68 5.464 11.58 5.896 11.29 6.09 L 9.553 7.256 C 9.268 7.447 8.905 7.338 8.735 7.009 C 8.362 6.29 7.775 5.779 7.078 5.57 C 7.076 5.569 7.074 5.568 7.071 5.567 C 7.069 5.567 7.067 5.566 7.065 5.565 C 5.607 5.136 4.122 6.168 3.748 7.87 C 3.747 7.872 3.747 7.874 3.747 7.877 C 3.746 7.879 3.745 7.882 3.745 7.884 C 3.567 8.708 3.672 9.565 4.043 10.296 C 4.044 10.297 4.044 10.298 4.045 10.299 C 4.046 10.301 4.047 10.302 4.047 10.304 C 4.421 11.036 5.014 11.556 5.72 11.766 C 6.044 11.862 6.24 12.247 6.157 12.625 L 5.663 14.896 C 5.592 15.216 5.347 15.429 5.077 15.429 C 5.028 15.429 4.977 15.421 4.927 15.407 C 4.604 15.309 4.409 14.925 4.491 14.546 L 4.847 12.91 C 4.265 12.621 3.755 12.174 3.354 11.602 L 2.112 12.465 C 1.824 12.664 1.453 12.553 1.283 12.218 C 1.112 11.882 1.207 11.448 1.494 11.249 L 2.737 10.386 C 2.499 9.7 2.408 8.963 2.469 8.226 L 1.07 7.809 C 0.746 7.713 0.551 7.328 0.633 6.949 Z\",\n className: \"sm-service-type-outline-0\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgSolarInstallation);\nexport default __webpack_public_path__ + \"static/media/solar-installation.a09cbf41588e12f327198e553588300c.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgSolarFinance(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"529.3019 247.261 44.6559 45.553\",\n width: 44.6559,\n height: 45.553,\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-card-header-icon-0\",\n d: \"M 573.923 287.128 L 567.633 269.973 C 567.541 269.587 567.171 269.395 566.801 269.395 L 536.463 269.395 C 536.093 269.395 535.723 269.684 535.63 269.973 L 529.34 287.128 C 529.248 287.417 529.34 287.706 529.433 287.995 C 529.618 288.285 529.895 288.381 530.173 288.381 L 534.798 288.381 L 534.798 291.851 C 534.798 292.429 535.168 292.814 535.723 292.814 L 568.651 292.814 C 569.206 292.814 569.576 292.429 569.576 291.851 L 569.576 288.381 L 572.906 288.381 C 573.183 288.381 573.461 288.188 573.646 287.995 C 573.923 287.706 574.016 287.417 573.923 287.128 Z M 545.897 280.382 L 546.545 275.852 L 556.627 275.852 L 557.274 280.382 L 545.897 280.382 Z M 557.459 282.309 L 558.014 286.55 L 545.065 286.55 L 545.62 282.309 L 557.459 282.309 Z M 535.445 275.852 L 544.602 275.852 L 543.955 280.382 L 533.78 280.382 L 535.445 275.852 Z M 546.73 273.924 L 547.099 271.322 L 555.887 271.322 L 556.257 273.924 L 546.73 273.924 Z M 558.384 275.852 L 567.726 275.852 L 569.391 280.382 L 559.031 280.382 L 558.384 275.852 Z M 567.079 273.924 L 558.106 273.924 L 557.736 271.322 L 566.061 271.322 L 567.079 273.924 Z M 537.11 271.322 L 545.25 271.322 L 544.88 273.924 L 536.185 273.924 L 537.11 271.322 Z M 533.133 282.309 L 543.77 282.309 L 543.215 286.55 L 531.56 286.55 L 533.133 282.309 Z M 567.818 290.887 L 536.74 290.887 L 536.74 288.381 L 543.955 288.381 C 543.955 288.381 543.955 288.381 544.047 288.381 C 544.047 288.381 544.047 288.381 544.047 288.381 L 559.031 288.381 C 559.031 288.381 559.031 288.381 559.031 288.381 C 559.031 288.381 559.031 288.381 559.124 288.381 L 567.818 288.381 L 567.818 290.887 Z M 559.864 286.453 L 559.309 282.213 L 570.131 282.213 L 571.703 286.453 L 559.864 286.453 Z\",\n transform: \"matrix(0.9999999999999999, 0, 0, 0.9999999999999999, -7.105427357601002e-15, -7.105427357601002e-15)\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M 551.56 255.143 L 551.56 250.403 C 553.108 250.403 554.278 251.422 554.278 252.773 L 556.08 252.773 C 556.08 250.568 554.088 248.832 551.56 248.832 L 551.56 247.261 L 549.758 247.261 L 549.758 248.832 C 547.229 248.832 545.238 250.568 545.238 252.773 C 545.238 254.977 547.229 256.714 549.758 256.714 L 549.758 261.454 C 548.209 261.454 547.039 260.434 547.039 259.084 L 545.238 259.084 C 545.238 261.289 547.229 263.025 549.758 263.025 L 549.758 264.596 L 551.56 264.596 L 551.56 263.025 C 554.088 263.025 556.08 261.289 556.08 259.084 C 556.08 256.879 554.088 255.143 551.56 255.143 Z M 547.039 252.773 C 547.039 251.422 548.209 250.403 549.758 250.403 L 549.758 255.143 C 548.209 255.143 547.039 254.123 547.039 252.773 Z M 551.56 261.454 L 551.56 256.714 C 553.108 256.714 554.278 257.733 554.278 259.084 C 554.278 260.434 553.108 261.454 551.56 261.454 Z\",\n transform: \"matrix(0.9999999999999999, 0, 0, 0.9999999999999999, -7.105427357601002e-15, -7.105427357601002e-15)\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgSolarFinance);\nexport default __webpack_public_path__ + \"static/media/solar-finance.68228c13857bc508ca107b8bc6423b3a.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2, _path3, _path4, _rect;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgBusinessLoan(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"350.78 107.277 43.209 47.805\",\n width: 43.209,\n height: 47.805,\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, /*#__PURE__*/React.createElement(\"g\", {\n transform: \"matrix(0.316101, 0, 0, 0.275593, 481.003524, 78.716097)\",\n style: {}\n }, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M -349.575 206.835 L -349.575 189.635 C -344.675 189.635 -340.975 193.335 -340.975 198.235 L -335.275 198.235 C -335.275 190.235 -341.575 183.935 -349.575 183.935 L -349.575 178.235 L -355.275 178.235 L -355.275 183.935 C -363.275 183.935 -369.575 190.235 -369.575 198.235 C -369.575 206.235 -363.275 212.535 -355.275 212.535 L -355.275 229.735 C -360.175 229.735 -363.875 226.035 -363.875 221.135 L -369.575 221.135 C -369.575 229.135 -363.275 235.435 -355.275 235.435 L -355.275 241.135 L -349.575 241.135 L -349.575 235.435 C -341.575 235.435 -335.275 229.135 -335.275 221.135 C -335.275 213.135 -341.575 206.835 -349.575 206.835 Z M -363.875 198.235 C -363.875 193.335 -360.175 189.635 -355.275 189.635 L -355.275 206.835 C -360.175 206.835 -363.875 203.135 -363.875 198.235 Z M -349.575 229.735 L -349.575 212.535 C -344.675 212.535 -340.975 216.235 -340.975 221.135 C -340.975 226.035 -344.675 229.735 -349.575 229.735 Z\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M -318.075 244.035 C -324.375 244.035 -329.475 238.835 -329.475 232.635 C -329.475 226.335 -324.275 221.235 -318.075 221.235 C -311.875 221.235 -306.675 226.435 -306.675 232.635 C -306.675 238.935 -311.775 244.035 -318.075 244.035 Z M -318.075 226.835 C -321.175 226.835 -323.775 229.435 -323.775 232.535 C -323.775 235.635 -321.175 238.235 -318.075 238.235 C -314.975 238.235 -312.375 235.635 -312.375 232.535 C -312.375 229.435 -314.975 226.835 -318.075 226.835 Z\"\n })), _path3 || (_path3 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M -286.675 269.835 C -292.975 269.835 -298.075 264.635 -298.075 258.435 C -298.075 252.235 -292.875 247.035 -286.675 247.035 C -280.375 247.035 -275.275 252.235 -275.275 258.435 C -275.275 264.635 -280.375 269.835 -286.675 269.835 Z M -286.675 252.635 C -289.775 252.635 -292.375 255.235 -292.375 258.335 C -292.375 261.435 -289.775 264.035 -286.675 264.035 C -283.575 264.035 -280.975 261.435 -280.975 258.335 C -280.975 255.235 -283.475 252.635 -286.675 252.635 Z\"\n })), _path4 || (_path4 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"sm-service-type-outline-0\",\n d: \"M -323.768 261.235 L -401.868 261.235 C -404.168 261.235 -406.168 259.235 -406.168 256.935 C -406.168 254.635 -404.168 252.635 -401.868 252.635 L -397.868 252.635 L -393.868 209.735 C -392.768 194.235 -384.968 179.735 -372.968 169.635 L -362.068 160.735 L -341.168 160.735 L -330.268 169.635 C -318.268 179.335 -310.568 193.935 -309.368 209.735 L -308.468 217.435 C -305.868 218.835 -303.568 221.135 -302.168 223.735 L -303.568 209.135 C -304.968 191.935 -313.268 175.935 -326.468 165.335 L -334.468 158.735 C -332.468 157.035 -331.368 154.735 -331.368 152.135 C -331.368 148.735 -333.368 145.835 -336.268 144.435 C -333.968 138.135 -327.968 131.035 -317.968 122.935 L -314.568 120.035 L -332.868 110.835 L -330.268 103.635 L -373.168 103.635 L -370.068 111.035 L -388.368 120.235 L -384.968 123.135 C -375.268 131.435 -368.968 138.635 -366.668 144.635 C -369.568 146.035 -371.868 148.935 -371.868 152.335 C -371.868 154.935 -370.768 157.235 -368.768 158.935 L -376.768 165.535 C -389.968 176.435 -398.268 192.435 -399.668 209.335 L -403.068 246.835 C -408.268 247.435 -411.968 251.735 -411.968 256.835 C -411.968 262.235 -407.368 266.835 -401.968 266.835 L -327.868 266.835 L -323.768 261.235 Z M -340.368 155.335 L -363.268 155.335 C -364.968 155.335 -366.168 154.235 -366.168 152.435 C -366.168 150.735 -365.068 149.535 -363.268 149.535 L -340.368 149.535 C -338.668 149.535 -337.468 150.635 -337.468 152.435 C -337.568 154.235 -338.668 155.335 -340.368 155.335 Z M -378.168 121.535 L -367.868 116.335 L -362.968 127.735 L -357.768 125.435 L -364.668 109.435 L -338.868 109.435 L -345.768 125.435 L -340.568 127.735 L -335.668 116.335 L -325.368 121.535 C -334.568 129.535 -340.268 137.035 -342.568 143.835 L -361.168 143.835 C -363.268 137.335 -368.768 129.835 -378.168 121.535 Z\"\n })), _rect || (_rect = /*#__PURE__*/React.createElement(\"rect\", {\n x: 171.808,\n y: 187.208,\n transform: \"matrix(0.573274, -0.819364, 0.819364, 0.573274, -578.027344, 307.281952)\",\n width: 69.803,\n height: 5.7\n }))));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgBusinessLoan);\nexport default __webpack_public_path__ + \"static/media/business-loan.107aade8376146780ff4dd79ef93295b.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2, _rect, _rect2, _rect3, _rect4, _rect5, _rect6;\nvar _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgServiceCardAdd(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 98,\n height: 111,\n viewBox: \"0 0 98 111\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M59 26.2825C59.6468 25.6999 60.3506 25.1463 61.1115 24.6219C61.8915 24.0976 62.7285 23.6411 63.6226 23.2527C64.5166 22.8643 65.4868 22.5632 66.5331 22.3496C67.5793 22.1165 68.7112 22 69.9287 22C71.5837 22 73.0865 22.2331 74.4371 22.6992C75.8067 23.1653 76.9767 23.8354 77.9468 24.7093C78.917 25.5639 79.6684 26.603 80.201 27.8266C80.7337 29.0501 81 30.4194 81 31.9343C81 33.4103 80.7907 34.6922 80.3722 35.7798C79.9537 36.848 79.4306 37.7803 78.8029 38.5766C78.1751 39.3729 77.4808 40.0623 76.7198 40.645C75.978 41.2276 75.2741 41.7812 74.6083 42.3056C73.9425 42.8105 73.3623 43.3155 72.8677 43.8205C72.3921 44.306 72.1068 44.8595 72.0117 45.481L71.3554 49.7344H66.5331L66.048 44.9858C65.9339 44.0729 66.0575 43.2766 66.4189 42.5969C66.7994 41.8977 67.294 41.2665 67.9027 40.7033C68.5305 40.1206 69.2248 39.5671 69.9857 39.0427C70.7466 38.4989 71.46 37.9162 72.1258 37.2947C72.7916 36.6538 73.3433 35.9449 73.7808 35.168C74.2374 34.3717 74.4656 33.4298 74.4656 32.3421C74.4656 31.643 74.3325 31.0215 74.0661 30.4776C73.8189 29.9144 73.4669 29.4386 73.0104 29.0501C72.5538 28.6423 72.0022 28.3315 71.3554 28.1179C70.7276 27.9042 70.0428 27.7974 69.3009 27.7974C68.2166 27.7974 67.294 27.9237 66.5331 28.1762C65.7912 28.4092 65.1539 28.6811 64.6213 28.9919C64.1077 29.2832 63.6701 29.5551 63.3087 29.8076C62.9473 30.0406 62.6239 30.1572 62.3385 30.1572C61.6537 30.1572 61.1591 29.8659 60.8547 29.2832L59 26.2825ZM64.393 60.6301C64.393 60.028 64.4976 59.4551 64.7069 58.9113C64.9351 58.3674 65.2395 57.9013 65.62 57.5129C66.0004 57.1244 66.457 56.8137 66.9896 56.5806C67.5223 56.3476 68.093 56.231 68.7017 56.231C69.3104 56.231 69.8716 56.3476 70.3852 56.5806C70.9179 56.8137 71.3744 57.1244 71.7549 57.5129C72.1543 57.9013 72.4682 58.3674 72.6965 58.9113C72.9248 59.4551 73.0389 60.028 73.0389 60.6301C73.0389 61.2516 72.9248 61.8342 72.6965 62.378C72.4682 62.9024 72.1543 63.3589 71.7549 63.7473C71.3744 64.1357 70.9179 64.4368 70.3852 64.6504C69.8716 64.8835 69.3104 65 68.7017 65C68.093 65 67.5223 64.8835 66.9896 64.6504C66.457 64.4368 66.0004 64.1357 65.62 63.7473C65.2395 63.3589 64.9351 62.9024 64.7069 62.378C64.4976 61.8342 64.393 61.2516 64.393 60.6301Z\",\n fill: \"#C4C4C4\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M6.94704 16.6956C7.79545 16.5892 8.43575 16.3194 8.86796 15.8862C9.30817 15.4454 9.52828 14.8715 9.52828 14.1647C9.52828 13.8759 9.47225 13.6251 9.3602 13.4123C9.25615 13.1918 9.10408 12.998 8.90398 12.8308C8.71189 12.6636 8.48378 12.5192 8.21965 12.3976C7.95552 12.276 7.66739 12.162 7.35524 12.0556L6.94704 16.6956ZM6.17867 4.64518C5.73045 4.69839 5.35027 4.78959 5.03812 4.9188C4.72597 5.04041 4.46985 5.19241 4.26975 5.37482C4.06965 5.55723 3.92158 5.76244 3.82554 5.99046C3.73749 6.21847 3.69348 6.45788 3.69348 6.70869C3.69348 6.99751 3.7455 7.25212 3.84955 7.47254C3.9616 7.68535 4.10967 7.87916 4.29376 8.05397C4.48585 8.22118 4.70996 8.37318 4.96609 8.50999C5.22221 8.6392 5.50235 8.7608 5.80649 8.87481L6.17867 4.64518ZM7.58335 9.42204C8.15962 9.58925 8.7319 9.77546 9.30017 9.98067C9.86845 10.1783 10.3767 10.4367 10.8249 10.7559C11.2811 11.0751 11.6493 11.4742 11.9294 11.953C12.2096 12.4242 12.3496 13.017 12.3496 13.7315C12.3496 14.4383 12.2256 15.1033 11.9775 15.7266C11.7293 16.3422 11.3652 16.8894 10.8849 17.3683C10.4047 17.8395 9.81642 18.2271 9.12009 18.5311C8.42375 18.8275 7.62737 19.0024 6.73093 19.0556L6.58686 20.7314C6.57886 20.9063 6.49882 21.0659 6.34675 21.2103C6.20268 21.3623 6.01859 21.4383 5.79448 21.4383H4.70196L4.91806 18.9986C3.98161 18.8769 3.10119 18.6337 2.27679 18.2689C1.4524 17.9041 0.752059 17.4519 0.175781 16.9122L1.08822 15.624C1.16826 15.51 1.27231 15.4188 1.40037 15.3504C1.53644 15.2744 1.68051 15.2364 1.83258 15.2364C2.00866 15.2364 2.19675 15.2972 2.39685 15.4188C2.59695 15.5328 2.82506 15.6696 3.08118 15.8292C3.3373 15.9812 3.62944 16.137 3.9576 16.2966C4.28576 16.4562 4.67395 16.574 5.12216 16.65L5.56637 11.554C4.9981 11.4019 4.43383 11.2233 3.87356 11.0181C3.3213 10.8129 2.82105 10.5431 2.37284 10.2087C1.93263 9.86666 1.57646 9.43724 1.30433 8.92041C1.0322 8.40359 0.896127 7.75755 0.896127 6.98231C0.896127 6.40468 1.01619 5.84225 1.2563 5.29502C1.49642 4.74019 1.84859 4.24616 2.31281 3.81294C2.78504 3.37972 3.36131 3.0225 4.04164 2.74128C4.72197 2.46007 5.50235 2.30046 6.38277 2.26246L6.51483 0.825979C6.53084 0.643569 6.61087 0.48016 6.75494 0.335753C6.89901 0.191345 7.08711 0.119141 7.31922 0.119141H8.41175L8.21965 2.35366C9.06806 2.48287 9.80041 2.71468 10.4167 3.0491C11.033 3.37592 11.5653 3.74453 12.0135 4.15496L11.2931 5.19241C11.1891 5.34442 11.081 5.45843 10.969 5.53443C10.8569 5.61044 10.7209 5.64844 10.5608 5.64844C10.4407 5.64844 10.2966 5.61424 10.1286 5.54583C9.96049 5.46983 9.7724 5.38242 9.5643 5.28362C9.3562 5.17721 9.12008 5.07081 8.85596 4.9644C8.59983 4.858 8.3157 4.77059 8.00355 4.70219L7.58335 9.42204Z\",\n fill: \"#C4C4C4\"\n })), _rect || (_rect = /*#__PURE__*/React.createElement(\"rect\", {\n x: 1.91406,\n y: 78.0195,\n width: 95.6518,\n height: 2.4599,\n rx: 1.22995,\n fill: \"#C4C4C4\"\n })), _rect2 || (_rect2 = /*#__PURE__*/React.createElement(\"rect\", {\n x: 1.91406,\n y: 32.1016,\n width: 39.1303,\n height: 2.4599,\n rx: 1.22995,\n fill: \"#C4C4C4\"\n })), _rect3 || (_rect3 = /*#__PURE__*/React.createElement(\"rect\", {\n x: 1.91406,\n y: 93.5957,\n width: 95.6518,\n height: 2.4599,\n rx: 1.22995,\n fill: \"#C4C4C4\"\n })), _rect4 || (_rect4 = /*#__PURE__*/React.createElement(\"rect\", {\n x: 1.91406,\n y: 47.6797,\n width: 39.1303,\n height: 2.4599,\n rx: 1.22995,\n fill: \"#C4C4C4\"\n })), _rect5 || (_rect5 = /*#__PURE__*/React.createElement(\"rect\", {\n x: 1.91406,\n y: 108.357,\n width: 95.6518,\n height: 2.4599,\n rx: 1.22995,\n fill: \"#C4C4C4\"\n })), _rect6 || (_rect6 = /*#__PURE__*/React.createElement(\"rect\", {\n x: 1.91406,\n y: 63.2598,\n width: 39.1303,\n height: 2.4599,\n rx: 1.22995,\n fill: \"#C4C4C4\"\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgServiceCardAdd);\nexport default __webpack_public_path__ + \"static/media/service-card-add.0aeb66f1ea337ea3fae0ac5b4aa7ad75.svg\";\nexport { ForwardRef as ReactComponent };","import React from 'react';\r\n\r\nimport { billTypes } from '../../enums/billTypes';\r\n\r\nimport { ReactComponent as ElectricityIcon } from '../icons/services/outline/electricity.svg';\r\nimport { ReactComponent as GasIcon } from '../icons/services/outline/gas.svg';\r\nimport { ReactComponent as HealthIcon } from '../icons/services/outline/health.svg';\r\nimport { ReactComponent as HomeInsuranceIcon } from '../icons/services/outline/home-insurance.svg';\r\nimport { ReactComponent as HomeLoanIcon } from '../icons/services/outline/home-loan.svg';\r\nimport { ReactComponent as InternetIcon } from '../icons/services/outline/internet.svg';\r\nimport { ReactComponent as VehicleInsuranceIcon } from '../icons/services/outline/vehicle-insurance.svg';\r\nimport { ReactComponent as MobilePhoneIcon } from '../icons/services/outline/mobile-phone.svg';\r\nimport { ReactComponent as SolarInstallationIcon } from '../icons/services/outline/solar-installation.svg';\r\nimport { ReactComponent as SolarFinanceIcon } from '../icons/services/outline/solar-finance.svg';\r\nimport { ReactComponent as BusinessLoanIcon } from '../icons/services/outline/business-loan.svg';\r\n\r\nconst ServiceOutline = ({ serviceType }) => {\r\n const getIcon = () => {\r\n const className = 'icon';\r\n\r\n switch (serviceType.Id) {\r\n case billTypes.ELECTRICITY.Id:\r\n return ;\r\n\r\n case billTypes.GAS.Id:\r\n return ;\r\n\r\n case billTypes.HEALTH_INSURANCE.Id:\r\n return ;\r\n\r\n case billTypes.HOME_AND_CONTENTS_INSURANCE.Id:\r\n return ;\r\n\r\n case billTypes.HOME_LOAN.Id:\r\n return ;\r\n\r\n case billTypes.INTERNET.Id:\r\n return ;\r\n\r\n case billTypes.VECHICLE_INSURANCE.Id:\r\n return ;\r\n\r\n case billTypes.MOBILE_PHONE.Id:\r\n return ;\r\n\r\n case billTypes.SOLAR_INSTALLATION.Id:\r\n return ;\r\n\r\n case billTypes.SOLAR_FINANCE.Id:\r\n return ;\r\n\r\n case billTypes.BUSINESS_LOAN.Id:\r\n return ;\r\n\r\n default:\r\n return null;\r\n }\r\n };\r\n\r\n return getIcon();\r\n};\r\n\r\nexport default ServiceOutline;\r\n","import React from 'react';\r\n\r\nimport Sheet from '../Sheet/Sheet';\r\nimport ServiceOutline from './serviceOutline';\r\n\r\nconst ServiceCardEmpty = ({ serviceType, onStart, isSample }) => {\r\n return (\r\n
\r\n monthly bill estimate for {customerEnergyChargeAverage.usage} {energyTypeDisplay}\r\n ({customerEnergyChargeAverage.averagePricePerKwhDisplay}c per {submission.energyTypeDisplay})\r\n
\r\n \r\n );\r\n case implementationCodes.ELECTRICITY.AU_DEFAULT:\r\n case implementationCodes.GAS.AU_DEFAULT:\r\n return (\r\n <>\r\n
{billAmountLowestDisplay}
\r\n
\r\n {isBill && hasSavingToHighlight && (\r\n ({percentageBillReductionAmountToHighlightDisplayShort} less) \r\n )}\r\n\r\n {isBill\r\n ? `in energy charges (${taxIndicator}) if you'd billed with this plan during the same ${billDays} day period${\r\n implementationCode === implementationCodes.GAS.AU_DEFAULT\r\n ? ` based on an estimated ${percentagePeakDisplay} peak and ${percentageOffPeakDisplay} off-peak usage`\r\n : ''\r\n }.`\r\n : estimateMonthlyDisclaimer}\r\n
\r\n \r\n );\r\n case implementationCodes.INTERNET.AU_DEFAULT:\r\n return (\r\n <>\r\n
\r\n );\r\n};\r\nexport default OfferMarketing;\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { billTypes } from '../../enums/billTypes';\r\n\r\nconst BillReductionDisclaimer = ({\r\n billType,\r\n programDisplayName,\r\n percentagePeakDisplay,\r\n percentageOffPeakDisplay,\r\n billAdditionalDisclaimer\r\n}) => {\r\n return (\r\n <>\r\n
\r\n Percentage reflects what you would have paid over the same period using actual usage from your bill\r\n {billType === billTypes.GAS.Name\r\n ? ` based on an estimated ${percentagePeakDisplay} peak and ${percentageOffPeakDisplay} off-peak usage`\r\n : ''}\r\n .\r\n
\r\n {billAdditionalDisclaimer &&
{billAdditionalDisclaimer}
}\r\n
\r\n Percentages do not take into account concessions, payment processing fees, paper bill fees, green energy\r\n contributions, government rebates, welcome credits, guaranteed service level credits or any balances carried\r\n forward from previous bill, unless otherwise stated.\r\n
\r\n
\r\n Information considered by {programDisplayName} includes the number of days of energy usage, the amount of kWh or\r\n MJ usage, the metering type of the energy consumed e.g. peak / off-peak / controlled load, usage pricing steps,\r\n solar feed-in and any discounts applied.\r\n
\r\n
{programDisplayName} only considers offers from approved energy providers within the SmartMe marketplace.
\r\n {`The after discounts amount shown is for your ${submission.billType.toLowerCase()} usage`}\r\n {submission.hasSolar ? ', supply and solar feed-in' : ' and supply'} only.\r\n
\r\n Figures may differ to those on your bill as they only include energy usage. Pay-on-time and other\r\n discounts have been applied to all figures.\r\n
\r\n Possible Annual Saving figure assumes that the usage in this bill is representative of your average\r\n usage and applies that usage to a 12 month period.\r\n
\r\n\r\n
{yourBillTaxDisclaimer}
\r\n \r\n
\r\n
\r\n )}\r\n
\r\n\r\n {!isSample && (\r\n
\r\n \r\n
\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default EnergyBill;\r\n","import React from 'react';\r\nimport { useSelector } from 'react-redux';\r\nimport { isMobile } from 'react-device-detect';\r\n\r\nimport { billTypes } from '../../enums/billTypes';\r\n\r\nimport ServiceCardSample from './serviceCardSample';\r\n\r\nconst ServiceCardStack = ({ cardSize }) => {\r\n const { billTypes: agentBillTypes } = useSelector(state => state.config);\r\n\r\n const hasElectricity = billTypes.hasServiceType(agentBillTypes, billTypes.ELECTRICITY);\r\n const hasGas = billTypes.hasServiceType(agentBillTypes, billTypes.GAS);\r\n const hasInternet = billTypes.hasServiceType(agentBillTypes, billTypes.INTERNET);\r\n const hasHomeLoan = billTypes.hasServiceType(agentBillTypes, billTypes.HOME_LOAN);\r\n const hasVehicleInsurance = billTypes.hasServiceType(agentBillTypes, billTypes.VECHICLE_INSURANCE);\r\n const hasHomeInsurance = billTypes.hasServiceType(agentBillTypes, billTypes.HOME_AND_CONTENTS_INSURANCE);\r\n const hasHealthInsurance = billTypes.hasServiceType(agentBillTypes, billTypes.HEALTH_INSURANCE);\r\n\r\n const sampleServices = [];\r\n const cardCount = 3;\r\n\r\n const getItem = (index, serviceType) => {\r\n switch (index) {\r\n case 0:\r\n sampleServices.push({ label: 'first', isEmpty: false, serviceType });\r\n break;\r\n case 1:\r\n sampleServices.push({ label: 'second', isEmpty: true, serviceType });\r\n break;\r\n case 2:\r\n sampleServices.push({ label: 'third', isEmpty: true, serviceType });\r\n break;\r\n default:\r\n break;\r\n }\r\n\r\n return index + 1;\r\n };\r\n\r\n for (let i = 0; i < cardCount; ) {\r\n if (hasElectricity && i < cardCount) i = getItem(i, billTypes.ELECTRICITY);\r\n if (hasGas && i < cardCount) i = getItem(i, billTypes.GAS);\r\n if (hasVehicleInsurance && i < cardCount) i = getItem(i, billTypes.VECHICLE_INSURANCE);\r\n if (hasHomeLoan && i < cardCount) i = getItem(i, billTypes.HOME_LOAN);\r\n if (hasInternet && i < cardCount) i = getItem(i, billTypes.INTERNET);\r\n if (hasHomeInsurance && i < cardCount) i = getItem(i, billTypes.HOME_AND_CONTENTS_INSURANCE);\r\n if (hasHealthInsurance && i < cardCount) i = getItem(i, billTypes.HEALTH_INSURANCE);\r\n }\r\n\r\n return (\r\n
\r\n Hi Claire, your EcoTel bill has arrived. To pay the full bill amount of $127.54, simply reply YES or click\r\n here for details.\r\n
\r\n
Yes
\r\n
Great! Your payment has been processed
\r\n
Thanks
\r\n
\r\n );\r\n };\r\n\r\n const useLiveComponent = true;\r\n\r\n const slide2Description = `Get rewarded each time you secure a great deal for your ${billTypes.getServicesText(\r\n agentBillTypes\r\n )} bills.`;\r\n\r\n const slide3Description = `Start by telling your ${organiserAgentName} about your current bills. If you have an e-bill${\r\n hasInsurance ? ' or insurance policy' : ''\r\n }, simply upload it and you're ready to go.`;\r\n\r\n const items = [\r\n {\r\n index: 0,\r\n heading: 'Remove bill pain for good',\r\n description: `${organiserAgentName} helps you take permanent control of your household bills.`,\r\n image: `${staticContentUrl}/images/help/how-it-works01.jpg`,\r\n showLogo: true\r\n },\r\n {\r\n index: 1,\r\n heading: 'We make bills easy',\r\n description: 'Manage your bills in one place and receive cheaper plan recommendations on applicable services.',\r\n image: `${staticContentUrl}/images/help/how-it-works02.jpg`,\r\n showLogo: true\r\n },\r\n {\r\n index: 2,\r\n heading: 'Earn when you save',\r\n description: slide2Description,\r\n image: `${staticContentUrl}/images/help/how-it-works03.jpg`,\r\n showLogo: true\r\n },\r\n {\r\n index: 3,\r\n heading: 'Getting setup is easy',\r\n description: slide3Description,\r\n image: `${staticContentUrl}/images/help/how-it-works04.png`,\r\n content: useLiveComponent ? : null,\r\n liveComponent: useLiveComponent\r\n },\r\n {\r\n index: 4,\r\n heading: 'Secure savings in minutes',\r\n description: `Applicable bills are instantly compared against the market to find great deals you can easily move to using ${organiserAgentName}.`,\r\n image: `${staticContentUrl}/images/help/how-it-works05.png`,\r\n content: useLiveComponent ? (\r\n
\r\n
\r\n \r\n
\r\n
\r\n ) : null,\r\n liveComponent: useLiveComponent\r\n },\r\n {\r\n index: 5,\r\n heading: \"It's super accurate\",\r\n description: `Throw away the messy spreadsheets. ${organiserAgentName} analyses your expenses to calculate your possible savings.`,\r\n image: `${staticContentUrl}/images/help/how-it-works06.png`,\r\n content: useLiveComponent ? getUserBillSample() : null,\r\n liveComponent: useLiveComponent\r\n },\r\n {\r\n index: 6,\r\n heading: \"You're organised\",\r\n description: `Once you secure each cheaper deal, you can link your ${billTypes.getServicesText(\r\n agentBillTypes\r\n )} bills to ${organiserAgentName}.`,\r\n image: `${staticContentUrl}/images/help/how-it-works07.png`,\r\n content: useLiveComponent ? : null,\r\n liveComponent: useLiveComponent\r\n },\r\n {\r\n index: 7,\r\n heading: 'Staying organised is easy',\r\n description: 'Any linked bills will automatically receive a regular review to ensure you STAY on great rates.',\r\n image: `${staticContentUrl}/images/help/how-it-works08.png`,\r\n content: useLiveComponent ? : null,\r\n liveComponent: useLiveComponent\r\n },\r\n {\r\n index: 8,\r\n heading: 'We monitor the markets',\r\n description: `${organiserAgentName} automatically checks your bills against the latest market rates on a regular basis. We'll alert you when a cheaper deal is available, based on your bills energy usage and rates.`,\r\n content: getRetailerPanel()\r\n },\r\n // {\r\n // index: 9,\r\n // heading: 'Pay bills with ease',\r\n // description: `${organiserAgentName} payment tools will soon enable you to pay your bills in seconds.`,\r\n // image: `${staticContentUrl}/images/help/how-it-works10.png`,\r\n // content: useLiveComponent ? getPayBillSample() : null\r\n // },\r\n // {\r\n // index: 10,\r\n // heading: 'Enjoy discount offers',\r\n // description: `${organiserAgentName} will soon give you access to discounts on over a hundred other household expenses.`,\r\n // content: getDiscountPanel()\r\n // },\r\n {\r\n index: 12,\r\n heading: \"Let's get started\",\r\n description: `Take a few minutes now to fill out each card in your ${organiserAgentName} and get permanently organised.`,\r\n image: `${staticContentUrl}/images/help/how-it-works13.jpg`,\r\n logoStyle: true\r\n }\r\n ];\r\n\r\n const agentServiceType = getAgentServiceType(billTypes.ELECTRICITY, agentBillTypes);\r\n const commissionType = agentServiceType.commissionType;\r\n const agentBillType = agentServiceType.agentBillType;\r\n\r\n if (agentServiceType.hasCommission) {\r\n const content = (\r\n \r\n );\r\n\r\n items.push({\r\n index: 11,\r\n heading: 'Earn when you save',\r\n description: `And to top it all off, you can earn ${commissionType.NamePlural} every time you lock in a saving using your ${organiserAgentName}.`,\r\n image: `${staticContentUrl}/images/help/how-it-works12.png`,\r\n content: useLiveComponent ? content : null,\r\n liveComponent: useLiveComponent\r\n });\r\n }\r\n\r\n const onNext = () => {\r\n if (animating === true) return;\r\n\r\n const nextIndex = activeIndex === items.length - 1 ? activeIndex : activeIndex + 1;\r\n setIndex(nextIndex, buttonDirection.Next);\r\n };\r\n\r\n const onPrevious = () => {\r\n if (animating === true) return;\r\n\r\n const nextIndex = activeIndex === 0 ? 0 : activeIndex - 1;\r\n setIndex(nextIndex, buttonDirection.Previous);\r\n };\r\n\r\n const onCloseInternal = () => {\r\n standardEvents('How-It-Works-Dialog', 'Close', `slide-${activeIndex + 1}`, googleAnalyticsClientCode);\r\n\r\n onClose(true);\r\n };\r\n\r\n const setIndex = (index, direction) => {\r\n setActiveIndex(index);\r\n resetNextCarouselAnimation();\r\n standardEvents('How-It-Works-Dialog', direction, `slide-${index + 1}`, googleAnalyticsClientCode);\r\n };\r\n\r\n const resetNextCarouselAnimation = () => {\r\n setNextCarouselAnimateClass('');\r\n\r\n setTimeout(() => {\r\n setNextCarouselAnimateClass(carouselAnimationClasses);\r\n }, 500);\r\n };\r\n\r\n const slides = items\r\n .sort((a, b) => {\r\n return a.index - b.index;\r\n })\r\n .map((item, index) => {\r\n return (\r\n setAnimating(true)} onExited={() => setAnimating(false)} key={`c-item-${index}`}>\r\n \r\n {item.content}\r\n \r\n\r\n {item.showLogo && (\r\n
To get started, we'll ask you a few questions about your bills and your home.
\r\n
\r\n We'll use this information to find our best deals for your{' '}\r\n {billTypes.getServicesText(agentBillTypes, null, false, serviceTypeOptions)}.\r\n
\r\n \r\n );\r\n }\r\n };\r\n\r\n return (\r\n
\r\n
\r\n
\r\n Welcome to your \r\n
\r\n
\r\n\r\n {tourGuideEnabled && (\r\n
\r\n
\r\n Access your Hints and Tips at any time for suggestions about the bills and offers in your{' '}\r\n .\r\n
\r\n {\r\n if (allowModeChange && userMode === 'text') {\r\n if (outOfRange) {\r\n cb(`${fieldName} must be between ${minValue} and ${maxValue}`);\r\n } else {\r\n cb(`Please click OK to apply the ${fieldName}`);\r\n }\r\n } else {\r\n cb(true);\r\n }\r\n }\r\n }}\r\n />\r\n
\r\n )}\r\n\r\n {/* --- CURRENT SPEND ----------------------------------------------- */}\r\n
\r\n
Current monthly spend
\r\n
\r\n setSelectedCurrentSpend(e.target.value ? parseFloat(e.target.value) : null)}\r\n validate={{\r\n pattern: {\r\n value: '^[0-9]{1,3}(\\\\.[0-9]{1,2})?$',\r\n errorMessage: `Please enter your current spend on broadband per month`\r\n },\r\n required: {\r\n value: true,\r\n errorMessage: `Please enter your current spend on broadband per month`\r\n }\r\n }}\r\n />\r\n
\r\n )}\r\n \r\n \r\n );\r\n\r\n return (\r\n <>\r\n {navBar}\r\n\r\n onHowItWorksDialogVisible(false)}\r\n >\r\n onHowItWorksDialogVisible(false, dialogResult)} />\r\n \r\n\r\n setRegistrationDialogOpen(false)}\r\n >\r\n setRegistrationDialogOpen(false)} />\r\n \r\n\r\n onGetStartedDialogVisible(false)}\r\n />\r\n \r\n );\r\n};\r\n\r\nexport default Navigation;\r\n","import React, { useState, useRef } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { Container, Row, Col, Modal, ModalBody, ModalFooter, Button } from 'reactstrap';\r\nimport TermsAndConditionsDialog from './termsAndConditionsDialog';\r\nimport { pageModes } from '../../enums/launchTypes';\r\nimport { postFrameDialogMessage } from '../../utilities/domUtilities';\r\n\r\nconst ProgramAbstractDialog = ({ buttonText, buttonClass }) => {\r\n const dispatch = useDispatch();\r\n const ref = useRef(null);\r\n\r\n const { organiserAgentName } = useSelector(state => state.content.general);\r\n const { programName } = useSelector(state => state.config);\r\n const { pageMode, frameHeight, frameHost } = useSelector(state => state.application);\r\n\r\n const [dialogOpen, setDialogOpen] = useState();\r\n\r\n const onDialogToggle = event => {\r\n // Prevent checkbox from being toggled in cases where dialog button is being used in the label\r\n event.stopPropagation();\r\n\r\n setDialogOpen(!dialogOpen);\r\n };\r\n\r\n const handleModal = () => {\r\n if (pageMode === pageModes.FRAMED) {\r\n dispatch(postFrameDialogMessage(frameHost, 'Program Abstract', dialogOpen, ref.current, frameHeight));\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
How {programName} works
\r\n \r\n
\r\n
\r\n close\r\n
\r\n \r\n \r\n\r\n \r\n
\r\n
\r\n {programName} is a free service that helps to remove bill-pain by managing your household bills in\r\n one central location. You'll soon be able to access your current and past bills, pay your bills by\r\n responding to an SMS and if you are moving house, you'll be able to move multiple services in one\r\n locaton.\r\n
\r\n
\r\n If you choose to have your bills delivered to your{' '}\r\n {' '}\r\n we'll automatically ask your new retailer to email your future e-bills to a {programName} email\r\n address we set up for you. We'll immediately forward all correspondence and bills from your retailer\r\n to your regular email address. Importantly, when communicating with the retailer, and when you\r\n register on their website or any apps, you'll need to use your Organiser email address that we'll\r\n shared with them.\r\n
\r\n \r\n {!hasSelectedAddress\r\n ? 'Please enter your property address first'\r\n : getDistributorItem(distributorSets, serviceType).length > 1 && !selectedDistributorPrimary\r\n ? 'Connection date will be available after you select a distributor'\r\n : ''}\r\n \r\n
\r\n ) : (\r\n
\r\n {\r\n let message = true;\r\n\r\n if (ajaxCount === 0 && installDates.length > 0) {\r\n if (!selectedOccupancyDate) {\r\n message = 'Please select a connection date';\r\n } else if (moment(selectedOccupancyDate) < moment().add(1, 'days')) {\r\n message = 'Please select a valid date in the future';\r\n }\r\n }\r\n\r\n cb(message);\r\n }\r\n }}\r\n />\r\n
We've analysed your {serviceTypeName} bill against plans from our available retailers.
\r\n
\r\n Based on your bill, there are currently no {hasOffers ? 'cheaper' : null} plans from our available\r\n retailers that we're able to switch you to.\r\n
\r\n \r\n ) : (\r\n <>\r\n
We've tried to analyse your {serviceTypeName} bill against plans from our available retailers.
\r\n
Unfortunately, we could not extract any information from the file you uploaded.
\r\n \r\n )}\r\n {exit && (\r\n
\r\n You may find a better plan with our larger range of retailers at{' '}\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default RedirectDialog;\r\n","import React, { useState, useEffect, useCallback } from 'react';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { push } from 'connected-react-router';\r\nimport { Button } from 'reactstrap';\r\nimport { AvForm } from 'availity-reactstrap-validation';\r\nimport _debounce from 'lodash.debounce';\r\n\r\nimport { useAuth0 } from '../../auth/auth0-Provider';\r\nimport SubmitBillFileUploader from './submitBillFileUploader';\r\nimport ExitLaunch from '../common/exitLaunch';\r\nimport SubmitCommon from './submitCommon';\r\nimport QsButtonGroup from './qsButtonGroup';\r\nimport PoweredBySmartMe from './poweredBySmartMe';\r\nimport GeneralDialog from '../dialogs/generalDialog';\r\nimport RedirectDialog from '../dialogs/redirectDialog';\r\nimport SubmitDialogBanner from '../dialogs/submitDialogBanner';\r\n\r\nimport { addSessionActivity } from '../../actions/sessionActivityActions';\r\nimport { closeDialogs } from '../../actions/dialogOptionsActions';\r\nimport { submitBillWithToken, submitBillWithKey, submitBillUnauthenticated } from '../../actions/energyBillActions';\r\nimport {\r\n setServerMessageClear,\r\n displayNoOffersMessage,\r\n comparisonErrorMessage\r\n} from '../../actions/serverMessageActions';\r\nimport * as serverMessageTargets from '../../actions/serverMessageTargets';\r\n\r\nimport { occupancyPurposes, submissionTypes } from '../../enums/submissionTypes';\r\nimport { launchDialogModes } from '../../enums/launchTypes';\r\nimport { billTypes } from '../../enums/billTypes';\r\nimport { sessionActivityTypes } from '../../enums/sessionActivityTypes';\r\n\r\nimport { submitAutoEstimates } from '../serviceCard/serviceCardUtilities';\r\nimport { getSessionActivity } from '../../utilities/commonUtilities';\r\nimport { standardEvents } from '../../utilities/googleAnalyticsEvents';\r\nimport { getExit } from '../../utilities/billTypeUtilities';\r\nimport BrandScroller from './brandScroller';\r\n\r\nconst SubmitBillDefaultUx2 = ({\r\n onSuccess,\r\n onEstimateButtonClick,\r\n onRedirectButtonClick,\r\n onBackButtonClick,\r\n showBackButton,\r\n confirmButtonText,\r\n serviceType: userServiceType,\r\n launchMode,\r\n onVerify\r\n}) => {\r\n const dispatch = useDispatch();\r\n const { getAccessToken, isUserAuthenticated } = useAuth0();\r\n\r\n const { serverMessage, selectedAgent, session } = useSelector(state => state);\r\n const { accessKey, accessId } = useSelector(state => state.comparison);\r\n const { exitCode } = useSelector(state => state.landing.home);\r\n const { occupancyPurpose } = useSelector(state => state.comparison.submission);\r\n const { defaultOccupancyPurpose, billTypes: agentBillTypes } = useSelector(state => state.config);\r\n const { launchDialogRedirectEnabled, showPoweredBy, googleAnalyticsClientCode, exits } = useSelector(\r\n state => state.config.settings\r\n );\r\n const { data: userBills } = useSelector(state => state.userBills);\r\n\r\n const sessionActivity = getSessionActivity(session);\r\n\r\n const getOccupancyPurpose = () => {\r\n return occupancyPurpose ? occupancyPurpose : defaultOccupancyPurpose;\r\n };\r\n\r\n const [selectedOccupancyPurpose, setSelectedOccupancyPurpose] = useState(getOccupancyPurpose());\r\n const [redirectDialogOpen, setRedirectDialogOpen] = useState(false);\r\n const [hasOffers, setHasOffers] = useState(false);\r\n const [supportedBill, setSupportedBill] = useState(false);\r\n const [serviceType, setServiceType] = useState(userServiceType);\r\n\r\n const [files, setFiles] = useState([]);\r\n const [hasSubmitted, setHasSubmitted] = useState(false);\r\n const [submissionCommon, setSubmissionCommon] = useState({});\r\n\r\n const target = serverMessageTargets.SUBMIT_BILL;\r\n const hasServiceType = serviceType !== billTypes.NONE;\r\n const redirectHeading = hasServiceType ? serviceType.Name : 'Your bill';\r\n\r\n const restrictedExit =\r\n launchMode === launchDialogModes.RESTRICTED ? getExit(exitCode, exits, serviceType, agentBillTypes) : null;\r\n\r\n useEffect(() => {\r\n dispatch(setServerMessageClear(target, serverMessage));\r\n }, []);\r\n\r\n // --------------------------------------------------------------------------\r\n // Invalid form submit handler.\r\n // --------------------------------------------------------------------------\r\n const handleInvalidSubmit = () => {\r\n setHasSubmitted(true);\r\n };\r\n\r\n // --------------------------------------------------------------------------\r\n // Submission common handlers.\r\n // --------------------------------------------------------------------------\r\n const onSubmissionCommonChange = value => {\r\n if (value) setSubmissionCommon(value);\r\n };\r\n\r\n const setButtonGroup = (event, setter) => {\r\n let option = event.target.getAttribute('data-value');\r\n setter(parseInt(option));\r\n };\r\n\r\n // --------------------------------------------------------------------------\r\n // Submit bill handler.\r\n // --------------------------------------------------------------------------\r\n const onSubmitBill = useCallback(\r\n _debounce(\r\n () => {\r\n const bill = {\r\n files,\r\n occupancyPurpose: selectedOccupancyPurpose,\r\n ...submissionCommon,\r\n sendComparisonEmail: true, // always send an email for bill comparisons\r\n sessionActivity\r\n };\r\n\r\n if (accessKey && accessId) {\r\n const data = { bill, access: { key: accessKey, id: accessId } };\r\n dispatch(submitBillWithKey(data, onComplete, onError, onVerifyResponse, serviceType));\r\n } else if (isUserAuthenticated()) {\r\n const fn = async () => {\r\n const accessToken = await getAccessToken();\r\n dispatch(submitBillWithToken(accessToken, { bill }, onComplete, onError, onVerifyResponse, serviceType));\r\n };\r\n fn();\r\n } else {\r\n dispatch(submitBillUnauthenticated({ bill }, onComplete, onError, onVerifyResponse, serviceType));\r\n }\r\n\r\n standardEvents('Service-Card-Selector', serviceType.Name, 'Submit-Bill', googleAnalyticsClientCode);\r\n },\r\n 2000,\r\n { leading: true }\r\n ),\r\n [files, submissionCommon, accessKey, accessId]\r\n );\r\n\r\n // --------------------------------------------------------------------------\r\n // Bill comparison verify handler.\r\n // --------------------------------------------------------------------------\r\n const onVerifyResponse = (verifyServiceType, verifyData) => {\r\n // If no data was extracted and we are in a restricted launch mode, show the redirect dialog.\r\n if (\r\n launchMode === launchDialogModes.RESTRICTED &&\r\n launchDialogRedirectEnabled &&\r\n verifyServiceType === billTypes.NONE &&\r\n !verifyData\r\n ) {\r\n setRedirectDialogOpen(true);\r\n setSupportedBill(false);\r\n } else {\r\n onVerify(verifyServiceType, verifyData);\r\n }\r\n };\r\n\r\n // --------------------------------------------------------------------------\r\n // Bill comparison error handler.\r\n // --------------------------------------------------------------------------\r\n const onError = error => {\r\n dispatch(comparisonErrorMessage(error, target));\r\n };\r\n\r\n // --------------------------------------------------------------------------\r\n // Add session activity.\r\n // --------------------------------------------------------------------------\r\n const recordSessionActivity = (comparisonResult, userBill) => {\r\n dispatch(\r\n addSessionActivity({\r\n ...sessionActivity,\r\n data: {\r\n submissionType: submissionTypes.BILL,\r\n submissionId: userBill.submissionId,\r\n serviceType: serviceType.Code,\r\n hasOffers: comparisonResult.hasOffers\r\n },\r\n activityType: sessionActivityTypes.COMPARISON_COMPLETED\r\n })\r\n );\r\n };\r\n\r\n // --------------------------------------------------------------------------\r\n // Bill comparison complete handler.\r\n // --------------------------------------------------------------------------\r\n const onComplete = (comparisonResult, userBill) => {\r\n recordSessionActivity(comparisonResult, userBill);\r\n\r\n const billServiceType = billTypes.getById(userBill.billTypeId, billTypes.NONE);\r\n const address = { ...userBill.bill.propertyAddress, isAddress: true };\r\n\r\n setHasOffers(comparisonResult.hasOffers);\r\n setSupportedBill(true);\r\n\r\n // Service type may be different after bill has been extracted.\r\n setServiceType(billServiceType);\r\n\r\n dispatch(\r\n submitAutoEstimates(\r\n billServiceType,\r\n address,\r\n selectedAgent,\r\n sessionActivity,\r\n submissionCommon,\r\n agentBillTypes,\r\n userBills,\r\n googleAnalyticsClientCode\r\n )\r\n );\r\n\r\n if (\r\n launchMode === launchDialogModes.RESTRICTED &&\r\n launchDialogRedirectEnabled &&\r\n (!comparisonResult.hasOffers || !comparisonResult.hasBetterOffers)\r\n ) {\r\n setRedirectDialogOpen(true);\r\n } else {\r\n if (!comparisonResult.hasOffers) {\r\n dispatch(displayNoOffersMessage(target));\r\n } else if (onSuccess) {\r\n onShowOffers();\r\n }\r\n }\r\n };\r\n\r\n const onShowOffers = () => {\r\n dispatch(closeDialogs('submitBillDefault:onShowOffers'));\r\n dispatch(push('/compare'));\r\n\r\n if (onSuccess) {\r\n onSuccess();\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n {launchDialogRedirectEnabled && redirectDialogOpen && (\r\n \r\n setRedirectDialogOpen(false)}\r\n />\r\n \r\n )}\r\n\r\n \r\n\r\n
\r\n \r\n {hasServiceType &&
Please upload your latest bill
}\r\n\r\n
\r\n Upload your bill in PDF format. That's probably how you received it in your email inbox! We'll scan your bill\r\n for your unique usage and costs and use this information to check the market for a better deal.\r\n
\r\n There's no need to fill in multiple application forms. Just confirm your move details below, select your\r\n preferred plans and we'll arrange all the connections for you. This moving service is free and super fast!\r\n
\r\n
\r\n )}\r\n {/* --- YOUR ADDRESS ------------------------------------------------------- */}\r\n \r\n
\r\n \r\n \r\n \r\n {movingHouse && (\r\n
\r\n 0 ? 'Services we can connect at your address' : null}\r\n serviceType={billTypes.NONE}\r\n services={movingHouseServiceTypes}\r\n isLoaded={distributorSetsLoaded}\r\n supportedServices={getSupportedServices()}\r\n />\r\n
\r\n )}\r\n {/* --- CURRENT PROVIDER -------------------------------------------------- */}\r\n {/* No longer required but will leave the code here for a while. To reinstate just uncomment this section, everything else is still in place */}\r\n {/* \r\n {selectedOccupancyType && (\r\n \r\n
\r\n {\r\n if (\r\n selectedBillStartDate &&\r\n selectedBillEndDate &&\r\n selectedBillStartDate > selectedBillEndDate\r\n ) {\r\n cb('Bill start date must be less than or equal to the bill end date');\r\n } else if (!selectedBillStartDate && !selectedBillStartDate) {\r\n cb('Bill start and end date are required');\r\n } else if (!selectedBillStartDate) {\r\n cb('Bill start date is required');\r\n } else if (!selectedBillEndDate) {\r\n cb('Bill end date is required');\r\n } else if (selectedBillStartDate && selectedBillStartDate < minBillDate) {\r\n cb('Bill start date is too far in the past');\r\n } else if (\r\n selectedBillStartDate &&\r\n (selectedBillStartDate < minBillDate || selectedBillStartDate > maxBillDate)\r\n ) {\r\n cb(\r\n 'Bill end date can not be in the future, adjust it back but ensure you have the same number of supply days.'\r\n );\r\n } else if (selectedBillEndDate && selectedBillEndDate < minBillDate) {\r\n cb('Bill end date is too far in the past');\r\n } else if (\r\n selectedBillEndDate &&\r\n (selectedBillEndDate < minBillDate || selectedBillEndDate > maxBillDate)\r\n ) {\r\n cb(\r\n 'Bill end date can not be in the future, adjust it back but ensure you have the same number of supply days.'\r\n );\r\n } else {\r\n cb(true);\r\n }\r\n }\r\n }}\r\n />\r\n
\r\n \r\n
\r\n {billDateStandarisedWarning && (\r\n
\r\n \r\n
\r\n Please check the supply period is the same as your bill and adjust the dates if you need to\r\n
\r\n Please enter at least one row for all the different {serviceType.Unit} usage types on your\r\n bill. Please do this even when the usage value on you bill is 0 {serviceType.Unit}. These\r\n usage types are used to determine your tariff structure. If you don't include each usage type\r\n we may return plans that are incorrect for the meter installed at your address.\r\n
\r\n
\r\n What is controlled load?\r\n
\r\n
\r\n Controlled load is electricity supplied to specific appliances, such as electric hot water\r\n systems or slab or underfloor heating, which are often separately metered. A controlled load\r\n tariff is generally a lower rate as these appliances operate during off-peak hours (usually\r\n overnight).\r\n
\r\n
\r\n If you have controlled load, it might also appear on your bill as 'dedicated circuit'. In\r\n Queensland it may be called 'Tariff 31' (choose controlled Load 2) or 'Tariff 33' (choose\r\n controlled Load 1), and in Tasmania it may be called 'Tariff 61' (choose controlled Load 2) or\r\n 'Tariff 63' (choose controlled Load 2).\r\n
\r\n \r\n ) : (\r\n <>\r\n
Please enter all {serviceType.Unit} usage from your bill.
\r\n
\r\n As some retailers charge different rates (peak / off-peak) during seasonal periods of the year\r\n we will use your billing period to determine an approximate percentage of use for peak and\r\n off-peak.\r\n
\r\n onChangeUsageValue(e.target.value, index)}\r\n validate={{\r\n pattern: {\r\n value: '^-?[0-9]{0,5}(\\\\.[0-9]{1,4})?$',\r\n errorMessage: `Please enter a valid ${serviceType.Unit} usage total from your bill`\r\n },\r\n required: {\r\n value: true,\r\n errorMessage: `Please enter the ${serviceType.Unit} usage total from your bill`\r\n }\r\n }}\r\n />\r\n \r\n
\r\n {\r\n if (selectedHasDemand) {\r\n cb('Bill compare is unavailable for bills that include demand charges at this time');\r\n } else cb(true);\r\n }\r\n }}\r\n />\r\n \r\n \r\n )}\r\n \r\n )}\r\n {/* --- PROPERTY TYPE ----------------------------------------------------- */}\r\n {!movingHouse && (\r\n \r\n
\r\n {\r\n if (selectedOccupancyPurpose === occupancyPurposes.BUSINESS.Id) {\r\n cb(\"Sorry, we currently don't support business comparisons\");\r\n } else cb(true);\r\n }\r\n }}\r\n />\r\n
\r\n Figures may differ to those on your bill as they only include energy usage. Pay-on-time and other\r\n discounts have been applied to all figures.\r\n
\r\n Possible Annual Saving figure assumes that the usage in this bill is representative of your average\r\n usage and applies that usage to a 12 month period.\r\n
\r\n\r\n
{yourBillTaxDisclaimer}
\r\n \r\n
\r\n
\r\n )}\r\n
\r\n\r\n {!isSample && (\r\n
\r\n \r\n
\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default HomeLoanDetailsAu;\r\n","import React from 'react';\r\nimport { useSelector } from 'react-redux';\r\nimport { FormGroup } from 'reactstrap';\r\nimport { AvField } from 'availity-reactstrap-validation';\r\nimport EmailAddress from './emailAddress';\r\n\r\nconst YourDetails = ({\r\n onChange,\r\n details: { title, firstName, surname, emailAddress, phoneNumber, membershipId, alternatePhoneNumber, dateOfBirth },\r\n phoneNumberRegex,\r\n alternatePhoneNumberRegex,\r\n showMembershipId,\r\n showAlternatePhoneNumber,\r\n showDateOfBirth,\r\n showTitle,\r\n showEmailAddress,\r\n showPhoneNumber,\r\n lockPhoneNumber\r\n}) => {\r\n const { titles } = useSelector(state => state.config.referenceData);\r\n const { country } = useSelector(state => state.config);\r\n const { emailAddress: userEmailAddress } = useSelector(state => state.user);\r\n\r\n return (\r\n <>\r\n {showTitle && (\r\n \r\n onChange(e, { title: e.target.value ? parseInt(e.target.value) : null })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Title is required' }\r\n }}\r\n >\r\n \r\n {titles.map((ref, i) => (\r\n \r\n ))}\r\n \r\n \r\n )}\r\n\r\n \r\n onChange(e, { firstName: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'First name is required' },\r\n minLength: { value: 2, errorMessage: 'First name is not the required length' },\r\n maxLength: { value: 50, errorMessage: 'First name should be 50 characters or less' },\r\n pattern: {\r\n value: '^[a-zA-Z -]+$',\r\n errorMessage: `Invalid characters in first name`\r\n }\r\n }}\r\n />\r\n \r\n \r\n onChange(e, { surname: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Surname is required' },\r\n minLength: { value: 2, errorMessage: 'Surname is not the required length' },\r\n maxLength: { value: 50, errorMessage: 'Surname should be 50 characters or less' },\r\n pattern: {\r\n value: '^[a-zA-Z -]+$',\r\n errorMessage: `Invalid characters in surname`\r\n }\r\n }}\r\n />\r\n \r\n\r\n {showEmailAddress && (\r\n \r\n {\r\n onChange(null, { emailAddress: value });\r\n }}\r\n forceRequireEmailAddress={true}\r\n />\r\n \r\n )}\r\n\r\n {showPhoneNumber && (\r\n \r\n onChange(e, { phoneNumber: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Mobile phone number is required' },\r\n pattern: {\r\n value: phoneNumberRegex,\r\n errorMessage: `Please enter a valid mobile phone number for ${country.name} (no spaces or hyphens)`\r\n }\r\n }}\r\n />\r\n \r\n )}\r\n\r\n {showAlternatePhoneNumber && (\r\n \r\n onChange(e, { alternatePhoneNumber: e.target.value })}\r\n validate={{\r\n pattern: {\r\n value: alternatePhoneNumberRegex,\r\n errorMessage: `Please enter a valid alternate phone number for ${country.name} (no spaces or hyphens)`\r\n }\r\n }}\r\n />\r\n \r\n )}\r\n\r\n {showDateOfBirth && (\r\n \r\n
Date of birth
\r\n onChange(e, { dateOfBirth: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Date of birth is required' },\r\n pattern: {\r\n value:\r\n '^(?:(?:(?:0[1-9]|1\\\\d|2[0-8])\\\\/(?:0[1-9]|1[0-2])|(?:29|30)/(?:0[13-9]|1[0-2])|31\\\\/(?:0[13578]|1[02]))\\\\/[1-9]\\\\d{3}|29\\\\/02(?:\\\\/[1-9]\\\\d(?:0[48]|[2468][048]|[13579][26])|(?:[2468][048]|[13579][26])00))$',\r\n errorMessage: 'Please enter in the format dd/mm/yyyy e.g. 09/04/1986'\r\n }\r\n }}\r\n />\r\n \r\n )}\r\n\r\n {showMembershipId && (\r\n
\r\n
\r\n onChange(e, { membershipId: e.target.value })}\r\n validate={{\r\n required: {\r\n value: true,\r\n errorMessage: 'Please enter your membership identification required by the selected plan'\r\n },\r\n minLength: { value: 3, errorMessage: 'Membership identification is not the required length' },\r\n maxLength: {\r\n value: 20,\r\n errorMessage: 'Membership identification should be 20 characters or less'\r\n }\r\n }}\r\n />\r\n
\r\n
\r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default YourDetails;\r\n","import React, { useState, useEffect } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { useAuth0 } from '../../auth/auth0-Provider.js';\r\nimport { Button } from 'reactstrap';\r\nimport { AvForm } from 'availity-reactstrap-validation';\r\n\r\nimport CustomerCommissionLogo from '../common/customerCommissionLogo';\r\nimport AgreeTerms from '../common/agreeTerms';\r\nimport QsCheckBox from '../common/qsCheckBox';\r\nimport ServerMessage from '../common/serverMessage';\r\nimport YourDetails from '../common/yourDetails';\r\nimport SubmitAgentMember from '../common/submitAgentMember.js';\r\n\r\nimport { getSessionActivity, popUp } from '../../utilities/commonUtilities';\r\nimport { setServerMessageClear, displayInfoMessage } from '../../actions/serverMessageActions';\r\nimport {\r\n submitAffiliateReferralUnauthenticated,\r\n submitAffiliateReferralWithKey,\r\n submitAffiliateReferralWithToken\r\n} from '../../actions/comparisonActions';\r\nimport * as serverMessageTargets from '../../actions/serverMessageTargets';\r\n\r\nconst AffiliateReferral = ({ agentServiceType, onClose }) => {\r\n const { staticContentUrl } = useSelector(state => state.config.applicationSettings);\r\n const { serverMessage, selectedAgent, session } = useSelector(state => state);\r\n const { emailAddress } = useSelector(state => state.user);\r\n const { mobilePhoneNumberRegex } = useSelector(state => state.config.applicationSettings.country);\r\n const { hasAgents } = useSelector(state => state.config);\r\n const { comparison } = useSelector(state => state.landing);\r\n\r\n const { getAccessToken, getAccessKey, isUserAuthenticated } = useAuth0();\r\n\r\n const [termsAndConditions, setTermsAndConditions] = useState(comparison.termsAndConditionsAccepted === true);\r\n const [agentMemberName, setAgentMemberName] = useState(selectedAgent.name ? selectedAgent.name : '');\r\n const [hasSubmitted, setHasSubmitted] = useState(false);\r\n\r\n const affiliate = agentServiceType.affiliate;\r\n const affiliateLogo = affiliate ? affiliate.affiliateLogo : null;\r\n const customerCommission = agentServiceType.agentBillType.customerCommission;\r\n const commissionType = agentServiceType.commissionType;\r\n\r\n const affiliateSettings = agentServiceType.affiliateSettings;\r\n\r\n const [selectedCollectCustomerDetails, setSelectedCollectCustomerDetails] = useState(\r\n affiliateSettings.collectCustomerDetailsDefault === true || comparison.ccd === true\r\n );\r\n const [yourDetails, setYourDetails] = useState({\r\n firstName: comparison.firstName,\r\n surname: comparison.surname,\r\n phoneNumber: comparison.mobilePhoneNumber,\r\n emailAddress\r\n });\r\n\r\n const target = serverMessageTargets.AFFILIATE_COMPARISON;\r\n\r\n const dispatch = useDispatch();\r\n\r\n useEffect(() => {\r\n dispatch(setServerMessageClear(target, serverMessage));\r\n }, []);\r\n\r\n const onComplete = data => {\r\n const exitUrl = data.exitUrl;\r\n\r\n if (!popUp(exitUrl)) {\r\n dispatch(\r\n displayInfoMessage(\r\n target,\r\n `Please press the \"${affiliate.exitButtonText}\" button again. If the problem persists, please unblock pop-ups in your browser to continue.`\r\n )\r\n );\r\n } else {\r\n onClose();\r\n }\r\n };\r\n\r\n const viewOffers = async () => {\r\n dispatch(setServerMessageClear(target, serverMessage));\r\n\r\n const sessionActivity = getSessionActivity(session);\r\n\r\n const model = {\r\n agentMemberExternalId: selectedAgent ? selectedAgent.code : null,\r\n serviceType: agentServiceType.serviceType.Id,\r\n sessionActivity,\r\n emailAddress: yourDetails.emailAddress ? yourDetails.emailAddress : emailAddress,\r\n termsAndConditions,\r\n firstName: selectedCollectCustomerDetails ? yourDetails.firstName : null,\r\n surname: selectedCollectCustomerDetails ? yourDetails.surname : null,\r\n mobilePhoneNumber: selectedCollectCustomerDetails ? yourDetails.phoneNumber : null,\r\n collectCustomerDetails: selectedCollectCustomerDetails\r\n };\r\n\r\n const accessKey = getAccessKey();\r\n const serviceType = agentServiceType.serviceType;\r\n\r\n // Prioritize accessKey first as even an authenticated user may have come in on a link, possibly for a different customer.\r\n if (accessKey) {\r\n dispatch(submitAffiliateReferralWithKey(accessKey, model, serviceType, onComplete));\r\n } else if (isUserAuthenticated()) {\r\n dispatch(submitAffiliateReferralWithToken(await getAccessToken(), model, serviceType, onComplete));\r\n } else {\r\n dispatch(submitAffiliateReferralUnauthenticated(model, serviceType, onComplete));\r\n }\r\n };\r\n\r\n const onYourDetailsChange = (e, data) => {\r\n setYourDetails({ ...yourDetails, ...data });\r\n };\r\n\r\n // --------------------------------------------------------------------------\r\n // Invalid form submit handler.\r\n // --------------------------------------------------------------------------\r\n const handleInvalidSubmit = () => {\r\n setHasSubmitted(true);\r\n };\r\n\r\n return (\r\n
Thanks for confirming your interest in solar finance.
\r\n
\r\n Please answer a few questions to get started. Our finance experts will ensure you get a sharp rate, help you\r\n avoid misleading 0% finance offers and ensure funding doesn't delay your solar project.\r\n
\r\n
\r\n
\r\n ),\r\n nextEntryCondition: () => {\r\n return true;\r\n },\r\n previousEntryCondition: () => {\r\n return true;\r\n },\r\n onNextButtonText: 'Continue',\r\n onNextFunc: onNext,\r\n hasNext: () => {\r\n return true;\r\n },\r\n hasBack: () => {\r\n return false;\r\n },\r\n hasClose: () => {\r\n return false;\r\n }\r\n };\r\n\r\n const homeLoanOptionSelector = {\r\n index: 1,\r\n wizardComplete: false,\r\n activityType: sessionActivityTypes.SOLAR_FINANCE_WIZARD_HOME_LOAN,\r\n getHeading: e => {\r\n return {\r\n title: `Interested in bundling your solar project into your home loan?`,\r\n scaleType: scaleTypes.all\r\n };\r\n },\r\n component: (\r\n \r\n ),\r\n explainer: (\r\n <>\r\n Increasing your home loan by $10,000 adds approximately $66 to your monthly repayments.\r\n \r\n \r\n If our experts find you a 0.26% interest rate reduction, you’ll also save $66 each month.\r\n {homeLoanDisclaimer ? (\r\n <>\r\n \r\n \r\n
\r\n ^ based on an interest rate of 6.24% with a comparison rate of 6.31% * based on a current a current loan\r\n balance of $400,000 over 25 years with an interest rate of 6.50% and a new rate of 6.24% with a $410,000\r\n loan on a 25 year term.\r\n
\r\n \r\n ) : (\r\n <>\r\n \r\n \r\n \r\n \r\n )}\r\n \r\n ),\r\n nextEntryCondition: () => {\r\n return true;\r\n },\r\n previousEntryCondition: () => {\r\n return true;\r\n },\r\n hasNext: () => {\r\n return false;\r\n },\r\n hasBack: () => {\r\n return true;\r\n },\r\n hasClose: () => {\r\n return true;\r\n }\r\n };\r\n\r\n // const greenLoanOptionSelector = {\r\n // index: 2,\r\n // wizardComplete: false,\r\n // activityType: sessionActivityTypes.SOLAR_FINANCE_WIZARD_GREEN_LOAN,\r\n // getHeading: e => {\r\n // return {\r\n // title: `Is a green loan important to you?`,\r\n // scaleType: scaleTypes.all\r\n // };\r\n // },\r\n // component: (\r\n // \r\n // ),\r\n // explainer:\r\n // 'Green loans may provide discounts for energy efficient homes. Comparison rates should be carefully considered when choosing these. Our experts can provide you with green loan options over the phone.',\r\n // nextEntryCondition: data => {\r\n // return data.homeLoanOption === boolTypes.YES;\r\n // },\r\n // previousEntryCondition: data => {\r\n // return data.homeLoan;\r\n // },\r\n // hasNext: () => {\r\n // return false;\r\n // },\r\n // hasBack: () => {\r\n // return true;\r\n // },\r\n // hasClose: () => {\r\n // return true;\r\n // }\r\n // };\r\n\r\n const estimatedCostSelector = {\r\n index: 2,\r\n wizardComplete: false,\r\n activityType: sessionActivityTypes.SOLAR_FINANCE_WIZARD_ESTIMATED_COST,\r\n getHeading: e => {\r\n return {\r\n title: `What's the estimated cost of your solar project?`,\r\n scaleType: scaleTypes.all\r\n };\r\n },\r\n component: (\r\n
\r\n {selectedHomeLoanOption === boolTypes.NO ? (\r\n <>\r\n We can also connect you to a personal finance expert with options from 30+ lenders.\r\n \r\n \r\n
\r\n ^ The comparison rate shown is for a secured loan amount of $30,000 over a term of 5 years based on\r\n monthly repayments. WARNING: This comparison rate is true only for the examples given. Different\r\n amounts and terms will result in different comparison rates. Costs such as redraw fees or early\r\n repayment fees, and cost savings such as fee waivers, are not included in the comparison rate but may\r\n influence the cost of the loan. Any calculations or estimations do not constitute an offer of credit\r\n or a formal credit quote and is only a calculation of what you may be able to achieve based on the\r\n information you have entered. It does not take into account suitable product features or loan product\r\n types. Rates + repayments shown are based on user inputted data. All applications for credit must be\r\n verified prior to the formal assessment process. All applications for credit approval are subject to\r\n lender credit approval. Approval is not guaranteed.\r\n
\r\n \r\n ) : (\r\n <>\r\n \r\n \r\n \r\n )}\r\n \r\n ) : (\r\n <>The cost of your solar installation may influence which finance type is best suited for you.\r\n )}\r\n
\r\n ),\r\n nextEntryCondition: data => true,\r\n previousEntryCondition: data => true,\r\n onNextButtonText: 'Next',\r\n onNextFunc: onNext,\r\n hasNext: () => {\r\n return true;\r\n },\r\n hasBack: () => {\r\n return true;\r\n },\r\n hasClose: () => {\r\n return true;\r\n }\r\n };\r\n\r\n const readyOptionSelector = {\r\n index: 3,\r\n wizardComplete: false,\r\n activityType: sessionActivityTypes.SOLAR_FINANCE_WIZARD_READY,\r\n getHeading: e => {\r\n return {\r\n title: `Are you ready to speak to an expert?`,\r\n scaleType: scaleTypes.all\r\n };\r\n },\r\n component: (\r\n \r\n ),\r\n explainer: 'We’re impartial, trustworthy and work for you!',\r\n nextEntryCondition: data => {\r\n return true;\r\n },\r\n previousEntryCondition: data => {\r\n return true;\r\n },\r\n hasNext: () => {\r\n return false;\r\n },\r\n hasBack: () => {\r\n return true;\r\n },\r\n hasClose: () => {\r\n return true;\r\n }\r\n };\r\n\r\n const whyNotOptionSelector = {\r\n index: 4,\r\n wizardComplete: false,\r\n activityType: sessionActivityTypes.SOLAR_FINANCE_WIZARD_NOT_READY,\r\n getHeading: e => {\r\n return {\r\n title: `No problem, please tell us a little more
`,\r\n scaleType: scaleTypes.all\r\n };\r\n },\r\n component: (\r\n \r\n ),\r\n explainer: '',\r\n nextEntryCondition: data => {\r\n return data.readyOption === boolTypes.NO;\r\n },\r\n previousEntryCondition: data => {\r\n return !data.ready;\r\n },\r\n hasNext: () => {\r\n return false;\r\n },\r\n hasBack: () => {\r\n return true;\r\n },\r\n hasClose: () => {\r\n return true;\r\n }\r\n };\r\n\r\n const waitingforQuotesSelector = {\r\n index: 5,\r\n wizardComplete: false,\r\n activityType: sessionActivityTypes.SOLAR_FINANCE_WIZARD_WAITING_FOR_QUOTES,\r\n getHeading: e => {\r\n return {\r\n title: `Why not get pre-approved at the same time?`,\r\n scaleType: scaleTypes.all\r\n };\r\n },\r\n component: (\r\n \r\n ),\r\n explainer: (\r\n <>\r\n We can arrange pre-approval over the phone, meaning you can be confident that your solar project is funded and\r\n ready to go.\r\n \r\n \r\n Install quotes usually take 6-7 days to arrive. Our experts usually arrange finance in 1-4 days.\r\n \r\n ),\r\n explainerFirst: true,\r\n nextEntryCondition: data => {\r\n return !data.ready && data.notReady === 1; // Waiting for quotes\r\n },\r\n previousEntryCondition: data => {\r\n return !data.ready && data.notReady === 1;\r\n },\r\n hasNext: () => {\r\n return false;\r\n },\r\n hasBack: () => {\r\n return true;\r\n },\r\n hasClose: () => {\r\n return true;\r\n }\r\n };\r\n\r\n const installerOrganisingSelector = {\r\n index: 6,\r\n wizardComplete: false,\r\n activityType: sessionActivityTypes.SOLAR_FINANCE_WIZARD_INSTALLER_ORGANISING,\r\n getHeading: e => {\r\n return {\r\n title: `We'll make sure you get the most competitive rates available`,\r\n scaleType: scaleTypes.all\r\n };\r\n },\r\n component: (\r\n \r\n ),\r\n explainer: (\r\n <>\r\n Be careful when asking solar installers to arrange finance for your hardware. They may receive kick-backs and\r\n other benefits from lenders, resulting in a bias towards certain finance products.\r\n \r\n \r\n We're happy to provide you with a second opinion. We'll check 30+ different lenders to find you a great rate\r\n that you can compare to your installers rate.\r\n \r\n ),\r\n explainerFirst: true,\r\n nextEntryCondition: data => {\r\n return !data.ready && data.notReady === 4; // Installer organising\r\n },\r\n previousEntryCondition: data => {\r\n return !data.ready && data.notReady === 4;\r\n },\r\n hasNext: () => {\r\n return false;\r\n },\r\n hasBack: () => {\r\n return true;\r\n },\r\n hasClose: () => {\r\n return true;\r\n }\r\n };\r\n\r\n const complete = {\r\n index: 7,\r\n wizardComplete: true,\r\n additionalClass: 'complete',\r\n activityType: sessionActivityTypes.SOLAR_FINANCE_WIZARD_COMPLETE,\r\n getHeading: e => {\r\n return {\r\n title: `Last question${firstName ? ` ${firstName}` : ''}`,\r\n scaleType: scaleTypes.all\r\n };\r\n },\r\n component: (\r\n
\r\n
Based on your responses we can now pass your information to the best suited solar finance expert.
\r\n
Please select the best time to contact you to discuss your options.
\r\n \r\n setSelectedCurrentSpend(\r\n e.target.value && parseFloat(e.target.value) ? parseFloat(e.target.value) : null\r\n )\r\n }\r\n validate={{\r\n number: true,\r\n min: { value: 0.01, errorMessage: 'Please enter a value above $0' },\r\n max: { value: 10000, errorMessage: 'Pleae enert a value below $10000' },\r\n pattern: {\r\n value: '^[0-9]{1,5}(\\\\.[0-9]{1,2})?$',\r\n errorMessage: `Please enter your current spend on broadband per month`\r\n },\r\n required: {\r\n value: true,\r\n errorMessage: `Please enter your current spend on broadband per month`\r\n }\r\n }}\r\n />\r\n \r\n
\r\n \r\n \r\n );\r\n};\r\n\r\nexport default SubmitBillDialogUx2;\r\n","import React from 'react';\r\n\r\n// Note: these are written to work with react-helmet. It may look like these can be done as function components but that does not work within a tag\r\n\r\nlet getGtagScript = (isLoaded, googleAdWordsId) => {\r\n var result =\r\n isLoaded && googleAdWordsId ? (\r\n \r\n ) : null;\r\n\r\n return result;\r\n};\r\n\r\nlet getGtagInitialise = (isLoaded, googleAdWordsId) => {\r\n var result =\r\n isLoaded && googleAdWordsId ? (\r\n \r\n ) : null;\r\n\r\n return result;\r\n};\r\n\r\nlet getAdWordConversionScript = (isLoaded, googleAdWordsId, adWordLabel, transactionId) => {\r\n var result =\r\n isLoaded && googleAdWordsId && adWordLabel && transactionId ? (\r\n \r\n ) : null;\r\n\r\n return result;\r\n};\r\n\r\nexport { getGtagScript, getGtagInitialise, getAdWordConversionScript };\r\n","import React from 'react';\r\n\r\n// Note: these are written to work with react-helmet. It may look like these can be done as function components but that does not work within a tag\r\n\r\nlet taboolaConversionScript = (isLoaded, taboolaId, taboolaLabel) => {\r\n var result =\r\n isLoaded && taboolaId && taboolaLabel ? (\r\n \r\n ) : null;\r\n\r\n return result;\r\n};\r\n\r\nexport { taboolaConversionScript };\r\n","import React from 'react';\r\nimport { useSelector } from 'react-redux';\r\n\r\nimport ServicesAuto from '../serviceCard/servicesAuto';\r\n\r\nconst CommonSwitchSummary = ({ serviceType, otherServices, showWhatHappensNext, showDisconnectionNotice }) => {\r\n const { whatHappensNext: whatHappensNextOffer } = useSelector(state => state.selectedOffer);\r\n const { whatHappensNextContent: whatHappensNextAutoConvert } = useSelector(state => state.comparison);\r\n\r\n const whatHappensNext = whatHappensNextOffer ?? whatHappensNextAutoConvert;\r\n\r\n const showWhatHappensNextHeading =\r\n showWhatHappensNext && whatHappensNext && whatHappensNext.toLowerCase().indexOf('what happens next') === -1;\r\n\r\n const hasWhatHappensNext = showWhatHappensNext && whatHappensNext;\r\n\r\n return (\r\n <>\r\n {otherServices ? (\r\n
\r\n tips_and_updates\r\n If you're moving from an existing property, please ensure you have contacted your existing retailer to arrange\r\n a disconnection of your existing services.\r\n
\r\n Based on the information you've provided, we've passed on your contact details to the following solar finance\r\n expert. They will be in contact with you to discuss your options.\r\n
Preparing to check your bills against the market...
\r\n )}\r\n \r\n
\r\n \r\n )}\r\n\r\n \r\n \r\n );\r\n};\r\n\r\nexport default Dashboard;\r\n","/**\n * Determine if we are in a browser\n * or a server environment\n * @type {Boolean}\n * @private\n */\nexport const IS_BROWSER =\n (typeof window === 'undefined' ? 'undefined' : typeof window) === 'object'\n\n/**\n * Default element to listen for events on\n * @type {Object}\n * @private\n */\nexport const DEFAULT_ELEMENT = IS_BROWSER ? document : {}\n\n/**\n * The default events to determine activity\n * @type {Array}\n * @private\n */\nexport const DEFAULT_EVENTS = [\n 'mousemove',\n 'keydown',\n 'wheel',\n 'DOMMouseScroll',\n 'mousewheel',\n 'mousedown',\n 'touchstart',\n 'touchmove',\n 'MSPointerDown',\n 'MSPointerMove',\n 'visibilitychange'\n]\n\n/**\n * Creates a debounced function that delays invoking func until\n * after delay milliseconds has elapsed since the last time the\n * debounced function was invoked.\n * @name debounced\n * @param {Function} fn Function to debounce\n * @param {Number} delay How long to wait\n * @return {Function} Executed Function\n * @private\n **/\nexport function debounced (fn, delay) {\n let timerId\n function result (...args) {\n if (timerId) {\n clearTimeout(timerId)\n }\n timerId = setTimeout(() => {\n fn(...args)\n timerId = null\n }, delay)\n }\n\n result.cancel = function () {\n clearTimeout(timerId)\n }\n\n return result\n}\n\n/**\n * Creates a throttled function that only invokes func at most\n * once per every wait milliseconds.\n * @name throttled\n * @param {Function} fn Function to debounce\n * @param {Number} delay How long to wait\n * @return {Function} Executed Function\n * @private\n **/\nexport function throttled (fn, delay) {\n let lastCall = 0\n return function (...args) {\n const now = new Date().getTime()\n if (now - lastCall < delay) {\n return\n }\n lastCall = now\n return fn(...args)\n }\n}\n\nlet lastMs = 0\nlet additional = 0\n\n/**\n * Returns current time in microseconds.\n *\n * @returns {Number} current time in microseconds\n * @private\n */\nexport function microSeconds () {\n const ms = new Date().getTime()\n if (ms === lastMs) {\n additional++\n return ms * 1000 + additional\n } else {\n lastMs = ms\n additional = 0\n return ms * 1000\n }\n}\n\n/**\n * Generate and return a random token.\n *\n * @returns {String} Random token.\n * @private\n */\nexport function randomToken () {\n return Math.random().toString(36).substring(2)\n}\n\n/**\n * Checks if a js object is a promise.\n *\n * @param {*} obj Any javascript object.\n * @returns {Boolean} Wether or not this object is a promise.\n */\nexport function isPromise (obj) {\n if (obj && typeof obj.then === 'function') {\n /* istanbul ignore next */\n return true\n } else {\n return false\n }\n}\n\n/**\n * Sleeps for x amount of milliseconds.\n *\n * @param {Number} time Amount of time in milliseconds.\n * @returns {Promise}\n * @private\n */\nexport function sleep (time = 0) {\n return new Promise(resolve => setTimeout(resolve, time))\n}\n\n/**\n * Get the current timestamp.\n *\n * @returns {Number}\n * @private\n */\nexport function now () {\n return new Date().getTime()\n}\n\n/**\n * Waits until the given function returns true\n * @param {function} fn\n * @return {Promise}\n */\nexport function waitUntil (fn, timeout = 0, interval = 20) {\n let timedOut = false\n let ok = false\n\n /* istanbul ignore next */\n if (timeout !== 0) {\n sleep(timeout).then(() => {\n timedOut = true\n })\n }\n\n return new Promise((resolve, reject) => {\n const runLoop = () => {\n if (ok) {\n resolve()\n return\n }\n /* istanbul ignore next */\n if (timedOut) {\n reject(new Error(`❌ waitUntil reached timeout of ${timeout}ms`))\n return\n }\n sleep(interval).then(() => {\n ok = fn()\n runLoop()\n })\n }\n runLoop()\n })\n}\n","/* eslint-env browser */\nimport { microSeconds } from '../../utils'\n\nexport const type = 'broadcastChannel'\n\nexport function create (channelName) {\n const state = {\n messagesCallback: null,\n bc: new BroadcastChannel(channelName)\n }\n\n state.bc.onmessage = msg => {\n if (state.messagesCallback) {\n state.messagesCallback(msg.data)\n }\n }\n\n return state\n}\n\nexport function close (channelState) {\n channelState.bc.close()\n}\n\nexport function postMessage (channelState, messageJson) {\n try {\n channelState.bc.postMessage(messageJson, false)\n return Promise.resolve()\n } catch (err) {\n /* istanbul ignore next */\n return Promise.reject(err)\n }\n}\n\nexport function onMessage (channelState, fn) {\n channelState.messagesCallback = fn\n}\n\nexport function canBeUsed () {\n if (typeof BroadcastChannel === 'function') {\n return true\n } else {\n /* istanbul ignore next */\n return false\n }\n}\n\nexport function averageResponseTime () {\n return 150\n}\n\nexport default {\n create,\n close,\n onMessage,\n postMessage,\n canBeUsed,\n type,\n averageResponseTime,\n microSeconds\n}\n","import { now } from '../utils'\n\nexport default class ObliviousSet {\n constructor (ttl = 1000 * 60) {\n this.ttl = ttl\n this.set = new Set()\n this.timeMap = new Map()\n }\n\n has (value) {\n return this.set.has(value)\n }\n\n add (value) {\n this.timeMap.set(value, now())\n this.set.add(value)\n this._removeTooOldValues()\n }\n\n clear () {\n this.set.clear()\n this.timeMap.clear()\n }\n\n _removeTooOldValues () {\n const olderThen = now() - this.ttl\n const iterator = this.set[Symbol.iterator]()\n\n while (true) {\n const value = iterator.next().value\n if (!value) return // no more elements\n const time = this.timeMap.get(value)\n if (time < olderThen) {\n this.timeMap.delete(value)\n this.set.delete(value)\n } else {\n // We reached a value that is not old enough\n return\n }\n }\n }\n}\n","import ObliviousSet from '../ObliviousSet'\n\nimport {\n randomToken,\n microSeconds\n} from '../../utils'\n\nexport const type = 'localStorage'\n\n/**\n * Returns local storage instance\n */\nexport function getLocalStorage () {\n let localStorage\n if (typeof window === 'undefined') return null\n try {\n localStorage = window.localStorage\n localStorage = window['ie8-eventlistener/storage'] || window.localStorage\n } catch (e) {\n // New versions of Firefox throw a Security exception\n // if cookies are disabled. See\n // https://bugzilla.mozilla.org/show_bug.cgi?id=1028153\n }\n return localStorage\n}\n\nexport function storageKey (channelName) {\n return channelName\n}\n\n/**\n* writes the new message to the storage\n* and fires the storage-event so other readers can find it\n*/\nexport function postMessage (channelState, messageJson) {\n return new Promise(resolve => {\n const key = storageKey(channelState.channelName)\n const writeObj = {\n token: randomToken(),\n time: new Date().getTime(),\n data: messageJson,\n uuid: channelState.uuid\n }\n const value = JSON.stringify(writeObj)\n getLocalStorage().setItem(key, value)\n\n /**\n * StorageEvent does not fire the 'storage' event\n * in the window that changes the state of the local storage.\n * So we fire it manually\n */\n const ev = document.createEvent('Event')\n ev.initEvent('storage', true, true)\n ev.key = key\n ev.newValue = value\n window.dispatchEvent(ev)\n\n resolve()\n })\n}\n\nexport function addStorageEventListener (channelName, fn) {\n const key = storageKey(channelName)\n const listener = ev => {\n if (ev.key === key) {\n fn(JSON.parse(ev.newValue))\n }\n }\n window.addEventListener('storage', listener)\n return listener\n}\nexport function removeStorageEventListener (listener) {\n window.removeEventListener('storage', listener)\n}\n\nexport function create (channelName, options = {}) {\n if (!canBeUsed()) {\n /* istanbul ignore next */\n throw new Error('❌ localStorage cannot be used.')\n }\n\n const uuid = randomToken()\n\n /**\n * eMIs\n * contains all messages that have been emitted before\n * @type {ObliviousSet}\n */\n const eMIs = new ObliviousSet(options.removeTimeout)\n\n const state = {\n channelName,\n uuid,\n eMIs // emittedMessagesIds\n }\n\n state.listener = addStorageEventListener(\n channelName,\n (msgObj) => {\n if (!state.messagesCallback) return // no listener\n if (msgObj.uuid === uuid) return // own message\n if (!msgObj.token || eMIs.has(msgObj.token)) return // already emitted\n if (msgObj.data.time && msgObj.data.time < state.messagesCallbackTime) return // too old\n\n eMIs.add(msgObj.token)\n state.messagesCallback(msgObj.data)\n }\n )\n\n return state\n}\n\nexport function close (channelState) {\n removeStorageEventListener(channelState.listener)\n}\n\nexport function onMessage (channelState, fn, time) {\n channelState.messagesCallbackTime = time\n channelState.messagesCallback = fn\n}\n\nexport function canBeUsed () {\n const ls = getLocalStorage()\n\n if (!ls) return false\n\n try {\n const key = '__check'\n ls.setItem(key, 'works')\n ls.removeItem(key)\n } catch (e) {\n // Safari 10 in private mode will not allow write access to local\n // storage and fail with a QuotaExceededError. See\n // https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API#Private_Browsing_Incognito_modes\n\n /* istanbul ignore next */\n return false\n }\n\n return true\n}\n\n/* istanbul ignore next */\nexport function averageResponseTime () {\n const defaultTime = 120\n const userAgent = navigator.userAgent.toLowerCase()\n if (userAgent.includes('safari') && !userAgent.includes('chrome')) {\n // safari is much slower so this time is higher\n return defaultTime * 2\n }\n return defaultTime\n}\n\nexport default {\n create,\n close,\n onMessage,\n postMessage,\n canBeUsed,\n type,\n averageResponseTime,\n microSeconds\n}\n","import { microSeconds } from '../../utils'\n\nexport const type = 'simulate'\n\nconst SIMULATE_CHANNELS = new Set()\n\nexport function create (channelName) {\n const state = {\n name: channelName,\n messagesCallback: null\n }\n SIMULATE_CHANNELS.add(state)\n\n return state\n}\n\nexport function close (channelState) {\n SIMULATE_CHANNELS.delete(channelState)\n}\n\nexport function postMessage (channelState, messageJson) {\n return new Promise(resolve => setTimeout(() => {\n const channelArray = Array.from(SIMULATE_CHANNELS)\n channelArray\n .filter(channel => channel.name === channelState.name)\n .filter(channel => channel !== channelState)\n .filter(channel => !!channel.messagesCallback)\n .forEach(channel => channel.messagesCallback(messageJson))\n resolve()\n }, 5))\n}\n\nexport function onMessage (channelState, fn) {\n channelState.messagesCallback = fn\n}\n\n/* istanbul ignore next */\nexport function canBeUsed () {\n return true\n}\n\n/* istanbul ignore next */\nexport function averageResponseTime () {\n return 5\n}\n\nexport default {\n create,\n close,\n onMessage,\n postMessage,\n canBeUsed,\n type,\n averageResponseTime,\n microSeconds\n}\n","import BroadcastChannelMethod from './methods/broadcastChannel'\nimport LocalStorageMethod from './methods/localStorage'\nimport SimulateMethod from './methods/simulate'\n\n// Order is important\nconst METHODS = [\n BroadcastChannelMethod,\n LocalStorageMethod\n]\n\nexport function chooseMethod (options = {}) {\n if (options.type) {\n // For testing\n if (options.type === 'simulate') {\n return SimulateMethod\n }\n\n // Chosen type\n const method = METHODS.find(m => m.type === options.type)\n if (!method) throw new Error(`❌ Method ${options.type} is not supported.`)\n else return method\n }\n\n const useMethod = METHODS.find(method => method.canBeUsed())\n\n /* istanbul ignore next */\n if (!useMethod) {\n throw new Error(`❌ No method found ${JSON.stringify(METHODS.map(m => m.type))}`)\n }\n return useMethod\n}\n","import { chooseMethod } from './methodChooser'\nimport { isPromise } from '../utils'\n\nexport class MessageChannel {\n constructor (name, options = {}) {\n this.name = name\n this.options = options\n this.method = chooseMethod(this.options)\n this.closed = false\n\n // isListening\n this._isListening = false\n\n /**\n * _onMessageListener\n * setting onmessage twice,\n * will overwrite the first listener\n */\n this._onMessageListener = null\n\n /**\n * _addEventListeners\n */\n this._addEventListeners = {\n message: [],\n internal: []\n }\n\n /**\n * Un send message promises\n * where the sending is still in progress\n * @type {Set}\n */\n this._unSendMessagePromises = new Set()\n\n /**\n * _beforeClose\n * array of promises that will be awaited\n * before the channel is closed\n */\n this._beforeClose = []\n\n /**\n * _preparePromise\n */\n this._preparePromises = null\n _prepareChannel(this)\n }\n\n postMessage (msg) {\n if (this.closed) {\n throw new Error(\n '❌ Cannot post message after channel has closed'\n )\n }\n return _post(this, 'message', msg)\n }\n\n postInternal (msg) {\n return _post(this, 'internal', msg)\n }\n\n set onmessage (fn) {\n const time = this.method.microSeconds()\n const listenObj = {\n time,\n fn\n }\n _removeListenerObject(this, 'message', this._onMessageListener)\n if (fn && typeof fn === 'function') {\n this._onMessageListener = listenObj\n _addListenerObject(this, 'message', listenObj)\n } else {\n /* istanbul ignore next */\n this._onMessageListener = null\n }\n }\n\n /* istanbul ignore next */\n get onmessage () {\n return this._onMessageListener\n }\n\n addEventListener (type, fn) {\n const time = this.method.microSeconds()\n const listenObj = {\n time,\n fn\n }\n _addListenerObject(this, type, listenObj)\n }\n\n removeEventListener (type, fn) {\n const obj = this._addEventListeners[type].find(obj => obj.fn === fn)\n _removeListenerObject(this, type, obj)\n }\n\n close () {\n if (this.closed) {\n return\n }\n this.closed = true\n const awaitPrepare = this._preparePromises ? this._preparePromises : Promise.resolve()\n\n this._onMessageListener = null\n this._addEventListeners.message = []\n\n return awaitPrepare\n // Wait until all current sending are processed\n .then(() => Promise.all(Array.from(this._unSendMessagePromises)))\n // Run before-close hooks\n .then(() => Promise.all(this._beforeClose.map(fn => fn())))\n // Close the channel\n .then(() => this.method.close(this._state))\n }\n\n get type () {\n return this.method.type\n }\n\n isClosed () {\n return this.closed\n }\n}\n\nfunction _post (messageChannel, type, msg) {\n const time = messageChannel.method.microSeconds()\n const msgObj = {\n time,\n type,\n data: msg\n }\n\n const awaitPrepare = messageChannel._preparePromises ? messageChannel._preparePromises : Promise.resolve()\n return awaitPrepare.then(() => {\n const sendPromise = messageChannel.method.postMessage(\n messageChannel._state,\n msgObj\n )\n\n // add/remove to un-send messages list\n messageChannel._unSendMessagePromises.add(sendPromise)\n sendPromise\n .catch()\n .then(() => messageChannel._unSendMessagePromises.delete(sendPromise))\n\n return sendPromise\n })\n}\n\nfunction _prepareChannel (channel) {\n const maybePromise = channel.method.create(channel.name, channel.options)\n /* istanbul ignore next */\n if (isPromise(maybePromise)) {\n channel._preparePromises = maybePromise\n maybePromise.then(s => {\n channel._state = s\n })\n } else {\n channel._state = maybePromise\n }\n}\n\nfunction _hasMessageListeners (channel) {\n if (channel._addEventListeners.message.length > 0) return true\n if (channel._addEventListeners.internal.length > 0) return true\n return false\n}\n\nfunction _addListenerObject (channel, type, obj) {\n channel._addEventListeners[type].push(obj)\n _startListening(channel)\n}\n\nfunction _removeListenerObject (channel, type, obj) {\n channel._addEventListeners[type] = channel._addEventListeners[type].filter(o => o !== obj)\n _stopListening(channel)\n}\n\nfunction _startListening (channel) {\n if (!channel._isListening && _hasMessageListeners(channel)) {\n // someone is listening, start subscribing\n\n const listenerFn = msgObj => {\n channel._addEventListeners[msgObj.type].forEach(obj => {\n if (msgObj.time >= obj.time) {\n obj.fn(msgObj.data)\n }\n })\n }\n\n const time = channel.method.microSeconds()\n if (channel._preparePromises) {\n /* istanbul ignore next */\n channel._preparePromises.then(() => {\n channel._isListening = true\n channel.method.onMessage(\n channel._state,\n listenerFn,\n time\n )\n })\n } else {\n channel._isListening = true\n channel.method.onMessage(\n channel._state,\n listenerFn,\n time\n )\n }\n }\n}\n\nfunction _stopListening (channel) {\n if (channel._isListening && !_hasMessageListeners(channel)) {\n // no one is listening, stop subscribing\n channel._isListening = false\n const time = channel.method.microSeconds()\n channel.method.onMessage(\n channel._state,\n null,\n time\n )\n }\n}\n","import { IS_BROWSER, sleep, randomToken } from '../utils'\n\nclass LeaderElection {\n constructor (channel, options) {\n this._channel = channel\n this._options = options\n\n this.isLeader = false\n this.isDead = false\n this.token = randomToken()\n\n this._isApplying = false\n this._reApply = false\n\n // things to clean up\n this._unloadFns = []\n this._listeners = []\n this._intervals = []\n this._duplicateListeners = () => { }\n this._duplicateCalled = false\n this._onBeforeDie = async () => {}\n\n const unloadFn = async () => this.die()\n\n if (IS_BROWSER) {\n window.addEventListener('beforeUnload', unloadFn)\n window.addEventListener('unload', unloadFn)\n\n this._unloadFns.push(['beforeUnload', unloadFn])\n this._unloadFns.push(['unload', unloadFn])\n }\n }\n\n applyOnce () {\n if (this.isLeader) return Promise.resolve(false)\n if (this.isDead) return Promise.resolve(false)\n\n // do nothing if already running\n if (this._isApplying) {\n this._reApply = true\n return Promise.resolve(false)\n }\n this._isApplying = true\n\n let stopCriteria = false\n const received = []\n\n const handleMessage = (msg) => {\n if (msg.context === 'leader' && msg.token !== this.token) {\n received.push(msg)\n\n if (msg.action === 'apply') {\n // Other is applying\n if (msg.token > this.token) {\n // Other has higher token, stop applying\n stopCriteria = true\n }\n }\n\n if (msg.action === 'tell') {\n // Other is already leader\n stopCriteria = true\n }\n }\n }\n this._channel.addEventListener('internal', handleMessage)\n\n return _sendMessage(this, 'apply') // send out that this one is applying\n .then(() => sleep(this._options.responseTime)) // let others time to respond\n .then(() => {\n if (stopCriteria) return Promise.reject(new Error())\n else return _sendMessage(this, 'apply')\n })\n .then(() => sleep(this._options.responseTime)) // let others time to respond\n .then(() => {\n if (stopCriteria) return Promise.reject(new Error())\n else return _sendMessage(this)\n })\n .then(() => beLeader(this)) // no one disagreed -> this one is now leader\n .then(() => true)\n .catch(() => false) // apply not successful\n .then(success => {\n this._channel.removeEventListener('internal', handleMessage)\n this._isApplying = false\n if (!success && this._reApply) {\n this._reApply = false\n return this.applyOnce()\n } else return success\n })\n }\n\n awaitLeadership () {\n if (\n !this._awaitLeadershipPromise\n ) {\n this._awaitLeadershipPromise = _awaitLeadershipOnce(this)\n }\n return this._awaitLeadershipPromise\n }\n\n set onDuplicate (fn) {\n this._duplicateListeners = fn\n }\n\n /* istanbul ignore next */\n get onDuplicate () {\n return this._duplicateListeners\n }\n\n set onBeforeDie (fn) {\n this._onBeforeDie = fn\n }\n\n /* istanbul ignore next */\n get onBeforeDie () {\n return this._onBeforeDie\n }\n\n async die () {\n if (this.isDead) return\n this.isDead = true\n\n await this.onBeforeDie()\n this._listeners.forEach(listener => this._channel.removeEventListener('internal', listener))\n this._intervals.forEach(interval => clearInterval(interval))\n this._unloadFns.forEach(uFn => {\n if (IS_BROWSER) {\n window.removeEventListener(uFn[0], uFn[1])\n }\n })\n return _sendMessage(this, 'death')\n }\n}\n\nfunction _awaitLeadershipOnce (leaderElector) {\n if (leaderElector.isLeader) return Promise.resolve()\n\n return new Promise(resolve => {\n let resolved = false\n\n function finish () {\n /* istanbul ignore next */\n if (resolved) {\n return\n }\n resolved = true\n clearInterval(interval)\n leaderElector._channel.removeEventListener('internal', whenDeathListener)\n resolve(true)\n }\n\n // try once now\n leaderElector.applyOnce().then(() => {\n if (leaderElector.isLeader) {\n finish()\n }\n })\n\n // try on fallbackInterval\n const interval = setInterval(() => {\n /* istanbul ignore next */\n leaderElector.applyOnce().then(() => {\n if (leaderElector.isLeader) {\n finish()\n }\n })\n }, leaderElector._options.fallbackInterval)\n leaderElector._intervals.push(interval)\n\n // try when other leader dies\n const whenDeathListener = msg => {\n if (msg.context === 'leader' && msg.action === 'death') {\n leaderElector.applyOnce().then(() => {\n if (leaderElector.isLeader) finish()\n })\n }\n }\n leaderElector._channel.addEventListener('internal', whenDeathListener)\n leaderElector._listeners.push(whenDeathListener)\n })\n}\n\n/**\n * Sends and internal message over the broadcast-channel\n */\nfunction _sendMessage (leaderElector, action) {\n const msgJson = {\n context: 'leader',\n action,\n token: leaderElector.token\n }\n return leaderElector._channel.postInternal(msgJson)\n}\n\nexport function beLeader (leaderElector) {\n leaderElector.isLeader = true\n\n const isLeaderListener = msg => {\n if (msg.context === 'leader' && msg.action === 'apply') {\n _sendMessage(leaderElector, 'tell')\n }\n\n if (msg.context === 'leader' && msg.action === 'tell' && !leaderElector._duplicateCalled) {\n /**\n * Another instance is also leader!\n * This can happen on rare events\n * like when the CPU is at 100% for long time\n * or the tabs are open very long and the browser throttles them.\n */\n leaderElector._duplicateCalled = true\n leaderElector._duplicateListeners() // message the lib user so the app can handle the problem\n _sendMessage(leaderElector, 'tell') // ensure other leader also knows the problem\n }\n }\n leaderElector._channel.addEventListener('internal', isLeaderListener)\n leaderElector._listeners.push(isLeaderListener)\n return _sendMessage(leaderElector, 'tell')\n}\n\nexport function createLeaderElection (channel, options) {\n if (channel._leaderElector) {\n throw new Error('❌ MessageChannel already has a leader-elector')\n }\n\n const elector = new LeaderElection(channel, options)\n channel._beforeClose.push(async () => elector.die())\n\n channel._leaderElector = elector\n return elector\n}\n","import { MessageChannel, createLeaderElection } from './MessageChannel'\nexport const TabManager = ({\n type,\n channelName,\n fallbackInterval,\n responseTime,\n emitOnAllTabs,\n callbacks,\n start,\n reset,\n pause,\n resume\n}) => {\n const channel = new MessageChannel(channelName, { type })\n const elector = createLeaderElection(channel, { fallbackInterval, responseTime })\n const registry = {}\n\n // Register self\n registry[elector.token] = false\n\n let leader = false\n let allIdle = true\n\n const isLeader = () => leader\n\n elector.awaitLeadership().then(() => {\n leader = true\n })\n\n channel.addEventListener('message', ([type, id]) => {\n switch (type) {\n case 'register':\n registry[id] = false\n break\n case 'deregister':\n delete registry[id]\n break\n case 'idle':\n idle(id)\n break\n case 'active':\n active(id)\n break\n case 'emitIdle':\n callbacks.onIdle()\n break\n case 'emitActive':\n callbacks.onActive()\n break\n case 'start':\n start(true)\n break\n case 'reset':\n reset(true)\n break\n case 'pause':\n pause(true)\n break\n case 'resume':\n resume(true)\n break\n default:\n // no op\n }\n })\n\n const setAllIdle = bool => {\n allIdle = bool\n }\n\n const isAllIdle = () => allIdle\n\n const idle = (id = elector.token) => {\n registry[id] = true\n const isIdle = Object.values(registry).every(v => v)\n if (!allIdle && isIdle) {\n allIdle = true\n if (isLeader()) {\n callbacks.onIdle()\n if (emitOnAllTabs) send('emitIdle')\n } else {\n send('idle')\n }\n }\n }\n\n const active = (id = elector.token) => {\n registry[id] = false\n const isActive = Object.values(registry).some(v => !v)\n if (allIdle && isActive) {\n allIdle = false\n if (isLeader()) {\n callbacks.onActive()\n if (emitOnAllTabs) send('emitActive')\n } else {\n send('active')\n }\n }\n }\n\n /* istanbul ignore next */\n elector.onDuplicate = async () => await elector.die()\n elector.onBeforeDie = async () => await send('deregister')\n\n const send = async message => channel.postMessage([message, elector.token])\n\n const close = async () => {\n await elector.die()\n await channel.close()\n }\n\n // Register self with remote tabs\n send('register')\n\n return { close, send, isLeader, idle, active, isAllIdle, setAllIdle }\n}\n","/**\n * ___ _ _ _____ _\n * |_ _|__| | | __|_ _(_)_ __ ___ ___ _ __\n * | |/ _` | |/ _ \\| | | | '_ ` _ \\ / _ \\ '__|\n * | | (_| | | __/| | | | | | | | | __/ |\n * |___\\__,_|_|\\___||_| |_|_| |_| |_|\\___|_|\n *\n * @name IdleTimer\n * @author Randy Lebeau\n * @private\n */\n\nimport { Component } from 'react'\nimport PropTypes from 'prop-types'\nimport { TabManager } from './TabManager'\nimport { IS_BROWSER, DEFAULT_ELEMENT, DEFAULT_EVENTS, debounced, throttled } from './utils'\n\n/**\n * Detects when your user is idle\n * @class IdleTimer\n * @private\n */\nclass IdleTimer extends Component {\n /**\n * Creates an instance of IdleTimer\n * bind all of our internal events here\n * for best performance\n * @param {Object} props\n * @return {IdleTimer}\n * @private\n */\n constructor (props) {\n super(props)\n\n /**\n * Sets initial component state\n * @type {Object}\n * @private\n */\n this.state = {\n idle: false,\n oldDate: +new Date(),\n lastActive: +new Date(),\n lastIdle: null,\n idleTime: 0,\n remaining: null,\n pageX: null,\n pageY: null\n }\n\n /**\n * The timer instance\n * @type {Timeout}\n * @private\n */\n this.tId = null\n\n /**\n * Wether or not events are bound\n * @type {boolean}\n * @private\n */\n this.eventsBound = false\n\n this.callbackRefs = {}\n\n // Debounce and throttle can't both be set\n if (props.debounce > 0 && props.throttle > 0) {\n throw new Error('onAction can either be throttled or debounced (not both)')\n }\n\n // Create debounced action if applicable\n if (props.debounce > 0) {\n this._onAction = debounced(props.onAction, props.debounce)\n\n // Create throttled action if applicable\n } else if (props.throttle > 0) {\n this._onAction = throttled(props.onAction, props.throttle)\n\n // Set custom onAction\n } else {\n this._onAction = props.onAction\n }\n\n // Create a throttle event handler if applicable\n if (props.eventsThrottle > 0) {\n this.handleEvent = throttled(this._handleEvent.bind(this), props.eventsThrottle)\n } else {\n this.handleEvent = this._handleEvent.bind(this)\n }\n\n // If startOnMount is set, idle state defaults to true\n if (!props.startOnMount || props.startManually) {\n this.state.idle = true\n }\n\n // Bind all events to component scope, built for speed 🚀\n this._toggleIdleState = this._toggleIdleState.bind(this)\n this.start = this.start.bind(this)\n this.reset = this.reset.bind(this)\n this.pause = this.pause.bind(this)\n this.resume = this.resume.bind(this)\n this.isIdle = this.isIdle.bind(this)\n this.getRemainingTime = this.getRemainingTime.bind(this)\n this.getElapsedTime = this.getElapsedTime.bind(this)\n this.getLastActiveTime = this.getLastActiveTime.bind(this)\n this.getLastIdleTime = this.getLastIdleTime.bind(this)\n this.getTotalIdleTime = this.getTotalIdleTime.bind(this)\n this.getTotalActiveTime = this.getTotalActiveTime.bind(this)\n }\n\n /**\n * Runs once the component has mounted\n * here we handle automatically starting\n * the idletimer\n * @private\n */\n componentDidMount () {\n const { startOnMount, startManually } = this.props\n\n // Set up cross tab\n this._setupTabManager()\n\n if (startManually) return\n if (startOnMount) {\n this.start()\n } else {\n this._bindEvents()\n }\n }\n\n componentDidUpdate (prevProps) {\n // Update debounce function\n if ((prevProps.debounce !== this.props.debounce) && this.props.debounce > 0) {\n if (this._onAction.cancel) this._onAction.cancel()\n this._onAction = debounced(this.props.onAction, this.props.debounce)\n } else\n // Update throttle function\n if ((prevProps.throttle !== this.props.throttle) && this.props.throttle > 0) {\n if (this._onAction.cancel) this._onAction.cancel()\n this._onAction = throttled(this.props.onAction, this.props.throttle)\n } else\n // Remove throttle or debounce\n if (\n (prevProps.throttle && this.props.throttle === 0) ||\n (prevProps.debounce && this.props.debounce === 0)\n ) {\n if (this._onAction.cancel) this._onAction.cancel()\n this._onAction = this.props.onAction\n }\n\n // Update event throttle function\n if (prevProps.eventsThrottle !== this.props.eventsThrottle) {\n this._unbindEvents()\n this.handleEvent = throttled(this._handleEvent.bind(this), this.props.eventsThrottle)\n this._bindEvents()\n }\n // Update timeout value\n if (prevProps.timeout !== this.props.timeout) {\n if (this.state.idle) this.reset()\n }\n\n // Update callback refs\n if (prevProps.onActive !== this.props.onActive) this.callbackRefs.onActive = this.props.onActive\n if (prevProps.onIdle !== this.props.onIdle) this.callbackRefs.onIdle = this.props.onIdle\n }\n\n /**\n * Called before the component un-mounts\n * here we clear the timer and remove\n * all the event listeners\n * @private\n */\n componentWillUnmount () {\n // Clear timeout to prevent delayed state changes\n clearTimeout(this.tId)\n this._unbindEvents(true)\n // Cancel any debounced onAction handlers\n if (this._onAction.cancel) this._onAction.cancel()\n /* istanbul ignore next */\n if (this.manager) {\n this.manager.close().catch(console.error)\n }\n }\n\n /**\n * Render children if IdleTimer is used as a wrapper\n * @return {Component} children\n * @private\n */\n render () {\n const { children } = this.props\n return children || null\n }\n\n /**\n * Setup the Tab Manager.\n * @private\n */\n _setupTabManager () {\n const { crossTab, onIdle, onActive } = this.props\n this.callbackRefs = { onIdle, onActive }\n\n /* istanbul ignore next */\n if (crossTab) {\n const {\n type,\n channelName,\n fallbackInterval,\n responseTime,\n emitOnAllTabs\n } = Object.assign({\n channelName: 'idle-timer',\n fallbackInterval: 2000,\n responseTime: 100,\n removeTimeout: 1000 * 60,\n emitOnAllTabs: false\n }, crossTab === true ? {} : crossTab)\n\n this.manager = TabManager({\n type,\n channelName,\n fallbackInterval,\n responseTime,\n emitOnAllTabs,\n callbacks: this.callbackRefs,\n start: this.start,\n reset: this.reset,\n pause: this.pause,\n resume: this.resume\n })\n }\n }\n\n /**\n * Binds the specified events\n * @private\n */\n _bindEvents () {\n // Don't bind events if\n // we are not in a browser\n if (!IS_BROWSER) return\n // Otherwise we bind all the events\n // to the supplied element\n const { element, events, passive, capture } = this.props\n if (!this.eventsBound) {\n events.forEach(e => {\n element.addEventListener(e, this.handleEvent, {\n capture,\n passive\n })\n })\n this.eventsBound = true\n }\n }\n\n /**\n * Unbinds all the bound events\n * @private\n */\n _unbindEvents (force = false) {\n // If we are not in a browser\n // we don't need to unbind events\n if (!IS_BROWSER) return\n // Unbind all events\n const { element, events, passive, capture } = this.props\n if (this.eventsBound || force) {\n events.forEach(e => {\n element.removeEventListener(e, this.handleEvent, {\n capture,\n passive\n })\n })\n this.eventsBound = false\n }\n }\n\n /**\n * Toggles the idle state and calls\n * the correct action function\n * @private\n */\n _toggleIdleState (e) {\n // Fire the appropriate action\n // and pass the event through\n // Toggle the idle state\n this.setState((prevState) => ({\n idle: !prevState.idle,\n lastIdle: !prevState.idle ? (+new Date()) - this.props.timeout : prevState.lastIdle,\n idleTime: prevState.idle ? prevState.idleTime + (+new Date()) - prevState.lastIdle : prevState.idleTime\n }), () => {\n const { onActive, onIdle, stopOnIdle } = this.props\n const { idle } = this.state\n if (idle) {\n if (stopOnIdle) {\n // Clear any existing timeout\n clearTimeout(this.tId)\n this.tId = null\n // Unbind events\n this._unbindEvents()\n }\n\n if (this.manager) {\n /* istanbul ignore next */\n this.manager.idle()\n } else {\n onIdle(e)\n }\n } else {\n this._bindEvents()\n if (this.manager) {\n /* istanbul ignore next */\n this.manager.active()\n } else {\n onActive(e)\n }\n }\n })\n }\n\n /**\n * Event handler for supported event types\n * @param {Object} e event object\n * @private\n */\n _handleEvent (e) {\n const { remaining, pageX, pageY, idle } = this.state\n const { timeout, stopOnIdle } = this.props\n\n // Fire onAction event\n this._onAction(e)\n\n // Already active, ignore events\n if (remaining) return\n\n // Mousemove event\n if (e.type === 'mousemove') {\n // If coords are same, it didn't move\n /* istanbul ignore next */\n if (e.pageX === pageX && e.pageY === pageY) {\n return\n }\n // If coords don't exist how could it move\n if (typeof e.pageX === 'undefined' && typeof e.pageY === 'undefined') {\n return\n }\n // Under 200 ms is hard to do\n // continuous activity will bypass this\n /* istanbul ignore next */\n const elapsed = this.getElapsedTime()\n /* istanbul ignore next */\n if (elapsed < 200) {\n return\n }\n }\n\n // Clear any existing timeout\n clearTimeout(this.tId)\n this.tId = null\n\n // Determine last time User was active, as can't rely on setTimeout ticking at the correct interval\n const elapsedTimeSinceLastActive = +new Date() - this.getLastActiveTime()\n\n // If the user is idle or last active time is more than timeout, flip the idle state\n if ((idle && !stopOnIdle) || (!idle && elapsedTimeSinceLastActive > timeout)) {\n this._toggleIdleState(e)\n }\n\n // Store when the user was last active\n // and update the mouse coordinates\n this.setState({\n lastActive: +new Date(),\n pageX: e.pageX,\n pageY: e.pageY\n })\n\n // If the user is idle and stopOnIdle flag is not set\n // set a new timeout\n if (idle) {\n if (!stopOnIdle) {\n this.tId = setTimeout(this._toggleIdleState, timeout)\n }\n } else {\n this.tId = setTimeout(this._toggleIdleState, timeout)\n }\n }\n\n /**\n * Set initial state and start timer\n * @name start\n */\n start (remote = true) {\n // Clear timeout\n clearTimeout(this.tId)\n this.tId = null\n\n // Bind the events\n this._bindEvents()\n\n // Reset state\n this.setState({\n idle: false,\n oldDate: +new Date(),\n lastActive: +new Date(),\n remaining: null\n })\n\n if (this.manager) {\n /* istanbul ignore next */\n this.manager.setAllIdle(false)\n /* istanbul ignore next */\n if (!remote && this.props.crossTab.emitOnAllTabs) {\n this.manager.send('start')\n }\n }\n\n // Set new timeout\n const { timeout } = this.props\n this.tId = setTimeout(this._toggleIdleState, timeout)\n }\n\n /**\n * Restore initial state and restart timer, calling onActive\n * @name reset\n */\n reset (remote = false) {\n // Clear timeout\n clearTimeout(this.tId)\n this.tId = null\n\n // Bind the events\n this._bindEvents()\n\n if (this.state.idle) {\n if (this.manager) {\n /* istanbul ignore next */\n this.manager.active()\n } else {\n this.props.onActive()\n }\n }\n\n if (this.manager) {\n /* istanbul ignore next */\n this.manager.setAllIdle(false)\n /* istanbul ignore next */\n if (!remote && this.props.crossTab.emitOnAllTabs) {\n this.manager.send('reset')\n }\n }\n\n // Reset state\n this.setState({\n idle: false,\n oldDate: +new Date(),\n lastActive: +new Date(),\n remaining: null\n })\n\n // Set new timeout\n const { timeout } = this.props\n this.tId = setTimeout(this._toggleIdleState, timeout)\n }\n\n /**\n * Store remaining time and stop timer\n * @name pause\n */\n pause (remote = false) {\n // Timer is already paused\n const { remaining } = this.state\n if (remaining !== null) return\n\n // Unbind events\n this._unbindEvents()\n\n // Clear existing timeout\n clearTimeout(this.tId)\n this.tId = null\n\n // Send event to other tabs\n if (this.manager) {\n /* istanbul ignore next */\n if (!remote && this.props.crossTab.emitOnAllTabs) {\n this.manager.send('pause')\n }\n }\n\n // Define how much is left on the timer\n this.setState({\n remaining: this.getRemainingTime()\n })\n }\n\n /**\n * Resumes a paused timer\n * @name resume\n */\n resume (remote = false) {\n // Timer is not paused\n const { remaining, idle } = this.state\n if (remaining === null) return\n\n // Bind events\n this._bindEvents()\n\n // Send event to other tabs\n if (this.manager) {\n /* istanbul ignore next */\n if (!remote && this.props.crossTab.emitOnAllTabs) {\n this.manager.send('resume')\n }\n }\n\n // Start timer and clear remaining\n // if we are in the active state\n if (!idle) {\n // Set a new timeout\n this.tId = setTimeout(this._toggleIdleState, remaining)\n // Set new state\n this.setState({ remaining: null, lastActive: +new Date() })\n }\n }\n\n /**\n * Time remaining before idle\n * @name getRemainingTime\n * @return {number} Milliseconds remaining\n */\n getRemainingTime () {\n const { remaining, lastActive } = this.state\n const { timeout } = this.props\n\n // If idle there is no time remaining\n if (remaining !== null) {\n return remaining < 0 ? 0 : remaining\n }\n\n // Determine remaining, if negative idle didn't finish flipping, just return 0\n const timeLeft = timeout - ((+new Date()) - lastActive)\n return timeLeft < 0 ? 0 : timeLeft\n }\n\n /**\n * How much time has elapsed\n * @name getElapsedTime\n * @return {Timestamp}\n */\n getElapsedTime () {\n const { oldDate } = this.state\n return (+new Date()) - oldDate\n }\n\n /**\n * Last time the user was idle\n * @name getLastIdleTime\n * @return {Timestamp}\n */\n getLastIdleTime () {\n const { lastIdle } = this.state\n return lastIdle\n }\n\n /**\n * Total time the user was idle\n * @name getTotalIdleTime\n * @return {number}\n */\n getTotalIdleTime () {\n const { idle, lastIdle, idleTime } = this.state\n if (idle) {\n return ((+new Date()) - lastIdle) + idleTime\n } else {\n return idleTime\n }\n }\n\n /**\n * Last time the user was active\n * @name getLastActiveTime\n * @return {Timestamp}\n */\n getLastActiveTime () {\n const { lastActive } = this.state\n return lastActive\n }\n\n /**\n * Total time the user was active\n * @name getTotalActiveTime\n * @return {number}\n */\n getTotalActiveTime () {\n return this.getElapsedTime() - this.getTotalIdleTime()\n }\n\n /**\n * Returns wether or not the user is idle\n * @name isIdle\n * @return {boolean}\n */\n isIdle () {\n const { idle } = this.state\n return idle\n }\n\n /**\n * Returns wether or not this is the leader tab\n * @name isLeader\n * @return {boolean}\n */\n isLeader () {\n return this.manager ? this.manager.isLeader() : true\n }\n}\n\n/**\n * Type checks for every property\n * @type {Object}\n * @private\n */\nIdleTimer.propTypes = {\n /**\n * Activity Timeout in milliseconds\n * default: 1200000\n * @type {Number}\n */\n timeout: PropTypes.number,\n /**\n * DOM events to listen to\n * default: see [default events](https://github.com/SupremeTechnopriest/react-idle-timer#default-events)\n * @type {Array}\n */\n events: PropTypes.arrayOf(PropTypes.string),\n /**\n * Function to call when user is idle\n * default: () => {}\n * @type {Function}\n */\n onIdle: PropTypes.func,\n /**\n * Function to call when user becomes active\n * default: () => {}\n * @type {Function}\n */\n onActive: PropTypes.func,\n /**\n * Function to call on user actions\n * default: () => {}\n * @type {Function}\n */\n onAction: PropTypes.func,\n /**\n * Debounce the onAction function by setting delay in milliseconds\n * default: 0\n * @type {Number}\n */\n debounce: PropTypes.number,\n /**\n * Throttle the onAction function by setting delay in milliseconds\n * default: 0\n * @type {Number}\n */\n throttle: PropTypes.number,\n /**\n * Throttle the event handler function by setting delay in milliseconds\n * default: 200\n * @type {Number}\n */\n eventsThrottle: PropTypes.number,\n /**\n * Element reference to bind activity listeners to\n * default: document\n * @type {Object}\n */\n element: PropTypes.oneOfType([PropTypes.object, PropTypes.element]),\n /**\n * Start the timer on mount\n * default: true\n * @type {Boolean}\n */\n startOnMount: PropTypes.bool,\n /**\n * Require the timer to be started manually.\n * default: false\n * @type {Boolean}\n */\n startManually: PropTypes.bool,\n /**\n * Once the user goes idle the IdleTimer will not\n * reset on user input instead, reset() must be\n * called manually to restart the timer\n * default: false\n * @type {Boolean}\n */\n stopOnIdle: PropTypes.bool,\n /**\n * Bind events passively\n * default: true\n * @type {Boolean}\n */\n passive: PropTypes.bool,\n /**\n * Capture events\n * default: true\n * @type {Boolean}\n */\n capture: PropTypes.bool,\n /**\n * Cross Tab functionality.\n * default: false\n * @type {Boolean|Object}\n */\n crossTab: PropTypes.oneOfType([\n PropTypes.bool,\n PropTypes.shape({\n type: PropTypes.oneOf(['broadcastChannel', 'localStorage', 'simulate']),\n channelName: PropTypes.string,\n fallbackInterval: PropTypes.number,\n responseTime: PropTypes.number,\n removeTimeout: PropTypes.number,\n emitOnAllTabs: PropTypes.bool\n })\n ])\n}\n\n/**\n * Sets default property values\n * @type {Object}\n * @private\n */\nIdleTimer.defaultProps = {\n timeout: 1000 * 60 * 20,\n element: DEFAULT_ELEMENT,\n events: DEFAULT_EVENTS,\n onIdle: () => { },\n onActive: () => { },\n onAction: () => { },\n debounce: 0,\n throttle: 0,\n eventsThrottle: 200,\n startOnMount: true,\n startManually: false,\n stopOnIdle: false,\n capture: true,\n passive: true,\n crossTab: false\n}\n\nexport default IdleTimer\n","/**\n * ___ _ _ _____ _\n * |_ _|__| | | __|_ _(_)_ __ ___ ___ _ __\n * | |/ _` | |/ _ \\| | | | '_ ` _ \\ / _ \\ '__|\n * | | (_| | | __/| | | | | | | | | __/ |\n * |___\\__,_|_|\\___||_| |_|_| |_| |_|\\___|_|\n *\n * @name useIdleTimer\n * @author Randy Lebeau\n * @private\n */\n\nimport { useEffect, useRef, useMemo } from 'react'\nimport PropTypes from 'prop-types'\nimport { TabManager } from './TabManager'\nimport { IS_BROWSER, DEFAULT_ELEMENT, DEFAULT_EVENTS, debounced, throttled } from './utils'\n\n/**\n * Detects when your user is idle\n * @function useIdleTimer\n * @private\n */\nfunction useIdleTimer ({\n timeout = 1000 * 60 * 20,\n element = DEFAULT_ELEMENT,\n events = DEFAULT_EVENTS,\n onIdle = () => { },\n onActive = () => { },\n onAction = () => { },\n debounce = 0,\n throttle = 0,\n eventsThrottle = 200,\n startOnMount = true,\n startManually = false,\n stopOnIdle = false,\n capture = true,\n passive = true,\n crossTab = false\n} = {}) {\n const eventsBound = useRef(false)\n const idle = useRef(true)\n const oldDate = useRef(+new Date())\n const remaining = useRef(null)\n const pageX = useRef(null)\n const pageY = useRef(null)\n const tId = useRef(null)\n const lastActive = useRef(null)\n const lastIdle = useRef(null)\n const idleTime = useRef(0)\n const firstLoad = useRef(true)\n const _timeout = useRef(timeout)\n const manager = useRef(null)\n\n /* istanbul ignore next */\n if (crossTab) {\n if (crossTab === true) crossTab = {}\n crossTab = Object.assign({\n channelName: 'idle-timer',\n fallbackInterval: 2000,\n responseTime: 100,\n removeTimeout: 1000 * 60,\n emitOnAllTabs: false\n }, crossTab)\n }\n\n // Event emitters\n const emitOnIdle = useRef(onIdle)\n const emitOnActive = useRef(onActive)\n const emitOnAction = useRef(onAction)\n\n useEffect(() => {\n emitOnIdle.current = onIdle\n }, [onIdle])\n\n useEffect(() => {\n emitOnActive.current = onActive\n }, [onActive])\n\n useEffect(() => {\n emitOnAction.current = onAction\n }, [onAction])\n\n const intermediateOnAction = useMemo(() => {\n function callOnAction (e) {\n emitOnAction.current(e)\n }\n\n // Cancel any existing debounce timeouts\n if (callOnAction.cancel) callOnAction.cancel()\n\n // Create debounced action if applicable\n if (debounce > 0) {\n return debounced(callOnAction, debounce)\n\n // Create throttled action if applicable\n } else if (throttle > 0) {\n return throttled(callOnAction, throttle)\n\n // No throttle or debounce\n } else {\n return callOnAction\n }\n }, [throttle, debounce])\n\n /**\n * Toggles the idle state and calls\n * the correct action function\n * @private\n */\n const _toggleIdleState = e => {\n const nextIdle = !idle.current\n idle.current = nextIdle\n if (nextIdle) {\n if (stopOnIdle) {\n // Clear any existing timeout\n clearTimeout(tId.current)\n tId.current = null\n // Unbind events\n _unbindEvents()\n }\n lastIdle.current = (+new Date()) - _timeout.current\n if (manager.current) {\n /* istanbul ignore next */\n manager.current.idle()\n } else {\n emitOnIdle.current(e)\n }\n } else {\n idleTime.current += (+new Date()) - lastIdle.current\n _bindEvents()\n if (manager.current) {\n /* istanbul ignore next */\n manager.current.active()\n } else {\n emitOnActive.current(e)\n }\n }\n }\n\n /**\n * Event handler\n * @param {Event} e\n */\n const _handleEvent = e => {\n // Fire onAction event\n intermediateOnAction(e)\n\n // Already active, ignore events\n if (remaining.current) return\n\n // Mousemove event\n /* istanbul ignore next */\n if (e.type === 'mousemove') {\n // If coords are same, it didn't move\n if (e.pageX === pageX && e.pageY === pageY) {\n return\n }\n // If coords don't exist how could it move\n if (typeof e.pageX === 'undefined' && typeof e.pageY === 'undefined') {\n return\n }\n // Under 200 ms is hard to do\n // continuous activity will bypass this\n const elapsed = getElapsedTime()\n if (elapsed < 200) {\n return\n }\n }\n\n // Clear any existing timeout\n clearTimeout(tId.current)\n tId.current = null\n\n // Determine last time User was active, as can't rely on setTimeout ticking at the correct interval\n const elapsedTimeSinceLastActive = +new Date() - getLastActiveTime()\n\n // If the user is idle or last active time is more than timeout, flip the idle state\n if (\n (idle.current && !stopOnIdle) ||\n (!idle.current && elapsedTimeSinceLastActive > _timeout.current)\n ) {\n _toggleIdleState(e)\n }\n\n // Store when the user was last active\n // and update the mouse coordinates\n lastActive.current = +new Date()\n pageX.current = e.pageX\n pageY.current = e.pageY\n\n // If the user is active, set a new timeout\n if (!idle.current) {\n tId.current = setTimeout(_toggleIdleState, _timeout.current)\n }\n }\n\n /**\n * Reference to current handleEvent function.\n * @private\n */\n const handleEvent = useRef(_handleEvent)\n\n /**\n * Binds the specified events\n * @private\n */\n const _bindEvents = () => {\n // Don't bind events if\n // we are not in a browser\n if (!IS_BROWSER) return\n // Otherwise we bind all the events\n // to the supplied element\n if (!eventsBound.current) {\n events.forEach(e => {\n element.addEventListener(e, handleEvent.current, {\n capture,\n passive\n })\n })\n eventsBound.current = true\n }\n }\n\n /**\n * Unbinds all the bound events\n * @private\n */\n const _unbindEvents = (force = false) => {\n // If we are not in a browser\n // we don't need to unbind events\n if (!IS_BROWSER) return\n // Unbind all events\n if (eventsBound.current || force) {\n events.forEach(e => {\n element.removeEventListener(e, handleEvent.current, {\n capture,\n passive\n })\n })\n eventsBound.current = false\n }\n }\n\n /**\n * Time remaining before idle\n * @name getRemainingTime\n * @return {number} Milliseconds remaining\n */\n const getRemainingTime = () => {\n // If idle there is no time remaining\n if (remaining.current !== null) {\n return remaining.current < 0 ? 0 : remaining.current\n }\n\n // Determine remaining, if negative idle didn't finish flipping, just return 0\n const timeLeft = _timeout.current - ((+new Date()) - lastActive.current)\n return timeLeft < 0 ? 0 : timeLeft\n }\n\n /**\n * How much time has elapsed\n * @name getElapsedTime\n * @return {Timestamp}\n */\n const getElapsedTime = () => (+new Date()) - oldDate.current\n\n /**\n * Last time the user was idle\n * @name getLastIdleTime\n * @return {Timestamp}\n */\n const getLastIdleTime = () => lastIdle.current\n\n /**\n * Get the total time user is idle\n * @name getTotalIdleTime\n * @return {number} Milliseconds idle\n */\n const getTotalIdleTime = () => {\n if (idle.current) {\n return ((+new Date()) - lastIdle.current) + idleTime.current\n } else {\n return idleTime.current\n }\n }\n\n /**\n * Last time the user was active\n * @name getLastActiveTime\n * @return {Timestamp}\n */\n const getLastActiveTime = () => lastActive.current\n\n /**\n * Get the total time user is active\n * @name getTotalActiveTime\n * @return {number} Milliseconds active\n */\n const getTotalActiveTime = () => getElapsedTime() - getTotalIdleTime()\n\n /**\n * Returns wether or not the user is idle\n * @name isIdle\n * @return {Boolean}\n */\n const isIdle = () => idle.current\n\n /**\n * Returns wether or not this is the leader tab\n * @returns {Boolean}\n */\n const isLeader = () => manager.current ? manager.current.isLeader() : true\n\n /**\n * Set initial state and start timer\n * @name reset\n */\n const start = (remote = false) => {\n // Clear timeout\n clearTimeout(tId.current)\n tId.current = null\n\n // Bind the events\n _bindEvents()\n\n // Set state\n idle.current = false\n oldDate.current = +new Date()\n lastActive.current = +new Date()\n remaining.current = null\n\n if (manager.current) {\n /* istanbul ignore next */\n manager.current.setAllIdle(false)\n /* istanbul ignore next */\n if (!remote && crossTab.emitOnAllTabs) {\n manager.current.send('start')\n }\n }\n\n // Set new timeout\n tId.current = setTimeout(_toggleIdleState, _timeout.current)\n }\n\n /**\n * Restore initial state and restart timer, calling onActive\n * @name reset\n */\n const reset = (remote = false) => {\n // Clear timeout\n clearTimeout(tId.current)\n tId.current = null\n\n // Bind the events\n _bindEvents()\n\n // Emit active\n if (idle.current) {\n if (manager.current) {\n /* istanbul ignore next */\n manager.current.active()\n } else {\n emitOnActive.current()\n }\n }\n\n // Reset state\n idle.current = false\n oldDate.current = +new Date()\n lastActive.current = +new Date()\n remaining.current = null\n\n if (manager.current) {\n /* istanbul ignore next */\n manager.current.setAllIdle(false)\n /* istanbul ignore next */\n if (!remote && crossTab.emitOnAllTabs) {\n manager.current.send('reset')\n }\n }\n\n // Set new timeout\n tId.current = setTimeout(_toggleIdleState, _timeout.current)\n }\n\n /**\n * Store remaining time and stop timer\n * @name pause\n */\n const pause = (remote = false) => {\n // Timer is already paused\n if (remaining.current !== null) return\n\n // Unbind events\n _unbindEvents()\n\n // Clear existing timeout\n clearTimeout(tId.current)\n tId.current = null\n\n // Define how much is left on the timer\n remaining.current = getRemainingTime()\n\n if (manager.current) {\n /* istanbul ignore next */\n if (!remote && crossTab.emitOnAllTabs) {\n manager.current.send('pause')\n }\n }\n }\n\n /**\n * Resumes a paused timer\n * @name resume\n */\n const resume = (remote = false) => {\n // Timer is not paused\n if (remaining.current === null) return\n\n // Bind events\n _bindEvents()\n\n // Start timer and clear remaining\n // if we are in the idle state\n if (!idle.current) {\n // Set a new timeout\n tId.current = setTimeout(_toggleIdleState, remaining.current)\n // Set states\n remaining.current = null\n lastActive.current = +new Date()\n }\n\n if (manager.current) {\n /* istanbul ignore next */\n if (!remote && crossTab.emitOnAllTabs) {\n manager.current.send('resume')\n }\n }\n }\n\n /**\n * Hook lifecycle\n */\n useEffect(() => {\n // Debounce and throttle can't both be set\n if (debounce > 0 && throttle > 0) {\n throw new Error('onAction can either be throttled or debounced (not both)')\n }\n\n // Set up cross tab\n /* istanbul ignore next */\n if (crossTab) {\n manager.current = TabManager({\n type: crossTab.type,\n channelName: crossTab.channelName,\n fallbackInterval: crossTab.fallbackInterval,\n responseTime: crossTab.responseTime,\n emitOnAllTabs: crossTab.emitOnAllTabs,\n callbacks: {\n onIdle: emitOnIdle.current,\n onActive: emitOnActive.current\n },\n start,\n reset,\n pause,\n resume\n })\n }\n\n // If startOnMount is enabled, start the timer\n if (startManually) {\n return async () => {\n clearTimeout(tId.current)\n _unbindEvents(true)\n if (crossTab) await manager.current.close()\n }\n }\n\n if (startOnMount) {\n start()\n } else {\n _bindEvents()\n }\n\n // Clear and unbind on unmount\n return async () => {\n clearTimeout(tId.current)\n _unbindEvents(true)\n if (intermediateOnAction.cancel) intermediateOnAction.cancel()\n if (crossTab) await manager.current.close()\n }\n }, [])\n\n useEffect(() => {\n const eventsWereBound = eventsBound.current\n if (eventsWereBound) _unbindEvents()\n if (eventsThrottle > 0) {\n handleEvent.current = throttled(_handleEvent, eventsThrottle)\n } else {\n handleEvent.current = _handleEvent\n }\n if (eventsWereBound) _bindEvents()\n }, [eventsThrottle])\n\n useEffect(() => {\n _timeout.current = timeout\n if (!firstLoad.current && idle.current) {\n reset()\n }\n firstLoad.current = false\n }, [timeout])\n\n return {\n isIdle,\n isLeader,\n start,\n pause,\n reset,\n resume,\n getLastIdleTime,\n getTotalIdleTime,\n getLastActiveTime,\n getTotalActiveTime,\n getElapsedTime,\n getRemainingTime\n }\n}\n\n/**\n * Type checks for every property\n * @type {Object}\n * @private\n */\nuseIdleTimer.propTypes = {\n /**\n * Activity Timeout in milliseconds\n * default: 1200000\n * @type {number}\n */\n timeout: PropTypes.number,\n /**\n * DOM events to listen to\n * default: see [default events](https://github.com/SupremeTechnopriest/react-idle-timer#default-events)\n * @type {Array}\n */\n events: PropTypes.arrayOf(PropTypes.string),\n /**\n * Function to call when user is idle.\n * default: () => {}\n * @type {Function}\n */\n onIdle: PropTypes.func,\n /**\n * Function to call when user becomes active.\n * default: () => {}\n * @type {Function}\n */\n onActive: PropTypes.func,\n /**\n * Function to call on user actions.\n * default: () => {}\n * @type {Function}\n */\n onAction: PropTypes.func,\n /**\n * Debounce the onAction function by setting delay in milliseconds.\n * default: 0\n * @type {number}\n */\n debounce: PropTypes.number,\n /**\n * Throttle the onAction function by setting delay in milliseconds.\n * default: 0\n * @type {number}\n */\n throttle: PropTypes.number,\n /**\n * Throttle the event handler function by setting delay in milliseconds.\n * default: 200\n * @type {number}\n */\n eventsThrottle: PropTypes.number,\n /**\n * Element reference to bind activity listeners to.\n * default: document\n * @type {Object}\n */\n element: PropTypes.oneOfType([PropTypes.object, PropTypes.element]),\n /**\n * Start the timer on mount.\n * default: true\n * @type {Boolean}\n */\n startOnMount: PropTypes.bool,\n /**\n * Require the timer to be started manually.\n * default: false\n * @type {Boolean}\n */\n startManually: PropTypes.bool,\n /**\n * Once the user goes idle the IdleTimer will not\n * reset on user input instead, start() or reset() must be\n * called manually to restart the timer.\n * default: false\n * @type {Boolean}\n */\n stopOnIdle: PropTypes.bool,\n /**\n * Bind events passively.\n * default: true\n * @type {Boolean}\n */\n passive: PropTypes.bool,\n /**\n * Capture events.\n * default: true\n * @type {Boolean}\n */\n capture: PropTypes.bool,\n /**\n * Cross Tab functionality.\n * default: false\n * @type {Boolean|Object}\n */\n crossTab: PropTypes.oneOfType([\n PropTypes.bool,\n PropTypes.shape({\n type: PropTypes.oneOf(['broadcastChannel', 'localStorage', 'simulate']),\n channelName: PropTypes.string,\n fallbackInterval: PropTypes.number,\n responseTime: PropTypes.number,\n removeTimeout: PropTypes.number,\n emitOnAllTabs: PropTypes.bool\n })\n ])\n}\n\n/**\n * Sets default property values\n * @type {Object}\n * @private\n */\nuseIdleTimer.defaultProps = {\n timeout: 1000 * 60 * 20,\n element: DEFAULT_ELEMENT,\n events: DEFAULT_EVENTS,\n onIdle: () => { },\n onActive: () => { },\n onAction: () => { },\n debounce: 0,\n throttle: 0,\n eventsThrottle: 200,\n startOnMount: true,\n startManually: false,\n stopOnIdle: false,\n capture: true,\n passive: true,\n crossTab: false\n}\n\nexport default useIdleTimer\n","import React, { useState, useEffect, useRef } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { Modal, ModalBody, ModalFooter, Button } from 'reactstrap';\r\nimport IdleTimer from 'react-idle-timer';\r\nimport { pageModes } from '../../enums/launchTypes';\r\nimport { idleTimerDialogVisible } from '../../actions/dialogOptionsActions';\r\nimport { postFrameDialogMessage } from '../../utilities/domUtilities';\r\n\r\nconst IdleTimerDialog = ({ timeout, onClose, closeButtonText, bodyClass, closeButtonClass, children, onIdle }) => {\r\n const dispatch = useDispatch();\r\n const ref = useRef(null);\r\n\r\n const { dialogOptions } = useSelector(state => state);\r\n const { pageMode, frameHeight, frameHost } = useSelector(state => state.application);\r\n\r\n const [dialogOpen, setDialogOpen] = useState();\r\n const [idleTimer, setIdleTimer] = useState(null);\r\n const [lastActiveTime, setLastActiveTime] = useState();\r\n\r\n const modalBodyClassName = bodyClass || 'qs-modal-body';\r\n\r\n useEffect(() => {\r\n if (dialogOptions.idleTimer.isOpen && dialogOpen) onDialogClosed();\r\n }, [dialogOptions]);\r\n\r\n const onDialogToggle = () => {\r\n dispatch(idleTimerDialogVisible(!dialogOpen));\r\n\r\n setDialogOpen(!dialogOpen);\r\n };\r\n\r\n const handleModal = () => {\r\n if (pageMode === pageModes.FRAMED) {\r\n dispatch(postFrameDialogMessage(frameHost, 'Idle Timeout', dialogOpen, ref.current, frameHeight));\r\n }\r\n\r\n if (!dialogOpen) onDialogClosed();\r\n };\r\n\r\n const onDialogClosed = () => {\r\n dispatch(idleTimerDialogVisible(false));\r\n setLastActiveTime(null);\r\n\r\n idleTimer.reset();\r\n\r\n if (onClose) onClose();\r\n };\r\n\r\n const onIdleInternal = () => {\r\n if (!lastActiveTime) {\r\n setLastActiveTime(idleTimer.getLastActiveTime());\r\n }\r\n\r\n idleTimer.pause();\r\n\r\n dispatch(idleTimerDialogVisible(true));\r\n setDialogOpen(true);\r\n\r\n if (onIdle) onIdle();\r\n };\r\n\r\n return (\r\n <>\r\n setIdleTimer(ref)}\r\n element={document}\r\n onIdle={onIdleInternal}\r\n debounce={250}\r\n timeout={timeout}\r\n />\r\n\r\n \r\n
\r\n {children}\r\n \r\n \r\n \r\n
\r\n \r\n \r\n );\r\n};\r\n\r\nexport default IdleTimerDialog;\r\n","import React from 'react';\r\n\r\nimport { Container, Row, Col } from 'reactstrap';\r\n\r\nconst IdleOfferTimeout = ({ heading, message }) => {\r\n return (\r\n \r\n \r\n
\r\n
{heading || 'Session Timeout'}
\r\n \r\n \r\n\r\n \r\n
{message}\r\n \r\n \r\n );\r\n};\r\nexport default IdleOfferTimeout;\r\n","export var FOCUS_GROUP = 'data-focus-lock';\nexport var FOCUS_DISABLED = 'data-focus-lock-disabled';\nexport var FOCUS_ALLOW = 'data-no-focus-lock';\nexport var FOCUS_AUTO = 'data-autofocus-inside';\n","import { useCallbackRef } from './useRef';\nimport { assignRef } from './assignRef';\n/**\n * Merges two or more refs together providing a single interface to set their value\n * @param {RefObject|Ref} refs\n * @returns {MutableRefObject} - a new ref, which translates all changes to {refs}\n *\n * @see {@link mergeRefs} a version without buit-in memoization\n * @see https://github.com/theKashey/use-callback-ref#usemergerefs\n * @example\n * const Component = React.forwardRef((props, ref) => {\n * const ownRef = useRef();\n * const domRef = useMergeRefs([ref, ownRef]); // 👈 merge together\n * return
...
\n * }\n */\nexport function useMergeRefs(refs, defaultValue) {\n return useCallbackRef(defaultValue, function (newValue) {\n return refs.forEach(function (ref) { return assignRef(ref, newValue); });\n });\n}\n","import { useState } from 'react';\n/**\n * creates a MutableRef with ref change callback\n * @param initialValue - initial ref value\n * @param {Function} callback - a callback to run when value changes\n *\n * @example\n * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);\n * ref.current = 1;\n * // prints 0 -> 1\n *\n * @see https://reactjs.org/docs/hooks-reference.html#useref\n * @see https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref\n * @returns {MutableRefObject}\n */\nexport function useCallbackRef(initialValue, callback) {\n var ref = useState(function () { return ({\n // value\n value: initialValue,\n // last callback\n callback: callback,\n // \"memoized\" public interface\n facade: {\n get current() {\n return ref.value;\n },\n set current(value) {\n var last = ref.value;\n if (last !== value) {\n ref.value = value;\n ref.callback(value, last);\n }\n }\n }\n }); })[0];\n // update callback\n ref.callback = callback;\n return ref.facade;\n}\n","/**\n * Assigns a value for a given ref, no matter of the ref format\n * @param {RefObject} ref - a callback function or ref object\n * @param value - a new value\n *\n * @see https://github.com/theKashey/use-callback-ref#assignref\n * @example\n * const refObject = useRef();\n * const refFn = (ref) => {....}\n *\n * assignRef(refObject, \"refValue\");\n * assignRef(refFn, \"refValue\");\n */\nexport function assignRef(ref, value) {\n if (typeof ref === 'function') {\n ref(value);\n }\n else if (ref) {\n ref.current = value;\n }\n return ref;\n}\n","import * as React from 'react';\nimport PropTypes from 'prop-types';\nexport var hiddenGuard = {\n width: '1px',\n height: '0px',\n padding: 0,\n overflow: 'hidden',\n position: 'fixed',\n top: '1px',\n left: '1px'\n};\n\nvar InFocusGuard = function InFocusGuard(_ref) {\n var children = _ref.children;\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"div\", {\n key: \"guard-first\",\n \"data-focus-guard\": true,\n \"data-focus-auto-guard\": true,\n style: hiddenGuard\n }), children, children && /*#__PURE__*/React.createElement(\"div\", {\n key: \"guard-last\",\n \"data-focus-guard\": true,\n \"data-focus-auto-guard\": true,\n style: hiddenGuard\n }));\n};\n\nInFocusGuard.propTypes = process.env.NODE_ENV !== \"production\" ? {\n children: PropTypes.node\n} : {};\nInFocusGuard.defaultProps = {\n children: null\n};\nexport default InFocusGuard;","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n t[p[i]] = s[p[i]];\r\n }\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __createBinding(o, m, k, k2) {\r\n if (k2 === undefined) k2 = k;\r\n o[k2] = m[k];\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (p !== \"default\" && !exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n if (m) return m.call(o);\r\n if (o && typeof o.length === \"number\") return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __spreadArrays() {\r\n for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n r[k] = a[j];\r\n return r;\r\n};\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, privateMap) {\r\n if (!privateMap.has(receiver)) {\r\n throw new TypeError(\"attempted to get private field on non-instance\");\r\n }\r\n return privateMap.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, privateMap, value) {\r\n if (!privateMap.has(receiver)) {\r\n throw new TypeError(\"attempted to set private field on non-instance\");\r\n }\r\n privateMap.set(receiver, value);\r\n return value;\r\n}\r\n","import * as tslib_1 from \"tslib\";\nfunction ItoI(a) {\n return a;\n}\nfunction innerCreateMedium(defaults, middleware) {\n if (middleware === void 0) { middleware = ItoI; }\n var buffer = [];\n var assigned = false;\n var medium = {\n read: function () {\n if (assigned) {\n throw new Error('Sidecar: could not `read` from an `assigned` medium. `read` could be used only with `useMedium`.');\n }\n if (buffer.length) {\n return buffer[buffer.length - 1];\n }\n return defaults;\n },\n useMedium: function (data) {\n var item = middleware(data, assigned);\n buffer.push(item);\n return function () {\n buffer = buffer.filter(function (x) { return x !== item; });\n };\n },\n assignSyncMedium: function (cb) {\n assigned = true;\n while (buffer.length) {\n var cbs = buffer;\n buffer = [];\n cbs.forEach(cb);\n }\n buffer = {\n push: function (x) { return cb(x); },\n filter: function () { return buffer; },\n };\n },\n assignMedium: function (cb) {\n assigned = true;\n var pendingQueue = [];\n if (buffer.length) {\n var cbs = buffer;\n buffer = [];\n cbs.forEach(cb);\n pendingQueue = buffer;\n }\n var executeQueue = function () {\n var cbs = pendingQueue;\n pendingQueue = [];\n cbs.forEach(cb);\n };\n var cycle = function () { return Promise.resolve().then(executeQueue); };\n cycle();\n buffer = {\n push: function (x) {\n pendingQueue.push(x);\n cycle();\n },\n filter: function (filter) {\n pendingQueue = pendingQueue.filter(filter);\n return buffer;\n },\n };\n },\n };\n return medium;\n}\nexport function createMedium(defaults, middleware) {\n if (middleware === void 0) { middleware = ItoI; }\n return innerCreateMedium(defaults, middleware);\n}\nexport function createSidecarMedium(options) {\n if (options === void 0) { options = {}; }\n var medium = innerCreateMedium(null);\n medium.options = tslib_1.__assign({ async: true, ssr: false }, options);\n return medium;\n}\n","import { createMedium, createSidecarMedium } from 'use-sidecar';\nexport var mediumFocus = createMedium({}, function (_ref) {\n var target = _ref.target,\n currentTarget = _ref.currentTarget;\n return {\n target: target,\n currentTarget: currentTarget\n };\n});\nexport var mediumBlur = createMedium();\nexport var mediumEffect = createMedium();\nexport var mediumSidecar = createSidecarMedium({\n async: true\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { node, bool, string, any, arrayOf, oneOfType, object, func } from 'prop-types';\nimport * as constants from 'focus-lock/constants';\nimport { useMergeRefs } from 'use-callback-ref';\nimport { hiddenGuard } from './FocusGuard';\nimport { mediumFocus, mediumBlur, mediumSidecar } from './medium';\nvar emptyArray = [];\nvar FocusLock = /*#__PURE__*/React.forwardRef(function FocusLockUI(props, parentRef) {\n var _extends2;\n\n var _React$useState = React.useState(),\n realObserved = _React$useState[0],\n setObserved = _React$useState[1];\n\n var observed = React.useRef();\n var isActive = React.useRef(false);\n var originalFocusedElement = React.useRef(null);\n var children = props.children,\n disabled = props.disabled,\n noFocusGuards = props.noFocusGuards,\n persistentFocus = props.persistentFocus,\n crossFrame = props.crossFrame,\n autoFocus = props.autoFocus,\n allowTextSelection = props.allowTextSelection,\n group = props.group,\n className = props.className,\n whiteList = props.whiteList,\n _props$shards = props.shards,\n shards = _props$shards === void 0 ? emptyArray : _props$shards,\n _props$as = props.as,\n Container = _props$as === void 0 ? 'div' : _props$as,\n _props$lockProps = props.lockProps,\n containerProps = _props$lockProps === void 0 ? {} : _props$lockProps,\n SideCar = props.sideCar,\n shouldReturnFocus = props.returnFocus,\n onActivationCallback = props.onActivation,\n onDeactivationCallback = props.onDeactivation;\n\n var _React$useState2 = React.useState({}),\n id = _React$useState2[0]; // SIDE EFFECT CALLBACKS\n\n\n var onActivation = React.useCallback(function () {\n originalFocusedElement.current = originalFocusedElement.current || document && document.activeElement;\n\n if (observed.current && onActivationCallback) {\n onActivationCallback(observed.current);\n }\n\n isActive.current = true;\n }, [onActivationCallback]);\n var onDeactivation = React.useCallback(function () {\n isActive.current = false;\n\n if (onDeactivationCallback) {\n onDeactivationCallback(observed.current);\n }\n }, [onDeactivationCallback]);\n var returnFocus = React.useCallback(function (allowDefer) {\n var current = originalFocusedElement.current;\n\n if (Boolean(shouldReturnFocus) && current && current.focus) {\n var focusOptions = typeof shouldReturnFocus === 'object' ? shouldReturnFocus : undefined;\n originalFocusedElement.current = null;\n\n if (allowDefer) {\n // React might return focus after update\n // it's safer to defer the action\n Promise.resolve().then(function () {\n return current.focus(focusOptions);\n });\n } else {\n current.focus(focusOptions);\n }\n }\n }, [shouldReturnFocus]); // MEDIUM CALLBACKS\n\n var onFocus = React.useCallback(function (event) {\n if (isActive.current) {\n mediumFocus.useMedium(event);\n }\n }, []);\n var onBlur = mediumBlur.useMedium; // REF PROPAGATION\n // not using real refs due to race conditions\n\n var setObserveNode = React.useCallback(function (newObserved) {\n if (observed.current !== newObserved) {\n observed.current = newObserved;\n setObserved(newObserved);\n }\n }, []);\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof allowTextSelection !== 'undefined') {\n // eslint-disable-next-line no-console\n console.warn('React-Focus-Lock: allowTextSelection is deprecated and enabled by default');\n }\n\n React.useEffect(function () {\n if (!observed.current) {\n // eslint-disable-next-line no-console\n console.error('FocusLock: could not obtain ref to internal node');\n }\n }, []);\n }\n\n var lockProps = _extends((_extends2 = {}, _extends2[constants.FOCUS_DISABLED] = disabled && 'disabled', _extends2[constants.FOCUS_GROUP] = group, _extends2), containerProps);\n\n var hasLeadingGuards = noFocusGuards !== true;\n var hasTailingGuards = hasLeadingGuards && noFocusGuards !== 'tail';\n var mergedRef = useMergeRefs([parentRef, setObserveNode]);\n return /*#__PURE__*/React.createElement(React.Fragment, null, hasLeadingGuards && [/*#__PURE__*/React.createElement(\"div\", {\n key: \"guard-first\",\n \"data-focus-guard\": true,\n tabIndex: disabled ? -1 : 0,\n style: hiddenGuard\n }),\n /*#__PURE__*/\n // nearest focus guard\n React.createElement(\"div\", {\n key: \"guard-nearest\",\n \"data-focus-guard\": true,\n tabIndex: disabled ? -1 : 1,\n style: hiddenGuard\n }) // first tabbed element guard\n ], !disabled && /*#__PURE__*/React.createElement(SideCar, {\n id: id,\n sideCar: mediumSidecar,\n observed: realObserved,\n disabled: disabled,\n persistentFocus: persistentFocus,\n crossFrame: crossFrame,\n autoFocus: autoFocus,\n whiteList: whiteList,\n shards: shards,\n onActivation: onActivation,\n onDeactivation: onDeactivation,\n returnFocus: returnFocus\n }), /*#__PURE__*/React.createElement(Container, _extends({\n ref: mergedRef\n }, lockProps, {\n className: className,\n onBlur: onBlur,\n onFocus: onFocus\n }), children), hasTailingGuards && /*#__PURE__*/React.createElement(\"div\", {\n \"data-focus-guard\": true,\n tabIndex: disabled ? -1 : 0,\n style: hiddenGuard\n }));\n});\nFocusLock.propTypes = process.env.NODE_ENV !== \"production\" ? {\n children: node,\n disabled: bool,\n returnFocus: oneOfType([bool, object]),\n noFocusGuards: bool,\n allowTextSelection: bool,\n autoFocus: bool,\n persistentFocus: bool,\n crossFrame: bool,\n group: string,\n className: string,\n whiteList: func,\n shards: arrayOf(any),\n as: oneOfType([string, func, object]),\n lockProps: object,\n onActivation: func,\n onDeactivation: func,\n sideCar: any.isRequired\n} : {};\nFocusLock.defaultProps = {\n children: undefined,\n disabled: false,\n returnFocus: false,\n noFocusGuards: false,\n autoFocus: true,\n persistentFocus: false,\n crossFrame: true,\n allowTextSelection: undefined,\n group: undefined,\n className: undefined,\n whiteList: undefined,\n shards: undefined,\n as: 'div',\n lockProps: {},\n onActivation: undefined,\n onDeactivation: undefined\n};\nexport default FocusLock;","import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';\nimport _defineProperty from '@babel/runtime/helpers/esm/defineProperty';\nimport React, { PureComponent } from 'react';\n\nfunction withSideEffect(reducePropsToState, handleStateChangeOnClient) {\n if (process.env.NODE_ENV !== \"production\") {\n if (typeof reducePropsToState !== 'function') {\n throw new Error('Expected reducePropsToState to be a function.');\n }\n\n if (typeof handleStateChangeOnClient !== 'function') {\n throw new Error('Expected handleStateChangeOnClient to be a function.');\n }\n }\n\n function getDisplayName(WrappedComponent) {\n return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n }\n\n return function wrap(WrappedComponent) {\n if (process.env.NODE_ENV !== \"production\") {\n if (typeof WrappedComponent !== 'function') {\n throw new Error('Expected WrappedComponent to be a React component.');\n }\n }\n\n var mountedInstances = [];\n var state;\n\n function emitChange() {\n state = reducePropsToState(mountedInstances.map(function (instance) {\n return instance.props;\n }));\n handleStateChangeOnClient(state);\n }\n\n var SideEffect = /*#__PURE__*/function (_PureComponent) {\n _inheritsLoose(SideEffect, _PureComponent);\n\n function SideEffect() {\n return _PureComponent.apply(this, arguments) || this;\n }\n\n // Try to use displayName of wrapped component\n SideEffect.peek = function peek() {\n return state;\n };\n\n var _proto = SideEffect.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n mountedInstances.push(this);\n emitChange();\n };\n\n _proto.componentDidUpdate = function componentDidUpdate() {\n emitChange();\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n var index = mountedInstances.indexOf(this);\n mountedInstances.splice(index, 1);\n emitChange();\n };\n\n _proto.render = function render() {\n return /*#__PURE__*/React.createElement(WrappedComponent, this.props);\n };\n\n return SideEffect;\n }(PureComponent);\n\n _defineProperty(SideEffect, \"displayName\", \"SideEffect(\" + getDisplayName(WrappedComponent) + \")\");\n\n return SideEffect;\n };\n}\n\nexport default withSideEffect;\n","export var toArray = function (a) {\n var ret = Array(a.length);\n for (var i = 0; i < a.length; ++i) {\n ret[i] = a[i];\n }\n return ret;\n};\nexport var asArray = function (a) { return (Array.isArray(a) ? a : [a]); };\n","import { FOCUS_DISABLED, FOCUS_GROUP } from '../constants';\nimport { asArray, toArray } from './array';\nvar filterNested = function (nodes) {\n var contained = new Set();\n var l = nodes.length;\n for (var i = 0; i < l; i += 1) {\n for (var j = i + 1; j < l; j += 1) {\n var position = nodes[i].compareDocumentPosition(nodes[j]);\n if ((position & Node.DOCUMENT_POSITION_CONTAINED_BY) > 0) {\n contained.add(j);\n }\n if ((position & Node.DOCUMENT_POSITION_CONTAINS) > 0) {\n contained.add(i);\n }\n }\n }\n return nodes.filter(function (_, index) { return !contained.has(index); });\n};\nvar getTopParent = function (node) {\n return node.parentNode ? getTopParent(node.parentNode) : node;\n};\nexport var getAllAffectedNodes = function (node) {\n var nodes = asArray(node);\n return nodes.filter(Boolean).reduce(function (acc, currentNode) {\n var group = currentNode.getAttribute(FOCUS_GROUP);\n acc.push.apply(acc, (group\n ? filterNested(toArray(getTopParent(currentNode).querySelectorAll(\"[\" + FOCUS_GROUP + \"=\\\"\" + group + \"\\\"]:not([\" + FOCUS_DISABLED + \"=\\\"disabled\\\"])\")))\n : [currentNode]));\n return acc;\n }, []);\n};\n","import { getAllAffectedNodes } from './utils/all-affected';\nimport { toArray } from './utils/array';\nvar focusInFrame = function (frame) { return frame === document.activeElement; };\nvar focusInsideIframe = function (topNode) {\n return Boolean(toArray(topNode.querySelectorAll('iframe')).some(function (node) { return focusInFrame(node); }));\n};\nexport var focusInside = function (topNode) {\n var activeElement = document && document.activeElement;\n if (!activeElement || (activeElement.dataset && activeElement.dataset.focusGuard)) {\n return false;\n }\n return getAllAffectedNodes(topNode).reduce(function (result, node) { return result || node.contains(activeElement) || focusInsideIframe(node); }, false);\n};\n","var isRadio = function (node) { return node.tagName === 'INPUT' && node.type === 'radio'; };\nvar findSelectedRadio = function (node, nodes) {\n return nodes\n .filter(isRadio)\n .filter(function (el) { return el.name === node.name; })\n .filter(function (el) { return el.checked; })[0] || node;\n};\nexport var correctNode = function (node, nodes) {\n if (isRadio(node) && node.name) {\n return findSelectedRadio(node, nodes);\n }\n return node;\n};\nexport var correctNodes = function (nodes) {\n var resultSet = new Set();\n nodes.forEach(function (node) { return resultSet.add(correctNode(node, nodes)); });\n return nodes.filter(function (node) { return resultSet.has(node); });\n};\n","import { correctNode } from './correctFocus';\nexport var pickFirstFocus = function (nodes) {\n if (nodes[0] && nodes.length > 1) {\n return correctNode(nodes[0], nodes);\n }\n return nodes[0];\n};\nexport var pickFocusable = function (nodes, index) {\n if (nodes.length > 1) {\n return nodes.indexOf(correctNode(nodes[index], nodes));\n }\n return index;\n};\n","var isElementHidden = function (node) {\n if (node.nodeType !== Node.ELEMENT_NODE) {\n return false;\n }\n var computedStyle = window.getComputedStyle(node, null);\n if (!computedStyle || !computedStyle.getPropertyValue) {\n return false;\n }\n return (computedStyle.getPropertyValue('display') === 'none' || computedStyle.getPropertyValue('visibility') === 'hidden');\n};\nvar isVisibleUncached = function (node, checkParent) {\n return !node ||\n node === document ||\n (node && node.nodeType === Node.DOCUMENT_NODE) ||\n (!isElementHidden(node) &&\n checkParent(node.parentNode && node.parentNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE\n ? node.parentNode.host\n : node.parentNode));\n};\nexport var isVisibleCached = function (visibilityCache, node) {\n var cached = visibilityCache.get(node);\n if (cached !== undefined) {\n return cached;\n }\n var result = isVisibleUncached(node, isVisibleCached.bind(undefined, visibilityCache));\n visibilityCache.set(node, result);\n return result;\n};\nexport var notHiddenInput = function (node) {\n return !((node.tagName === 'INPUT' || node.tagName === 'BUTTON') && (node.type === 'hidden' || node.disabled));\n};\nexport var isGuard = function (node) { return Boolean(node && node.dataset && node.dataset.focusGuard); };\nexport var isNotAGuard = function (node) { return !isGuard(node); };\nexport var isDefined = function (x) { return Boolean(x); };\n","import { correctNodes } from './utils/correctFocus';\nimport { pickFocusable } from './utils/firstFocus';\nimport { isGuard } from './utils/is';\nexport var NEW_FOCUS = 'NEW_FOCUS';\nexport var newFocus = function (innerNodes, outerNodes, activeElement, lastNode) {\n var cnt = innerNodes.length;\n var firstFocus = innerNodes[0];\n var lastFocus = innerNodes[cnt - 1];\n var isOnGuard = isGuard(activeElement);\n if (innerNodes.indexOf(activeElement) >= 0) {\n return undefined;\n }\n var activeIndex = outerNodes.indexOf(activeElement);\n var lastIndex = lastNode ? outerNodes.indexOf(lastNode) : activeIndex;\n var lastNodeInside = lastNode ? innerNodes.indexOf(lastNode) : -1;\n var indexDiff = activeIndex - lastIndex;\n var firstNodeIndex = outerNodes.indexOf(firstFocus);\n var lastNodeIndex = outerNodes.indexOf(lastFocus);\n var correctedNodes = correctNodes(outerNodes);\n var correctedIndexDiff = correctedNodes.indexOf(activeElement) - (lastNode ? correctedNodes.indexOf(lastNode) : activeIndex);\n var returnFirstNode = pickFocusable(innerNodes, 0);\n var returnLastNode = pickFocusable(innerNodes, cnt - 1);\n if (activeIndex === -1 || lastNodeInside === -1) {\n return NEW_FOCUS;\n }\n if (!indexDiff && lastNodeInside >= 0) {\n return lastNodeInside;\n }\n if (activeIndex <= firstNodeIndex && isOnGuard && Math.abs(indexDiff) > 1) {\n return returnLastNode;\n }\n if (activeIndex >= lastNodeIndex && isOnGuard && Math.abs(indexDiff) > 1) {\n return returnFirstNode;\n }\n if (indexDiff && Math.abs(correctedIndexDiff) > 1) {\n return lastNodeInside;\n }\n if (activeIndex <= firstNodeIndex) {\n return returnLastNode;\n }\n if (activeIndex > lastNodeIndex) {\n return returnFirstNode;\n }\n if (indexDiff) {\n if (Math.abs(indexDiff) > 1) {\n return lastNodeInside;\n }\n return (cnt + lastNodeInside + indexDiff) % cnt;\n }\n return undefined;\n};\n","import { toArray } from './array';\nexport var tabSort = function (a, b) {\n var tabDiff = a.tabIndex - b.tabIndex;\n var indexDiff = a.index - b.index;\n if (tabDiff) {\n if (!a.tabIndex) {\n return 1;\n }\n if (!b.tabIndex) {\n return -1;\n }\n }\n return tabDiff || indexDiff;\n};\nexport var orderByTabIndex = function (nodes, filterNegative, keepGuards) {\n return toArray(nodes)\n .map(function (node, index) { return ({\n node: node,\n index: index,\n tabIndex: keepGuards && node.tabIndex === -1 ? ((node.dataset || {}).focusGuard ? 0 : -1) : node.tabIndex,\n }); })\n .filter(function (data) { return !filterNegative || data.tabIndex >= 0; })\n .sort(tabSort);\n};\n","import { FOCUS_AUTO } from '../constants';\nimport { toArray } from './array';\nimport { tabbables } from './tabbables';\nvar queryTabbables = tabbables.join(',');\nvar queryGuardTabbables = queryTabbables + \", [data-focus-guard]\";\nexport var getFocusables = function (parents, withGuards) {\n return parents.reduce(function (acc, parent) {\n return acc.concat(toArray(parent.querySelectorAll(withGuards ? queryGuardTabbables : queryTabbables)), parent.parentNode\n ? toArray(parent.parentNode.querySelectorAll(queryTabbables)).filter(function (node) { return node === parent; })\n : []);\n }, []);\n};\nexport var getParentAutofocusables = function (parent) {\n var parentFocus = parent.querySelectorAll(\"[\" + FOCUS_AUTO + \"]\");\n return toArray(parentFocus)\n .map(function (node) { return getFocusables([node]); })\n .reduce(function (acc, nodes) { return acc.concat(nodes); }, []);\n};\n","export var tabbables = [\n 'button:enabled',\n 'select:enabled',\n 'textarea:enabled',\n 'input:enabled',\n 'a[href]',\n 'area[href]',\n 'summary',\n 'iframe',\n 'object',\n 'embed',\n 'audio[controls]',\n 'video[controls]',\n '[tabindex]',\n '[contenteditable]',\n '[autofocus]',\n];\n","import { toArray } from './array';\nimport { isVisibleCached, notHiddenInput } from './is';\nimport { orderByTabIndex } from './tabOrder';\nimport { getFocusables, getParentAutofocusables } from './tabUtils';\nexport var filterFocusable = function (nodes, visibilityCache) {\n return toArray(nodes)\n .filter(function (node) { return isVisibleCached(visibilityCache, node); })\n .filter(function (node) { return notHiddenInput(node); });\n};\nexport var getTabbableNodes = function (topNodes, visibilityCache, withGuards) {\n return orderByTabIndex(filterFocusable(getFocusables(topNodes, withGuards), visibilityCache), true, withGuards);\n};\nexport var getAllTabbableNodes = function (topNodes, visibilityCache) {\n return orderByTabIndex(filterFocusable(getFocusables(topNodes), visibilityCache), false);\n};\nexport var parentAutofocusables = function (topNode, visibilityCache) {\n return filterFocusable(getParentAutofocusables(topNode), visibilityCache);\n};\n","import { asArray } from './array';\nimport { parentAutofocusables } from './DOMutils';\nvar getParents = function (node, parents) {\n if (parents === void 0) { parents = []; }\n parents.push(node);\n if (node.parentNode) {\n getParents(node.parentNode, parents);\n }\n return parents;\n};\nexport var getCommonParent = function (nodeA, nodeB) {\n var parentsA = getParents(nodeA);\n var parentsB = getParents(nodeB);\n for (var i = 0; i < parentsA.length; i += 1) {\n var currentParent = parentsA[i];\n if (parentsB.indexOf(currentParent) >= 0) {\n return currentParent;\n }\n }\n return false;\n};\nexport var getTopCommonParent = function (baseActiveElement, leftEntry, rightEntries) {\n var activeElements = asArray(baseActiveElement);\n var leftEntries = asArray(leftEntry);\n var activeElement = activeElements[0];\n var topCommon = false;\n leftEntries.filter(Boolean).forEach(function (entry) {\n topCommon = getCommonParent(topCommon || entry, entry) || topCommon;\n rightEntries.filter(Boolean).forEach(function (subEntry) {\n var common = getCommonParent(activeElement, subEntry);\n if (common) {\n if (!topCommon || common.contains(topCommon)) {\n topCommon = common;\n }\n else {\n topCommon = getCommonParent(common, topCommon);\n }\n }\n });\n });\n return topCommon;\n};\nexport var allParentAutofocusables = function (entries, visibilityCache) {\n return entries.reduce(function (acc, node) { return acc.concat(parentAutofocusables(node, visibilityCache)); }, []);\n};\n","import { NEW_FOCUS, newFocus } from './solver';\nimport { getAllAffectedNodes } from './utils/all-affected';\nimport { getAllTabbableNodes, getTabbableNodes } from './utils/DOMutils';\nimport { pickFirstFocus } from './utils/firstFocus';\nimport { isDefined, isNotAGuard } from './utils/is';\nimport { allParentAutofocusables, getTopCommonParent } from './utils/parenting';\nvar findAutoFocused = function (autoFocusables) { return function (node) {\n return node.autofocus || (node.dataset && !!node.dataset.autofocus) || autoFocusables.indexOf(node) >= 0;\n}; };\nvar reorderNodes = function (srcNodes, dstNodes) {\n var remap = new Map();\n dstNodes.forEach(function (entity) { return remap.set(entity.node, entity); });\n return srcNodes.map(function (node) { return remap.get(node); }).filter(isDefined);\n};\nexport var getFocusMerge = function (topNode, lastNode) {\n var activeElement = (document && document.activeElement);\n var entries = getAllAffectedNodes(topNode).filter(isNotAGuard);\n var commonParent = getTopCommonParent(activeElement || topNode, topNode, entries);\n var visibilityCache = new Map();\n var anyFocusable = getAllTabbableNodes(entries, visibilityCache);\n var innerElements = getTabbableNodes(entries, visibilityCache).filter(function (_a) {\n var node = _a.node;\n return isNotAGuard(node);\n });\n if (!innerElements[0]) {\n innerElements = anyFocusable;\n if (!innerElements[0]) {\n return undefined;\n }\n }\n var outerNodes = getAllTabbableNodes([commonParent], visibilityCache).map(function (_a) {\n var node = _a.node;\n return node;\n });\n var orderedInnerElements = reorderNodes(outerNodes, innerElements);\n var innerNodes = orderedInnerElements.map(function (_a) {\n var node = _a.node;\n return node;\n });\n var newId = newFocus(innerNodes, outerNodes, activeElement, lastNode);\n if (newId === NEW_FOCUS) {\n var autoFocusable = anyFocusable\n .map(function (_a) {\n var node = _a.node;\n return node;\n })\n .filter(findAutoFocused(allParentAutofocusables(entries, visibilityCache)));\n return {\n node: autoFocusable && autoFocusable.length ? pickFirstFocus(autoFocusable) : pickFirstFocus(innerNodes),\n };\n }\n if (newId === undefined) {\n return newId;\n }\n return orderedInnerElements[newId];\n};\n","import { getFocusMerge } from './focusMerge';\nexport var focusOn = function (target) {\n target.focus();\n if ('contentWindow' in target && target.contentWindow) {\n target.contentWindow.focus();\n }\n};\nvar guardCount = 0;\nvar lockDisabled = false;\nexport var setFocus = function (topNode, lastNode) {\n var focusable = getFocusMerge(topNode, lastNode);\n if (lockDisabled) {\n return;\n }\n if (focusable) {\n if (guardCount > 2) {\n console.error('FocusLock: focus-fighting detected. Only one focus management system could be active. ' +\n 'See https://github.com/theKashey/focus-lock/#focus-fighting');\n lockDisabled = true;\n setTimeout(function () {\n lockDisabled = false;\n }, 1);\n return;\n }\n guardCount++;\n focusOn(focusable.node);\n guardCount--;\n }\n};\n","import * as constants from './constants';\nimport { getFocusabledIn } from './focusables';\nimport { focusInside } from './focusInside';\nimport { focusIsHidden } from './focusIsHidden';\nimport { getFocusMerge as focusMerge } from './focusMerge';\nimport { setFocus } from './setFocus';\nimport { focusNextElement, focusPrevElement } from './sibling';\nimport tabHook from './tabHook';\nimport { getAllAffectedNodes } from './utils/all-affected';\nexport { tabHook, focusInside, focusIsHidden, focusMerge, getFocusabledIn, constants, getAllAffectedNodes, focusNextElement, focusPrevElement, };\nexport default setFocus;\n","export function deferAction(action) {\n // Hidding setImmediate from Webpack to avoid inserting polyfill\n var _window = window,\n setImmediate = _window.setImmediate;\n\n if (typeof setImmediate !== 'undefined') {\n setImmediate(action);\n } else {\n setTimeout(action, 1);\n }\n}\nexport var inlineProp = function inlineProp(name, value) {\n var obj = {};\n obj[name] = value;\n return obj;\n};","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport withSideEffect from 'react-clientside-effect';\nimport moveFocusInside, { focusInside, focusIsHidden, getFocusabledIn } from 'focus-lock';\nimport { deferAction } from './util';\nimport { mediumFocus, mediumBlur, mediumEffect } from './medium';\n\nvar focusOnBody = function focusOnBody() {\n return document && document.activeElement === document.body;\n};\n\nvar isFreeFocus = function isFreeFocus() {\n return focusOnBody() || focusIsHidden();\n};\n\nvar lastActiveTrap = null;\nvar lastActiveFocus = null;\nvar lastPortaledElement = null;\nvar focusWasOutsideWindow = false;\n\nvar defaultWhitelist = function defaultWhitelist() {\n return true;\n};\n\nvar focusWhitelisted = function focusWhitelisted(activeElement) {\n return (lastActiveTrap.whiteList || defaultWhitelist)(activeElement);\n};\n\nvar recordPortal = function recordPortal(observerNode, portaledElement) {\n lastPortaledElement = {\n observerNode: observerNode,\n portaledElement: portaledElement\n };\n};\n\nvar focusIsPortaledPair = function focusIsPortaledPair(element) {\n return lastPortaledElement && lastPortaledElement.portaledElement === element;\n};\n\nfunction autoGuard(startIndex, end, step, allNodes) {\n var lastGuard = null;\n var i = startIndex;\n\n do {\n var item = allNodes[i];\n\n if (item.guard) {\n if (item.node.dataset.focusAutoGuard) {\n lastGuard = item;\n }\n } else if (item.lockItem) {\n if (i !== startIndex) {\n // we will tab to the next element\n return;\n }\n\n lastGuard = null;\n } else {\n break;\n }\n } while ((i += step) !== end);\n\n if (lastGuard) {\n lastGuard.node.tabIndex = 0;\n }\n}\n\nvar extractRef = function extractRef(ref) {\n return ref && 'current' in ref ? ref.current : ref;\n};\n\nvar focusWasOutside = function focusWasOutside(crossFrameOption) {\n if (crossFrameOption) {\n // with cross frame return true for any value\n return Boolean(focusWasOutsideWindow);\n } // in other case return only of focus went a while aho\n\n\n return focusWasOutsideWindow === 'meanwhile';\n};\n\nvar activateTrap = function activateTrap() {\n var result = false;\n\n if (lastActiveTrap) {\n var _lastActiveTrap = lastActiveTrap,\n observed = _lastActiveTrap.observed,\n persistentFocus = _lastActiveTrap.persistentFocus,\n autoFocus = _lastActiveTrap.autoFocus,\n shards = _lastActiveTrap.shards,\n crossFrame = _lastActiveTrap.crossFrame;\n var workingNode = observed || lastPortaledElement && lastPortaledElement.portaledElement;\n var activeElement = document && document.activeElement;\n\n if (workingNode) {\n var workingArea = [workingNode].concat(shards.map(extractRef).filter(Boolean));\n\n if (!activeElement || focusWhitelisted(activeElement)) {\n if (persistentFocus || focusWasOutside(crossFrame) || !isFreeFocus() || !lastActiveFocus && autoFocus) {\n if (workingNode && !(focusInside(workingArea) || focusIsPortaledPair(activeElement, workingNode))) {\n if (document && !lastActiveFocus && activeElement && !autoFocus) {\n // Check if blur() exists, which is missing on certain elements on IE\n if (activeElement.blur) {\n activeElement.blur();\n }\n\n document.body.focus();\n } else {\n result = moveFocusInside(workingArea, lastActiveFocus);\n lastPortaledElement = {};\n }\n }\n\n focusWasOutsideWindow = false;\n lastActiveFocus = document && document.activeElement;\n }\n }\n\n if (document) {\n var newActiveElement = document && document.activeElement;\n var allNodes = getFocusabledIn(workingArea);\n var focusedIndex = allNodes.map(function (_ref) {\n var node = _ref.node;\n return node;\n }).indexOf(newActiveElement);\n\n if (focusedIndex > -1) {\n // remove old focus\n allNodes.filter(function (_ref2) {\n var guard = _ref2.guard,\n node = _ref2.node;\n return guard && node.dataset.focusAutoGuard;\n }).forEach(function (_ref3) {\n var node = _ref3.node;\n return node.removeAttribute('tabIndex');\n });\n autoGuard(focusedIndex, allNodes.length, +1, allNodes);\n autoGuard(focusedIndex, -1, -1, allNodes);\n }\n }\n }\n }\n\n return result;\n};\n\nvar onTrap = function onTrap(event) {\n if (activateTrap() && event) {\n // prevent scroll jump\n event.stopPropagation();\n event.preventDefault();\n }\n};\n\nvar onBlur = function onBlur() {\n return deferAction(activateTrap);\n};\n\nvar onFocus = function onFocus(event) {\n // detect portal\n var source = event.target;\n var currentNode = event.currentTarget;\n\n if (!currentNode.contains(source)) {\n recordPortal(currentNode, source);\n }\n};\n\nvar FocusWatcher = function FocusWatcher() {\n return null;\n};\n\nvar FocusTrap = function FocusTrap(_ref4) {\n var children = _ref4.children;\n return /*#__PURE__*/React.createElement(\"div\", {\n onBlur: onBlur,\n onFocus: onFocus\n }, children);\n};\n\nFocusTrap.propTypes = process.env.NODE_ENV !== \"production\" ? {\n children: PropTypes.node.isRequired\n} : {};\n\nvar onWindowBlur = function onWindowBlur() {\n focusWasOutsideWindow = 'just'; // using setTimeout to set this variable after React/sidecar reaction\n\n setTimeout(function () {\n focusWasOutsideWindow = 'meanwhile';\n }, 0);\n};\n\nvar attachHandler = function attachHandler() {\n document.addEventListener('focusin', onTrap, true);\n document.addEventListener('focusout', onBlur);\n window.addEventListener('blur', onWindowBlur);\n};\n\nvar detachHandler = function detachHandler() {\n document.removeEventListener('focusin', onTrap, true);\n document.removeEventListener('focusout', onBlur);\n window.removeEventListener('blur', onWindowBlur);\n};\n\nfunction reducePropsToState(propsList) {\n return propsList.filter(function (_ref5) {\n var disabled = _ref5.disabled;\n return !disabled;\n });\n}\n\nfunction handleStateChangeOnClient(traps) {\n var trap = traps.slice(-1)[0];\n\n if (trap && !lastActiveTrap) {\n attachHandler();\n }\n\n var lastTrap = lastActiveTrap;\n var sameTrap = lastTrap && trap && trap.id === lastTrap.id;\n lastActiveTrap = trap;\n\n if (lastTrap && !sameTrap) {\n lastTrap.onDeactivation(); // return focus only of last trap was removed\n\n if (!traps.filter(function (_ref6) {\n var id = _ref6.id;\n return id === lastTrap.id;\n }).length) {\n // allow defer is no other trap is awaiting restore\n lastTrap.returnFocus(!trap);\n }\n }\n\n if (trap) {\n lastActiveFocus = null;\n\n if (!sameTrap || lastTrap.observed !== trap.observed) {\n trap.onActivation();\n }\n\n activateTrap(true);\n deferAction(activateTrap);\n } else {\n detachHandler();\n lastActiveFocus = null;\n }\n} // bind medium\n\n\nmediumFocus.assignSyncMedium(onFocus);\nmediumBlur.assignMedium(onBlur);\nmediumEffect.assignMedium(function (cb) {\n return cb({\n moveFocusInside: moveFocusInside,\n focusInside: focusInside\n });\n});\nexport default withSideEffect(reducePropsToState, handleStateChangeOnClient)(FocusWatcher);","import { FOCUS_ALLOW } from './constants';\nimport { toArray } from './utils/array';\nexport var focusIsHidden = function () {\n return document &&\n toArray(document.querySelectorAll(\"[\" + FOCUS_ALLOW + \"]\")).some(function (node) { return node.contains(document.activeElement); });\n};\n","import { getAllAffectedNodes } from './utils/all-affected';\nimport { getTabbableNodes } from './utils/DOMutils';\nimport { isGuard, isNotAGuard } from './utils/is';\nimport { getTopCommonParent } from './utils/parenting';\nexport var getFocusabledIn = function (topNode) {\n var entries = getAllAffectedNodes(topNode).filter(isNotAGuard);\n var commonParent = getTopCommonParent(topNode, topNode, entries);\n var visibilityCache = new Map();\n var outerNodes = getTabbableNodes([commonParent], visibilityCache, true);\n var innerElements = getTabbableNodes(entries, visibilityCache)\n .filter(function (_a) {\n var node = _a.node;\n return isNotAGuard(node);\n })\n .map(function (_a) {\n var node = _a.node;\n return node;\n });\n return outerNodes.map(function (_a) {\n var node = _a.node, index = _a.index;\n return ({\n node: node,\n index: index,\n lockItem: innerElements.indexOf(node) >= 0,\n guard: isGuard(node),\n });\n });\n};\n","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport FocusLockUI from './Lock';\nimport FocusTrap from './Trap';\n/* that would be a BREAKING CHANGE!\n// delaying sidecar execution till the first usage\nconst RequireSideCar = (props) => {\n // eslint-disable-next-line global-require\n const SideCar = require('./Trap').default;\n return ;\n};\n*/\n\nvar FocusLockCombination = /*#__PURE__*/React.forwardRef(function FocusLockUICombination(props, ref) {\n return /*#__PURE__*/React.createElement(FocusLockUI, _extends({\n sideCar: FocusTrap,\n ref: ref\n }, props));\n});\n\nvar _ref = FocusLockUI.propTypes || {},\n sideCar = _ref.sideCar,\n propTypes = _objectWithoutPropertiesLoose(_ref, [\"sideCar\"]);\n\nFocusLockCombination.propTypes = process.env.NODE_ENV !== \"production\" ? propTypes : {};\nexport default FocusLockCombination;","import 'focus-outline-manager';\nimport React, { useState, useEffect, useRef, createRef, Component } from 'react';\nimport cn from 'classnames';\nimport scrollSmooth from 'scroll-smooth';\nimport Scrollparent from 'scrollparent';\nimport debounce from 'lodash.debounce';\nimport FocusLock from 'react-focus-lock';\nimport styled, { createGlobalStyle } from 'styled-components';\nimport PropTypes from 'prop-types';\nimport { createPortal } from 'react-dom';\n\nfunction ownKeys(object, enumerableOnly) {\n var keys = Object.keys(object);\n\n if (Object.getOwnPropertySymbols) {\n var symbols = Object.getOwnPropertySymbols(object);\n\n if (enumerableOnly) {\n symbols = symbols.filter(function (sym) {\n return Object.getOwnPropertyDescriptor(object, sym).enumerable;\n });\n }\n\n keys.push.apply(keys, symbols);\n }\n\n return keys;\n}\n\nfunction _objectSpread2(target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i] != null ? arguments[i] : {};\n\n if (i % 2) {\n ownKeys(Object(source), true).forEach(function (key) {\n _defineProperty(target, key, source[key]);\n });\n } else if (Object.getOwnPropertyDescriptors) {\n Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));\n } else {\n ownKeys(Object(source)).forEach(function (key) {\n Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));\n });\n }\n }\n\n return target;\n}\n\nfunction _classCallCheck(instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n}\n\nfunction _defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n}\n\nfunction _createClass(Constructor, protoProps, staticProps) {\n if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n if (staticProps) _defineProperties(Constructor, staticProps);\n return Constructor;\n}\n\nfunction _defineProperty(obj, key, value) {\n if (key in obj) {\n Object.defineProperty(obj, key, {\n value: value,\n enumerable: true,\n configurable: true,\n writable: true\n });\n } else {\n obj[key] = value;\n }\n\n return obj;\n}\n\nfunction _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function\");\n }\n\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n writable: true,\n configurable: true\n }\n });\n if (superClass) _setPrototypeOf(subClass, superClass);\n}\n\nfunction _getPrototypeOf(o) {\n _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {\n return o.__proto__ || Object.getPrototypeOf(o);\n };\n return _getPrototypeOf(o);\n}\n\nfunction _setPrototypeOf(o, p) {\n _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n };\n\n return _setPrototypeOf(o, p);\n}\n\nfunction _isNativeReflectConstruct() {\n if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n if (Reflect.construct.sham) return false;\n if (typeof Proxy === \"function\") return true;\n\n try {\n Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n return true;\n } catch (e) {\n return false;\n }\n}\n\nfunction _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return self;\n}\n\nfunction _possibleConstructorReturn(self, call) {\n if (call && (typeof call === \"object\" || typeof call === \"function\")) {\n return call;\n }\n\n return _assertThisInitialized(self);\n}\n\nfunction _createSuper(Derived) {\n var hasNativeReflectConstruct = _isNativeReflectConstruct();\n\n return function _createSuperInternal() {\n var Super = _getPrototypeOf(Derived),\n result;\n\n if (hasNativeReflectConstruct) {\n var NewTarget = _getPrototypeOf(this).constructor;\n\n result = Reflect.construct(Super, arguments, NewTarget);\n } else {\n result = Super.apply(this, arguments);\n }\n\n return _possibleConstructorReturn(this, result);\n };\n}\n\nfunction _taggedTemplateLiteral(strings, raw) {\n if (!raw) {\n raw = strings.slice(0);\n }\n\n return Object.freeze(Object.defineProperties(strings, {\n raw: {\n value: Object.freeze(raw)\n }\n }));\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"];\n\n if (_i == null) return;\n var _arr = [];\n var _n = true;\n var _d = false;\n\n var _s, _e;\n\n try {\n for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {\n _arr.push(_s.value);\n\n if (i && _arr.length === i) break;\n }\n } catch (err) {\n _d = true;\n _e = err;\n } finally {\n try {\n if (!_n && _i[\"return\"] != null) _i[\"return\"]();\n } finally {\n if (_d) throw _e;\n }\n }\n\n return _arr;\n}\n\nfunction _unsupportedIterableToArray(o, minLen) {\n if (!o) return;\n if (typeof o === \"string\") return _arrayLikeToArray(o, minLen);\n var n = Object.prototype.toString.call(o).slice(8, -1);\n if (n === \"Object\" && o.constructor) n = o.constructor.name;\n if (n === \"Map\" || n === \"Set\") return Array.from(o);\n if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);\n}\n\nfunction _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n\n for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];\n\n return arr2;\n}\n\nfunction _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n}\n\nfunction _createForOfIteratorHelper(o, allowArrayLike) {\n var it = typeof Symbol !== \"undefined\" && o[Symbol.iterator] || o[\"@@iterator\"];\n\n if (!it) {\n if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === \"number\") {\n if (it) o = it;\n var i = 0;\n\n var F = function () {};\n\n return {\n s: F,\n n: function () {\n if (i >= o.length) return {\n done: true\n };\n return {\n done: false,\n value: o[i++]\n };\n },\n e: function (e) {\n throw e;\n },\n f: F\n };\n }\n\n throw new TypeError(\"Invalid attempt to iterate non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n }\n\n var normalCompletion = true,\n didErr = false,\n err;\n return {\n s: function () {\n it = it.call(o);\n },\n n: function () {\n var step = it.next();\n normalCompletion = step.done;\n return step;\n },\n e: function (e) {\n didErr = true;\n err = e;\n },\n f: function () {\n try {\n if (!normalCompletion && it.return != null) it.return();\n } finally {\n if (didErr) throw err;\n }\n }\n };\n}\n\nvar _templateObject$9;\nvar GlobalStyle = createGlobalStyle(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteral([\"\\n .focus-outline-hidden :focus {\\n outline: none;\\n }\\n\"])));\n\nvar _templateObject$8;\nvar SvgButton = styled.button(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteral([\"\\n display: block;\\n padding: 0;\\n border: 0;\\n background: none;\\n font-size: 0;\\n cursor: \", \";\\n\"])), function (props) {\n return props.disabled ? 'not-allowed' : 'pointer';\n});\n\nvar _templateObject$7, _templateObject2;\nvar Label = styled.span(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral([\"\\n font-size: 12px;\\n line-height: 1;\\n\"])));\n\nfunction Arrow(_ref) {\n var className = _ref.className,\n onClick = _ref.onClick,\n inverted = _ref.inverted,\n label = _ref.label,\n disabled = _ref.disabled;\n return /*#__PURE__*/React.createElement(SvgButton, {\n className: className,\n onClick: onClick,\n \"data-tour-elem\": \"\".concat(inverted ? 'right' : 'left', \"-arrow\"),\n disabled: disabled\n }, label ? /*#__PURE__*/React.createElement(Label, null, label) : /*#__PURE__*/React.createElement(\"svg\", {\n viewBox: \"0 0 18.4 14.4\"\n }, /*#__PURE__*/React.createElement(\"path\", {\n d: inverted ? 'M17 7.2H1M10.8 1L17 7.2l-6.2 6.2' : 'M1.4 7.2h16M7.6 1L1.4 7.2l6.2 6.2',\n fill: \"none\",\n stroke: \"currentColor\",\n strokeWidth: \"2\",\n strokeLinecap: \"round\",\n strokeMiterlimit: \"10\"\n })));\n}\n\nArrow.propTypes = {\n className: PropTypes.string.isRequired,\n onClick: PropTypes.func.isRequired,\n inverted: PropTypes.bool,\n label: PropTypes.node,\n disabled: PropTypes.bool\n};\nvar Arrow$1 = styled(Arrow)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral([\"\\n color: \", \";\\n\\n \", \";\\n \", \";\\n\\n &:hover {\\n color: \", \";\\n }\\n\"])), function (props) {\n return props.disabled ? '#caccce' : '#646464';\n}, function (props) {\n return props.inverted ? 'margin-left: 24px;' : 'margin-right: 24px;';\n}, function (props) {\n return !props.label && \"\\n width: 16px;\\n height: 12px;\\n flex: 0 0 16px;\\n \";\n}, function (props) {\n return props.disabled ? '#caccce' : '#000';\n});\n\nvar _templateObject$6;\n\nfunction Close(_ref) {\n var className = _ref.className,\n onClick = _ref.onClick,\n ariaLabel = _ref.ariaLabel;\n return /*#__PURE__*/React.createElement(SvgButton, {\n className: className,\n onClick: onClick,\n \"aria-label\": ariaLabel\n }, /*#__PURE__*/React.createElement(\"svg\", {\n viewBox: \"0 0 9.1 9.1\",\n \"aria-hidden\": true,\n role: \"presentation\"\n }, /*#__PURE__*/React.createElement(\"path\", {\n fill: \"currentColor\",\n d: \"M5.9 4.5l2.8-2.8c.4-.4.4-1 0-1.4-.4-.4-1-.4-1.4 0L4.5 3.1 1.7.3C1.3-.1.7-.1.3.3c-.4.4-.4 1 0 1.4l2.8 2.8L.3 7.4c-.4.4-.4 1 0 1.4.2.2.4.3.7.3s.5-.1.7-.3L4.5 6l2.8 2.8c.3.2.5.3.8.3s.5-.1.7-.3c.4-.4.4-1 0-1.4L5.9 4.5z\"\n })));\n}\n\nClose.propTypes = {\n className: PropTypes.string.isRequired,\n onClick: PropTypes.func.isRequired,\n ariaLabel: PropTypes.string\n};\nvar StyledClose = styled(Close)(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral([\"\\n position: absolute;\\n top: 22px;\\n right: 22px;\\n width: 9px;\\n height: 9px;\\n color: #5e5e5e;\\n &:hover {\\n color: #000;\\n }\\n\"])));\n\nfunction getNodeRect(node) {\n var _node$getBoundingClie = node.getBoundingClientRect(),\n top = _node$getBoundingClie.top,\n right = _node$getBoundingClie.right,\n bottom = _node$getBoundingClie.bottom,\n left = _node$getBoundingClie.left,\n width = _node$getBoundingClie.width,\n height = _node$getBoundingClie.height;\n\n return {\n top: top,\n right: right,\n bottom: bottom,\n left: left,\n width: width,\n height: height\n };\n}\nfunction getHighlightedRect(node, step) {\n if (!step.highlightedSelectors) {\n return getNodeRect(node);\n }\n\n var attrs = getNodeRect(node);\n\n var _iterator = _createForOfIteratorHelper(step.highlightedSelectors),\n _step;\n\n try {\n for (_iterator.s(); !(_step = _iterator.n()).done;) {\n var selector = _step.value;\n var element = document.querySelector(selector);\n\n if (!element || element.style.display === 'none' || element.style.visibility === 'hidden') {\n continue;\n }\n\n var rect = getNodeRect(element);\n\n if (rect.top < attrs.top) {\n attrs.top = rect.top;\n }\n\n if (rect.right > attrs.right) {\n attrs.right = rect.right;\n }\n\n if (rect.bottom > attrs.bottom) {\n attrs.bottom = rect.bottom;\n }\n\n if (rect.left < attrs.left) {\n attrs.left = rect.left;\n }\n }\n } catch (err) {\n _iterator.e(err);\n } finally {\n _iterator.f();\n }\n\n attrs.width = attrs.right - attrs.left;\n attrs.height = attrs.bottom - attrs.top;\n return attrs;\n}\nfunction inView(_ref) {\n var top = _ref.top,\n right = _ref.right,\n bottom = _ref.bottom,\n left = _ref.left,\n w = _ref.w,\n h = _ref.h,\n _ref$threshold = _ref.threshold,\n threshold = _ref$threshold === void 0 ? 0 : _ref$threshold;\n return top >= 0 + threshold && left >= 0 + threshold && bottom <= h - threshold && right <= w - threshold;\n}\nfunction isBody(node) {\n return node === document.querySelector('body') || node === document.querySelector('html');\n}\nvar isHoriz = function isHoriz(pos) {\n return /(left|right)/.test(pos);\n};\nvar isOutsideX = function isOutsideX(val, windowWidth) {\n return val > windowWidth;\n};\nvar isOutsideY = function isOutsideY(val, windowHeight) {\n return val > windowHeight;\n};\nvar safe = function safe(sum) {\n return sum < 0 ? 0 : sum;\n};\nfunction bestPositionOf(positions) {\n return Object.keys(positions).map(function (p) {\n return {\n position: p,\n value: positions[p]\n };\n }).sort(function (a, b) {\n return b.value - a.value;\n }).map(function (p) {\n return p.position;\n });\n}\n\nvar _templateObject$5;\nvar Guide = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteral([\"\\n --reactour-accent: \", \";\\n \", \"\\n position: fixed;\\n transition: transform 0.3s;\\n top: 0;\\n left: 0;\\n z-index: 1000000;\\n\\n transform: \", \";\\n\"])), function (props) {\n return props.accentColor;\n}, function (props) {\n return props.defaultStyles ? \"\\n max-width: 331px;\\n min-width: 150px;\\n padding-right: 40px;\\n border-radius: \".concat(props.rounded, \"px;\\n background-color: #fff;\\n padding: 24px 30px;\\n box-shadow: 0 0.5em 3em rgba(0, 0, 0, 0.3);\\n color: inherit;\\n \") : '';\n}, function (props) {\n var targetTop = props.targetTop,\n targetRight = props.targetRight,\n targetBottom = props.targetBottom,\n targetLeft = props.targetLeft,\n windowWidth = props.windowWidth,\n windowHeight = props.windowHeight,\n helperWidth = props.helperWidth,\n helperHeight = props.helperHeight,\n helperPosition = props.helperPosition,\n padding = props.padding;\n var available = {\n left: targetLeft,\n right: windowWidth - targetRight,\n top: targetTop,\n bottom: windowHeight - targetBottom\n };\n\n var couldPositionAt = function couldPositionAt(position) {\n return available[position] > (isHoriz(position) ? helperWidth + padding * 2 : helperHeight + padding * 2);\n };\n\n var autoPosition = function autoPosition(coords) {\n var positionsOrder = bestPositionOf(available);\n\n for (var j = 0; j < positionsOrder.length; j++) {\n if (couldPositionAt(positionsOrder[j])) {\n return coords[positionsOrder[j]];\n }\n }\n\n return coords.center;\n };\n\n var pos = function pos(helperPosition) {\n if (Array.isArray(helperPosition)) {\n var isOutX = isOutsideX(helperPosition[0], windowWidth);\n var isOutY = isOutsideY(helperPosition[1], windowHeight);\n\n var warn = function warn(axis, num) {\n console.warn(\"\".concat(axis, \":\").concat(num, \" is outside window, falling back to center\"));\n };\n\n if (isOutX) warn('x', helperPosition[0]);\n if (isOutY) warn('y', helperPosition[1]);\n return [isOutX ? windowWidth / 2 - helperWidth / 2 : helperPosition[0], isOutY ? windowHeight / 2 - helperHeight / 2 : helperPosition[1]];\n }\n\n var hX = isOutsideX(targetLeft + helperWidth, windowWidth) ? isOutsideX(targetRight + padding, windowWidth) ? targetRight - helperWidth : targetRight - helperWidth + padding : targetLeft - padding;\n var x = hX > padding ? hX : padding;\n var hY = isOutsideY(targetTop + helperHeight, windowHeight) ? isOutsideY(targetBottom + padding, windowHeight) ? targetBottom - helperHeight : targetBottom - helperHeight + padding : targetTop - padding;\n var y = hY > padding ? hY : padding;\n var coords = {\n top: [x, targetTop - helperHeight - padding * 2],\n right: [targetRight + padding * 2, y],\n bottom: [x, targetBottom + padding * 2],\n left: [targetLeft - helperWidth - padding * 2, y],\n center: [windowWidth / 2 - helperWidth / 2, windowHeight / 2 - helperHeight / 2]\n };\n\n if (helperPosition === 'center' || couldPositionAt(helperPosition)) {\n return coords[helperPosition];\n }\n\n return autoPosition(coords);\n };\n\n var p = pos(helperPosition);\n return \"translate(\".concat(Math.round(p[0]), \"px, \").concat(Math.round(p[1]), \"px)\");\n});\n\nvar _templateObject$4;\nvar Badge = styled.span(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral([\"\\n position: absolute;\\n font-family: monospace;\\n background: var(--reactour-accent);\\n background: \", \";\\n height: 1.875em;\\n line-height: 2;\\n padding-left: 0.8125em;\\n padding-right: 0.8125em;\\n font-size: 1em;\\n border-radius: 1.625em;\\n color: white;\\n text-align: center;\\n box-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.3);\\n top: -0.8125em;\\n left: -0.8125em;\\n\"])), function (props) {\n return props.accentColor;\n});\n\nvar _templateObject$3;\nvar Controls = styled.div(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral([\"\\n display: flex;\\n margin-top: 24px;\\n align-items: center;\\n justify-content: center;\\n\"])));\n\nvar _templateObject$2;\nvar Navigation = styled.nav(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral([\"\\n counter-reset: dot;\\n display: flex;\\n justify-content: center;\\n align-items: center;\\n flex-wrap: wrap;\\n\"])));\n\nvar _templateObject$1;\nvar Dot = styled.button(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral([\"\\n counter-increment: dot;\\n width: 8px;\\n height: 8px;\\n border: \", \";\\n\\n border-radius: 100%;\\n padding: 0;\\n display: block;\\n margin: 4px;\\n transition: opacity 0.3s, transform 0.3s;\\n cursor: \", \";\\n transform: scale(\", \");\\n\\n color: \", \";\\n background: \", \";\\n\\n color: \", \";\\n background: \", \";\\n\\n &:before {\\n content: counter(dot);\\n position: absolute;\\n bottom: calc(100% + 0.25em);\\n left: 50%;\\n opacity: 0;\\n transform: translate(-50%, 1em);\\n transition: 0.3s;\\n display: \", \";\\n }\\n\\n &:hover {\\n background-color: currentColor;\\n\\n &:before {\\n opacity: 0.5;\\n transform: translate(-50%, -2px);\\n }\\n }\\n\"])), function (props) {\n return props.current === props.index ? '0' : '1px solid #caccce';\n}, function (props) {\n return props.disabled ? 'not-allowed' : 'pointer';\n}, function (props) {\n return props.current === props.index ? 1.25 : 1;\n}, function (props) {\n return props.current === props.index ? 'var(--reactour-accent)' : '#caccce';\n}, function (props) {\n return props.current === props.index ? 'var(--reactour-accent)' : 'none';\n}, function (props) {\n return props.current === props.index ? props.accentColor : '#caccce';\n}, function (props) {\n return props.current === props.index ? props.accentColor : 'none';\n}, function (props) {\n return props.showNumber ? 'block' : 'none';\n});\n\nvar _templateObject;\nvar SvgMaskWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral([\"\\n opacity: \", \";\\n color: \", \";\\n width: 100%;\\n left: 0;\\n top: 0;\\n height: 100%;\\n position: fixed;\\n z-index: 99999;\\n pointer-events: none;\\n\"])), function (props) {\n return !props.maskClassName && 0.7;\n}, function (props) {\n return !props.maskClassName && '#000';\n});\nfunction SvgMask(_ref) {\n var windowWidth = _ref.windowWidth,\n windowHeight = _ref.windowHeight,\n targetWidth = _ref.targetWidth,\n targetHeight = _ref.targetHeight,\n targetTop = _ref.targetTop,\n targetLeft = _ref.targetLeft,\n padding = _ref.padding,\n rounded = _ref.rounded,\n roundedStep = _ref.roundedStep,\n disableInteraction = _ref.disableInteraction,\n disableInteractionClassName = _ref.disableInteractionClassName,\n className = _ref.className,\n onClick = _ref.onClick,\n highlightedBorder = _ref.highlightedBorder;\n var width = safe(targetWidth + padding * 2);\n var height = safe(targetHeight + padding * 2);\n var top = safe(targetTop - padding);\n var left = safe(targetLeft - padding);\n var roundedRadius = roundedStep ? Math.min(width / 2, height / 2) : rounded;\n return /*#__PURE__*/React.createElement(SvgMaskWrapper, {\n onClick: onClick,\n maskClassName: className\n }, /*#__PURE__*/React.createElement(\"svg\", {\n width: windowWidth,\n height: windowHeight,\n xmlns: \"http://www.w3.org/2000/svg\",\n className: className\n }, /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"mask\", {\n id: \"mask-main\"\n }, /*#__PURE__*/React.createElement(\"rect\", {\n x: 0,\n y: 0,\n width: windowWidth,\n height: windowHeight,\n fill: \"white\"\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: left,\n y: top,\n width: width,\n height: height,\n fill: \"black\"\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: left - 1,\n y: top - 1,\n width: roundedRadius,\n height: roundedRadius,\n fill: \"white\"\n }), /*#__PURE__*/React.createElement(\"circle\", {\n cx: left + roundedRadius,\n cy: top + roundedRadius,\n r: roundedRadius,\n fill: \"black\"\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: left + width - roundedRadius + 1,\n y: top - 1,\n width: roundedRadius,\n height: roundedRadius,\n fill: \"white\"\n }), /*#__PURE__*/React.createElement(\"circle\", {\n cx: left + width - roundedRadius,\n cy: top + roundedRadius,\n r: roundedRadius,\n fill: \"black\"\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: left - 1,\n y: top + height - roundedRadius + 1,\n width: roundedRadius,\n height: roundedRadius,\n fill: \"white\"\n }), /*#__PURE__*/React.createElement(\"circle\", {\n cx: left + roundedRadius,\n cy: top + height - roundedRadius,\n r: roundedRadius,\n fill: \"black\"\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: left + width - roundedRadius + 1,\n y: top + height - roundedRadius + 1,\n width: roundedRadius,\n height: roundedRadius,\n fill: \"white\"\n }), /*#__PURE__*/React.createElement(\"circle\", {\n cx: left + width - roundedRadius,\n cy: top + height - roundedRadius,\n r: roundedRadius,\n fill: \"black \"\n })), /*#__PURE__*/React.createElement(\"clipPath\", {\n id: \"clip-path\"\n }, /*#__PURE__*/React.createElement(\"rect\", {\n x: 0,\n y: 0,\n width: windowWidth,\n height: top\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: 0,\n y: top,\n width: left,\n height: height\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: targetLeft + targetWidth + padding,\n y: top,\n width: safe(windowWidth - targetWidth - left),\n height: height\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: 0,\n y: targetTop + targetHeight + padding,\n width: windowWidth,\n height: safe(windowHeight - targetHeight - top)\n }))), /*#__PURE__*/React.createElement(\"rect\", {\n x: 0,\n y: 0,\n width: windowWidth,\n height: windowHeight,\n fill: \"currentColor\",\n mask: \"url(#mask-main)\"\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: 0,\n y: 0,\n width: windowWidth,\n height: windowHeight,\n fill: \"currentColor\",\n clipPath: \"url(#clip-path)\",\n pointerEvents: \"auto\"\n }), /*#__PURE__*/React.createElement(\"rect\", {\n x: left,\n y: top,\n width: width,\n height: height,\n pointerEvents: \"auto\",\n fill: \"transparent\",\n display: disableInteraction ? 'block' : 'none',\n className: disableInteractionClassName\n }), highlightedBorder && /*#__PURE__*/React.createElement(\"rect\", {\n x: safe(left + highlightedBorder.width / 2.0),\n y: safe(top + highlightedBorder.width / 2.0),\n width: safe(width - highlightedBorder.width),\n height: safe(height - highlightedBorder.width),\n pointerEvents: \"auto\",\n fill: \"none\",\n strokeWidth: highlightedBorder.width,\n stroke: highlightedBorder.color,\n rx: roundedRadius - 2\n })));\n}\nSvgMask.propTypes = {\n windowWidth: PropTypes.number.isRequired,\n windowHeight: PropTypes.number.isRequired,\n targetWidth: PropTypes.number.isRequired,\n targetHeight: PropTypes.number.isRequired,\n targetTop: PropTypes.number.isRequired,\n targetLeft: PropTypes.number.isRequired,\n padding: PropTypes.number.isRequired,\n rounded: PropTypes.number.isRequired,\n roundedStep: PropTypes.bool,\n disableInteraction: PropTypes.bool.isRequired,\n disableInteractionClassName: PropTypes.string.isRequired,\n highlightedBorder: PropTypes.shape({\n color: PropTypes.string.isRequired,\n width: PropTypes.number.isRequired\n })\n};\n\nvar ReactourResizeObserver = (function (_ref) {\n var step = _ref.step,\n refresh = _ref.refresh;\n\n var _useState = useState(0),\n _useState2 = _slicedToArray(_useState, 2),\n mutationsCounter = _useState2[0],\n setMutationsCounter = _useState2[1]; // only use to notify main logic below\n // that a resizeObservable has been added to DOM (or removed from it)\n\n\n useEffect(function () {\n if (!step.resizeObservables) {\n return;\n }\n\n var incrementMutationsCounterIfObservable = function incrementMutationsCounterIfObservable(nodes) {\n var _iterator = _createForOfIteratorHelper(nodes),\n _step;\n\n try {\n var _loop = function _loop() {\n var node = _step.value;\n\n if (!node.attributes) {\n return \"continue\";\n }\n\n var found = step.resizeObservables.find(function (observable) {\n return node.matches(observable) || node.querySelector(observable) != null;\n });\n\n if (found) {\n setMutationsCounter(mutationsCounter + 1);\n }\n };\n\n for (_iterator.s(); !(_step = _iterator.n()).done;) {\n var _ret = _loop();\n\n if (_ret === \"continue\") continue;\n }\n } catch (err) {\n _iterator.e(err);\n } finally {\n _iterator.f();\n }\n };\n\n var mutationObserver = new MutationObserver(function (mutationsList) {\n var _iterator2 = _createForOfIteratorHelper(mutationsList),\n _step2;\n\n try {\n for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {\n var mutation = _step2.value;\n\n if (0 !== mutation.addedNodes.length) {\n incrementMutationsCounterIfObservable(mutation.addedNodes);\n }\n\n if (0 !== mutation.removedNodes.length) {\n incrementMutationsCounterIfObservable(mutation.removedNodes);\n }\n }\n } catch (err) {\n _iterator2.e(err);\n } finally {\n _iterator2.f();\n }\n });\n var observable = document.documentElement || document.body;\n var config = {\n childList: true,\n subtree: true\n };\n mutationObserver.observe(observable, config);\n return function () {\n mutationObserver.disconnect();\n };\n }, [step, mutationsCounter]); // the main logic is here\n\n useEffect(function () {\n if (!step.resizeObservables) {\n return;\n }\n\n var resizeObserver = new ResizeObserver(function (entries) {\n refresh();\n });\n\n var _iterator3 = _createForOfIteratorHelper(step.resizeObservables),\n _step3;\n\n try {\n for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {\n var observable = _step3.value;\n var element = document.querySelector(observable);\n\n if (element) {\n resizeObserver.observe(element);\n }\n }\n } catch (err) {\n _iterator3.e(err);\n } finally {\n _iterator3.f();\n }\n\n return function () {\n resizeObserver.disconnect();\n };\n }, [step, mutationsCounter]);\n return null;\n});\n\nvar ReactourMutationObserver = (function (_ref) {\n var step = _ref.step,\n refresh = _ref.refresh;\n useEffect(function () {\n if (!step.mutationObservables) {\n return;\n }\n\n var refreshHighlightedRegionIfObservable = function refreshHighlightedRegionIfObservable(nodes) {\n var _iterator = _createForOfIteratorHelper(nodes),\n _step;\n\n try {\n var _loop = function _loop() {\n var node = _step.value;\n\n if (!node.attributes) {\n return \"continue\";\n }\n\n var found = step.mutationObservables.find(function (observable) {\n return node.matches(observable) || node.querySelector(observable) != null;\n });\n\n if (found) {\n refresh();\n }\n };\n\n for (_iterator.s(); !(_step = _iterator.n()).done;) {\n var _ret = _loop();\n\n if (_ret === \"continue\") continue;\n }\n } catch (err) {\n _iterator.e(err);\n } finally {\n _iterator.f();\n }\n };\n\n var mutationObserver = new MutationObserver(function (mutationsList) {\n var _iterator2 = _createForOfIteratorHelper(mutationsList),\n _step2;\n\n try {\n for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {\n var mutation = _step2.value;\n\n if (0 !== mutation.addedNodes.length) {\n refreshHighlightedRegionIfObservable(mutation.addedNodes);\n }\n\n if (0 !== mutation.removedNodes.length) {\n refreshHighlightedRegionIfObservable(mutation.removedNodes);\n }\n }\n } catch (err) {\n _iterator2.e(err);\n } finally {\n _iterator2.f();\n }\n });\n var observable = document.documentElement || document.body;\n var config = {\n childList: true,\n subtree: true\n };\n mutationObserver.observe(observable, config);\n return function () {\n mutationObserver.disconnect();\n };\n }, [step]);\n return null;\n});\n\nfunction Portal(_ref) {\n var children = _ref.children;\n var ref = useRef(null);\n\n if (ref.current === null) {\n ref.current = document.createElement('div');\n ref.current.setAttribute('id', '___reactour');\n }\n\n useEffect(function () {\n document.body.appendChild(ref.current);\n return function () {\n document.body.removeChild(ref.current);\n };\n }, [ref]);\n return /*#__PURE__*/createPortal(children, ref.current);\n}\n\nvar propTypes = {\n disableFocusLock: PropTypes.bool,\n badgeContent: PropTypes.func,\n highlightedMaskClassName: PropTypes.string,\n children: PropTypes.oneOfType([PropTypes.node, PropTypes.element]),\n className: PropTypes.string,\n closeButtonAriaLabel: PropTypes.string,\n closeWithMask: PropTypes.bool,\n inViewThreshold: PropTypes.number,\n isOpen: PropTypes.bool.isRequired,\n lastStepNextButton: PropTypes.node,\n maskClassName: PropTypes.string,\n maskSpace: PropTypes.number,\n nextButton: PropTypes.node,\n onAfterOpen: PropTypes.func,\n onBeforeClose: PropTypes.func,\n onRequestClose: PropTypes.func,\n prevButton: PropTypes.node,\n scrollDuration: PropTypes.number,\n scrollOffset: PropTypes.number,\n showButtons: PropTypes.bool,\n showCloseButton: PropTypes.bool,\n showNavigation: PropTypes.bool,\n showNavigationNumber: PropTypes.bool,\n showNumber: PropTypes.bool,\n startAt: PropTypes.number,\n goToStep: PropTypes.number,\n getCurrentStep: PropTypes.func,\n nextStep: PropTypes.func,\n prevStep: PropTypes.func,\n steps: PropTypes.arrayOf(PropTypes.shape({\n selector: PropTypes.string,\n content: PropTypes.oneOfType([PropTypes.node, PropTypes.element, PropTypes.func]).isRequired,\n position: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.oneOf(['top', 'right', 'bottom', 'left', 'center'])]),\n action: PropTypes.func,\n style: PropTypes.object,\n stepInteraction: PropTypes.bool,\n navDotAriaLabel: PropTypes.string,\n roundedStep: PropTypes.bool\n })),\n update: PropTypes.string,\n updateDelay: PropTypes.number,\n disableInteraction: PropTypes.bool,\n disableDotsNavigation: PropTypes.bool,\n disableKeyboardNavigation: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOf(['esc', 'right', 'left'])), PropTypes.bool]),\n rounded: PropTypes.number,\n accentColor: PropTypes.string,\n highlightedBorder: PropTypes.shape({\n color: PropTypes.string.isRequired,\n width: PropTypes.number.isRequired\n })\n};\nvar defaultProps = {\n disableFocusLock: false,\n showNavigation: true,\n showNavigationNumber: true,\n showButtons: true,\n showCloseButton: true,\n closeButtonAriaLabel: 'Close',\n showNumber: true,\n scrollDuration: 1,\n maskSpace: 10,\n updateDelay: 1,\n disableInteraction: false,\n rounded: 0,\n accentColor: '#007aff',\n closeWithMask: true\n};\n\nvar CN = {\n mask: {\n base: 'reactour__mask',\n isOpen: 'reactour__mask--is-open',\n disableInteraction: 'reactour__mask--disable-interaction'\n },\n helper: {\n base: 'reactour__helper',\n isOpen: 'reactour__helper--is-open'\n },\n dot: {\n base: 'reactour__dot',\n active: 'reactour__dot--is-active'\n }\n};\n\nvar Tour = /*#__PURE__*/function (_Component) {\n _inherits(Tour, _Component);\n\n var _super = _createSuper(Tour);\n\n function Tour() {\n var _this;\n\n _classCallCheck(this, Tour);\n\n _this = _super.call(this);\n\n _defineProperty(_assertThisInitialized(_this), \"unlockFocus\", function (callback) {\n _this.setState({\n focusUnlocked: true\n }, callback());\n });\n\n _defineProperty(_assertThisInitialized(_this), \"showStep\", function () {\n if (!_this.helper || !_this.helper.current) return;\n var steps = _this.props.steps;\n var _this$state = _this.state,\n current = _this$state.current,\n focusUnlocked = _this$state.focusUnlocked;\n\n if (focusUnlocked) {\n _this.setState({\n focusUnlocked: false\n });\n }\n\n var step = steps[current];\n var node = step.selector ? document.querySelector(step.selector) : null;\n\n var stepCallback = function stepCallback(o) {\n if (step.action && typeof step.action === 'function') {\n _this.unlockFocus(function () {\n return step.action(o);\n });\n }\n };\n\n if (step.observe) {\n var target = document.querySelector(step.observe);\n var config = {\n attributes: true,\n childList: true,\n characterData: true\n };\n\n _this.setState(function (prevState) {\n if (prevState.observer) {\n setTimeout(function () {\n prevState.observer.disconnect();\n }, 0);\n }\n\n return {\n observer: new MutationObserver(function (mutations) {\n mutations.forEach(function (mutation) {\n if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {\n var cb = function cb() {\n return stepCallback(mutation.addedNodes[0]);\n };\n\n setTimeout(function () {\n return _this.calculateNode(mutation.addedNodes[0], step, cb);\n }, 100);\n } else if (mutation.type === 'childList' && mutation.removedNodes.length > 0) {\n var _cb = function _cb() {\n return stepCallback(node);\n };\n\n _this.calculateNode(node, step, _cb);\n }\n });\n })\n };\n }, function () {\n return _this.state.observer.observe(target, config);\n });\n } else {\n if (_this.state.observer) {\n _this.state.observer.disconnect();\n\n _this.setState({\n observer: null\n });\n }\n }\n\n if (node) {\n var cb = function cb() {\n return stepCallback(node);\n };\n\n _this.calculateNode(node, step, cb);\n } else {\n _this.setState(setNodeState(null, step, _this.helper.current), stepCallback);\n\n step.selector && console.warn(\"Doesn't find a DOM node '\".concat(step.selector, \"'. Please check the 'steps' Tour prop Array at position \").concat(current, \".\"));\n }\n });\n\n _defineProperty(_assertThisInitialized(_this), \"calculateNode\", function (node, step, cb) {\n var _this$props = _this.props,\n scrollDuration = _this$props.scrollDuration,\n inViewThreshold = _this$props.inViewThreshold,\n scrollOffset = _this$props.scrollOffset;\n var attrs = getHighlightedRect(node, step);\n var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);\n var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);\n\n if (!inView(_objectSpread2(_objectSpread2({}, attrs), {}, {\n w: w,\n h: h,\n threshold: inViewThreshold\n }))) {\n var parentScroll = Scrollparent(node);\n var offset = scrollOffset ? scrollOffset : attrs.height > h ? -25 : -(h / 2) + attrs.height / 2;\n scrollSmooth.to(node, {\n context: isBody(parentScroll) ? window : parentScroll,\n duration: scrollDuration,\n offset: offset,\n callback: function callback(nd) {\n _this.setState(setNodeState(nd, step, _this.helper.current), cb);\n }\n });\n } else {\n _this.setState(setNodeState(node, step, _this.helper.current), cb);\n }\n });\n\n _defineProperty(_assertThisInitialized(_this), \"recalculateNode\", function (step) {\n var node = document.querySelector(step.selector);\n\n var stepCallback = function stepCallback(o) {\n if (step.action && typeof step.action === 'function') {\n _this.unlockFocus(function () {\n return step.action(o);\n });\n }\n };\n\n _this.calculateNode(node, step, function () {\n return stepCallback(node);\n });\n });\n\n _defineProperty(_assertThisInitialized(_this), \"maskClickHandler\", function (e) {\n var _this$props2 = _this.props,\n closeWithMask = _this$props2.closeWithMask,\n onRequestClose = _this$props2.onRequestClose;\n\n if (closeWithMask && !e.target.classList.contains(CN.mask.disableInteraction)) {\n onRequestClose(e);\n }\n });\n\n _defineProperty(_assertThisInitialized(_this), \"nextStep\", function () {\n var _this$props3 = _this.props,\n steps = _this$props3.steps,\n getCurrentStep = _this$props3.getCurrentStep;\n\n _this.setState(function (prevState) {\n var nextStep = prevState.current < steps.length - 1 ? prevState.current + 1 : prevState.current;\n\n if (typeof getCurrentStep === 'function') {\n getCurrentStep(nextStep);\n }\n\n return {\n current: nextStep\n };\n }, _this.showStep);\n });\n\n _defineProperty(_assertThisInitialized(_this), \"prevStep\", function () {\n var getCurrentStep = _this.props.getCurrentStep;\n\n _this.setState(function (prevState) {\n var nextStep = prevState.current > 0 ? prevState.current - 1 : prevState.current;\n\n if (typeof getCurrentStep === 'function') {\n getCurrentStep(nextStep);\n }\n\n return {\n current: nextStep\n };\n }, _this.showStep);\n });\n\n _defineProperty(_assertThisInitialized(_this), \"gotoStep\", function (n) {\n var _this$props4 = _this.props,\n steps = _this$props4.steps,\n getCurrentStep = _this$props4.getCurrentStep;\n\n _this.setState(function (prevState) {\n var nextStep = steps[n] ? n : prevState.current;\n\n if (typeof getCurrentStep === 'function') {\n getCurrentStep(nextStep);\n }\n\n return {\n current: nextStep\n };\n }, _this.showStep);\n });\n\n _defineProperty(_assertThisInitialized(_this), \"keyDownHandler\", function (e) {\n var _this$props5 = _this.props,\n onRequestClose = _this$props5.onRequestClose,\n nextStep = _this$props5.nextStep,\n prevStep = _this$props5.prevStep,\n disableKeyboardNavigation = _this$props5.disableKeyboardNavigation;\n e.stopPropagation();\n\n if (disableKeyboardNavigation === true) {\n return;\n }\n\n var isEscDisabled, isRightDisabled, isLeftDisabled;\n\n if (disableKeyboardNavigation) {\n isEscDisabled = disableKeyboardNavigation.includes('esc');\n isRightDisabled = disableKeyboardNavigation.includes('right');\n isLeftDisabled = disableKeyboardNavigation.includes('left');\n }\n\n if (e.keyCode === 27 && !isEscDisabled) {\n // esc\n e.preventDefault();\n onRequestClose();\n }\n\n if (e.keyCode === 39 && !isRightDisabled) {\n // right\n e.preventDefault();\n typeof nextStep === 'function' ? nextStep() : _this.nextStep();\n }\n\n if (e.keyCode === 37 && !isLeftDisabled) {\n // left\n e.preventDefault();\n typeof prevStep === 'function' ? prevStep() : _this.prevStep();\n }\n });\n\n _this.state = {\n isOpen: false,\n current: 0,\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n width: 0,\n height: 0,\n w: 0,\n h: 0,\n inDOM: false,\n observer: null,\n focusUnlocked: false\n };\n _this.helper = /*#__PURE__*/createRef();\n _this.helperElement = null;\n _this.debouncedShowStep = debounce(_this.showStep, 70);\n return _this;\n }\n\n _createClass(Tour, [{\n key: \"componentDidMount\",\n value: function componentDidMount() {\n var _this$props6 = this.props,\n isOpen = _this$props6.isOpen,\n startAt = _this$props6.startAt;\n\n if (isOpen) {\n this.open(startAt);\n }\n }\n }, {\n key: \"UNSAFE_componentWillReceiveProps\",\n value: function UNSAFE_componentWillReceiveProps(nextProps) {\n var _this$props7 = this.props,\n isOpen = _this$props7.isOpen,\n update = _this$props7.update,\n updateDelay = _this$props7.updateDelay;\n\n if (!isOpen && nextProps.isOpen) {\n this.open(nextProps.startAt);\n } else if (isOpen && !nextProps.isOpen) {\n this.close();\n }\n\n if (isOpen && update !== nextProps.update) {\n if (nextProps.steps[this.state.current]) {\n setTimeout(this.showStep, updateDelay);\n } else {\n this.props.onRequestClose();\n }\n }\n\n if (isOpen && nextProps.isOpen && this.state.current !== nextProps.goToStep) {\n this.gotoStep(nextProps.goToStep);\n }\n }\n }, {\n key: \"componentWillUnmount\",\n value: function componentWillUnmount() {\n var isOpen = this.props.isOpen;\n\n if (isOpen) {\n this.close();\n }\n\n if (this.state.observer) {\n this.state.observer.disconnect();\n }\n }\n }, {\n key: \"open\",\n value: function open(startAt) {\n var _this2 = this;\n\n var onAfterOpen = this.props.onAfterOpen;\n this.setState(function (prevState) {\n return {\n isOpen: true,\n current: startAt !== undefined ? startAt : prevState.current\n };\n }, function () {\n setTimeout(_this2.showStep, 1);\n _this2.helperElement = _this2.helper.current;\n if (!_this2.props.disableFocusLock) _this2.helper.current.focus();\n\n if (onAfterOpen) {\n onAfterOpen(_this2.helperElement);\n }\n });\n window.addEventListener('resize', this.debouncedShowStep, false);\n window.addEventListener('keydown', this.keyDownHandler, false);\n }\n }, {\n key: \"close\",\n value: function close() {\n this.setState(function (prevState) {\n if (prevState.observer) {\n prevState.observer.disconnect();\n }\n\n return {\n isOpen: false,\n observer: null\n };\n }, this.onBeforeClose);\n window.removeEventListener('resize', this.debouncedShowStep);\n window.removeEventListener('keydown', this.keyDownHandler);\n }\n }, {\n key: \"onBeforeClose\",\n value: function onBeforeClose() {\n var onBeforeClose = this.props.onBeforeClose;\n\n if (onBeforeClose) {\n onBeforeClose(this.helperElement);\n }\n }\n }, {\n key: \"render\",\n value: function render() {\n var _this3 = this;\n\n var _this$props8 = this.props,\n className = _this$props8.className,\n steps = _this$props8.steps,\n maskClassName = _this$props8.maskClassName,\n showButtons = _this$props8.showButtons,\n showCloseButton = _this$props8.showCloseButton,\n closeButtonAriaLabel = _this$props8.closeButtonAriaLabel,\n showNavigation = _this$props8.showNavigation,\n showNavigationNumber = _this$props8.showNavigationNumber,\n showNumber = _this$props8.showNumber,\n onRequestClose = _this$props8.onRequestClose,\n maskSpace = _this$props8.maskSpace,\n lastStepNextButton = _this$props8.lastStepNextButton,\n nextButton = _this$props8.nextButton,\n prevButton = _this$props8.prevButton,\n badgeContent = _this$props8.badgeContent,\n highlightedMaskClassName = _this$props8.highlightedMaskClassName,\n disableInteraction = _this$props8.disableInteraction,\n disableDotsNavigation = _this$props8.disableDotsNavigation,\n nextStep = _this$props8.nextStep,\n prevStep = _this$props8.prevStep,\n rounded = _this$props8.rounded,\n accentColor = _this$props8.accentColor,\n CustomHelper = _this$props8.CustomHelper,\n disableFocusLock = _this$props8.disableFocusLock,\n highlightedBorder = _this$props8.highlightedBorder;\n var _this$state2 = this.state,\n isOpen = _this$state2.isOpen,\n current = _this$state2.current,\n inDOM = _this$state2.inDOM,\n targetTop = _this$state2.top,\n targetRight = _this$state2.right,\n targetBottom = _this$state2.bottom,\n targetLeft = _this$state2.left,\n targetWidth = _this$state2.width,\n targetHeight = _this$state2.height,\n windowWidth = _this$state2.w,\n windowHeight = _this$state2.h,\n helperWidth = _this$state2.helperWidth,\n helperHeight = _this$state2.helperHeight,\n helperPosition = _this$state2.helperPosition;\n\n if (isOpen) {\n return /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(GlobalStyle, null), /*#__PURE__*/React.createElement(ReactourResizeObserver, {\n step: steps[current],\n refresh: function refresh() {\n return _this3.recalculateNode(steps[current]);\n }\n }), /*#__PURE__*/React.createElement(ReactourMutationObserver, {\n step: steps[current],\n refresh: function refresh() {\n return _this3.recalculateNode(steps[current]);\n }\n }), /*#__PURE__*/React.createElement(SvgMask, {\n onClick: this.maskClickHandler,\n forwardRef: function forwardRef(c) {\n return _this3.mask = c;\n },\n windowWidth: windowWidth,\n windowHeight: windowHeight,\n targetWidth: targetWidth,\n targetHeight: targetHeight,\n targetTop: targetTop,\n targetLeft: targetLeft,\n padding: maskSpace,\n rounded: rounded,\n roundedStep: steps[current].roundedStep,\n className: maskClassName,\n disableInteraction: steps[current].stepInteraction === false || disableInteraction ? !steps[current].stepInteraction : disableInteraction,\n disableInteractionClassName: \"\".concat(CN.mask.disableInteraction, \" \").concat(highlightedMaskClassName),\n highlightedBorder: highlightedBorder\n }), /*#__PURE__*/React.createElement(FocusLock, {\n disabled: disableFocusLock,\n autoFocus: false\n }, /*#__PURE__*/React.createElement(Guide, {\n ref: this.helper,\n targetHeight: targetHeight,\n targetWidth: targetWidth,\n targetTop: targetTop,\n targetRight: targetRight,\n targetBottom: targetBottom,\n targetLeft: targetLeft,\n windowWidth: windowWidth,\n windowHeight: windowHeight,\n helperWidth: helperWidth,\n helperHeight: helperHeight,\n helperPosition: helperPosition,\n padding: maskSpace,\n tabIndex: -1,\n current: current,\n style: steps[current].style ? steps[current].style : {},\n rounded: rounded,\n className: cn(CN.helper.base, className, _defineProperty({}, CN.helper.isOpen, isOpen)),\n accentColor: accentColor,\n defaultStyles: !CustomHelper,\n role: \"dialog\"\n }, CustomHelper ? /*#__PURE__*/React.createElement(CustomHelper, {\n current: current,\n totalSteps: steps.length,\n gotoStep: this.gotoStep,\n close: onRequestClose,\n content: steps[current] && (typeof steps[current].content === 'function' ? steps[current].content({\n close: onRequestClose,\n goTo: this.gotoStep,\n inDOM: inDOM,\n step: current + 1\n }) : steps[current].content)\n }, this.props.children) : /*#__PURE__*/React.createElement(React.Fragment, null, this.props.children, steps[current] && (typeof steps[current].content === 'function' ? steps[current].content({\n close: onRequestClose,\n goTo: this.gotoStep,\n inDOM: inDOM,\n step: current + 1\n }) : steps[current].content), showNumber && /*#__PURE__*/React.createElement(Badge, {\n \"data-tour-elem\": \"badge\",\n accentColor: accentColor\n }, typeof badgeContent === 'function' ? badgeContent(current + 1, steps.length) : current + 1), (showButtons || showNavigation) && /*#__PURE__*/React.createElement(Controls, {\n \"data-tour-elem\": \"controls\"\n }, showButtons && /*#__PURE__*/React.createElement(Arrow$1, {\n onClick: typeof prevStep === 'function' ? prevStep : this.prevStep,\n disabled: current === 0,\n label: prevButton ? prevButton : null\n }), showNavigation && /*#__PURE__*/React.createElement(Navigation, {\n \"data-tour-elem\": \"navigation\"\n }, steps.map(function (s, i) {\n return /*#__PURE__*/React.createElement(Dot, {\n key: \"\".concat(s.selector ? s.selector : 'undef', \"_\").concat(i),\n onClick: function onClick() {\n return _this3.gotoStep(i);\n },\n current: current,\n index: i,\n accentColor: accentColor,\n disabled: current === i || disableDotsNavigation,\n showNumber: showNavigationNumber,\n \"data-tour-elem\": \"dot\",\n className: cn(CN.dot.base, _defineProperty({}, CN.dot.active, current === i)),\n \"aria-label\": s.navDotAriaLabel\n });\n })), showButtons && /*#__PURE__*/React.createElement(Arrow$1, {\n onClick: current === steps.length - 1 ? lastStepNextButton ? onRequestClose : function () {} : typeof nextStep === 'function' ? nextStep : this.nextStep,\n disabled: !lastStepNextButton && current === steps.length - 1,\n inverted: true,\n label: lastStepNextButton && current === steps.length - 1 ? lastStepNextButton : nextButton ? nextButton : null\n })), showCloseButton && /*#__PURE__*/React.createElement(StyledClose, {\n onClick: onRequestClose,\n className: \"reactour__close\",\n ariaLabel: closeButtonAriaLabel\n })))));\n }\n\n return null;\n }\n }]);\n\n return Tour;\n}(Component);\n\nvar setNodeState = function setNodeState(node, step, helper) {\n if (!helper) return;\n var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);\n var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);\n\n var _hx$getNodeRect = getNodeRect(helper),\n helperWidth = _hx$getNodeRect.width,\n helperHeight = _hx$getNodeRect.height;\n\n var attrs = {\n top: h + 10,\n right: w / 2 + 9,\n bottom: h / 2 + 9,\n left: w / 2 - helperWidth / 2,\n width: 0,\n height: 0,\n w: w,\n h: h,\n helperPosition: 'center'\n };\n\n if (node) {\n attrs = getHighlightedRect(node, step);\n }\n\n return function update() {\n return _objectSpread2(_objectSpread2({\n w: w,\n h: h,\n helperWidth: helperWidth,\n helperHeight: helperHeight,\n helperPosition: step.position\n }, attrs), {}, {\n inDOM: node ? true : false\n });\n };\n};\n\nTour.propTypes = propTypes;\nTour.defaultProps = defaultProps;\n\nexport default Tour;\nexport { Arrow$1 as Arrow, Badge, StyledClose as Close, Controls, Dot, Navigation };\n","import FocusLock from './Combination';\nexport * from './UI';\nexport default FocusLock;","import React, { useEffect, useState } from 'react';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { isMobile } from 'react-device-detect';\r\nimport Tour from 'reactour';\r\nimport { navigationTypes } from '../../enums/navigationTypes';\r\nimport { navigationOptions } from '../../actions/globalOptionsActions';\r\nimport { getLocalStorage, setLocalStorage } from '../../utilities/localStorageUtilities';\r\n\r\nconst TourGuide = ({ tourId, steps, requestStart, requestClose, onClose }) => {\r\n const dispatch = useDispatch();\r\n\r\n const { primaryBackgroundColor } = useSelector(state => state.content.cssVariables);\r\n const { count: ajaxCount } = useSelector(state => state.ajaxCall);\r\n const { event: navigationEvent } = useSelector(state => state.globalOptions.navigation);\r\n\r\n const [isTourOpen, setIsTourOpen] = useState(false);\r\n const [currentIndex, setCurrentIndex] = useState(0);\r\n\r\n useEffect(() => {\r\n if (requestStart && steps.length > 0 && ajaxCount === 0) {\r\n let forceStart = false;\r\n\r\n if (navigationEvent === navigationTypes.TOUR) {\r\n forceStart = true;\r\n dispatch(navigationOptions(navigationTypes.NONE));\r\n }\r\n\r\n if (trackTour() || forceStart) {\r\n setIsTourOpen(true);\r\n }\r\n } else {\r\n setIsTourOpen(false);\r\n }\r\n }, [requestStart, ajaxCount]);\r\n\r\n const trackTour = () => {\r\n const localStorageResult = getLocalStorage('tourTracker');\r\n const item = localStorageResult.value;\r\n const tracker = item ? JSON.parse(item) : [];\r\n\r\n const index = tracker.findIndex(e => e.id === tourId);\r\n const trackedItem = { id: tourId, seen: true };\r\n let showTour = false;\r\n\r\n if (index === -1) {\r\n tracker.push(trackedItem);\r\n showTour = true;\r\n } else {\r\n tracker[index] = trackedItem;\r\n }\r\n\r\n setLocalStorage('tourTracker', JSON.stringify(tracker));\r\n\r\n return showTour;\r\n };\r\n\r\n return (\r\n <>\r\n `${step} of ${total}`}\r\n prevButton={\r\n
Back
\r\n }\r\n nextButton={
Next
}\r\n lastStepNextButton={
Done
}\r\n getCurrentStep={index => setCurrentIndex(index)}\r\n startAt={0}\r\n rounded={15}\r\n disableDotsNavigation={true}\r\n disableInteraction={true}\r\n showNavigation={false}\r\n showNavigationNumber={false}\r\n //disableFocusLock={true}\r\n maskSpace={10}\r\n accentColor={primaryBackgroundColor}\r\n children={} // adding space on step header\r\n scrollDuration={500} // need to set this always, even on first step, so page has finished transitioning; otherwise subsquent tour runs will not focus first step element correctly\r\n onAfterOpen={() => {\r\n document.body.style.overflowY = 'hidden';\r\n if (!isMobile) document.body.style.paddingRight = '17px';\r\n }}\r\n onBeforeClose={() => {\r\n document.body.style.overflowY = ''; // need to remove property altogether rather than set overflowY to 'auto' so modal dialogs opened later don't scroll parent\r\n if (!isMobile) document.body.style.paddingRight = '';\r\n if (onClose) onClose();\r\n }}\r\n />\r\n \r\n );\r\n};\r\n\r\nexport default TourGuide;\r\n","var _excluded = [\"title\", \"titleId\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\nimport * as React from \"react\";\nfunction SvgParty(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n viewBox: \"0.392 0.496 127.218 127.03\",\n width: 127.218,\n height: 127.03,\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, /*#__PURE__*/React.createElement(\"g\", null, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M72.59,58.36c-0.65,1.18-1.3,2.37-1.92,3.55l-0.52,0.98l-0.05,0.08c1.83,2.43,3.4,5.04,4.64,7.69 c0.18,0.37,0.35,0.75,0.52,1.13c1.77-0.52,3.55-0.81,5.29-0.88c-1.31-3.47-3.33-7.07-6.3-10.71 C73.73,59.57,73.16,58.97,72.59,58.36z\",\n style: {\n fill: \"#FCC21B\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M77.93,85.16c-0.37,0-0.75,0.02-1.13,0.06c-2.07,6.54-8.79,9.4-15.89,8.52 c-11.15-1.37-21.38-9.85-24.81-20.5c-0.7-2.13-0.94-4.25-1.02-6.51c-0.2-5.82,0.92-12.05,6.75-14.46l0.07-0.03 c0.19-0.08,0.38-0.13,0.57-0.19c-0.42-0.63-0.85-1.29-1.26-2.02c-0.58-1.03-0.93-2.12-1.14-3.18c-6.25,2.18-10.06,7.7-12.73,13.78 C24.79,66.45,8.22,111.2,8.22,111.2l-2.22,6c-0.76,2.08-1.94,4.17-1.94,6.44c0,2.65,2.36,4.46,5.02,3.72 c1.78-0.5,3.74-1.42,5.55-2.14c3.83-1.56,10.93-4.63,10.93-4.63l29.68-12.22c0,0,14.31-5.18,20.33-10.85 c2.92-2.75,5.26-6.71,6.29-11.44c-0.21-0.11-0.43-0.23-0.65-0.32C80.21,85.35,79.14,85.16,77.93,85.16z\",\n style: {\n fill: \"#FCC21B\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M55.68,47.54c0.77,1.47,1.62,3.14,1.94,5.21c1.42,0.6,2.78,1.32,4.07,2.17 c0.45-1.44,0.92-2.86,1.41-4.31c-0.21-0.13-0.42-0.28-0.63-0.4c-2.11-1.2-4.48-2.22-6.95-2.98C55.58,47.34,55.63,47.43,55.68,47.54 z\",\n style: {\n fill: \"#FCC21B\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M111.93,31.98c-0.16,1-0.12,2.42,0.04,3.4c0.17,1.1,0.42,2.27,0.82,3.31 c0.57,1.46,1.27,0.95,2.7,0.75c0.99-0.13,1.91-0.06,2.89-0.26c1.03-0.21,2.05-0.48,3.08-0.68c2.42-0.46,3.63-1,3.12-3.55 c-0.37-1.84-0.98-3.67-1.46-5.49c-0.44-0.39-1.29-0.17-1.81-0.05c-0.92,0.21-1.83,0.26-2.75,0.42c-1.66,0.27-3.4,0.47-5.03,0.86 C112.7,30.87,112.06,31.12,111.93,31.98z\",\n style: {\n fill: \"#D7598B\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M98.87,62c0.38,0.87,1.31,0.65,2.22,0.85c2.02,0.46,4.07,0.41,6.14,0.41c0.77,0,2.72,0.29,3.27-0.4 c0.44-0.56,0.06-1.67,0-2.32c-0.08-0.85-0.16-1.69-0.24-2.54c-0.04-0.4,0.03-3.02-0.31-3.24c-0.58-0.39-1.68-0.2-2.34-0.19 c-1.21,0.04-2.4,0.19-3.63,0.19c-1.59,0-3.31,0.02-4.85,0.4c-0.54,1.43-0.39,2.92-0.39,4.49C98.74,60.38,98.58,61.32,98.87,62z\",\n style: {\n fill: \"#40C0E7\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M91.92,105.19c-0.83-1.23-1.24-2.88-3.09-2.7c-1.74,0.17-3.28,1.55-4.81,2.3 c-0.99,0.48-1.71,1.34-1.91,2.42c-0.23,1.23,0.28,2.21,0.87,3.26c0.44,0.79,0.73,1.7,1.08,2.53c0.36,0.86,0.91,1.63,1.28,2.48 c0.25,0.6,0.17,0.55,0.72,0.76c0.28,0.1,0.74,0.18,1.04,0.19c1.75,0.05,3.65-1.72,4.92-2.76c1.02-0.82,3.06-1.34,2.85-2.89 c-0.15-1.15-0.95-2.26-1.5-3.25C92.91,106.72,92.42,105.94,91.92,105.19z\",\n style: {\n fill: \"#D7598B\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M111.46,113.59c-0.23-0.15-0.45-0.24-0.65-0.27c-1.06-0.19-1.76,1.09-2.6,1.92 c-1.01,0.97-2.21,1.74-3.13,2.8c-0.99,1.16-0.22,2.2,0.8,2.82c1.11,0.67,2.1,1.51,3.2,2.21c0.98,0.63,1.77,1.19,2.86,0.51 c0.99-0.62,1.54-1.71,2.22-2.62c1.26-1.7,3.41-3.07,1.3-4.94C114.28,114.97,112.76,114.45,111.46,113.59z\",\n style: {\n fill: \"#40C0E7\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M9,55.06c0.05-0.46,1.35-4.14,0.96-4.25c-0.89-0.22-1.73-0.64-2.63-0.88 c-1.04-0.27-2.11-0.48-3.08-0.96c-1.17-0.58-1.89-0.29-2.38,0.36c-0.69,0.92-0.91,2.57-1.24,3.58c-0.26,0.79-0.42,1.69,0.14,2.25 c0.64,0.63,1.7,0.99,2.53,1.26c1.04,0.34,2.2,0.94,3.27,1.04C8.03,57.62,8.85,56.3,9,55.06z\",\n style: {\n fill: \"#40C0E7\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M68.63,19.54c1.3,0.58,2.56,0.91,3.89,1.29c0.47,0.14,0.77,0.37,1.26,0.11 c0.63-0.32,1.33-1.43,1.68-2.04c0.83-1.51,1.44-3,2.01-4.59c0.31-0.85,1.23-2.23,1-3.13c-0.2-0.76-1.3-1.23-1.92-1.56 c-0.83-0.43-1.62-1.01-2.46-1.38c-1.08-0.47-2.56-0.98-3.72-1.15c-0.64-0.1-1.09,0.16-1.44,0.57c-0.32,0.37-0.56,0.86-0.8,1.31 c-1.21,2.32-2.7,5.81-2.65,8.49C65.5,18.73,67.67,19.11,68.63,19.54z\",\n style: {\n fill: \"#40C0E7\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M16.65,33.3c0.73,1.12,1.38,2.14,2.24,3.2c0.84,1.02,1.44,1.22,2.47,0.37 c0.65-0.52,1.39-0.93,2.01-1.49c0.59-0.52,1.08-1.18,1.67-1.72c0.42-0.39,1.25-0.78,1.49-1.32c0.33-0.76-0.36-1.42-0.78-1.98 c-0.52-0.7-0.92-1.46-1.49-2.16c-0.73-0.88-1.52-1.71-2.34-2.53c-0.67-0.67-1.48-1.7-2.24-2.22c-0.2-0.13-0.43-0.22-0.67-0.25 c-0.91-0.13-1.99,0.39-2.7,0.81c-0.97,0.57-1.91,1.42-2.76,2.17c-1.33,1.18-0.04,2.73,0.74,3.85 C15.07,31.11,15.91,32.16,16.65,33.3z\",\n style: {\n fill: \"#D7598B\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M16.73,9.97c0.67,0.72,1.5,1.59,2.44,2c0.83,0.37,1.68-0.37,2.35-0.78c0.75-0.46,1.36-1.13,1.92-1.8 c0.51-0.62,1.2-1.29,1.58-2.01c0.44-0.82-0.16-1.13-0.77-1.62c-0.73-0.6-1.47-1.22-2.09-1.94c-0.84-0.98-1.68-2.08-2.57-2.98 c-0.3-0.31-0.66-0.39-1.04-0.32c-1.19,0.2-2.6,1.87-3.3,2.42c-0.56,0.43-1.54,1.19-1.71,1.9c-0.21,0.8,0.26,1.57,0.66,2.24 C14.85,8.16,15.85,9.03,16.73,9.97z\",\n style: {\n fill: \"#40C0E7\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M45.86,29.19c1.38,4.78-2.3,8.47-2.7,13c-0.12,1.31-0.12,2.62,0.1,3.88 c0.14,0.82,0.37,1.62,0.78,2.35c0.54,0.96,1.16,1.83,1.73,2.73c0.56,0.87,1.06,1.75,1.4,2.76c0.75,2.24,0.23,4.26-0.09,6.48 c-0.26,1.77-1.16,3.44-2.24,4.84c-0.33,0.43-1.24,0.98-1.02,1.61c0.03,0.11,0.23,0.15,0.52,0.15c1.2,0,4.03-0.73,4.44-0.92 c1.8-0.87,2.85-2.63,3.78-4.33c1.38-2.52,2.27-5.46,1.88-8.35c-0.08-0.66-0.26-1.28-0.48-1.88c-0.67-1.79-1.78-3.39-2.41-5.22 c-0.08-0.22-0.16-0.44-0.22-0.67c-0.92-3.58,1.29-7.09,3.15-9.94c1.83-2.79,2.52-6.89,1.22-10.09c-0.66-1.62-1.72-3.24-3.01-4.43 c-1.53-1.42-3.86-2.71-3.6-5.16c0.22-2.13,1.66-4.37,2.75-6.13c0.54-0.89,2.24-2.71,2.18-3.73c-0.05-1.04-1.5-1.56-2.19-2.17 c-1.56-1.38-2.8-2.44-4.8-3.07c-0.36-0.12-0.66-0.17-0.94-0.17c-1.29,0-1.74,1.17-2.46,2.43c-1.32,2.33-2.62,4.79-3.5,7.31 c-1.66,4.68-1.91,9.51,1.68,13.89C43.05,25.89,45.34,27.39,45.86,29.19z\",\n style: {\n fill: \"#ED6C30\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M62.08,69.54c0.25,0.26,0.48,0.37,0.69,0.37c0.39,0,0.7-0.4,0.95-0.87 c0.19-0.36,0.34-0.73,0.46-1.12c0.67-2.25,2-4.48,3.1-6.56c0.2-0.37,0.4-0.73,0.59-1.09c0.76-1.43,1.54-2.86,2.35-4.28 c0.63-1.12,1.26-2.25,1.94-3.33c1.78-2.85,4.18-5.89,7.2-7.48c1.9-1.02,4.04-1.49,5.95-2.5c2.17-1.13,3.44-2.84,4.85-4.79 c1.4-1.93,2.13-4.31,3.41-6.34c0.54-0.86,0.46-1.62,1.41-2.22c2.11-1.32,4.64-0.87,6.98-1.32c5.53-1.06,6.02-8.35,10.54-10.98 c0.95-0.55,1.92-1.06,2.88-1.57c0.56-0.3,1.64-0.67,2.03-1.22c0.67-0.94-0.6-2.17-0.98-3.03c-0.66-1.48-1.65-2.97-2.5-4.35 c-0.72-1.16-1.36-2.21-2.64-2.21l-0.25,0.02c-2.89,0.28-5.47,1.55-7.32,3.76c-2.25,2.7-2.55,6.87-6.09,8.35 c-2.3,0.96-5.01,0.58-7.19,1.91c-2.58,1.58-3.41,4.7-4.13,7.44c-0.54,2-0.57,4.41-2.09,5.98c-2.06,2.11-5.19,2.37-7.83,3.5 c-0.71,0.31-1.39,0.68-2,1.16c-3.35,2.64-5.25,6.97-6.75,10.85c-0.61,1.59-1.16,3.21-1.7,4.83c-0.5,1.51-0.99,3.02-1.46,4.54 c-0.24,0.78-0.5,1.56-0.74,2.35c-0.61,1.98-1.17,4.01-1.89,5.96C61.35,66.55,61.04,68.46,62.08,69.54z\",\n style: {\n fill: \"#ED6C30\"\n }\n }), /*#__PURE__*/React.createElement(\"path\", {\n d: \"M127.44,86.8c-0.19-0.2-0.46-0.22-0.73-0.22l-0.31,0.01l-0.17-0.01c-0.6-0.04-1.1-0.3-1.68-0.5 c-2.67-0.93-4.4-1.7-6.76-3.29c-2.66-1.79-5.71-3.46-8.99-3.61l-0.38-0.01c-3.24,0-6.23,1.71-9.48,1.71h-0.02 c-3.6-0.02-6.71-2.58-9.55-4.47c-0.24-0.16-0.48-0.31-0.74-0.45c-2.23-1.26-4.63-1.81-7.05-1.84c-0.06,0-0.13-0.02-0.19-0.02 c-1.67,0-3.35,0.26-4.99,0.72c-1.6,0.44-3.15,1.08-4.63,1.87c-2.11,1.12-4.14,2.47-5.99,3.97c-1.03,0.83-2.16,1.78-2.86,2.93 c-0.38,0.61-0.9,2.93,0.07,3.31l0.13,0.03c0.38,0,1-0.4,1.27-0.57c2.16-1.33,4.44-2.49,6.87-3.25c1.99-0.63,4.08-1.09,6.15-1.17 c0.17-0.01,0.35-0.02,0.52-0.02c1.49,0,2.97,0.23,4.41,0.79c0.02,0.01,0.04,0.02,0.06,0.03c2.01,0.8,3.69,2.18,5.35,3.53 c2.44,1.98,5.15,2.42,7.91,2.42c2.15,0,4.33-0.26,6.46-0.26c2.23,0,4.39,0.29,6.38,1.46c1.62,0.97,3.08,2.24,4.33,3.59 c1.38,1.47,3.14,2.7,5.21,3.02c0.88,0.14,1.68,0.21,2.57,0.22h0.02c1.5,0,2.07-1.73,2.83-2.72c1.04-1.34,1.76-2.88,2.71-4.29 C126.57,89.09,128.12,87.48,127.44,86.8z\",\n style: {\n fill: \"#ED6C30\"\n }\n })));\n}\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgParty);\nexport default __webpack_public_path__ + \"static/media/party.9d4392ff50c418e47f321a49828ade82.svg\";\nexport { ForwardRef as ReactComponent };","import React, { useEffect, useState } from 'react';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport qs from 'query-string';\r\nimport { Helmet } from 'react-helmet';\r\nimport { Button } from 'reactstrap';\r\nimport { getServiceCards } from '../actions/serviceCardActions';\r\nimport { setUserBillSuccess, getComparisonWithToken, getComparisonWithKey, goHome } from '../actions/comparisonActions';\r\nimport { sessionExpiredServerMessage } from '../actions/serverMessageActions';\r\nimport * as serverMessageTargets from '../actions/serverMessageTargets';\r\nimport Dashboard from '../components/dashboard';\r\nimport { useAuth0 } from '../auth/auth0-Provider.js';\r\nimport IdleTimerDialog from '../components/dialogs/idleTimerDialog';\r\nimport IdleOfferTimeout from '../components/common/idleOfferTimeout';\r\nimport ShowFeatureCheckbox from '../components/common/showFeatureCheckbox';\r\nimport TourGuide from '../components/common/tourGuide';\r\nimport CustomerCommissionLogo from '../components/common/customerCommissionLogo';\r\nimport { submissionTypes } from '../enums/submissionTypes';\r\nimport { getAgentServiceType } from '../enums/customerCommissionTypes';\r\nimport { serviceCardLoadingTypes } from '../enums/serviceCardLoadingTypes';\r\nimport { uploadBillTypes, uploadSubTypes } from '../enums/uploadBillTypes';\r\nimport { agentOperatingModes, pageModes } from '../enums/launchTypes';\r\nimport { billTypes } from '../enums/billTypes';\r\nimport { navigationTypes } from '../enums/navigationTypes';\r\n\r\nimport { getServiceCardData, getSubmission } from '../components/serviceCard/serviceCardUtilities';\r\nimport { userPreferenceTypes, getUserPreferences } from '../utilities/userPreferencesUtilities';\r\nimport { standardEvents } from '../utilities/googleAnalyticsEvents';\r\nimport { isFramed } from '../utilities/domUtilities';\r\n\r\nimport { ReactComponent as PartyIcon } from '../components/icons/util/party.svg';\r\nimport { ReactComponent as MailIcon } from '../components/icons/util/mail.svg';\r\nimport { openSubmitDialog } from '../actions/dialogOptionsActions';\r\n\r\nconst DashboardScreen = props => {\r\n const { googleAnalyticsClientCode, tourGuideEnabled } = useSelector(state => state.config.settings);\r\n const { loaded: userBillsLoaded, data: userBills } = useSelector(state => state.userBills);\r\n const { billTypes: agentBillTypes, isLoaded: configLoaded } = useSelector(state => state.config);\r\n const { event: navigationEvent } = useSelector(state => state.globalOptions.navigation);\r\n const { pageMode } = useSelector(state => state.application);\r\n const { operatingMode } = useSelector(state => state.config.settings);\r\n\r\n const [idleTimer, setIdleTimer] = useState(false);\r\n const [summaries, setSummaries] = useState([]);\r\n const [services, setServices] = useState([]);\r\n const [totalSavings, setTotalSavings] = useState(0);\r\n const [totalCommission, setTotalCommission] = useState(0);\r\n const [requestStartTour, setRequestStartTour] = useState(false);\r\n const [tourStarted, setTourStarted] = useState();\r\n const [tourClosed, setTourClosed] = useState();\r\n const [steps, setSteps] = useState([]);\r\n\r\n const { loading: auth0Loading, isAuthenticated, isUserAuthenticated, getAccessToken } = useAuth0();\r\n\r\n const dispatch = useDispatch();\r\n\r\n const pageModeDefault = pageMode === pageModes.DEFAULT;\r\n const agentMode = agentOperatingModes.getById(operatingMode);\r\n\r\n const getServiceBarLeadText = (isEmpty, reductionAmountAnnualTotal, hasNextCompareDate, hasEstimates) => {\r\n if (isEmpty) return { text: 'Add' };\r\n if (reductionAmountAnnualTotal > 0) return {}; //{ text: 'Annual saving', disclaimerSymbol: '†' };\r\n if (hasNextCompareDate) return { text: 'View' };\r\n if (hasEstimates) return { text: 'View' };\r\n return { text: 'View' };\r\n };\r\n\r\n const onTimeoutClosed = () => {\r\n if (userBillsLoaded) {\r\n userBills\r\n .filter(e => e.submissionId && e.reductionLoaded && !e.deletedDateUtc)\r\n .forEach(e => dispatch(setUserBillSuccess({ ...e, reductionLoaded: false })));\r\n }\r\n };\r\n\r\n const onTimeoutIdle = () => {\r\n closeTour();\r\n };\r\n\r\n const getStarted = (serviceType, submissionId, submission) => {\r\n closeTour();\r\n standardEvents('Service-Card', serviceType.Name, 'Get-Started', googleAnalyticsClientCode);\r\n dispatch(openSubmitDialog(serviceType, uploadBillTypes.NONE, uploadSubTypes.NONE, { submissionId, submission }));\r\n };\r\n\r\n const getComparison = (serviceType, submissionId, userBill) => {\r\n closeTour();\r\n standardEvents('Service-Card', serviceType.Name, 'Get-Comparison', googleAnalyticsClientCode);\r\n\r\n const serviceCardLoading = userBillsLoaded ? serviceCardLoadingTypes.NONE : serviceCardLoadingTypes.DEFAULT;\r\n\r\n const accessKey = userBill.accessKey;\r\n const submissionType = userBill.submissionType;\r\n\r\n if (accessKey) {\r\n dispatch(\r\n getComparisonWithKey(\r\n { key: accessKey.accessKey, id: accessKey.accessId },\r\n null,\r\n submissionType,\r\n serviceType,\r\n serviceCardLoading\r\n )\r\n );\r\n } else if (isUserAuthenticated()) {\r\n const fn = async () => {\r\n dispatch(getComparisonWithToken(await getAccessToken(), submissionId, submissionType, serviceType));\r\n };\r\n fn();\r\n } else {\r\n dispatch(sessionExpiredServerMessage(serverMessageTargets.DASHBOARD));\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n const locationSearch = qs.parse(props.location.search);\r\n\r\n const start = locationSearch.start;\r\n if (start && userBillsLoaded) {\r\n // See if there are any comparisons that a customer has created ie. they should now make a selection not trigger a start process\r\n var billOrComparison = userBills.find(\r\n s => s.status !== 0 && !s.deletedDateUtc && (s.bill || (s.estimate && !s.estimate.defaultComparison))\r\n );\r\n\r\n if (!billOrComparison) {\r\n // If there are only default comparisons then launch them into the process of comparisons\r\n var defaultComparisons = userBills.filter(\r\n s => s.status !== 0 && !s.deletedDateUtc && s.estimate && s.estimate.defaultComparison\r\n );\r\n\r\n if (defaultComparisons) {\r\n var firstDefaultComparison = defaultComparisons.sort(function(a, b) {\r\n const bt1 = billTypes.getById(a.billTypeId).SortOrder;\r\n const bt2 = billTypes.getById(b.billTypeId).SortOrder;\r\n\r\n if (bt1 === bt2) {\r\n return a.displayAddress && b.displayAddress ? a.displayAddress.localeCompare(b.displayAddress) : false;\r\n } else {\r\n return bt1 < bt2 ? -1 : 1;\r\n }\r\n })[0];\r\n\r\n if (firstDefaultComparison) {\r\n var firstDefaultSubmission = getSubmission(firstDefaultComparison);\r\n var firstDefaultServiceType = billTypes.getById(firstDefaultComparison.billTypeId);\r\n\r\n closeTour();\r\n\r\n dispatch(\r\n openSubmitDialog(firstDefaultServiceType, uploadBillTypes.MANUAL, uploadSubTypes.NONE, {\r\n submissionId: firstDefaultComparison.submissionId,\r\n submission: firstDefaultSubmission\r\n })\r\n );\r\n }\r\n }\r\n }\r\n }\r\n }, [userBillsLoaded]);\r\n\r\n useEffect(() => {\r\n const completeCards = userBills\r\n .filter(s => s.status !== 0 && !s.deletedDateUtc)\r\n .sort(function(a, b) {\r\n const st1 = a.submissionType === submissionTypes.BILL ? 0 : 1;\r\n const st2 = b.submissionType === submissionTypes.BILL ? 0 : 1;\r\n const bt1 = billTypes.getById(a.billTypeId).SortOrder * 10;\r\n const bt2 = billTypes.getById(b.billTypeId).SortOrder * 10;\r\n\r\n const itemA = st1 + bt1;\r\n const itemB = st2 + bt2;\r\n\r\n if (itemA === itemB) {\r\n return a.displayAddress && b.displayAddress ? a.displayAddress.localeCompare(b.displayAddress) : false;\r\n } else {\r\n return itemA < itemB ? -1 : 1;\r\n }\r\n });\r\n\r\n const emptyCards = userBills\r\n .filter(bill => bill.status === 0 && !completeCards.some(e => e.billTypeId === bill.billTypeId && e.status !== 0))\r\n .sort(function(a, b) {\r\n const bt1 = billTypes.getById(a.billTypeId).SortOrder;\r\n const bt2 = billTypes.getById(b.billTypeId).SortOrder;\r\n\r\n return bt1 - bt2;\r\n });\r\n\r\n let latestBills = [];\r\n\r\n const _summaries = [];\r\n const _services = [];\r\n\r\n let _totalSavings = 0;\r\n let _totalCommission = 0;\r\n\r\n setIdleTimer(userBillsLoaded && completeCards.length > 0);\r\n\r\n if (userBillsLoaded) {\r\n completeCards.forEach(a => {\r\n const isBill = a.submissionType === submissionTypes.BILL;\r\n const isEstimate = a.submissionType === submissionTypes.ESTIMATE;\r\n\r\n // For each meter, only show a card for the latest bill.\r\n if (isBill) {\r\n const index = latestBills.findIndex(e => e.lastBillMeterId === a.lastBillMeterId);\r\n\r\n if (index === -1) {\r\n latestBills.push(a);\r\n } else if (Date.parse(a.lastBillIssueDate) > Date.parse(latestBills[index].lastBillIssueDate)) {\r\n latestBills.splice(index, 1);\r\n latestBills.push({ ...a, key: `serviceCard_${a.submissionId}` });\r\n }\r\n }\r\n\r\n // Set to true if we should only show a card for the latest estimate per service type; otherwise display all estimate cards.\r\n const limitLatest = false;\r\n\r\n if (isEstimate) {\r\n if (limitLatest) {\r\n const index = latestBills.findIndex(\r\n e => e.billTypeId === a.billTypeId && e.submissionType === submissionTypes.ESTIMATE\r\n );\r\n\r\n if (index === -1) {\r\n latestBills.push(a);\r\n } else {\r\n latestBills.splice(index, 1);\r\n latestBills.push({ ...a, key: `serviceCard_${a.billTypeId}` });\r\n }\r\n } else {\r\n latestBills.push({ ...a, key: `serviceCard_${a.submissionId}` });\r\n }\r\n }\r\n });\r\n\r\n // Add empty cards last.\r\n latestBills = [...latestBills, ...emptyCards];\r\n\r\n latestBills.forEach(e => {\r\n const isEmpty = e.status === 0;\r\n const serviceType = billTypes.getById(e.billTypeId);\r\n const agentServiceType = getAgentServiceType(serviceType, agentBillTypes);\r\n const serviceCardData = getServiceCardData(e, agentServiceType);\r\n\r\n _services.push(serviceCardData);\r\n\r\n // Add status summaries.\r\n if (isEmpty) {\r\n _summaries.push({\r\n id: `serviceBarButton_${e.billTypeId}`,\r\n serviceType,\r\n isEmpty\r\n });\r\n } else {\r\n const existing = _summaries.find(s => s.serviceType.Id === serviceType.Id);\r\n\r\n const current = existing\r\n ? existing\r\n : {\r\n id: `serviceSummary_${e.billTypeId}`,\r\n serviceType,\r\n isEmpty\r\n };\r\n\r\n if (existing === undefined) {\r\n _summaries.push(current);\r\n }\r\n }\r\n });\r\n\r\n _totalSavings = _services.reduce((previous, current) => {\r\n return (\r\n previous + (current.reductionLoaded && current.reductionAmountAnnual > 0 ? current.reductionAmountAnnual : 0)\r\n );\r\n }, 0);\r\n\r\n _totalCommission = _services.reduce((previous, current) => {\r\n if (current.reductionAmountAnnual <= 0) return previous;\r\n\r\n const agentServiceType = getAgentServiceType(current.serviceType, agentBillTypes);\r\n\r\n if (!agentServiceType.hasCommission) return previous;\r\n\r\n return previous + agentServiceType.agentBillType.customerCommission;\r\n }, 0);\r\n\r\n // Apply status summary content\r\n _summaries.forEach(e => {\r\n const serviceCards = _services.filter(s => s.serviceType === e.serviceType);\r\n\r\n const notificationTotal = serviceCards.reduce((previous, current) => {\r\n return previous + current.notificationCount;\r\n }, 0);\r\n\r\n const reductionAmountAnnualTotal = serviceCards.reduce((previous, current) => {\r\n return previous + current.reductionAmountAnnual;\r\n }, 0);\r\n\r\n const hasNextCompareDate = serviceCards.every(item => item.nextCompareDate);\r\n\r\n const hasEstimates = serviceCards.some(item => item.isEstimate);\r\n\r\n e.notificationCount = notificationTotal;\r\n e.reductionAmountAnnual = reductionAmountAnnualTotal;\r\n e.hasNextCompareDate = hasNextCompareDate;\r\n\r\n e.leadText = getServiceBarLeadText(e.isEmpty, reductionAmountAnnualTotal, hasNextCompareDate, hasEstimates);\r\n });\r\n\r\n // Include \"Add another service\" card if we have at least one completed card.\r\n if (completeCards.length > 0) {\r\n const serviceType = { ...billTypes.NONE, Name: 'Add another service' };\r\n\r\n _services.push({\r\n id: 'service-card-add',\r\n serviceType,\r\n isAdd: true,\r\n leadText: { text: 'Need to add another service?' },\r\n tagline: 'Add a new card for each separate property address, car or loan.',\r\n buttonText: 'Get Organised'\r\n });\r\n }\r\n }\r\n\r\n // ------------------------------------------------------------------------\r\n // Guided tour\r\n // ------------------------------------------------------------------------\r\n if (tourGuideEnabled) {\r\n const _steps = [];\r\n\r\n const savingsCards = completeCards.filter(e => e.reductionAmountAnnual > 0);\r\n const noSavingsCards = completeCards.filter(e => e.reductionAmountAnnual === 0);\r\n const content =\r\n _totalSavings > 0 ? (\r\n <>\r\n
Savings found
\r\n
Ready to improve your household's financial health?
\r\n
It takes just a few minutes...
\r\n \r\n ) : (\r\n <>\r\n
Your total savings
\r\n
This is where you'll find the total savings we've identified from all of your bills.
\r\n Arranging quotes for your solar installation? If you are, it's the right time to consider your solar finance\r\n options.\r\n
\r\n
Speak to one of our certified solar finance experts today.
\r\n {hasSolarFinance && (\r\n
\r\n \r\n
\r\n )}\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n );\r\n};\r\nexport default Introduction;\r\n","import React from 'react';\r\n\r\nconst Insights = () => {\r\n const items = [\r\n {\r\n title: 'Why financing your solar project could make sense:',\r\n content:\r\n 'With much improved ROI payback periods, consumers are now making commercial commitments in excess of $20,000 to not only purchase solar panels, but also batteries, inverters, pool heat pumps and even cars at the same time. '\r\n },\r\n {\r\n title: 'Why the banks are bundling solar into home loans:',\r\n content:\r\n 'Home electrification (solar) is an investment in your most valuable asset – your home. Your home is not only likely to increase in value as a result of the installation, but actually differentiate your property to others in the event of a sale.'\r\n },\r\n {\r\n title: 'What is a SmartMe certified finance expert?',\r\n content:\r\n 'We train Australia\\'s largest and most trusted mortgage brokers and asset finance companies to become \"SmartMe certified solar finance experts\". We survey our customers to make sure the experience you\\'re receiving is valued.'\r\n }\r\n ];\r\n return (\r\n
\r\n );\r\n};\r\nexport default CertifiedLogo;\r\n","import React from 'react';\r\nimport CertifiedLogo from './certifiedLogo';\r\nimport { Button } from 'reactstrap';\r\nimport { useSelector } from 'react-redux';\r\nimport { billTypes } from '../../enums/billTypes';\r\n\r\nconst Next = ({ startService }) => {\r\n const { billTypes: agentBillTypes } = useSelector(state => state.config);\r\n\r\n const serviceTypeOptions = { includeExternal: false };\r\n const hasSolarFinance = billTypes.hasServiceType(agentBillTypes, billTypes.SOLAR_FINANCE, serviceTypeOptions);\r\n\r\n return (\r\n
\r\n
\r\n
\r\n
What happens next?
\r\n
\r\n We'll connect you with a solar finance expert who we've trained to be able to explain your options. They'll\r\n call you for a no-obligation, free discussion about your finance options. If you'd like to proceed with any\r\n of the finance options, they'll also do the leg work for you to make applying easy!\r\n
\r\n Please call us on {phoneNumber}, and quote your reference number\r\n above. Our energy experts will be able to complete your application and assist you with any questions\r\n you may have.\r\n \r\n \r\n {callCentreHours && (\r\n \r\n
\r\n The rates for your address are dependent on your distribution area and the meter type. The\r\n distributors for your location are shown on the panel above and the {pricingDocumentName} shown below\r\n is for the selected meter type from the drop-down above. The second page of a current electricity bill\r\n for that property will show the meter/tariff type.\r\n
\r\n Early Termination Fee{offer.earlyTerminationFeeIsMonthly ? ' (per month remaining on the contract)' : ''}:{' '}\r\n {offer.earlyTerminationFeeDisplay}\r\n \r\n (Note: This fee will not be charged if you end your contract early because you are moving out.)\r\n
\r\n Annual saving figure shown is the difference between your declared current loan repayments and the loan\r\n we have compared it to\r\n
\r\n
\r\n Refinancing your current loan over a longer term could reduce the annual repayments but may result in\r\n more interest being paid over the life of the loan{' '}\r\n
\r\n
\r\n This comparison does not constitute a loan offer or a recommendation for your individual circumstances{' '}\r\n
\r\n {disclaimer} {additionalDisclaimer} The approximate charges include only the usage and supply charges related to\r\n this plan.\r\n
\r\n
\r\n Any other fees or charges applied by the retailer are not included in the approximate charges. This may include,\r\n but is not limited to, any fees associated to payment processing, connection / disconnection, dishonoured\r\n payments or paper bill fees. Please see the more information section for this plan to see details related to any\r\n additional fees.\r\n
\r\n
\r\n Please note: if a retailer charges connection fees they are typically only charged for moving in to a property.\r\n
\r\n onChange(e, { termsAndConditions: !termsAndConditions })}\r\n label={label}\r\n validatorName=\"smartme-terms\"\r\n validationMessage=\"Please accept the terms and conditions\"\r\n />\r\n
\r\n );\r\n};\r\n\r\nexport default SmartMeTermsAndConditions;\r\n","export const conditionTypes = {\r\n GENERAL: 'General',\r\n DIRECT_DEBIT: 'DirectDebit',\r\n CONCESSION: 'Concession',\r\n MOVE_IN: 'MoveIn'\r\n};\r\n","import React, { useState } from 'react';\r\nimport { Collapse } from 'reactstrap';\r\nimport { useSelector } from 'react-redux';\r\nimport ProviderTermsAndConditions from './providerTermsAndConditions';\r\nimport Conditions from './conditions';\r\nimport OutboundLink from './outboundLink';\r\nimport QsCheckBox from './qsCheckBox';\r\nimport SmartMeTermsAndConditions from './smartMeTermsAndConditions';\r\nimport { billTypes } from '../../enums/billTypes';\r\nimport { conditionTypes } from '../../enums/conditionTypes';\r\nimport { submissionTypes } from '../../enums/submissionTypes';\r\nimport { orientationTypes } from '../../enums/scaleTypes';\r\n\r\nconst OfferConfirmTermsAndConditionsAu = ({ confirmDetail, offer, onChange, setConfirmDetail, title }) => {\r\n const { pricingDocumentName, pricingDocumentNameShort, submissionType } = useSelector(state => state.comparison);\r\n const { billType } = useSelector(state => state.comparison.submission);\r\n\r\n const serviceType = billTypes.getByCode(billType);\r\n\r\n const [documentsOpen, setDocumentsOpen] = useState(\r\n submissionType === submissionTypes.BILL || serviceType !== billTypes.ELECTRICITY\r\n );\r\n\r\n const displayTitle = title ? title : 'Terms and conditions';\r\n\r\n const hasPricingDocuments = () => {\r\n switch (submissionType) {\r\n case submissionTypes.BILL:\r\n return offer.pricingDocuments && offer.pricingDocuments.length > 0;\r\n\r\n case submissionTypes.ESTIMATE:\r\n return offer.allRates && offer.allRates.filter(e => e.pricingDocument).length > 0;\r\n\r\n default:\r\n return false;\r\n }\r\n };\r\n\r\n const getPricingDocumentText = () => {\r\n switch (submissionType) {\r\n case submissionTypes.BILL:\r\n return null;\r\n\r\n case submissionTypes.ESTIMATE:\r\n if (serviceType === billTypes.ELECTRICITY) {\r\n return (\r\n
\r\n The rates for your address are dependent on your distribution area and the meter type. The{' '}\r\n {pricingDocumentNameShort} listed below are for all meter types that may apply to you. A current\r\n electricity bill for that property will show the meter/tariff type.\r\n setDocumentsOpen(!documentsOpen)}>\r\n {documentsOpen ? 'Hide documents' : 'Show documents'}\r\n \r\n
\r\n onChange(e, { multipleSclerosis: !confirmDetail.multipleSclerosis })}\r\n label=\"Does anyone living at this property have multiple sclerosis?\"\r\n />\r\n
\r\n onChange(e, { medicalCooling: !confirmDetail.medicalCooling })}\r\n label=\"Does anyone living at this property require medical cooling?\"\r\n />\r\n
\r\n {preText}We enable your by providing {providerDisplayCode} with a new '\r\n email address' which we link to your personal email address. Your bills and all other\r\n correspondence sent to your email address (from {providerDisplayCode}) will be\r\n instantly relayed to your personal email address\r\n {emailAddress ? {emailAddress} : ''}. Emails you respond to will\r\n also be relayed back to {providerDisplayCode}, meaning you don't need to access a new inbox to use this service\r\n and your current bill will always be available within your dashboard.\r\n
\r\n\r\n {!shortVersion && (\r\n
\r\n Importantly, when communicating with {providerDisplayCode}, and when you register on their website or any\r\n apps, you'll need to use your email address that we'll share with them.{postText}\r\n
\r\n A text message with a verification code was just sent to {confirmDetail.phoneNumber}.\r\n
\r\n\r\n {isOrganiser && (\r\n
\r\n
\r\n Important information about how your works\r\n
\r\n \r\n You've requested that your {providerDisplayCode} bills be sent to your \r\n \r\n }\r\n postText=\" This is:\"\r\n emailAddress={confirmDetail.emailAddress}\r\n />\r\n
{offer.autoCheckEmailAddress}
\r\n
\r\n We'll send you a confirmation email that contains all of these details for your future reference.\r\n
\r\n
\r\n If you've changed your mind about using your , please select 'Cancel' below and\r\n update your bill delivery preferences before proceeding.\r\n
\r\n
\r\n )}\r\n
\r\n By submitting this verification code, you acknowledge that you have read and agree to the terms and\r\n conditions of this offer.\r\n
\r\n\r\n
Please enter verification code
\r\n\r\n
\r\n
\r\n onChange(e, { otp: e.target.value })}\r\n validate={{\r\n required: {\r\n value: offer.requireOtp,\r\n errorMessage: 'Please enter the verification code sent to your mobile phone'\r\n },\r\n pattern: {\r\n value: '^[0-9]{4,6}',\r\n errorMessage: 'Please enter the verification code sent to your mobile phone'\r\n }\r\n }}\r\n />\r\n
\r\n \r\n )}\r\n \r\n )}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default Premise;\r\n","import React from 'react';\r\nimport { Row, Col } from 'reactstrap';\r\nimport QsCheckBox from '../common/qsCheckBox';\r\n\r\nconst MarketingQuestions = ({ confirmDetail, productDetail, onChange }) => {\r\n return (\r\n <>\r\n
Marketing
\r\n \r\n
\r\n onChange(e, { marketingOptOut: !confirmDetail.marketingOptOut })}\r\n />\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default MarketingQuestions;\r\n","import React from 'react';\r\nimport { AvField } from 'availity-reactstrap-validation';\r\nimport { Row, Col, FormGroup } from 'reactstrap';\r\nimport { validateAbn } from '../../utilities/abnUtilities';\r\n\r\nconst validateAbnEntry = (value, ctx, input, cb) => {\r\n if (!validateAbn(value)) {\r\n cb('Please enter a valid ABN');\r\n } else cb(true);\r\n};\r\n\r\nconst Business = props => {\r\n const {\r\n onChange,\r\n details: { abn, businessName, position }\r\n } = props;\r\n\r\n return (\r\n
\r\n \r\n
Business\r\n \r\n \r\n
\r\n \r\n onChange(e, { businessName: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Business name is required' },\r\n minLength: { value: 2, errorMessage: 'Business name is not the required length' },\r\n maxLength: { value: 100, errorMessage: 'Business name should be 100 characters or less' }\r\n }}\r\n />\r\n \r\n \r\n onChange(e, { abn: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'ABN is required' },\r\n abn: validateAbnEntry\r\n }}\r\n />\r\n \r\n \r\n
\r\n \r\n onChange(e, { position: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Position is required' },\r\n minLength: { value: 2, errorMessage: 'Position is not the required length' },\r\n maxLength: { value: 50, errorMessage: 'Position should be 50 characters or less' },\r\n pattern: {\r\n value: '^[a-zA-Z ]{2,20}$',\r\n errorMessage: `Please enter a valid position (letters and spaces only)`\r\n }\r\n }}\r\n />\r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport default Business;\r\n","const validateAbn = abn => {\r\n var isValid = true;\r\n\r\n //remove all spaces\r\n abn = abn.replace(/\\s/g, '');\r\n\r\n //0. ABN must be 11 digits long\r\n isValid &= abn && /^\\d{11}$/.test(abn);\r\n\r\n if (isValid) {\r\n var weightedSum = 0;\r\n var weight = [10, 1, 3, 5, 7, 9, 11, 13, 15, 17, 19];\r\n\r\n //Rules: 1,2,3\r\n for (var i = 0; i < weight.length; i++) {\r\n weightedSum += (parseInt(abn[i]) - (i === 0 ? 1 : 0)) * weight[i];\r\n }\r\n\r\n //Rules: 4,5\r\n isValid &= weightedSum % 89 === 0;\r\n }\r\n\r\n return isValid;\r\n};\r\n\r\nexport { validateAbn };\r\n","import React from 'react';\r\nimport QsCheckBox from './qsCheckBox';\r\n\r\nconst CreditCheckConsent = ({ onChange, providerDisplayCode, creditCheckConsent }) => {\r\n return (\r\n <>\r\n
\r\n {providerDisplayCode} need to perform a credit check. If you don't meet the credit requirements you will be\r\n notified by mail.\r\n
\r\n
\r\n onChange(e, { creditCheckConsent: !creditCheckConsent })}\r\n label={`By ticking this box you consent to ${providerDisplayCode} using your personal information above to conduct a\r\n credit check.`}\r\n validatorName=\"credit-check-consent\"\r\n validationMessage=\"We need your consent to be able to process your applciation.\"\r\n />\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default CreditCheckConsent;\r\n","export const concessionTypesEnum = {\r\n NONE: { Id: 0, Validation: null },\r\n CENTRELINK_HEALTH_CARE: {\r\n Id: 1,\r\n Validation: '^[0-9]{9}[a-zA-Z]$',\r\n ValidationError: 'Your concession card number should be 9 numbers and one letter at the end.'\r\n },\r\n CENTRELINK_PENSIONER: { Id: 2, Validation: null },\r\n VETERAN_AFFAIRS_PENSIONER: { Id: 3, Validation: null },\r\n VETERAN_AFFAIRS_GOLD: { Id: 4, Validation: null },\r\n VETERAN_AFFAIRS_WAR_WIDOW: { Id: 5, Validation: null },\r\n VETERAN_AFFAIRS_GOLD_TPI: { Id: 6, Validation: null },\r\n QLD_GOVERNMENT_SENIOR: { Id: 7, Validation: null },\r\n\r\n getById: concessionTypeId => {\r\n switch (concessionTypeId) {\r\n case concessionTypesEnum.CENTRELINK_HEALTH_CARE.Id:\r\n return concessionTypesEnum.CENTRELINK_HEALTH_CARE;\r\n case concessionTypesEnum.CENTRELINK_PENSIONER.Id:\r\n return concessionTypesEnum.CENTRELINK_PENSIONER;\r\n case concessionTypesEnum.VETERAN_AFFAIRS_PENSIONER.Id:\r\n return concessionTypesEnum.VETERAN_AFFAIRS_PENSIONER;\r\n case concessionTypesEnum.VETERAN_AFFAIRS_GOLD.Id:\r\n return concessionTypesEnum.VETERAN_AFFAIRS_GOLD;\r\n case concessionTypesEnum.VETERAN_AFFAIRS_WAR_WIDOW.Id:\r\n return concessionTypesEnum.VETERAN_AFFAIRS_WAR_WIDOW;\r\n case concessionTypesEnum.VETERAN_AFFAIRS_GOLD_TPI.Id:\r\n return concessionTypesEnum.VETERAN_AFFAIRS_GOLD_TPI;\r\n case concessionTypesEnum.QLD_GOVERNMENT_SENIOR.Id:\r\n return concessionTypesEnum.QLD_GOVERNMENT_SENIOR;\r\n default:\r\n return null;\r\n }\r\n }\r\n};\r\n","import React from 'react';\r\nimport { AvField } from 'availity-reactstrap-validation';\r\nimport { Row, Col, FormGroup } from 'reactstrap';\r\nimport QsCheckBox from './qsCheckBox';\r\nimport { useSelector } from 'react-redux';\r\nimport { orientationTypes } from '../../enums/scaleTypes';\r\nimport Conditions from './conditions';\r\nimport { conditionTypes } from '../../enums/conditionTypes';\r\nimport { concessionTypesEnum } from '../../enums/concessionTypes';\r\n\r\nconst Concession = props => {\r\n const { onChange, acceptConcession, concessionDisclaimer, details, setConfirmDetail, offer } = props;\r\n const { concessionTypes } = useSelector(state => state.config.referenceData);\r\n\r\n const {\r\n hasConcession,\r\n concessionType,\r\n concessionTypeId,\r\n concessionTypeIdIssued,\r\n concessionTypeIdExpiry,\r\n concessionConsent\r\n } = details;\r\n\r\n const hasConcessionConditions =\r\n offer &&\r\n offer.productDetail &&\r\n offer.productDetail.consentConditions &&\r\n offer.productDetail.consentConditions.length > 0 &&\r\n offer.productDetail.consentConditions.filter(condition => condition.type === conditionTypes.CONCESSION).length > 0;\r\n\r\n const setAllConcessionConditionsChecked = newConcessionConsent => {\r\n onChange(null, { concessionConsent: newConcessionConsent });\r\n };\r\n\r\n const validateConcessionType = (value, ctx, input, cb) => {\r\n if (hasConcession && value === '') cb('Concession type is required.');\r\n else cb(true);\r\n };\r\n\r\n const validateConcessionTypeId = (value, ctx, input, cb) => {\r\n if (hasConcession) {\r\n if (value !== '') {\r\n if (value.length < 6) {\r\n cb('Concession type card is too short.');\r\n } else if (value.length > 20) {\r\n cb('Concession type card is too long.');\r\n } else {\r\n var concessionTypeObject = concessionTypesEnum.getById(parseInt(concessionType));\r\n\r\n if (concessionTypeObject && concessionTypeObject.Validation) {\r\n let regex = new RegExp(concessionTypeObject.Validation);\r\n if (!regex.test(value)) {\r\n cb(concessionTypeObject.ValidationError);\r\n } else cb(true);\r\n } else cb(true);\r\n }\r\n } else {\r\n cb('Concession type card number is required.');\r\n }\r\n } else {\r\n cb(true);\r\n }\r\n };\r\n\r\n const validateConcessionTypeIdIssued = (value, ctx, input, cb) => {\r\n if (hasConcession) {\r\n if (value !== '') {\r\n var regex, concessionIssuedDisplayFormat;\r\n if (concessionType === '1' || concessionType === '2') {\r\n regex = new RegExp(\r\n '^(?:(?:(?:0[1-9]|1\\\\d|2[0-8])\\\\/(?:0[1-9]|1[0-2])|(?:29|30)/(?:0[13-9]|1[0-2])|31\\\\/(?:0[13578]|1[02]))\\\\/[1-9]\\\\d{3}|29\\\\/02(?:\\\\/[1-9]\\\\d(?:0[48]|[2468][048]|[13579][26])|(?:[2468][048]|[13579][26])00))$'\r\n );\r\n concessionIssuedDisplayFormat = 'dd/mm/yyyy';\r\n } else {\r\n regex = new RegExp('^(0?[1-9]|1[0-2])/(([0-9]{2}))$');\r\n concessionIssuedDisplayFormat = 'mm/yy';\r\n }\r\n\r\n if (!regex.test(value)) {\r\n cb(`Concession type date issued should be ${concessionIssuedDisplayFormat}.`);\r\n } else cb(true);\r\n } else {\r\n cb('Concession type date issued is required.');\r\n }\r\n } else {\r\n cb(true);\r\n }\r\n };\r\n\r\n const validateConcessionTypeIdExpiry = (value, ctx, input, cb) => {\r\n if (hasConcession) {\r\n if (value !== '') {\r\n var regex, concessionDateDisplayFormat;\r\n if (concessionType === '1' || concessionType === '2') {\r\n regex = new RegExp(\r\n '^(?:(?:(?:0[1-9]|1\\\\d|2[0-8])\\\\/(?:0[1-9]|1[0-2])|(?:29|30)/(?:0[13-9]|1[0-2])|31\\\\/(?:0[13578]|1[02]))\\\\/[1-9]\\\\d{3}|29\\\\/02(?:\\\\/[1-9]\\\\d(?:0[48]|[2468][048]|[13579][26])|(?:[2468][048]|[13579][26])00))$'\r\n );\r\n concessionDateDisplayFormat = 'dd/mm/yyyy';\r\n } else {\r\n regex = new RegExp('^(0?[1-9]|1[0-2])/(([0-9]{2}))$');\r\n concessionDateDisplayFormat = 'mm/yy';\r\n }\r\n\r\n if (!regex.test(value)) {\r\n cb(`Concession type expiry should be ${concessionDateDisplayFormat}.`);\r\n } else cb(true);\r\n } else {\r\n cb('Concession type expiry is required.');\r\n }\r\n } else {\r\n cb(true);\r\n }\r\n };\r\n\r\n let concessionDateDisplayFormat;\r\n switch (concessionType) {\r\n case '1':\r\n case '2':\r\n concessionDateDisplayFormat = 'dd/mm/yyyy';\r\n break;\r\n default:\r\n concessionDateDisplayFormat = 'mm/yy';\r\n }\r\n\r\n return (\r\n <>\r\n onChange(e, { hasConcession: !hasConcession })}\r\n />\r\n\r\n {hasConcession && (\r\n <>\r\n {acceptConcession ? (\r\n
\r\n \r\n
\r\n Concession details\r\n
The card must be in the name of the applicant above.
\r\n \r\n\r\n {hasConcessionConditions ? (\r\n \r\n ) : (\r\n onChange(e, { concessionConsent: !concessionConsent })}\r\n label=\"Do you understand and agree to the concession terms & conditions?\"\r\n validatorName=\"concession-disclaimer-terms\"\r\n validationMessage={\r\n hasConcession ? 'We need your consent to be able to validate your concession card details.' : null\r\n }\r\n />\r\n )}\r\n
\r\n
\r\n ) : (\r\n \r\n )}\r\n \r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default Concession;\r\n","import React from 'react';\r\nimport { Row, Col } from 'reactstrap';\r\nimport { AvField } from 'availity-reactstrap-validation';\r\n\r\nconst BillDisplayAddress = props => {\r\n const { displayAddress } = props;\r\n\r\n return (\r\n \r\n
\r\n Does anyone residing or intending to reside at your property/premises require life support equipment?\r\n setLifeSupportInfoOpen(!lifeSupportInfoOpen)}\r\n >\r\n info\r\n \r\n
\r\n \r\n setLifeSupportInfoOpen(!lifeSupportInfoOpen)}\r\n >\r\n \r\n Why do we ask this?clear\r\n \r\n \r\n
\r\n If you, or anyone at your home depends on life support, this needs to be registered on your account. If\r\n applicable, your energy retailer and local distributor can give you extra protections with your power\r\n supply. You are classified as being life support dependent if you depend on any of the following life\r\n support equipment:\r\n \r\n \r\n
\r\n Any other equipment (whether fuelled by electricity or gas) that a registered medical practitioner\r\n certifies is required for a person residing at the customer's premises for life support or otherwise\r\n where the customer provides a current medical certificate certifying that a person residing at the\r\n customer's premises has a medical condition which requires continued supply of electricity or gas.\r\n
\r\n Unfortunately we are currently unable to provide our services for this address as a \"Switch Hold\" is\r\n preventing us from being able to change your provider.\r\n
\r\n\r\n
\r\n A Switch Hold can be placed on a premise by either a Retail Energy Provider (REP) (with customer's\r\n consent) for an outstanding bill or by the Transmission and Distribution Service Provider (TDSP/TDU, or\r\n utility company) due to meter tampering.\r\n
\r\n\r\n
\r\n A Switch Hold is placed on a residential service address to ensure that the person responsible for the\r\n billing at that location pays their electricity bill to their current Retail Electricity Provider (REP, or\r\n electricity company) before switching to a new REP.\r\n
\r\n\r\n
\r\n In general, a Switch Hold is a response to a customer who doesn't pay a past-due bill for a given service\r\n address to the old Retail Electricity Provider (REP, or electricity company) as a way to prevent that\r\n customer from switching to another electricity provider.\r\n
\r\n\r\n
\r\n If you are a new resident moving in and have never lived at the premise where a switch hold exists and are\r\n not associated with the customer for which the switch hold was placed then you will need to provide at\r\n least one of the following documents to a provider to have them request that the Switch Hold be removed on\r\n your behalf.\r\n
\r\n
Copy of Signed Lease
\r\n
Affidavit of the landlord
\r\n
Closing documents
\r\n
Certificate of occupancy
\r\n
Utility bill in Customer’s name dated within the last two months from a different premise
\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default SwitchHoldDialog;\r\n","import React, { useState, useEffect, useCallback } from 'react';\r\nimport { Row, Col, FormGroup } from 'reactstrap';\r\nimport { AvField } from 'availity-reactstrap-validation';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport YourDetails from './yourDetails';\r\nimport { validateSsn } from '../../utilities/ssn';\r\nimport DatePicker from 'react-datepicker';\r\nimport 'react-datepicker/dist/react-datepicker.css';\r\nimport moment from 'moment';\r\nimport 'moment-timezone';\r\nimport QsCheckBox from './qsCheckBox';\r\nimport QsButtonGroup from './qsButtonGroup';\r\nimport { implementationCodes } from '../../enums/implementationCodes';\r\nimport Autocomplete from 'react-autocomplete';\r\nimport { submissionTypes, occupancyTypes } from '../../enums/submissionTypes';\r\nimport { setSelectedEnergyOfferDetail } from '../../actions/selectedOfferActions';\r\nimport axios from 'axios';\r\nimport _debounce from 'lodash.debounce';\r\nimport BillDisplayAddress from './billDisplayAddress';\r\nimport SwitchHoldDialog from '../dialogs/switchHoldDialog';\r\nimport OutboundLink from './outboundLink';\r\n\r\nconst OfferConfirmUs = props => {\r\n const { confirmDetail, offer, implementationCode, onChange } = props;\r\n const { submissionType } = useSelector(state => state.comparison);\r\n const { emailAddress, accountVerified } = useSelector(state => state.user);\r\n const { comparison } = useSelector(state => state);\r\n const { occupancyType } = useSelector(state => state.comparison.submission);\r\n const { submission } = useSelector(state => state.comparison);\r\n const { mobilePhoneNumberRegex } = useSelector(state => state.config.applicationSettings.country);\r\n const [selectedInstallDate, setSelectedInstallDate] = useState(null);\r\n const [addressInputValue, setaddressInputValue] = useState();\r\n const [addresses, setAddresses] = useState([]);\r\n const [switchHoldDialogOpen, setSwitchHoldDialogOpen] = useState(false);\r\n const [switchHold, setSwitchHold] = useState(false);\r\n const dispatch = useDispatch();\r\n\r\n useEffect(() => {\r\n if (confirmDetail.installDate && !selectedInstallDate) {\r\n var storedDate = moment(confirmDetail.installDate, 'YYYY-MM-DD').toDate();\r\n setSelectedInstallDate(storedDate);\r\n }\r\n }, []);\r\n\r\n const validateSsnInput = (value, ctx, input, cb) => {\r\n if (validateSsn(value)) {\r\n cb(true);\r\n } else {\r\n cb('Enter a valid social security number.');\r\n }\r\n };\r\n\r\n const validateHiddeninstallStandard = (value, ctx, input, cb) => {\r\n let noInstallDateMessage = `Please select ${\r\n occupancyType === occupancyTypes.CURRENT.Id ? 'standard switch or select ' : ''\r\n }a preferred install date.`;\r\n\r\n if (value === 'false' && !confirmDetail.installDate) {\r\n cb(noInstallDateMessage);\r\n } else if (value === 'true' && confirmDetail.installDate) {\r\n cb('Please select either a standard switch or a preferred install date not both.');\r\n } else cb(true);\r\n };\r\n\r\n const validateHiddenAddress = (value, ctx, input, cb) => {\r\n if (switchHold) {\r\n cb('This address currently has a \"Switch Hold\"');\r\n } else cb(true);\r\n };\r\n\r\n const onInstallDateChange = date => {\r\n setSelectedInstallDate(date);\r\n\r\n var utcDate = moment(date).format('YYYY-MM-DD');\r\n onChange(null, { installDate: utcDate });\r\n };\r\n\r\n const onChangePreferredLanguage = event => {\r\n let option = event.target.getAttribute('data-value');\r\n onChange(null, { preferredLanguage: option });\r\n };\r\n\r\n const onAddressSelected = (inputValue, item) => {\r\n setaddressInputValue(inputValue);\r\n onChange(null, { meterIdentifier: item.meterIdentifier, supplyAddressDisplay: item.addressDisplay });\r\n\r\n if (item.switchHold) {\r\n setSwitchHold(true);\r\n setSwitchHoldDialogOpen(true);\r\n } else {\r\n setSwitchHold(false);\r\n dispatch(setSelectedEnergyOfferDetail(comparison, offer, item.meterIdentifier));\r\n }\r\n };\r\n\r\n const onChangeAddressInput = inputValue => {\r\n setaddressInputValue(inputValue);\r\n onChange(null, { meterIdentifier: null, supplyAddressDisplay: null });\r\n\r\n if (inputValue) {\r\n getAddresses(inputValue);\r\n }\r\n };\r\n\r\n const getAddresses = useCallback(\r\n _debounce(\r\n searchTerm => {\r\n axios\r\n .post(\r\n `/api/convert/address/accesskey/${comparison.accessId}/?key=${comparison.accessKey}&search=${searchTerm}`,\r\n {\r\n searchTerm,\r\n postcode: submission.propertyAddress.postcode,\r\n offerId: offer.offerId\r\n }\r\n )\r\n .then(response => {\r\n if (response.data) {\r\n setAddresses(response.data);\r\n }\r\n });\r\n },\r\n 150,\r\n { leading: false }\r\n ),\r\n []\r\n );\r\n\r\n let useInstallDates =\r\n offer.installDates && offer.installDates.length > 0\r\n ? offer.installDates\r\n : offer.productDetail\r\n ? offer.productDetail.installDates\r\n : [];\r\n let installDates = useInstallDates.map((date, i) => moment.tz(date, 'YYYY-MM-DD', 'GMT').toDate());\r\n\r\n return (\r\n <>\r\n \r\n
\r\n onChange(e, { dateOfBirth: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Date of birth is required' },\r\n pattern: {\r\n value:\r\n '^((((0[13578])|(1[02]))[\\\\/](([1-9])|([0-2][0-9])|(3[01])))|(((0[469])|11)[\\\\/](([1-9])|([0-2][0-9])|30))|((2|02)[\\\\/](([1-9])|([0-2][0-9]))))[/]\\\\d{4}$',\r\n errorMessage: 'Please enter in the format mm/dd/yyyy e.g. 12/31/1986'\r\n }\r\n }}\r\n />\r\n \r\n\r\n
\r\n \r\n\r\n {/* separate images to avoid flicker when switching between the two CSS classes */}\r\n {cardType && cardType.logo && !cardType.logoHorizontal && (\r\n \r\n )}\r\n {cardType && cardType.logo && cardType.logoHorizontal && (\r\n \r\n )}\r\n
\r\n {\r\n let message = true;\r\n if (!isCardValid) {\r\n message = cardError;\r\n }\r\n\r\n cb(message);\r\n }\r\n }}\r\n />\r\n \r\n onChange(e, { creditCardName: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Card name is required' },\r\n minLength: { value: 2, errorMessage: 'Card name is invalid' },\r\n maxLength: { value: 26 }\r\n }}\r\n />\r\n \r\n \r\n \r\n \r\n
\r\n \r\n onChange(e, { creditCardExpiry: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Card expiry date is required' },\r\n pattern: {\r\n value: creditCardExpiryValidation,\r\n errorMessage: `Card expiry date must be in the format ${creditCardExpiryDisplayFormat}`\r\n },\r\n validateCardExpiry: validateCreditCardExpiry\r\n }}\r\n />\r\n \r\n \r\n
\r\n \r\n onChange(e, { existingNumber: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Home phone number is required' },\r\n pattern: {\r\n value: homePhoneNumberRegex,\r\n errorMessage: `Please enter a valid home phone number for ${country.name} including area code (no spaces or hyphens)`\r\n }\r\n }}\r\n />\r\n \r\n \r\n\r\n
\r\n \r\n onChange(e, { hasHomePhoneTransferAuthority: !confirmDetail.hasHomePhoneTransferAuthority })\r\n }\r\n validatorName=\"home-phone-transfer-authority\"\r\n validationMessage=\"You must have authority to transfer this service.\"\r\n />\r\n \r\n \r\n )}\r\n \r\n )}\r\n\r\n \r\n
Where would you like us to deliver your equipment?
\r\n \r\n My connection address} value={billingTypes.ADDRESS_CONNECTION.Code} />\r\n {productDetail.allowDeliveryAddressOtherAddress && (\r\n Other address (can't be a Post Box, Locked Bag or RMB)}\r\n value={billingTypes.ADDRESS_OTHER.Code}\r\n />\r\n )}\r\n \r\n \r\n \r\n )}\r\n\r\n {confirmDetail.deliveryType === billingTypes.ADDRESS_OTHER.Code && (\r\n <>\r\n
\r\n \r\n
\r\n \r\n )}\r\n\r\n {productDetail && productDetail.billingContent && (\r\n \r\n \r\n \r\n )}\r\n\r\n setOrganiserDialogOpen(false)}\r\n >\r\n setOrganiserDialogOpen(false)} />\r\n \r\n \r\n );\r\n};\r\n\r\nexport default OfferConfirmInternetDetailsAu;\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { bindActionCreators } from 'redux';\r\nimport { connect } from 'react-redux';\r\nimport * as actions from '../../actions/confirmDetailActions';\r\nimport * as selectedOfferActions from '../../actions/selectedOfferActions';\r\nimport * as serverMessageActions from '../../actions/serverMessageActions';\r\nimport { AvField } from 'availity-reactstrap-validation';\r\nimport { Container, Row, Col } from 'reactstrap';\r\nimport ServerMessage from './serverMessage';\r\nimport { scroller } from 'react-scroll';\r\nimport OtpDialog from '../dialogs/otpDialog';\r\nimport CreditCheckFailedDialog from '../dialogs/creditCheckFailedDialog';\r\nimport OfferConfirmPersonalDetailsAu from './offerConfirmPersonalDetailsAu';\r\nimport OfferConfirmPersonalDetailsUs from './offerConfirmPersonalDetailsUs';\r\nimport OfferConfirmDirectDebitDetailsAu from './offerConfirmDirectDebitDetailsAu';\r\nimport OfferConfirmTermsAndConditionsAu from './offerConfirmTermsAndConditionsAu';\r\nimport OfferConfirmTermsAndConditionsUs from './offerConfirmTermsAndConditionsUs';\r\nimport OfferConfirmHomeLoanDetailsAu from './offerConfirmHomeLoanDetailsAu';\r\nimport OfferConfirmInternetDetailsAu from './offerConfirmInternetDetailsAu';\r\nimport { implementationCodes } from '../../enums/implementationCodes';\r\nimport { billingTypes, occupancyTypes, submissionTypes } from '../../enums/submissionTypes';\r\nimport { detailStatuses } from '../../enums/detailStatuses';\r\nimport { directDebitTypes } from '../../enums/directDebitTypes';\r\nimport _debounce from 'lodash.debounce';\r\nimport { getSessionActivity } from '../../utilities/commonUtilities';\r\n\r\nexport class OfferConfirm extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n const {\r\n title: userTitle,\r\n firstName: userFirstName,\r\n surname: userSurname,\r\n mobilePhoneNumberNational: userPhoneNumber\r\n } = this.props.user;\r\n\r\n let title = userTitle;\r\n let firstName = userFirstName;\r\n let surname = userSurname;\r\n\r\n // For bills submissions where account name is populated but user is not, use details from the bill.\r\n if (this.props.comparison.submissionType === submissionTypes.BILL && this.props.comparison.submission.accountName) {\r\n const {\r\n titleId: accountTitleId,\r\n firstName: accountFirstName,\r\n surname: accountSurname\r\n } = this.props.comparison.submission.accountName;\r\n\r\n if (!title && accountTitleId) title = accountTitleId;\r\n if (!firstName && accountFirstName) firstName = accountFirstName;\r\n if (!surname && accountSurname) surname = accountSurname;\r\n }\r\n\r\n const hasDirectDebitCreditCard =\r\n this.props.offer.productDetail && this.props.offer.productDetail.hasDirectDebitCreditCard;\r\n const hasDirectDebitBankAccount =\r\n this.props.offer.productDetail && this.props.offer.productDetail.hasDirectDebitBankAccount;\r\n\r\n const selectedDirectDebitType = hasDirectDebitCreditCard\r\n ? directDebitTypes.CREDIT_CARD.Code\r\n : hasDirectDebitBankAccount\r\n ? directDebitTypes.BANK_ACCOUNT.Code\r\n : directDebitTypes.NONE.Code;\r\n\r\n this.hasDirectDebit = hasDirectDebitCreditCard || hasDirectDebitBankAccount;\r\n\r\n const defaultBillingTypeCode =\r\n this.props.offer && this.props.offer.defaultBillingType\r\n ? this.props.offer.defaultBillingType\r\n : billingTypes.NONE.Code;\r\n\r\n const allowOrganiser =\r\n this.props.offer &&\r\n this.props.offer.allowOrganiser &&\r\n this.props.config &&\r\n this.props.config.settings &&\r\n this.props.config.settings.allowOrganiser;\r\n const billingTypeCode =\r\n !allowOrganiser && defaultBillingTypeCode === billingTypes.EMAIL_ORGANISER.Code\r\n ? billingTypes.EMAIL_PERSONAL.Code\r\n : defaultBillingTypeCode;\r\n\r\n this.state = {\r\n isOtpOpen: null,\r\n isCreditCheckFailedOpen: null,\r\n isCreditCheckFailedOpenStamp: null,\r\n confirmDetail: {\r\n title: this.props.confirmDetailStore.title ? this.props.confirmDetailStore.title : title,\r\n firstName: this.props.confirmDetailStore.firstName ? this.props.confirmDetailStore.firstName : firstName,\r\n surname: this.props.confirmDetailStore.surname ? this.props.confirmDetailStore.surname : surname,\r\n emailAddress: this.props.user.emailAddress,\r\n phoneNumber: this.props.confirmDetailStore.phoneNumber\r\n ? this.props.confirmDetailStore.phoneNumber\r\n : userPhoneNumber,\r\n dateOfBirth: null,\r\n verifyMethod: null,\r\n verifyId: null,\r\n verifyIdExpiry: null,\r\n ssn: null,\r\n hasConcession: false,\r\n lifeSupport: true,\r\n solarFeedIn: false,\r\n termsAndConditions: false,\r\n concessionType: null,\r\n concessionTypeId: null,\r\n concessionTypeIdIssued: null,\r\n concessionTypeIdExpiry: null,\r\n medicalCooling: false,\r\n multipleSclerosis: false,\r\n concessionConsent: false,\r\n creditCheckConsent: false,\r\n primaryResidence: true,\r\n premiseType: null,\r\n passportCountry: this.props.config.country.alpha3,\r\n driversLicenceStateOfIssue: null,\r\n medicareIrn: null,\r\n medicareCardType: null,\r\n clientData1: null,\r\n membershipId: null,\r\n installStandard: false,\r\n installDate: null,\r\n otp: null,\r\n preferredLanguage: 'English',\r\n supplyAddress:\r\n this.props.comparison.submissionType === submissionTypes.ESTIMATE\r\n ? this.props.comparison.submission.propertyAddress\r\n : null, // initialize with submission property address; it may potentially get updated by the user.\r\n siteAccessIssues: null,\r\n siteAccessIssuesDetail: null,\r\n siteHazardIssues: null,\r\n siteHazardIssuesDetail: null,\r\n worksInProgress: null,\r\n worksInProgressDetail: null,\r\n powerOn:\r\n this.props.comparison.submissionType === submissionTypes.ESTIMATE &&\r\n this.props.comparison.occupancyType === occupancyTypes.NEW.id\r\n ? 'false'\r\n : 'true',\r\n accessConsent: null,\r\n existingAccount: 'false',\r\n keepExistingNumber: 'false',\r\n specificDeliveryDate: 'false',\r\n billingType: billingTypeCode,\r\n deliveryType: billingTypes.ADDRESS_CONNECTION.Code,\r\n directDebitType: selectedDirectDebitType,\r\n hasHomePhoneTransferAuthority: false,\r\n employeeHasCreditCard:\r\n this.props.offer.productDetail && this.props.offer.productDetail.showEmployeeHasCreditCard ? false : null,\r\n conditions: []\r\n }\r\n };\r\n\r\n this.implementationCode = this.props.comparison.implementationCode;\r\n }\r\n\r\n onSubmit = () => {\r\n this.props.submitForm();\r\n };\r\n\r\n onSendOtp = async () => {\r\n const accessToken =\r\n this.props.isAuthenticated && this.props.comparison.submissionId ? await this.props.getTokenSilently() : null;\r\n const sessionActivity = getSessionActivity(this.props.session);\r\n\r\n this.props.selectedOfferActions.sendOtp(\r\n this.props.comparison,\r\n this.props.offer,\r\n this.state.confirmDetail,\r\n accessToken,\r\n this.props.comparison.submissionId,\r\n sessionActivity\r\n );\r\n };\r\n\r\n getEmptyConditions = () => {\r\n var conditions = [];\r\n\r\n if (\r\n this.props.offer &&\r\n this.props.offer.productDetail &&\r\n this.props.offer.productDetail.consentConditions &&\r\n this.props.offer.productDetail.consentConditions.length > 0\r\n ) {\r\n this.props.offer.productDetail.consentConditions.forEach(condition => {\r\n var conditionAccept = { conditionId: condition.id, accepted: false, type: condition.type };\r\n\r\n conditions.push(conditionAccept);\r\n });\r\n }\r\n\r\n return conditions;\r\n };\r\n\r\n getInitialAddonSelections = (addons, allowMultipleSelections) => {\r\n const selections = addons.filter(addon => addon.isSelected).map(addon => addon.id);\r\n\r\n if (selections && selections.length > 0) {\r\n return allowMultipleSelections ? selections : selections[0];\r\n } else return null;\r\n };\r\n\r\n componentDidMount = () => {\r\n var initialConditions = this.getEmptyConditions();\r\n var newConfirmDetail;\r\n if (this.props.offer.twoStepConfirm && this.props.confirmDetailStore.entryStarted) {\r\n newConfirmDetail = { ...this.props.confirmDetailStore, conditions: initialConditions };\r\n } else {\r\n newConfirmDetail = { ...this.state.confirmDetail, conditions: initialConditions };\r\n }\r\n\r\n var productDetail = this.props.offer.productDetail;\r\n if (productDetail) {\r\n if (productDetail.homeLine && productDetail.homeLine.length > 0)\r\n newConfirmDetail['homeLine'] = this.getInitialAddonSelections(productDetail.homeLine, false);\r\n\r\n if (productDetail.modems && productDetail.modems.length > 0)\r\n newConfirmDetail['modem'] = this.getInitialAddonSelections(productDetail.modems, false);\r\n\r\n if (productDetail.otherAddons && productDetail.otherAddons.length > 0)\r\n newConfirmDetail['otherAddons'] = this.getInitialAddonSelections(productDetail.otherAddons, true);\r\n }\r\n\r\n this.setConfirmDetail(newConfirmDetail);\r\n\r\n if (this.state.isOtpOpen !== this.props.offer.requireOtp) this.setOtpOpen(this.props.offer.requireOtp);\r\n };\r\n\r\n componentDidUpdate = () => {\r\n if (this.state.isOtpOpen !== this.props.offer.requireOtp) this.setOtpOpen(this.props.offer.requireOtp);\r\n\r\n if (\r\n // Credit check failed = 1, Upfront payment required = 2\r\n (this.props.offer.detailsStatus === detailStatuses.CREDIT_CHECK_FAILED ||\r\n this.props.offer.detailsStatus === detailStatuses.UPFRONT_PAYMENT_REQUIRED) &&\r\n this.state.isCreditCheckFailedOpenStamp !== this.props.offer.detailsStatusStamp\r\n )\r\n this.setState({\r\n isCreditCheckFailedOpen: true,\r\n isCreditCheckFailedOpenStamp: this.props.offer.detailsStatusStamp\r\n });\r\n };\r\n\r\n onChangeGeneric = (e, target) => {\r\n var newConfirmDetail = { ...this.state.confirmDetail, ...target, entryStarted: true };\r\n\r\n this.setState({ confirmDetail: newConfirmDetail }, () => this.setConfirmDetailStore(newConfirmDetail));\r\n };\r\n\r\n setConfirmDetail = newConfirmDetail => {\r\n this.setState({ confirmDetail: newConfirmDetail }, () => {\r\n this.setConfirmDetailStore(newConfirmDetail);\r\n });\r\n };\r\n\r\n setConfirmDetailStore = _debounce(\r\n newConfirmDetail => {\r\n this.props.actions.setConfirmDetail(newConfirmDetail);\r\n },\r\n 250,\r\n { leading: false }\r\n );\r\n\r\n onOtpCancel = () => {\r\n if (this.state.isOtpOpen) {\r\n this.props.selectedOfferActions.dispatchSelectedOfferSuccess({ ...this.props.offer, requireOtp: false });\r\n\r\n this.setState({ confirmDetail: { ...this.state.confirmDetail, otp: '' } }, () =>\r\n this.props.actions.setConfirmDetail(this.state.confirmDetail)\r\n );\r\n }\r\n };\r\n\r\n onCreditCheckFailedCancel = () => {\r\n if (this.state.isCreditCheckFailedOpen) {\r\n this.setState({ isCreditCheckFailedOpen: false });\r\n }\r\n };\r\n\r\n setOtpOpen = isOpen => {\r\n this.setState({ isOtpOpen: isOpen });\r\n };\r\n\r\n getLeadin = () => {\r\n switch (this.implementationCode) {\r\n case implementationCodes.HOME_LOAN.AU_DEFAULT:\r\n return \"We're about to pass these details to an expert in our home loans team\";\r\n default:\r\n return \"We need some basic information and then we'll get started straight away.\";\r\n }\r\n };\r\n\r\n render() {\r\n if (this.props.serverMessage.scrollTo) {\r\n setTimeout(() => {\r\n scroller.scrollTo('server-message', { duration: 800, delay: 0, smooth: 'easeInOutQuart', offset: -20 });\r\n this.props.serverMessageActions.setServerMessage({ scrollTo: false });\r\n }, 100);\r\n }\r\n\r\n return (\r\n \r\n {(!this.props.offer.twoStepConfirm || this.props.step === 'details') && (\r\n <>\r\n
\r\n Internet offers and options like modems, routers and call packages can be confusing. Our call\r\n center experts will call you to talk through your options and process your sale.\r\n
\r\n We've checked the market and it looks like you're already on great rates with{' '}\r\n {currentProviderName}\r\n {getFeatureCheckbox(_steps)}\r\n
\r\n )\r\n });\r\n break;\r\n\r\n case submissionTypes.ESTIMATE:\r\n let heading;\r\n let content;\r\n\r\n switch (serviceType) {\r\n case billTypes.INTERNET:\r\n heading = 'The lowest cost';\r\n content =
This plan has the lowest cost based on the plan features you've selected.
\r\n \r\n )\r\n });\r\n\r\n break;\r\n default:\r\n break;\r\n }\r\n }\r\n }\r\n }\r\n\r\n let drawerHeading;\r\n let drawerContent;\r\n switch (submissionType) {\r\n case submissionTypes.BILL:\r\n drawerHeading = 'Bill info and tools';\r\n drawerContent = `Open this draw to see your ${serviceTypeName} bill info and other useful tools.`;\r\n break;\r\n\r\n case submissionTypes.ESTIMATE:\r\n drawerHeading = 'Property info and tools';\r\n drawerContent = 'Open this draw to see your property info and other useful tools.';\r\n break;\r\n\r\n default:\r\n drawerHeading = null;\r\n drawerContent = null;\r\n }\r\n\r\n _steps.push({\r\n selector: '#drawer_handle',\r\n content: (\r\n
\r\n {hasSaving ? (\r\n <>\r\n Make sure you secure your {serviceTypeName} deal on this page, then go to your{' '}\r\n to see other offers we've found for {displayAddress}.\r\n \r\n ) : (\r\n <>\r\n Your current {serviceTypeName} deal looks great! Click the button now\r\n to check out the other offers we've found for {displayAddress}.\r\n \r\n )}\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n \r\n )\r\n });\r\n\r\n setSteps(_steps);\r\n }\r\n\r\n // allow the screen to finalize scroll position.\r\n delay(1500).then(() => startTour());\r\n }\r\n }, [comparison, userBill]);\r\n\r\n // --------------------------------------------------------------------------\r\n // Guided tour\r\n // --------------------------------------------------------------------------\r\n useEffect(() => {\r\n if (pageMode === pageModes.FRAMED) {\r\n postFrameScrollTopMessage(frameHost);\r\n }\r\n\r\n if (navigationEvent === navigationTypes.TOUR) {\r\n startTour(true);\r\n }\r\n }, [navigationEvent]);\r\n\r\n useEffect(() => {\r\n if (currentComparisonId !== comparison.id) {\r\n var newFilterSorter = getFilterSorter(comparison);\r\n setFilterSorter(newFilterSorter);\r\n setCurrentComparisonId(comparison.id);\r\n }\r\n }, [comparison]);\r\n\r\n const startTour = forceStart => {\r\n const userPreferences = getUserPreferences();\r\n const showTour =\r\n tourGuideEnabled &&\r\n pageMode === pageModes.DEFAULT &&\r\n (userPreferences[userPreferenceTypes.TOURS.code] === true || forceStart);\r\n\r\n if (showTour) {\r\n if (submitDialogOpen || directSwitchDialogOpen) {\r\n setQueueTour(true); // queue the tour to start once the estimate or direct switch error dialogs are closed.\r\n } else {\r\n // Requesting to start will start the tour once all ajax spinner calls have completed.\r\n setRequestStartTour(Date.now());\r\n }\r\n }\r\n };\r\n\r\n const closeTour = () => {\r\n setRequestStartTour(false);\r\n };\r\n\r\n const getEstimateDialog = () => {\r\n switch (comparison.implementationCode) {\r\n case implementationCodes.ELECTRICITY.US_DEFAULT:\r\n case implementationCodes.ELECTRICITY.AU_DEFAULT:\r\n case implementationCodes.GAS.AU_DEFAULT:\r\n case implementationCodes.INTERNET.AU_DEFAULT:\r\n return (\r\n \r\n );\r\n\r\n default:\r\n return null;\r\n }\r\n };\r\n\r\n const onTimeout = () => {\r\n closeTour();\r\n };\r\n\r\n const onDashboardClick = () => {\r\n closeTour();\r\n setQueueRedirect('/dashboard'); // set redirect path to navigate to after tour closes and has had an opportunity to set the scroll bar back.\r\n };\r\n\r\n const onDirectSwitchDialogOpen = () => {\r\n directSwitchDialogOpen = true;\r\n };\r\n\r\n const onDialogClosed = () => {\r\n if (queueTour) {\r\n setQueueTour(false);\r\n setRequestStartTour(Date.now());\r\n }\r\n };\r\n\r\n const tourClosed = () => {\r\n if (queueRedirect) {\r\n dispatch(push(queueRedirect));\r\n }\r\n };\r\n\r\n const openMoreInfo = () => {\r\n dispatch(setLanding({ ...landing, comparison: { ...landing.comparison, openMoreInfo: true } }));\r\n };\r\n\r\n return (\r\n <>\r\n \r\n Compare\r\n {getAdWordConversionScript(\r\n config.isLoaded,\r\n config.settings.googleAdWordsId,\r\n config.settings.googleAdWordsComparisonLabel,\r\n comparison.id\r\n )}\r\n {taboolaConversionScript(config.isLoaded, config.settings.taboolaId, config.settings.taboolaComparisonLabel)}\r\n \r\n \r\n {pageMode === pageModes.DEFAULT && (\r\n \r\n )}\r\n\r\n {getEstimateDialog()}\r\n\r\n \r\n\r\n
\r\n {showPriceNote && (\r\n \r\n \r\n
\r\n
\r\n Your e-bill may include usage charges that don't reflect your most recent energy rate changes.\r\n
\r\n
\r\n See{' '}\r\n {' '}\r\n to compare your current rates to the rates shown.\r\n
\r\n Unfortunately we have no {occupancyPurpose.Name.toLowerCase()} {serviceType.Name.toLowerCase()} plans for{' '}\r\n {postcodeInitial || displayAddress || 'your postcode'} right now.\r\n
\r\n \r\n \r\n );\r\n};\r\n\r\nexport default MyDetailsSection;\r\n","import React, { useState } from 'react';\r\nimport { Popover, PopoverHeader, PopoverBody } from 'reactstrap';\r\nimport { AvField } from 'availity-reactstrap-validation';\r\nimport QsButtonGroup from '../common/qsButtonGroup';\r\n\r\nconst LifeSupportQuestions = ({ formRef, confirmDetail, onChange }) => {\r\n const [infoOpen, setInfoOpen] = useState(false);\r\n\r\n const onChangeLifeSupport = event => {\r\n const option = event.target.getAttribute('data-value');\r\n\r\n if (formRef && formRef.current) {\r\n let inputs = {\r\n hiddenLifeSupport: formRef.current._inputs['hiddenLifeSupport']\r\n };\r\n formRef.current.setTouched(Object.keys(inputs));\r\n }\r\n\r\n onChange(null, { lifeSupport: option });\r\n };\r\n\r\n const validateHiddenLifeSupport = (value, ctx, input, cb) => {\r\n if (value === 'false') {\r\n cb('Unfortunately we can not process requests requiring life support equipment');\r\n } else cb(true);\r\n };\r\n\r\n return (\r\n <>\r\n
\r\n Does anyone residing or intending to reside at your property/premises require life support equipment?\r\n setInfoOpen(!infoOpen)}>\r\n info\r\n \r\n
\r\n \r\n \r\n\r\n setInfoOpen(!infoOpen)}>\r\n \r\n Why do we ask this?clear\r\n \r\n \r\n
\r\n If you, or anyone at your home depends on life support, this needs to be registered on your account. If\r\n applicable, your energy retailer and local distributor can give you extra protections with your power\r\n supply. You are classified as being life support dependent if you depend on any of the following life\r\n support equipment:\r\n \r\n \r\n
\r\n Any other equipment (whether fuelled by electricity or gas) that a registered medical practitioner\r\n certifies is required for a person residing at the customer's premises for life support or otherwise\r\n where the customer provides a current medical certificate certifying that a person residing at the\r\n customer's premises has a medical condition which requires continued supply of electricity or gas.\r\n
\r\n We'll pass your application details to {providerDisplayCode} for approval. If approved, they'll\r\n inform your current provider that you're moving to their plan, so you don't need to do this.\r\n
\r\n
\r\n You'll continue billing with your current provider until your meter is next read. Once your\r\n meter is read, you'll receive a final bill from your current provider.\r\n
\r\n
\r\n If you want to set up direct debit with {providerDisplayCode}, the welcome pack you receive from\r\n them will explain how to do this online or via phone is you prefer that option.\r\n
\r\n
\r\n \r\n
\r\n \r\n )\r\n }\r\n });\r\n }}\r\n />\r\n
\r\n )}\r\n
\r\n );\r\n};\r\n\r\nexport default Summary;\r\n","import React from 'react';\r\nimport { useState } from 'react';\r\nimport { useSelector } from 'react-redux';\r\nimport GeneralDialogCloseIcon from '../dialogs/generalDialogCloseIcon';\r\n\r\nconst QuickTips = ({ tip, onRatingClick, onClose }) => {\r\n const { staticContentUrl } = useSelector(state => state.config.applicationSettings);\r\n\r\n const [rating, setRating] = useState();\r\n\r\n const onClick = value => {\r\n setRating(value);\r\n onRatingClick(value);\r\n\r\n if (tip.onRatingClick) tip.onRatingClick(value);\r\n };\r\n\r\n return (\r\n
\r\n \r\n onChange(e, { existingNumber: e.target.value })}\r\n validate={{\r\n required: { value: true, errorMessage: 'Home phone number is required' },\r\n pattern: {\r\n value: homePhoneNumberRegex,\r\n errorMessage: `Please enter a valid home phone number for ${country.name} including area code (no spaces or hyphens)`\r\n }\r\n }}\r\n />\r\n \r\n \r\n\r\n
\r\n When you choose to have your bills linked to your , they'll automatically appear in your{' '}\r\n dashboard each time they're issued by {providerDisplayCode}.\r\n
\r\n\r\n
\r\n After 12 months, your will begin to automatically check your bills against the\r\n latest market rates whenever they're issued.\r\n
\r\n
\r\n You'll be automatically informed when a cheaper deal is available, based on your bill's actual energy\r\n usage and rates.\r\n
\r\n There's nothing more you need to do. Your bills and all other correspondence from {providerDisplayCode} will\r\n be instantly relayed from your to your personal email address. Any emails you\r\n respond to from your personal email address will also be relayed back to {providerDisplayCode}.\r\n
\r\n
\r\n Importantly, when communicating with {providerDisplayCode}, make sure you use your new{' '}\r\n {autocheckEmailAddressDisplay} email address. We'll confirm that address as soon as you submit your\r\n application.\r\n
\r\n Internet offers and options like modems, routers and call packages can be confusing. Our call center\r\n experts will call you to talk through your options and process your sale.\r\n
\r\n
\r\n );\r\n }\r\n\r\n myDetails = ;\r\n billDeliveryDetails = (\r\n \r\n );\r\n otherDetails = (\r\n <>\r\n \r\n \r\n \r\n );\r\n\r\n if (hasDirectDebit) {\r\n directDebitDetails = (\r\n \r\n );\r\n }\r\n\r\n if (productDetail.showVerifyId) {\r\n idVerificationDetails = (\r\n \r\n );\r\n }\r\n }\r\n\r\n if (showTerms && productDetail && productDetail.inlineTermsAndConditions) {\r\n termsDetails = auTerms;\r\n }\r\n break;\r\n\r\n case implementationCodes.ELECTRICITY.US_DEFAULT:\r\n if (showDetails) {\r\n myDetails = (\r\n \r\n );\r\n }\r\n\r\n if (showTerms) {\r\n termsDetails = usTerms;\r\n }\r\n break;\r\n\r\n case implementationCodes.HOME_LOAN.AU_DEFAULT:\r\n leadin = \"We're about to pass these details to an expert in our home loans team\";\r\n\r\n if (showDetails) {\r\n myDetails = ;\r\n }\r\n\r\n if (showTerms) {\r\n termsDetails = auTerms;\r\n }\r\n break;\r\n\r\n default:\r\n break;\r\n }\r\n\r\n hasIdVerification = idVerificationDetails ? true : false;\r\n\r\n const myDetailsHeader = (\r\n
\r\n {providerDisplayCode} requires your contact details and ID verification information to complete your{' '}\r\n {serviceTypeName} application.\r\n
\r\n
\r\n We take your privacy seriously. We will never share your information with any third parties for any reason\r\n other than to provide our core services as outlined in our{' '}\r\n and{' '}\r\n .\r\n
\r\n Select your preferred ID verification method and your drivers licence state of issue or medicare card\r\n colour and click Quick Tips again to see where the required information is on your card / document.\r\n
\r\n )}\r\n\r\n
\r\n License not handy?\r\n
\r\n\r\n
\r\n Try searching for the word 'license' in the photos section of your smartphone for a previous photo you've\r\n taken.\r\n
\r\n Once you've switched, {providerDisplayCode} will send you a welcome pack explaining how you can set up\r\n direct debit online or over the phone if you prefer that option.\r\n
\r\n\r\n \r\n \r\n ) : (\r\n getComponents()\r\n )}\r\n \r\n setIsCreditCheckFailedOpen(false)} />\r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default OfferAccept;\r\n","import React from 'react';\r\n\r\n// Note: these are written to work with react-helmet. It may look like these can be done as function components but that does not work within a tag\r\n\r\nlet getFacebookPixelScript = (isLoaded, facebookPixelId) => {\r\n var result =\r\n isLoaded && facebookPixelId ? (\r\n \r\n ) : null;\r\n\r\n return result;\r\n};\r\n\r\nlet getFacebookPixelNoScript = (isLoaded, facebookPixelId) => {\r\n var result =\r\n isLoaded && facebookPixelId ? (\r\n \r\n ) : null;\r\n\r\n return result;\r\n};\r\n\r\nlet facebookPageChanged = (facebookPixelId, window, path) => {\r\n if (facebookPixelId && window.fbq) {\r\n if (path)\r\n window.fbq('track', 'PageView', {\r\n page: path\r\n });\r\n else window.fbq('track', 'PageView');\r\n }\r\n};\r\n\r\nexport { getFacebookPixelScript, getFacebookPixelNoScript, facebookPageChanged };\r\n","import React, { useState, useCallback } from 'react';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport _debounce from 'lodash.debounce';\r\n\r\nimport { useAuth0 } from '../../auth/auth0-Provider';\r\nimport Offer from './offer';\r\nimport OfferAccept from '../OfferAcceptance/offerAccept';\r\nimport IdleOfferTimeout from '../common/idleOfferTimeout';\r\n\r\nimport * as serverMessageTargets from '../../actions/serverMessageTargets';\r\nimport { sessionExpiredServerMessage } from '../../actions/serverMessageActions';\r\nimport { setAcceptedOffer } from '../../actions/selectedOfferActions';\r\nimport { goHome, getComparisonWithToken, getComparisonWithKey, goDashboard } from '../../actions/comparisonActions';\r\nimport { openSubmitDialog } from '../../actions/dialogOptionsActions';\r\nimport { resetFramePartner } from '../../actions/partnerActions';\r\n\r\nimport { onComparisonTimeout } from '../../utilities/compareUtilities';\r\nimport { getSessionActivity } from '../../utilities/commonUtilities';\r\nimport { getAddress } from '../../utilities/addressUtilities';\r\nimport { getNextServices } from '../serviceCard/serviceCardUtilities';\r\nimport { postFrameScrollTopMessage } from '../../utilities/domUtilities';\r\nimport { offerEvents, pageChanged, standardEvents } from '../../utilities/googleAnalyticsEvents';\r\n\r\nimport { billTypes } from '../../enums/billTypes';\r\nimport { serviceCardLoadingTypes } from '../../enums/serviceCardLoadingTypes';\r\nimport { submissionTypes } from '../../enums/submissionTypes';\r\nimport { pageModes } from '../../enums/launchTypes';\r\nimport { uploadBillTypes, uploadSubTypes } from '../../enums/uploadBillTypes';\r\nimport { restartSources } from '../../enums/partnerFrameTypes';\r\n\r\nimport GeneralDialog from '../dialogs/generalDialog';\r\nimport SwitchedDialogContent from '../dialogs/switchedDialogContent';\r\nimport IdleTimerDialog from '../dialogs/idleTimerDialog';\r\n\r\nimport { facebookPageChanged } from '../../utilities/facebookUtilities';\r\n\r\nconst OfferSwitch = ({ isDirectSwitch, onBack }) => {\r\n const { getAccessToken, isUserAuthenticated } = useAuth0();\r\n\r\n const { selectedOffer, user, comparison, confirmDetail, session } = useSelector(state => state);\r\n const { switchButtonText } = useSelector(state => state.content.general);\r\n const { googleAnalyticsClientCode, uxSwitchVersion, uxSwitchInternetVersion, showPoweredBy } = useSelector(\r\n state => state.config.settings\r\n );\r\n const { loaded: userBillsLoaded, data: userBills } = useSelector(state => state.userBills);\r\n const { settings: configSettings, billTypes: agentBillTypes } = useSelector(state => state.config);\r\n const { pageMode, frameHost } = useSelector(state => state.application);\r\n\r\n const serviceCardLoading = !userBillsLoaded ? serviceCardLoadingTypes.DEFAULT : serviceCardLoadingTypes.NONE;\r\n\r\n const dispatch = useDispatch();\r\n\r\n const target = serverMessageTargets.COMPARE;\r\n\r\n const [switchedDialogOpen, setSwitchedDialogOpen] = useState(false);\r\n const [switchedDialogCloseButtonText, setSwitchedDialogCloseButtonText] = useState();\r\n const [switchedDialogConfirmButtonText, setSwitchedDialogConfirmButtonText] = useState();\r\n\r\n const sessionActivity = getSessionActivity(session);\r\n\r\n const serviceType = billTypes.getByCode(comparison.submission.billType);\r\n\r\n const onComplete = offer => {\r\n const nextUserBill = getNextUserBill();\r\n\r\n if (nextUserBill) {\r\n const nextServiceType = billTypes.getById(nextUserBill.billTypeId);\r\n setSwitchedDialogConfirmButtonText(`Continue with ${nextServiceType.Name}`);\r\n setSwitchedDialogCloseButtonText('No thanks');\r\n } else {\r\n setSwitchedDialogCloseButtonText('Done');\r\n }\r\n\r\n setSwitchedDialogOpen(true);\r\n\r\n offerEvents('switched-dialog', offer, googleAnalyticsClientCode);\r\n pageChanged('/switched', '', 'Switched', configSettings, false);\r\n facebookPageChanged(configSettings.facebookPixelId, window, '/switched');\r\n };\r\n\r\n const getNextUserBill = () => {\r\n const otherUserBills = getOtherUserBills();\r\n\r\n return otherUserBills.length > 0 ? otherUserBills[0] : null;\r\n };\r\n\r\n const getOtherUserBills = () => {\r\n const addressOptions = {\r\n unitNumber: true\r\n };\r\n\r\n const switchedAddress = getAddress(comparison.submission.propertyAddress, addressOptions);\r\n const otherUserBills = getNextServices(serviceType, switchedAddress, agentBillTypes, userBills);\r\n\r\n return otherUserBills;\r\n };\r\n\r\n const getOtherServices = () => {\r\n const otherUserBills = getOtherUserBills();\r\n\r\n const services = [];\r\n\r\n otherUserBills.forEach(e => {\r\n services.push(billTypes.getById(e.billTypeId));\r\n });\r\n\r\n return services;\r\n };\r\n\r\n const getComparison = ({ submissionType, submissionId, accessKey, billTypeId, estimate }) => {\r\n const nextServiceType = billTypes.getById(billTypeId);\r\n\r\n // Auto show estimate dialog if the next service is a default estimate submission.\r\n if (submissionType === submissionTypes.ESTIMATE && estimate.defaultComparison) {\r\n dispatch(openSubmitDialog(nextServiceType, uploadBillTypes.NONE, uploadSubTypes.NONE));\r\n }\r\n\r\n const serviceCardLoading = userBillsLoaded ? serviceCardLoadingTypes.NONE : serviceCardLoadingTypes.DEFAULT;\r\n\r\n if (accessKey) {\r\n dispatch(\r\n getComparisonWithKey(\r\n { key: accessKey.accessKey, id: accessKey.accessId },\r\n null,\r\n submissionType,\r\n nextServiceType,\r\n serviceCardLoading\r\n )\r\n );\r\n } else if (isUserAuthenticated()) {\r\n const fn = async () => {\r\n dispatch(getComparisonWithToken(await getAccessToken(), submissionId, submissionType, serviceType));\r\n };\r\n fn();\r\n } else {\r\n dispatch(sessionExpiredServerMessage(serverMessageTargets.HOME));\r\n goHome();\r\n }\r\n };\r\n\r\n const onSelectOffer = useCallback(\r\n _debounce(\r\n async (offer, submissionId) => {\r\n let accessToken = isUserAuthenticated() ? await getAccessToken() : null;\r\n\r\n if (comparison.accessKey || isUserAuthenticated()) {\r\n dispatch(\r\n setAcceptedOffer(\r\n sessionActivity,\r\n serviceType,\r\n comparison,\r\n offer,\r\n confirmDetail,\r\n accessToken,\r\n submissionId,\r\n onComplete\r\n )\r\n );\r\n } else {\r\n dispatch(sessionExpiredServerMessage(target));\r\n }\r\n\r\n offerEvents('accept-offer', offer, googleAnalyticsClientCode);\r\n },\r\n 2000,\r\n { leading: true }\r\n ),\r\n [confirmDetail, comparison]\r\n );\r\n\r\n const onTimeoutClosed = () => {\r\n const accessToken = isUserAuthenticated() ? getAccessToken : null;\r\n dispatch(onComparisonTimeout(serviceCardLoading, accessToken, comparison));\r\n };\r\n\r\n const onSwitchedClosed = result => {\r\n if (!result) {\r\n setSwitchedDialogOpen(false);\r\n dispatch(goDashboard());\r\n\r\n if (pageMode === pageModes.FRAMED) {\r\n standardEvents('energy-estimate-wizard', 'click', 'switched-dialog-closed', googleAnalyticsClientCode);\r\n dispatch(resetFramePartner(restartSources.SWITCH));\r\n postFrameScrollTopMessage(frameHost);\r\n }\r\n } else {\r\n const nextUserBill = getNextUserBill();\r\n\r\n if (nextUserBill) {\r\n getComparison(nextUserBill);\r\n }\r\n }\r\n };\r\n\r\n const getSwitchComponent = () => {\r\n const useEnergyUx2 =\r\n uxSwitchVersion === 2 && (serviceType === billTypes.ELECTRICITY || serviceType === billTypes.GAS);\r\n const useInternetUx2 = uxSwitchInternetVersion === 2 && serviceType === billTypes.INTERNET;\r\n\r\n if (useEnergyUx2 || useInternetUx2) {\r\n return (\r\n \r\n );\r\n }\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n return (\r\n <>\r\n
{getSwitchComponent()}
\r\n\r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default OfferSwitch;\r\n","import React, { useState, useEffect } from 'react';\r\nimport { goBack } from 'connected-react-router';\r\nimport { Container, Button } from 'reactstrap';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { Helmet } from 'react-helmet';\r\nimport * as serverMessageTargets from '../actions/serverMessageTargets';\r\nimport { displayInfoMessage, setServerMessageClear } from '../actions/serverMessageActions';\r\nimport { goHome } from '../actions/comparisonActions';\r\nimport ServerMessage from '../components/common/serverMessage';\r\nimport OfferSwitch from '../components/common/offerSwitch';\r\nimport CompareDrawer from '../components/common/compareDrawer';\r\nimport SubmitBillDialogUx2 from '../components/dialogs/submitBillDialogUx2';\r\nimport ServiceIcon from '../components/serviceCard/serviceIcon';\r\nimport FooterDisclaimers from '../components/disclaimers/footerDisclaimers';\r\nimport { setDirectSwitch } from '../actions/directSwitchActions';\r\nimport { billTypes } from '../enums/billTypes';\r\nimport { uploadBillTypes, uploadSubTypes } from '../enums/uploadBillTypes';\r\nimport { directSwitchSessionStatus } from '../enums/directSwitchSessionStatus';\r\nimport { directSwitchTypes } from '../enums/submissionTypes';\r\nimport { pageModes } from '../enums/launchTypes';\r\nimport { postFrameScrollTopMessage } from '../utilities/domUtilities';\r\nimport SummaryFooter from '../components/EstimateWizard/summaryFooter';\r\n\r\nconst SwitchScreen = () => {\r\n const dispatch = useDispatch();\r\n const target = serverMessageTargets.SWITCH;\r\n\r\n const { comparison, directSwitch, serverMessage } = useSelector(state => state);\r\n const { pageMode, frameHost } = useSelector(state => state.application);\r\n\r\n const [isDirectSwitch, setIsDirectSwitch] = useState(false);\r\n const [submitDialogOpen, setSubmitDialogOpen] = useState(false);\r\n\r\n const serviceType = billTypes.getByCode(comparison.submission.billType);\r\n const serviceTypeName = serviceType ? serviceType.Name.toLowerCase() : null;\r\n const submissionId = comparison.submissionId;\r\n const submission = comparison.submission;\r\n\r\n const openDialog = () => {\r\n dispatch(setServerMessageClear(serverMessageTargets.SUBMIT_BILL, serverMessage));\r\n dispatch(setServerMessageClear(serverMessageTargets.ESTIMATE_DIALOG, serverMessage));\r\n\r\n setSubmitDialogOpen(true);\r\n };\r\n\r\n const onBack = () => {\r\n dispatch(setServerMessageClear());\r\n dispatch(goBack());\r\n };\r\n\r\n useEffect(() => {\r\n if (pageMode === pageModes.FRAMED) {\r\n postFrameScrollTopMessage(frameHost);\r\n }\r\n\r\n if (!comparison.isLoaded) {\r\n dispatch(goHome());\r\n }\r\n\r\n if (directSwitch.sessionStatus === directSwitchSessionStatus.READY) {\r\n if (directSwitch.directSwitchType === directSwitchTypes.LANDING) {\r\n dispatch(\r\n displayInfoMessage(\r\n target,\r\n
\r\n NOTE: You are switching your {serviceTypeName} plan for an existing {serviceTypeName} connection at\r\n this address. To setup a new connection click{' '}\r\n \r\n .\r\n
,\r\n false\r\n )\r\n );\r\n }\r\n\r\n setIsDirectSwitch(true);\r\n\r\n // Set session status so user is not forced into initial offer again.\r\n const model = {\r\n ...directSwitch,\r\n sessionStatus: directSwitchSessionStatus.COMPLETED_SUCCESSFULLY\r\n };\r\n\r\n dispatch(setDirectSwitch(model));\r\n }\r\n }, []);\r\n\r\n const getHeader = () => {\r\n switch (serviceType) {\r\n case billTypes.HOME_LOAN:\r\n return (\r\n
\r\n \r\n );\r\n};\r\nexport default FaqQuestion;\r\n","import React, { useEffect } from 'react';\r\nimport { scroller } from 'react-scroll';\r\nimport { useSelector } from 'react-redux';\r\n\r\nimport { billTypes } from '../../enums/billTypes';\r\n\r\nimport FaqQuestion from './faqQuestion';\r\nimport CommissionTermsDialog from '../dialogs/commissionTermsDialog';\r\n\r\nconst FaqAu = ({ panelProviders }) => {\r\n useEffect(() => {\r\n const hash = window.location.hash;\r\n\r\n if (hash && hash.startsWith('#')) {\r\n var id = hash.substring(1);\r\n\r\n scroller.scrollTo(id, {\r\n duration: 800,\r\n delay: 500,\r\n smooth: 'easeInOutQuart'\r\n });\r\n }\r\n }, []);\r\n\r\n const { areasSupportedDisclaimer } = useSelector(state => state.content.general);\r\n const { billTypes: agentBillTypes } = useSelector(state => state.config);\r\n\r\n const hasInternet = billTypes.hasServiceType(agentBillTypes, billTypes.INTERNET);\r\n const hasHomeLoan = billTypes.hasServiceType(agentBillTypes, billTypes.HOME_LOAN);\r\n\r\n const energyPanel = panelProviders.filter(\r\n p => p.provider.billTypes.filter(bt => bt.id === billTypes.ELECTRICITY.Id || bt.id === billTypes.GAS.Id).length > 0\r\n );\r\n\r\n const internetPanel = panelProviders.filter(\r\n p => p.provider.billTypes.filter(bt => bt.id === billTypes.INTERNET.Id).length > 0\r\n );\r\n\r\n const homeLoanPanel = panelProviders.filter(\r\n p => p.provider.billTypes.filter(bt => bt.id === billTypes.HOME_LOAN.Id).length > 0\r\n );\r\n\r\n const getCustomerCommissionQuestions = () => {\r\n const serviceTypeOptions = { includeExternal: true };\r\n const agentServices = billTypes.getAgentServices(agentBillTypes, null, serviceTypeOptions);\r\n\r\n const commissionServices =\r\n agentServices &&\r\n agentServices.filter(e => e.enabled && (e.hasCommission || (e.providers && e.providers.length > 0)));\r\n\r\n if (!commissionServices || commissionServices.length === 0) return;\r\n\r\n const firstService = commissionServices[0];\r\n\r\n const commissionName = firstService.commissionType.Name;\r\n const commissionTag = firstService.commissionType.Tag;\r\n const question1 = `When will I get my ${commissionName} offer?`;\r\n\r\n const body1 = `After you've successfully switched a service with an associated ${commissionName} offer, we'll need a little time to check that the terms of the ${commissionTag} offer have been met. Your ${commissionName} will be sent to the details you used in your application, between 60 and 90 days after your application has been successfully approved by the retailer. To be eligible for the ${commissionName} offer, you'll need to be an active billing customer with the retailer on the day the ${commissionName} is due to be issued. If your agreement was cancelled or you decide to switch to a different product, you will not receive your ${commissionTag}.`;\r\n\r\n const answer1 = (\r\n <>\r\n
\r\n \r\n );\r\n\r\n const question2 = `My application was approved by the retailer, but I haven't received my ${commissionName}. What should I do?`;\r\n\r\n const answer2 = (\r\n <>\r\n {`Once your application is successfully approved by the retailer, we need a little time to do some checks. This can take up to three months. To be eligible for the ${commissionName} offer, you'll need to be an active billing customer with the retailer on the day the ${commissionTag} are due to be issued. If you've met the terms of the offer and you'd like to know more, please email `}\r\n service@smartme.bizand we'll get it sorted.\r\n \r\n );\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n );\r\n };\r\n\r\n return (\r\n <>\r\n {energyPanel && energyPanel.length > 0 && (\r\n \r\n We consider offers from Australia's leading energy retailers to find the product that best aligns to your\r\n needs. These retailers include:{' '}\r\n
\r\n {energyPanel.map(a => {\r\n return
{a.provider.displayCode}
;\r\n })}\r\n
\r\n {areasSupportedDisclaimer}\r\n \r\n }\r\n />\r\n )}\r\n\r\n {hasInternet && internetPanel && internetPanel.length > 0 && (\r\n \r\n We consider offers from Australia's leading broadband retailers to find the product that best aligns to\r\n your needs. These retailers include:{' '}\r\n
\r\n {internetPanel.map(a => {\r\n return
{a.provider.displayCode}
;\r\n })}\r\n
\r\n \r\n }\r\n />\r\n )}\r\n\r\n {hasHomeLoan && homeLoanPanel && homeLoanPanel.length > 0 && (\r\n \r\n We consider offers from Australia's leading home loan providers to find the product that best aligns to\r\n your needs. These providers include:{' '}\r\n
\r\n {homeLoanPanel.map(a => {\r\n return
{a.provider.displayCode}
;\r\n })}\r\n
\r\n \r\n }\r\n />\r\n )}\r\n\r\n \r\n Comparison does not take into account concessions, payment processing\r\n fees, paper bill fees, green energy contributions, government rebates, guaranteed service level credits or\r\n any balances carried forward from previous bill, unless otherwise stated. Comparison{' '}\r\n does take in to account the number of days of energy usage, the amount of\r\n kWh or MJ usage, the metering type of the energy consumed e.g. peak / off-peak / controlled load, usage\r\n pricing steps, solar feed-in and any discounts applied.\r\n \r\n }\r\n />\r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n {getCustomerCommissionQuestions()}\r\n \r\n );\r\n};\r\nexport default FaqAu;\r\n","import React from 'react';\r\nimport FaqQuestion from './faqQuestion';\r\n\r\nconst FaqUs = props => {\r\n const { panelProviders } = props;\r\n\r\n return (\r\n <>\r\n \r\n We consider offers from leading utility providers to find and present the products that best aligns to your\r\n needs. These providers include:\r\n
\r\n {panelProviders.map(a => {\r\n return
{a.provider.displayCode}
;\r\n })}\r\n
\r\n Services may not be available in government regulated service markets.\r\n \r\n }\r\n />\r\n\r\n \r\n Comparison does not take into account concessions, payment processing\r\n fees, paper bill fees, green energy contributions, government rebates, guaranteed service level credits or\r\n any balances carried forward from previous bill, unless otherwise stated. Comparison{' '}\r\n does take in to account the number of days of energy usage, the amount of\r\n kWh or MJ usage, the metering type of the energy consumed, usage pricing steps, solar feed-in and any\r\n credits applied.\r\n \r\n }\r\n />\r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n\r\n \r\n \r\n );\r\n};\r\nexport default FaqUs;\r\n","import React from 'react';\r\nimport { useSelector } from 'react-redux';\r\nimport { Container, Row, Col, Button } from 'reactstrap';\r\nimport { Helmet } from 'react-helmet';\r\nimport FaqAu from './common/faqAu';\r\nimport FaqUs from './common/faqUs';\r\nimport { homePageTypes, agentOperatingModes } from '../enums/launchTypes';\r\n\r\nconst Faq = props => {\r\n const { panelProviders, country } = useSelector(state => state.config);\r\n const { homePageType, operatingMode } = useSelector(state => state.config.settings);\r\n\r\n const homePage = homePageTypes.getById(homePageType);\r\n const agentMode = agentOperatingModes.getById(operatingMode);\r\n\r\n return (\r\n <>\r\n \r\n FAQs\r\n \r\n \r\n \r\n
You've taken a big step towards removing bill pain forever.
\r\n \r\n \r\n )}\r\n\r\n \r\n
\r\n
\r\n You now have a {programName} email address that you can use with all your providers so that {programName}{' '}\r\n can receive and check your future bills.\r\n
\r\n
{autoCheckEmailAddress}
\r\n \r\n \r\n\r\n
\r\n
{actionButton}
\r\n
\r\n \r\n );\r\n};\r\n\r\nexport default RegistrationSummary;\r\n","import React from 'react';\r\nimport { useSelector } from 'react-redux';\r\nimport { Container, Row, Col } from 'reactstrap';\r\n\r\nimport TermsAndConditionsDialog from '../dialogs/termsAndConditionsDialog';\r\nimport OrganiserName from '../common/organiserName';\r\n\r\nconst RegistrationIntroduction = () => {\r\n const { programName, programDisplayName } = useSelector(state => state.config);\r\n\r\n var title = `${programDisplayName}™ Registration`;\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n
\r\n {programName} is a free service that helps to remove bill-pain by managing your household bills in one\r\n central location. You'll soon be able to access your current and past bills, pay your bills by responding to\r\n an SMS and if you are moving house, you'll be able to move multiple services in one locaton.\r\n
\r\n
\r\n If you choose to have your bills delivered to your we'll ask your new retailer to email\r\n your future e-bills to a {programName} email address we set up for you. We'll immediately forward all\r\n correspondence and bills from your retailer to your regular email address. Importantly, when communicating\r\n with the retailer, and when you register on their website or any apps, you'll need to use your Organiser\r\n email address that we'll share with them.\r\n
\r\n
\r\n See for more details.\r\n
\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default RegistrationIntroduction;\r\n","import React from 'react';\r\nimport { useSelector } from 'react-redux';\r\nimport { Container, Row, Col } from 'reactstrap';\r\nimport { Helmet } from 'react-helmet';\r\nimport RegistrationDialog from './registrationDialog';\r\nimport RegistrationDialogUx2 from '../registration/registrationDialogUx2';\r\nimport RegistrationSummary from './registrationSummary';\r\nimport RegistrationIntroduction from './registrationIntroduction';\r\n\r\nconst Registration = () => {\r\n const { name: agentName, programName } = useSelector(state => state.config);\r\n const { registrationComplete, registrationPresent, emailAddress, autoCheckEmailAddress } = useSelector(\r\n state => state.registration\r\n );\r\n\r\n return (\r\n \r\n \r\n Registration\r\n \r\n\r\n {registrationComplete || registrationPresent ? (\r\n
\r\n You are currently unsubscribed to SMS notifications. SMS \"start\" from{' '}\r\n {mobilePhoneNumber} to {smsGeneralMobileNumber} to enable SMS preferences.\r\n
\r\n You are currently unsubscribed to SMS authentication. You will not be able to log in\r\n via SMS codes. SMS \"start\" from {mobilePhoneNumber} to{' '}\r\n {smsAuthenticationMobileNumber} to enable authentication.\r\n
\r\n Take complete control of your bills permanently by setting up your Concierge preferences here. You can\r\n change these at any time through the 'preferences' section in your dashboard.\r\n
\r\n
\r\n When Concierge finds a deal that matches your preferences (below) we'll inform you via email and/or SMS that\r\n you will be moved to that new deal in 3 days time. If you do not wish to move to the new deal, you can\r\n simply respond 'NO' to the email and/or SMS and you’ll remain on your current plan.\r\n
\r\n
\r\n Please set up you Concierge preferences for each household service below. Concierge will only inform you of\r\n a new deal when ALL of your preferences are achieved.\r\n
\r\n Looks like you have not switched any services yet. Services switched using {programDisplayName} will appear\r\n here.\r\n
\r\n )}\r\n\r\n {!userBillsLoaded &&
Loading your preferences...
}\r\n\r\n {userBillsLoaded && (\r\n <>\r\n {disableConciergeDialogTrigger &&\r\n !selectedPreferences.isNew &&\r\n showDialog(\r\n 'Disable Concierge?',\r\n `You are about to disable Concierge for ${selectedSupplyAddress.lastBillMeterAddress}. Are you sure?`,\r\n result => {\r\n if (result) {\r\n onDisable();\r\n }\r\n setDisableConciergeDialogTrigger(false);\r\n }\r\n )}\r\n\r\n onSave(event)}>\r\n \r\n
\r\n You have not set up Concierge preferences for this address yet.\r\n
\r\n ) : (\r\n onEnableChanged(!selectedPreferences.enabled)}\r\n >\r\n {`${selectedPreferences.enabled ? 'Disable' : 'Enable'} Concierge for this address`}\r\n \r\n )}\r\n \r\n \r\n \r\n\r\n \r\n {renderLabel('The new deal achieves a bill reduction of at least')}\r\n
\r\n \r\n \r\n {\r\n updateLocalPreferenceSetting({\r\n betterOfferPercentageMinimum: e.target.value === '' ? 0 : e.target.value\r\n });\r\n }}\r\n validate={{\r\n min: { value: 0, errorMessage: 'Please enter a value >= 0' },\r\n max: { value: 100, errorMessage: 'Please enter a value <= 100' },\r\n maxLength: { value: 5 },\r\n number: true,\r\n required: { value: true, errorMessage: 'Required' }\r\n }}\r\n />\r\n \r\n \r\n %\r\n \r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n {renderLabel('The new deal can have exit fees')}\r\n
\r\n \r\n updateLocalPreferenceSetting({\r\n includePayOnTimePlans: e.target.getAttribute('data-value')\r\n })\r\n }\r\n additionalClass=\"qs-concierge-preferences-button-group\"\r\n buttons={[\r\n {\r\n label: 'Yes',\r\n value: 'true'\r\n },\r\n {\r\n label: 'No',\r\n value: 'false'\r\n }\r\n ]}\r\n />\r\n \r\n \r\n\r\n \r\n {renderLabel('The new deal has solar credits the same or higher than my current plan')}\r\n
\r\n \r\n updateLocalPreferenceSetting({\r\n includeInferiorSolarPlans: e.target.getAttribute('data-value')\r\n })\r\n }\r\n additionalClass=\"qs-concierge-preferences-button-group\"\r\n buttons={[\r\n {\r\n label: 'Yes',\r\n value: 'false'\r\n },\r\n {\r\n label: 'No',\r\n value: 'true'\r\n }\r\n ]}\r\n />\r\n \r\n \r\n\r\n \r\n {renderLabel(\"Don't switch me more often than every\")}\r\n
\r\n I understand that I will be informed about a switch using the contact details provided above, and\r\n can opt-out of any deal offered by Concierge\r\n \r\n
\r\n 
\r\n 
\r\n ) : (\r\n 
\r\n 
\r\n {serviceType.ComparisonImplemented && (\r\n <>\r\n 
}\r\n\r\n 
\r\n \r\n );\r\n })}\r\n 
\r\n 
\r\n \r\n );\r\n })}\r\n 
\r\n 
\r\n 
{' '}\r\n 
\r\n 
\r\n 
\r\n 
\r\n 
\r\n 
\r\n 
\r\n {/* {offer.indicator === 'sponsor' && 
\r\n )}\r\n {cardType && cardType.logo && cardType.logoHorizontal && (\r\n 
\r\n \r\n 
\r\n 
\r\n 
\r\n