@xylabs/sdk-react 2.9.10 → 2.9.14

package/dist/cjs5/index.js

@@ -18,6 +18,7 @@ var queryString = require('query-string');
 var styles$1 = require('@mui/material/styles');
 var clone = require('lodash/clone');
 var numeral = require('numeral');
+var reactDom = require('react-dom');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -39,33 +40,6 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
 PERFORMANCE OF THIS SOFTWARE.
 ***************************************************************************** */
-/* global Reflect, Promise */
-
-var extendStatics = function(d, b) {
-    extendStatics = Object.setPrototypeOf ||
-        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-        function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-    return extendStatics(d, b);
-};
-
-function __extends(d, b) {
-    if (typeof b !== "function" && b !== null)
-        throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-    extendStatics(d, b);
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-}
-
-var __assign = function() {
-    __assign = Object.assign || function __assign(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 
 function __rest(s, e) {
     var t = {};
@@ -87,176 +61,107 @@ function __awaiter(thisArg, _arguments, P, generator) {
         function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
-}
-
-function __generator(thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
-            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;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-}
-
-function __values(o) {
-    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-    if (m) return m.call(o);
-    if (o && typeof o.length === "number") return {
-        next: function () {
-            if (o && i >= o.length) o = void 0;
-            return { value: o && o[i++], done: !o };
-        }
-    };
-    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
-}
-
-function __read(o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-}
-
-function __spreadArray(to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
 }
 
-var BusyCircularProgress = function (_a) {
-    var bgcolor = _a.bgcolor, style = _a.style, rounded = _a.rounded, size = _a.size, _b = _a.opacity, opacity = _b === void 0 ? 0.85 : _b, props = __rest(_a, ["bgcolor", "style", "rounded", "size", "opacity"]);
-    var theme = material.useTheme();
-    return (jsxRuntime.jsx(material.Box, __assign({ display: "flex", bgcolor: material.alpha(bgcolor !== null && bgcolor !== void 0 ? bgcolor : theme.palette.background.default, parseFloat("".concat(opacity))), flexGrow: 1, position: "absolute", left: 0, right: 0, top: 0, bottom: 0, justifyContent: "center", alignItems: "center", overflow: "hidden", style: __assign({ borderRadius: rounded ? theme.shape.borderRadius : 0 }, style) }, { children: jsxRuntime.jsx(material.CircularProgress, __assign({ size: size }, props), void 0) }), void 0));
+const BusyCircularProgress = (_a) => {
+    var { bgcolor, style, rounded, size, opacity = 0.85 } = _a, props = __rest(_a, ["bgcolor", "style", "rounded", "size", "opacity"]);
+    const theme = material.useTheme();
+    return (jsxRuntime.jsx(material.Box, Object.assign({ display: "flex", bgcolor: material.alpha(bgcolor !== null && bgcolor !== void 0 ? bgcolor : theme.palette.background.default, parseFloat(`${opacity}`)), flexGrow: 1, position: "absolute", left: 0, right: 0, top: 0, bottom: 0, justifyContent: "center", alignItems: "center", overflow: "hidden", style: Object.assign({ borderRadius: rounded ? theme.shape.borderRadius : 0 }, style) }, { children: jsxRuntime.jsx(material.CircularProgress, Object.assign({ size: size }, props), void 0) }), void 0));
 };
 
-var BusyLinearProgress = function (_a) {
-    var bgcolor = _a.bgcolor, style = _a.style, rounded = _a.rounded, _b = _a.opacity, opacity = _b === void 0 ? 0.85 : _b, props = __rest(_a, ["bgcolor", "style", "rounded", "opacity"]);
-    var theme = material.useTheme();
-    return (jsxRuntime.jsx(material.Box, __assign({ display: "flex", flexDirection: "column", bgcolor: material.alpha(bgcolor !== null && bgcolor !== void 0 ? bgcolor : theme.palette.background.default, parseFloat("".concat(opacity))), position: "absolute", left: 0, right: 0, top: 0, bottom: 0, justifyContent: "flex-start", alignItems: "stretch", overflow: "hidden", style: __assign({ borderRadius: rounded ? theme.shape.borderRadius : 0 }, style) }, { children: jsxRuntime.jsx(material.LinearProgress, __assign({}, props), void 0) }), void 0));
+const BusyLinearProgress = (_a) => {
+    var { bgcolor, style, rounded, opacity = 0.85 } = _a, props = __rest(_a, ["bgcolor", "style", "rounded", "opacity"]);
+    const theme = material.useTheme();
+    return (jsxRuntime.jsx(material.Box, Object.assign({ display: "flex", flexDirection: "column", bgcolor: material.alpha(bgcolor !== null && bgcolor !== void 0 ? bgcolor : theme.palette.background.default, parseFloat(`${opacity}`)), position: "absolute", left: 0, right: 0, top: 0, bottom: 0, justifyContent: "flex-start", alignItems: "stretch", overflow: "hidden", style: Object.assign({ borderRadius: rounded ? theme.shape.borderRadius : 0 }, style) }, { children: jsxRuntime.jsx(material.LinearProgress, Object.assign({}, props), void 0) }), void 0));
 };
 
-var BusyBox = function (_a) {
-    var background = _a.background, children = _a.children, component = _a.component, _b = _a.busyVariant, busyVariant = _b === void 0 ? 'circular' : _b, busySize = _a.busySize, _c = _a.busyOpacity, busyOpacity = _c === void 0 ? 0.85 : _c, busyColor = _a.busyColor, busy = _a.busy, busyCircularProps = _a.busyCircularProps, busyLinearProps = _a.busyLinearProps, paper = _a.paper, style = _a.style, props = __rest(_a, ["background", "children", "component", "busyVariant", "busySize", "busyOpacity", "busyColor", "busy", "busyCircularProps", "busyLinearProps", "paper", "style"]);
-    var theme = material.useTheme();
-    return (jsxRuntime.jsxs(material.Box, __assign({ component: paper ? material.Paper : component, position: "relative", style: background
-            ? __assign({ backgroundColor: theme.palette.background.default, color: theme.palette.text.primary }, style) : style }, props, { children: [children, busy && busyVariant === 'linear' ? (jsxRuntime.jsx(BusyLinearProgress, __assign({ color: busyColor, opacity: busyOpacity }, busyLinearProps), void 0)) : null, busy && busyVariant === 'circular' ? (jsxRuntime.jsx(BusyCircularProgress, __assign({ color: busyColor, opacity: busyOpacity, size: busySize }, busyCircularProps), void 0)) : null] }), void 0));
+const BusyBox = (_a) => {
+    var { background, children, component, busyVariant = 'circular', busySize, busyOpacity = 0.85, busyColor, busy, busyCircularProps, busyLinearProps, paper, style } = _a, props = __rest(_a, ["background", "children", "component", "busyVariant", "busySize", "busyOpacity", "busyColor", "busy", "busyCircularProps", "busyLinearProps", "paper", "style"]);
+    const theme = material.useTheme();
+    return (jsxRuntime.jsxs(material.Box, Object.assign({ component: paper ? material.Paper : component, position: "relative", style: background
+            ? Object.assign({ backgroundColor: theme.palette.background.default, color: theme.palette.text.primary }, style) : style }, props, { children: [children, busy && busyVariant === 'linear' ? (jsxRuntime.jsx(BusyLinearProgress, Object.assign({ color: busyColor, opacity: busyOpacity }, busyLinearProps), void 0)) : null, busy && busyVariant === 'circular' ? (jsxRuntime.jsx(BusyCircularProgress, Object.assign({ color: busyColor, opacity: busyOpacity, size: busySize }, busyCircularProps), void 0)) : null] }), void 0));
 };
 
-var FlexCol = function (props) {
-    return jsxRuntime.jsx(BusyBox, __assign({ alignItems: "center", display: "flex", flexDirection: "column", justifyContent: "center" }, props), void 0);
+const FlexCol = (props) => {
+    return jsxRuntime.jsx(BusyBox, Object.assign({ alignItems: "center", display: "flex", flexDirection: "column", justifyContent: "center" }, props), void 0);
 };
-var FlexGrowCol = function (props) {
-    return jsxRuntime.jsx(FlexCol, __assign({ flexGrow: 1 }, props), void 0);
+const FlexGrowCol = (props) => {
+    return jsxRuntime.jsx(FlexCol, Object.assign({ flexGrow: 1 }, props), void 0);
 };
 
-var FlexRow = function (props) {
-    return jsxRuntime.jsx(BusyBox, __assign({ alignItems: "center", display: "flex", flexDirection: "row", justifyContent: "center" }, props), void 0);
+const FlexRow = (props) => {
+    return jsxRuntime.jsx(BusyBox, Object.assign({ alignItems: "center", display: "flex", flexDirection: "row", justifyContent: "center" }, props), void 0);
 };
-var FlexGrowRow = function (props) {
-    return jsxRuntime.jsx(FlexRow, __assign({ flexGrow: 1 }, props), void 0);
+const FlexGrowRow = (props) => {
+    return jsxRuntime.jsx(FlexRow, Object.assign({ flexGrow: 1 }, props), void 0);
 };
 
 /**
  * @deprecated The functionality of Background is now part of FlexBox.  Use the 'background' property to enable the background.
  */
-var Background = function (props) {
-    return jsxRuntime.jsx(FlexRow, __assign({}, props), void 0);
+const Background = (props) => {
+    return jsxRuntime.jsx(FlexRow, Object.assign({}, props), void 0);
 };
 
-var ErrorViewer = function (props) {
-    var error = props.error, boxProps = __rest(props, ["error"]);
-    var theme = material.useTheme();
-    return (jsxRuntime.jsxs(FlexCol, __assign({ color: theme.palette.error.main }, boxProps, { children: [jsxRuntime.jsx(material.Typography, __assign({ align: "center", variant: "subtitle1" }, { children: error === null || error === void 0 ? void 0 : error.name }), void 0), jsxRuntime.jsx(material.Typography, __assign({ align: "center", variant: "body2" }, { children: error === null || error === void 0 ? void 0 : error.message }), void 0)] }), void 0));
+const ErrorViewer = (props) => {
+    const { error } = props, boxProps = __rest(props, ["error"]);
+    const theme = material.useTheme();
+    return (jsxRuntime.jsxs(FlexCol, Object.assign({ color: theme.palette.error.main }, boxProps, { children: [jsxRuntime.jsx(material.Typography, Object.assign({ align: "center", variant: "subtitle1" }, { children: error === null || error === void 0 ? void 0 : error.name }), void 0), jsxRuntime.jsx(material.Typography, Object.assign({ align: "center", variant: "body2" }, { children: error === null || error === void 0 ? void 0 : error.message }), void 0)] }), void 0));
 };
 
-var ErrorsViewer = function (props) {
-    var onRetry = props.onRetry, errors = props.errors, boxProps = __rest(props, ["onRetry", "errors"]);
-    return (jsxRuntime.jsxs(FlexGrowCol, __assign({ padding: 1 }, boxProps, { children: [errors === null || errors === void 0 ? void 0 : errors.map(function (error, index) {
+const ErrorsViewer = (props) => {
+    const { onRetry, errors } = props, boxProps = __rest(props, ["onRetry", "errors"]);
+    return (jsxRuntime.jsxs(FlexGrowCol, Object.assign({ padding: 1 }, boxProps, { children: [errors === null || errors === void 0 ? void 0 : errors.map((error, index) => {
                 return jsxRuntime.jsx(ErrorViewer, { error: error }, index);
-            }), onRetry ? (jsxRuntime.jsx(material.IconButton, __assign({ onClick: onRetry }, { children: jsxRuntime.jsx(ai.AiOutlineReload, {}, void 0) }), void 0)) : null] }), void 0));
+            }), onRetry ? (jsxRuntime.jsx(material.IconButton, Object.assign({ onClick: onRetry }, { children: jsxRuntime.jsx(ai.AiOutlineReload, {}, void 0) }), void 0)) : null] }), void 0));
 };
 
-var CoverProgress = function (props) {
+const CoverProgress = (props) => {
     var _a;
-    var _b = props.paper, paper = _b === void 0 ? true : _b, open = props.open, _c = props.opacity, opacity = _c === void 0 ? 0.25 : _c, errors = props.errors, onRetry = props.onRetry;
-    var theme = material.useTheme();
+    const { paper = true, open, opacity = 0.25, errors, onRetry } = props;
+    const theme = material.useTheme();
     if (open) {
-        return (jsxRuntime.jsx(FlexGrowRow, __assign({ position: "absolute", margin: -1, top: 0, bottom: 0, right: 0, left: 0, bgcolor: paper ? theme.palette.background.paper : theme.palette.background.default }, { children: ((_a = errors === null || errors === void 0 ? void 0 : errors.length) !== null && _a !== void 0 ? _a : 0) === 0 ? (jsxRuntime.jsx(material.CircularProgress, { style: { opacity: opacity } }, void 0)) : (jsxRuntime.jsx(ErrorsViewer, { margin: 1, errors: errors, onRetry: onRetry }, void 0)) }), void 0));
+        return (jsxRuntime.jsx(FlexGrowRow, Object.assign({ position: "absolute", margin: -1, top: 0, bottom: 0, right: 0, left: 0, bgcolor: paper ? theme.palette.background.paper : theme.palette.background.default }, { children: ((_a = errors === null || errors === void 0 ? void 0 : errors.length) !== null && _a !== void 0 ? _a : 0) === 0 ? (jsxRuntime.jsx(material.CircularProgress, { style: { opacity } }, void 0)) : (jsxRuntime.jsx(ErrorsViewer, { margin: 1, errors: errors, onRetry: onRetry }, void 0)) }), void 0));
     }
     return null;
 };
 
-var HoverScale = function (props) {
-    var children = props.children, _a = props.scale, scale = _a === void 0 ? 1.1 : _a;
-    var useStyles = styles.makeStyles(function () {
-        return styles.createStyles({
-            zoomdiv: {
-                '&:hover': {
-                    transform: "scale(".concat(scale, ")"),
-                    transitionDuration: '0.2s',
-                    transitionTimingFunction: 'ease',
-                },
+const HoverScale = (props) => {
+    const { children, scale = 1.1 } = props;
+    const useStyles = styles.makeStyles(() => styles.createStyles({
+        zoomdiv: {
+            '&:hover': {
+                transform: `scale(${scale})`,
+                transitionDuration: '0.2s',
+                transitionTimingFunction: 'ease',
             },
-        });
-    });
-    var classes = useStyles();
-    return (jsxRuntime.jsx(FlexRow, { children: jsxRuntime.jsx(material.Box, __assign({ className: classes.zoomdiv }, { children: children }), void 0) }, void 0));
+        },
+    }));
+    const classes = useStyles();
+    return (jsxRuntime.jsx(FlexRow, { children: jsxRuntime.jsx(material.Box, Object.assign({ className: classes.zoomdiv }, { children: children }), void 0) }, void 0));
 };
 
-var range = function (n, in_min, in_max, out_min, out_max) {
+const range = (n, in_min, in_max, out_min, out_max) => {
     return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min;
 };
-var updateCanvas = function (canvas, props) {
-    var _a = props.value, value = _a === void 0 ? '' : _a, _b = props.size, size = _b === void 0 ? 400 : _b, _c = props.bg, bg = _c === void 0 ? 'transparent' : _c, _d = props.count, count = _d === void 0 ? 5 : _d, palette = props.palette, _e = props.iconPadding, iconPadding = _e === void 0 ? 0 : _e;
-    var fg = props.fg;
-    var hash = md5__default["default"](value);
-    var block = Math.floor(size / count);
-    var hashcolor = hash.slice(0, 6);
-    var current = canvas.current;
+const updateCanvas = (canvas, props) => {
+    const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props;
+    let { fg } = props;
+    const hash = md5__default["default"](value);
+    const block = Math.floor(size / count);
+    const hashcolor = hash.slice(0, 6);
+    const current = canvas.current;
     if (!current) {
         return;
     }
     if (palette && palette.length) {
-        var index = Math.floor(range(parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length));
+        const index = Math.floor(range(parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length));
         fg = palette[index];
     }
     current.width = block * count + iconPadding;
     current.height = block * count + iconPadding;
-    var arr = hash.split('').map(function (el) {
-        var parsedEl = parseInt(el, 16);
+    const arr = hash.split('').map((el) => {
+        const parsedEl = parseInt(el, 16);
         if (parsedEl < 8) {
             return 0;
         }
@@ -264,16 +169,16 @@ var updateCanvas = function (canvas, props) {
             return 1;
         }
     });
-    var map = [];
+    const map = [];
     map[0] = map[4] = arr.slice(0, 5);
     map[1] = map[3] = arr.slice(5, 10);
     map[2] = arr.slice(10, 15);
-    var ctx = current.getContext('2d');
+    const ctx = current.getContext('2d');
     if (ctx) {
         ctx.imageSmoothingEnabled = false;
         ctx.clearRect(0, 0, current.width, current.height);
-        map.forEach(function (row, i) {
-            row.forEach(function (el, j) {
+        map.forEach((row, i) => {
+            row.forEach((el, j) => {
                 if (el) {
                     ctx.fillStyle = fg ? fg : '#' + hashcolor;
                     ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding);
@@ -286,101 +191,99 @@ var updateCanvas = function (canvas, props) {
         });
     }
 };
-var Identicon = function (_a) {
-    var _b = _a.size, size = _b === void 0 ? 400 : _b, _c = _a.className, className = _c === void 0 ? 'identicon' : _c, bg = _a.bg, count = _a.count, fg = _a.fg, iconPadding = _a.iconPadding, palette = _a.palette, value = _a.value, props = __rest(_a, ["size", "className", "bg", "count", "fg", "iconPadding", "palette", "value"]);
-    var canvas = react.useRef(null);
-    react.useEffect(function () {
-        updateCanvas(canvas, { bg: bg, className: className, count: count, fg: fg, iconPadding: iconPadding, palette: palette, size: size, value: value });
+const Identicon = (_a) => {
+    var { size = 400, className = 'identicon', bg, count, fg, iconPadding, palette, value } = _a, props = __rest(_a, ["size", "className", "bg", "count", "fg", "iconPadding", "palette", "value"]);
+    const canvas = react.useRef(null);
+    react.useEffect(() => {
+        updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value });
     });
-    return (jsxRuntime.jsx(FlexRow, __assign({}, props, { children: jsxRuntime.jsx("canvas", { className: className, ref: canvas, style: { height: size, width: size } }, void 0) }), void 0));
+    return (jsxRuntime.jsx(FlexRow, Object.assign({}, props, { children: jsxRuntime.jsx("canvas", { className: className, ref: canvas, style: { height: size, width: size } }, void 0) }), void 0));
 };
 
-var RedirectWithQuery = function (_a) {
-    var to = _a.to, toOptions = _a.toOptions;
-    var newPath = "".concat(to).concat(document.location.search);
-    var navigate = reactRouterDom.useNavigate();
-    var pathname = reactRouterDom.useLocation().pathname;
-    react.useEffect(function () {
+const RedirectWithQuery = ({ to, toOptions }) => {
+    const newPath = `${to}${document.location.search}`;
+    const navigate = reactRouterDom.useNavigate();
+    const { pathname } = reactRouterDom.useLocation();
+    react.useEffect(() => {
         if (newPath !== pathname) {
-            navigate(newPath, __assign({ replace: true }, toOptions));
+            navigate(newPath, Object.assign({ replace: true }, toOptions));
         }
     });
     return jsxRuntime.jsx("div", {}, void 0);
 };
 
-var ScrollToTopButton = function (_a) {
-    var children = _a.children, anchorId = _a.anchorId, props = __rest(_a, ["children", "anchorId"]);
-    var trigger = material.useScrollTrigger({
+const ScrollToTopButton = (_a) => {
+    var { children, anchorId } = _a, props = __rest(_a, ["children", "anchorId"]);
+    const trigger = material.useScrollTrigger({
         disableHysteresis: true,
         threshold: 100,
     });
-    var handleClick = function (event) {
-        var anchor = (event.target.ownerDocument || document).querySelector("#".concat(anchorId));
+    const handleClick = (event) => {
+        const anchor = (event.target.ownerDocument || document).querySelector(`#${anchorId}`);
         if (anchor) {
             anchor.scrollIntoView({ behavior: 'smooth', block: 'center' });
         }
     };
-    var theme = material.useTheme();
-    return (jsxRuntime.jsx(material.Zoom, __assign({ in: trigger }, props, { children: jsxRuntime.jsx(material.Box, __assign({ zIndex: 10, position: "fixed", right: theme.spacing(2), bottom: theme.spacing(2), onClick: handleClick, role: "presentation" }, { children: children }), void 0) }), void 0));
+    const theme = material.useTheme();
+    return (jsxRuntime.jsx(material.Zoom, Object.assign({ in: trigger }, props, { children: jsxRuntime.jsx(material.Box, Object.assign({ zIndex: 10, position: "fixed", right: theme.spacing(2), bottom: theme.spacing(2), onClick: handleClick, role: "presentation" }, { children: children }), void 0) }), void 0));
 };
 
-var AppBarEx = function (props) {
-    var contextToolbar = props.contextToolbar, systemToolbar = props.systemToolbar, container = props.container, style = props.style, appbarProps = __rest(props, ["contextToolbar", "systemToolbar", "container", "style"]);
-    var theme = material.useTheme();
-    var AppBarExInner = function () {
-        return (jsxRuntime.jsxs(FlexGrowRow, __assign({ justifyContent: "space-between" }, { children: [contextToolbar !== null && contextToolbar !== void 0 ? contextToolbar : jsxRuntime.jsx(material.Toolbar, {}, void 0), systemToolbar !== null && systemToolbar !== void 0 ? systemToolbar : jsxRuntime.jsx(material.Toolbar, {}, void 0)] }), void 0));
+const AppBarEx = (props) => {
+    const { contextToolbar, systemToolbar, container, style } = props, appbarProps = __rest(props, ["contextToolbar", "systemToolbar", "container", "style"]);
+    const theme = material.useTheme();
+    const AppBarExInner = () => {
+        return (jsxRuntime.jsxs(FlexGrowRow, Object.assign({ justifyContent: "space-between" }, { children: [contextToolbar !== null && contextToolbar !== void 0 ? contextToolbar : jsxRuntime.jsx(material.Toolbar, {}, void 0), systemToolbar !== null && systemToolbar !== void 0 ? systemToolbar : jsxRuntime.jsx(material.Toolbar, {}, void 0)] }), void 0));
     };
-    return (jsxRuntime.jsx(material.AppBar, __assign({ position: "static", style: __assign({ backgroundColor: theme.palette.background.paper, color: theme.palette.text.primary, display: 'flex' }, style) }, appbarProps, { children: container ? (jsxRuntime.jsx(material.Container, __assign({ maxWidth: container }, { children: jsxRuntime.jsx(AppBarExInner, {}, void 0) }), void 0)) : (jsxRuntime.jsx(AppBarExInner, {}, void 0)) }), void 0));
+    return (jsxRuntime.jsx(material.AppBar, Object.assign({ position: "static", style: Object.assign({ backgroundColor: theme.palette.background.paper, color: theme.palette.text.primary, display: 'flex' }, style) }, appbarProps, { children: container ? (jsxRuntime.jsx(material.Container, Object.assign({ maxWidth: container }, { children: jsxRuntime.jsx(AppBarExInner, {}, void 0) }), void 0)) : (jsxRuntime.jsx(AppBarExInner, {}, void 0)) }), void 0));
 };
 
-var CookieConsentContext = react.createContext({});
+const CookieConsentContext = react.createContext({});
 
-var CookiesAcceptedLocalStorageName = 'CookiesAccepted';
-var CookieConsentLoader = function (_a) {
-    var children = _a.children;
-    var getAcceptedFromLocalStorage = function () {
+const CookiesAcceptedLocalStorageName = 'CookiesAccepted';
+const CookieConsentLoader = ({ children }) => {
+    const getAcceptedFromLocalStorage = () => {
         return localStorage.getItem(CookiesAcceptedLocalStorageName) === 'true';
     };
-    var setAcceptedToLocalStorage = function (accepted) {
+    const setAcceptedToLocalStorage = (accepted) => {
         localStorage.setItem(CookiesAcceptedLocalStorageName, accepted ? 'true' : 'false');
     };
-    var _b = __read(react.useState(getAcceptedFromLocalStorage()), 2), accepted = _b[0], setAccepted = _b[1];
-    var setAcceptedHandler = function (accepted) {
+    const [accepted, setAccepted] = react.useState(getAcceptedFromLocalStorage());
+    const setAcceptedHandler = (accepted) => {
         setAcceptedToLocalStorage(accepted);
         setAccepted(accepted);
     };
-    var clearAccepted = function () {
+    const clearAccepted = () => {
         localStorage.removeItem(CookiesAcceptedLocalStorageName);
         setAccepted(getAcceptedFromLocalStorage());
     };
-    return (jsxRuntime.jsx(CookieConsentContext.Provider, __assign({ value: { accepted: accepted, clearAccepted: clearAccepted, setAccepted: setAcceptedHandler, storageName: CookiesAcceptedLocalStorageName } }, { children: children }), void 0));
+    return (jsxRuntime.jsx(CookieConsentContext.Provider, Object.assign({ value: { accepted, clearAccepted, setAccepted: setAcceptedHandler, storageName: CookiesAcceptedLocalStorageName } }, { children: children }), void 0));
 };
 
-var useCookieConsent = function () {
+const useCookieConsent = () => {
     return react.useContext(CookieConsentContext);
 };
 
-var EthersContext = react.createContext({});
+const EthersContext = react.createContext({});
 
-var infuraKey = '1d9f8053c65a49cfb99fafaa8ef201c0';
-var InfuraEthersLoader = function (props) {
-    var children = props.children;
-    var chainId = 1;
-    var provider = new providers.InfuraProvider(1, infuraKey);
-    return (jsxRuntime.jsx(EthersContext.Provider, __assign({ value: {
+const infuraKey = '1d9f8053c65a49cfb99fafaa8ef201c0';
+const InfuraEthersLoader = (props) => {
+    const { children } = props;
+    const chainId = 1;
+    const provider = new providers.InfuraProvider(1, infuraKey);
+    return (jsxRuntime.jsx(EthersContext.Provider, Object.assign({ value: {
             busy: false,
-            chainId: chainId,
+            chainId,
             isConnected: true,
-            provider: provider,
+            provider,
             signer: null,
         } }, { children: children }), void 0));
 };
 
-var getApiStage = function () {
+const getApiStage = () => {
     return sdkJs.getApiStage(document.location.hostname);
 };
 
-var isLocalhost = !!(window.location.hostname === 'localhost' ||
+const isLocalhost = !!(window.location.hostname === 'localhost' ||
     // [::1] is the IPv6 localhost address.
     window.location.hostname === '[::1]' ||
     // 127.0.0.0/8 are considered localhost for IPv4.
@@ -389,18 +292,18 @@ var isLocalhost = !!(window.location.hostname === 'localhost' ||
 /* eslint-disable react-hooks/exhaustive-deps */
 function useAsyncEffect(effect, inputs) {
     react.useEffect(function () {
-        var mounted = true;
-        var promise = effect(function () {
+        let mounted = true;
+        const promise = effect(() => {
             return mounted;
         });
         Promise.resolve(promise)
-            .then(function (callback) {
+            .then((callback) => {
             if (callback) {
                 callback === null || callback === void 0 ? void 0 : callback();
             }
         })
-            .catch(function (reason) {
-            console.log("useAsyncEffect Excepted: ".concat(reason));
+            .catch((reason) => {
+            console.log(`useAsyncEffect Excepted: ${reason}`);
         });
         return function () {
             mounted = false;
@@ -408,33 +311,24 @@ function useAsyncEffect(effect, inputs) {
     }, inputs !== null && inputs !== void 0 ? inputs : []);
 }
 
-var logProfiling = false;
-var enableProfileLogging = function (enabled) {
+let logProfiling = false;
+const enableProfileLogging = (enabled) => {
     logProfiling = enabled;
 };
-var profileResults = [];
-var profileBlock = function (name, closure) { return __awaiter(void 0, void 0, void 0, function () {
-    var startTime, endTime;
-    return __generator(this, function (_a) {
-        switch (_a.label) {
-            case 0:
-                startTime = Date.now();
-                return [4 /*yield*/, closure()];
-            case 1:
-                _a.sent();
-                endTime = Date.now();
-                profileResults.push({ endTime: endTime, name: name, startTime: startTime });
-                if (logProfiling) {
-                    console.log("Timed ".concat(name, " [").concat(endTime - startTime, "ms]"));
-                }
-                return [2 /*return*/];
-        }
-    });
-}); };
+const profileResults = [];
+const profileBlock = (name, closure) => __awaiter(void 0, void 0, void 0, function* () {
+    const startTime = Date.now();
+    yield closure();
+    const endTime = Date.now();
+    profileResults.push({ endTime, name, startTime });
+    if (logProfiling) {
+        console.log(`Timed ${name} [${endTime - startTime}ms]`);
+    }
+});
 
-var getLocalStorageObject = function (key, log) {
+const getLocalStorageObject = (key, log) => {
     var _a;
-    var result = {};
+    let result = {};
     try {
         result = JSON.parse((_a = localStorage.getItem(key)) !== null && _a !== void 0 ? _a : '{}');
     }
@@ -443,7 +337,7 @@ var getLocalStorageObject = function (key, log) {
     }
     return result;
 };
-var setLocalStorageObject = function (key, value, log) {
+const setLocalStorageObject = (key, value, log) => {
     try {
         localStorage.setItem(key, JSON.stringify(value));
     }
@@ -452,9 +346,9 @@ var setLocalStorageObject = function (key, value, log) {
     }
 };
 
-var getSessionStorageObject = function (key, log) {
+const getSessionStorageObject = (key, log) => {
     var _a;
-    var result = {};
+    let result = {};
     try {
         result = JSON.parse((_a = sessionStorage.getItem(key)) !== null && _a !== void 0 ? _a : '{}');
     }
@@ -463,7 +357,7 @@ var getSessionStorageObject = function (key, log) {
     }
     return result;
 };
-var setSessionStorageObject = function (key, value, log) {
+const setSessionStorageObject = (key, value, log) => {
     try {
         sessionStorage.setItem(key, JSON.stringify(value));
     }
@@ -472,161 +366,110 @@ var setSessionStorageObject = function (key, value, log) {
     }
 };
 
-var Referrer = /** @class */ (function () {
-    function Referrer() {
+class Referrer {
+    constructor() {
         var _a, _b;
         this.session = (_a = this.getFromSession()) !== null && _a !== void 0 ? _a : document.referrer;
         sessionStorage.setItem(Referrer.storageId, this.session);
         this.local = (_b = this.getFromLocal()) !== null && _b !== void 0 ? _b : document.referrer;
         localStorage.setItem(Referrer.storageId, this.local);
     }
-    Referrer.prototype.getFromLocal = function () {
-        var value = localStorage.getItem(Referrer.storageId);
+    getFromLocal() {
+        const value = localStorage.getItem(Referrer.storageId);
         if (value && value.length > 0) {
             return value;
         }
-    };
-    Referrer.prototype.getFromSession = function () {
-        var value = sessionStorage.getItem(Referrer.storageId);
+    }
+    getFromSession() {
+        const value = sessionStorage.getItem(Referrer.storageId);
         if (value && value.length > 0) {
             return value;
         }
-    };
-    Referrer.prototype.toJson = function () {
+    }
+    toJson() {
         if ((this.local && this.local.length > 0) || (this.session && this.session.length > 0)) {
             return {
                 local: this.local,
                 session: this.session,
             };
         }
-    };
-    Referrer.storageId = '_coin_referrer';
-    return Referrer;
-}());
-
-var XyoUserEventHandler = /** @class */ (function (_super) {
-    __extends(XyoUserEventHandler, _super);
-    function XyoUserEventHandler(handlers) {
-        if (handlers === void 0) { handlers = []; }
-        var _this = _super.call(this) || this;
-        _this.handlers = handlers;
-        return _this;
-    }
-    XyoUserEventHandler.prototype.testStarted = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, Promise.allSettled(this.handlers.map(function (handler) { return handler.testStarted(data); }))];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
+    }
+}
+Referrer.storageId = '_coin_referrer';
+
+class XyoUserEventHandler extends pixel.UserEventHandler {
+    constructor(handlers = []) {
+        super();
+        this.handlers = handlers;
+    }
+    testStarted(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield Promise.allSettled(this.handlers.map((handler) => handler.testStarted(data)));
         });
-    };
-    XyoUserEventHandler.prototype.funnelStarted = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, Promise.allSettled(this.handlers.map(function (handler) { return handler.funnelStarted(data); }))];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
+    }
+    funnelStarted(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield Promise.allSettled(this.handlers.map((handler) => handler.funnelStarted(data)));
         });
-    };
-    XyoUserEventHandler.prototype.viewContent = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, Promise.allSettled(this.handlers.map(function (handler) { return handler.viewContent(data); }))];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
+    }
+    viewContent(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield Promise.allSettled(this.handlers.map((handler) => handler.viewContent(data)));
         });
-    };
-    XyoUserEventHandler.prototype.userClick = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, Promise.allSettled(this.handlers.map(function (handler) { return handler.userClick(data); }))];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
+    }
+    userClick(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield Promise.allSettled(this.handlers.map((handler) => handler.userClick(data)));
         });
-    };
-    return XyoUserEventHandler;
-}(pixel.UserEventHandler));
+    }
+}
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-var global = window;
+const global = window;
 
-var DripBaseEvent = /** @class */ (function () {
-    function DripBaseEvent(name, param) {
+class DripBaseEvent {
+    constructor(name, param) {
         this.name = name;
         this.param = param;
         this.dcq = this.getDcq();
         this.dcs = this.getDcs();
     }
-    DripBaseEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var payload;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        payload = [this.name];
-                        if (this.param) {
-                            payload.push(this.param);
-                        }
-                        payload.push(data);
-                        this.dcq.push(payload);
-                        return [4 /*yield*/, sdkJs.delay(0)];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const payload = [this.name];
+            if (this.param) {
+                payload.push(this.param);
+            }
+            payload.push(data);
+            this.dcq.push(payload);
+            yield sdkJs.delay(0);
         });
-    };
-    DripBaseEvent.prototype.getDcq = function () {
+    }
+    getDcq() {
         if (!global._dcq) {
             throw Error('DCQ not found');
         }
         return global._dcq;
-    };
-    DripBaseEvent.prototype.getDcs = function () {
+    }
+    getDcs() {
         if (!global._dcs) {
             throw Error('DCS not found');
         }
         return global._dcs;
-    };
-    return DripBaseEvent;
-}());
-
-var DripCustomEvent = /** @class */ (function (_super) {
-    __extends(DripCustomEvent, _super);
-    function DripCustomEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
     }
-    return DripCustomEvent;
-}(DripBaseEvent));
+}
 
-var DripStandardEvents = /** @class */ (function () {
-    function DripStandardEvents() {
-    }
-    DripStandardEvents.prototype.identify = function () {
+class DripCustomEvent extends DripBaseEvent {
+}
+
+class DripStandardEvents {
+    identify() {
         return new DripBaseEvent('identify');
-    };
-    return DripStandardEvents;
-}());
+    }
+}
 
-var Fbq = /** @class */ (function () {
-    function Fbq(pixelId) {
+class Fbq {
+    constructor(pixelId) {
         this.pixelId = pixelId;
         this.fbq = function () {
             // eslint-disable-next-line prefer-rest-params,prefer-spread
@@ -642,147 +485,109 @@ var Fbq = /** @class */ (function () {
         this.fbq('init', pixelId);
         this.fbq('track', 'PageView');
     }
-    Fbq.init = function (pixelId) {
+    static init(pixelId) {
         if (!this.instance) {
             this.instance = new Fbq(pixelId);
         }
         return this.instance;
-    };
-    Fbq.prototype.track = function (event, data) {
-        this.fbq('track', event, __assign({}, data));
-    };
-    Fbq.prototype.trackCustom = function (event, data) {
-        this.fbq('trackCustom', event, __assign({}, data));
-    };
-    return Fbq;
-}());
+    }
+    track(event, data) {
+        this.fbq('track', event, Object.assign({}, data));
+    }
+    trackCustom(event, data) {
+        this.fbq('trackCustom', event, Object.assign({}, data));
+    }
+}
 
-var FacebookBaseEvent = /** @class */ (function () {
-    function FacebookBaseEvent(name) {
+class FacebookBaseEvent {
+    constructor(name) {
         this.name = name;
         this.fbq = sdkJs.assertEx(Fbq.instance, 'Missing Fbq');
     }
-    FacebookBaseEvent.prototype.send = function (_data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    return FacebookBaseEvent;
-}());
-
-var FacebookCustomEvent = /** @class */ (function (_super) {
-    __extends(FacebookCustomEvent, _super);
-    function FacebookCustomEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    FacebookCustomEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        this.fbq.trackCustom(this.name, data);
-                        return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
+    send(_data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield sdkJs.delay(0); //force async to increase reporting odds
         });
-    };
-    return FacebookCustomEvent;
-}(FacebookBaseEvent));
-
-var FacebookStandardEvent = /** @class */ (function (_super) {
-    __extends(FacebookStandardEvent, _super);
-    function FacebookStandardEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    FacebookStandardEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        this.fbq.track(this.name, data);
-                        return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
+    }
+}
+
+class FacebookCustomEvent extends FacebookBaseEvent {
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.fbq.trackCustom(this.name, data);
+            yield sdkJs.delay(0); //force async to increase reporting odds
         });
-    };
-    return FacebookStandardEvent;
-}(FacebookBaseEvent));
+    }
+}
 
-var FacebookStandardEvents = /** @class */ (function () {
-    function FacebookStandardEvents() {
+class FacebookStandardEvent extends FacebookBaseEvent {
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.fbq.track(this.name, data);
+            yield sdkJs.delay(0); //force async to increase reporting odds
+        });
     }
-    FacebookStandardEvents.prototype.addPaymentInfo = function () {
+}
+
+class FacebookStandardEvents {
+    addPaymentInfo() {
         return new FacebookStandardEvent('AddPaymentInfo');
-    };
-    FacebookStandardEvents.prototype.addToCart = function () {
+    }
+    addToCart() {
         return new FacebookStandardEvent('AddToCart');
-    };
-    FacebookStandardEvents.prototype.addToWishList = function () {
+    }
+    addToWishList() {
         return new FacebookStandardEvent('AddToWishList');
-    };
-    FacebookStandardEvents.prototype.completedRegistration = function () {
+    }
+    completedRegistration() {
         return new FacebookStandardEvent('CompleteRegistration');
-    };
-    FacebookStandardEvents.prototype.contact = function () {
+    }
+    contact() {
         return new FacebookStandardEvent('Contact');
-    };
-    FacebookStandardEvents.prototype.customizeProduct = function () {
+    }
+    customizeProduct() {
         return new FacebookStandardEvent('CustomizeProduct');
-    };
-    FacebookStandardEvents.prototype.donate = function () {
+    }
+    donate() {
         return new FacebookStandardEvent('Donate');
-    };
-    FacebookStandardEvents.prototype.findLocation = function () {
+    }
+    findLocation() {
         return new FacebookStandardEvent('FindLocation');
-    };
-    FacebookStandardEvents.prototype.initiateCheckout = function () {
+    }
+    initiateCheckout() {
         return new FacebookStandardEvent('InitiateCheckout');
-    };
-    FacebookStandardEvents.prototype.lead = function () {
+    }
+    lead() {
         return new FacebookStandardEvent('Lead');
-    };
-    FacebookStandardEvents.prototype.pageView = function () {
+    }
+    pageView() {
         return new FacebookStandardEvent('PageView');
-    };
-    FacebookStandardEvents.prototype.purchase = function () {
+    }
+    purchase() {
         return new FacebookStandardEvent('Purchase');
-    };
-    FacebookStandardEvents.prototype.schedule = function () {
+    }
+    schedule() {
         return new FacebookStandardEvent('Schedule');
-    };
-    FacebookStandardEvents.prototype.search = function () {
+    }
+    search() {
         return new FacebookStandardEvent('Search');
-    };
-    FacebookStandardEvents.prototype.startTrial = function () {
+    }
+    startTrial() {
         return new FacebookStandardEvent('StartTrial');
-    };
-    FacebookStandardEvents.prototype.submitApplication = function () {
+    }
+    submitApplication() {
         return new FacebookStandardEvent('SubmitApplication');
-    };
-    FacebookStandardEvents.prototype.subscribe = function () {
+    }
+    subscribe() {
         return new FacebookStandardEvent('Subscribe');
-    };
-    FacebookStandardEvents.prototype.viewContent = function () {
+    }
+    viewContent() {
         return new FacebookStandardEvent('ViewContent');
-    };
-    return FacebookStandardEvents;
-}());
+    }
+}
 
-var Gtag = /** @class */ (function () {
-    function Gtag(ga4id, awid, domains) {
+class Gtag {
+    constructor(ga4id, awid, domains) {
         var _a, _b, _c, _d;
         this.ga4id = ga4id;
         this.awid = awid;
@@ -797,328 +602,255 @@ var Gtag = /** @class */ (function () {
         this.gtag('js', new Date());
         this.gtag('config', ga4id);
         //this.gtag('config', awid) - this is configured in the Data Stream in Google Analytics
-        var parsedQueryString = queryString.parse(document.location.search);
+        const parsedQueryString = queryString.parse(document.location.search);
         //we handle the utm_referrer here incase a referrer was forwarded (special.coinapp.co does this)
         sessionStorage.setItem('initialReferrer', decodeURIComponent((_d = (_c = parsedQueryString['utm_referrer']) === null || _c === void 0 ? void 0 : _c.toString()) !== null && _d !== void 0 ? _d : document.referrer));
         delete parsedQueryString['utm_referrer'];
-        var remainingSearch = parsedQueryString ? queryString.stringify(parsedQueryString) : '';
+        const remainingSearch = parsedQueryString ? queryString.stringify(parsedQueryString) : '';
         sessionStorage.setItem('initialQuery', remainingSearch);
         sessionStorage.setItem('initialPage', document.location.href);
     }
-    Gtag.prototype.updatePagePath = function (page_path) {
-        var ga4id = sdkJs.assertEx(this.ga4id, 'Missing GA4ID');
-        var pathOnly = page_path.split('?')[0];
-        var search = Gtag.getInitialQuery();
-        this.gtag('config', ga4id, { page_path: "".concat(pathOnly).concat(search) });
-    };
+    updatePagePath(page_path) {
+        const ga4id = sdkJs.assertEx(this.ga4id, 'Missing GA4ID');
+        const pathOnly = page_path.split('?')[0];
+        const search = Gtag.getInitialQuery();
+        this.gtag('config', ga4id, { page_path: `${pathOnly}${search}` });
+    }
     //
-    Gtag.getInitialQuery = function () {
+    static getInitialQuery() {
         return sessionStorage.getItem('initialQuery') || '';
-    };
-    Gtag.getInitialPage = function () {
+    }
+    static getInitialPage() {
         return sessionStorage.getItem('initialPage') || '';
-    };
-    Gtag.getInitialReferrer = function () {
+    }
+    static getInitialReferrer() {
         return sessionStorage.getItem('initialReferrer') || '';
-    };
-    Gtag.clearDataLayer = function () {
-        var dataLayer = global.dataLayer;
+    }
+    static clearDataLayer() {
+        const dataLayer = global.dataLayer;
         dataLayer.length = 0;
-    };
-    Gtag.init = function (ga4id, awid, domains) {
+    }
+    static init(ga4id, awid, domains) {
         if (!this.instance) {
             return this.reinit(ga4id, awid, domains);
         }
         return this.instance;
-    };
-    Gtag.reinit = function (ga4id, awid, domains) {
+    }
+    static reinit(ga4id, awid, domains) {
         this.instance = new Gtag(ga4id, awid, domains);
         return this.instance;
-    };
-    Gtag.updatePagePath = function (page_path) {
-        var instance = sdkJs.assertEx(this.instance, 'Not initialized');
+    }
+    static updatePagePath(page_path) {
+        const instance = sdkJs.assertEx(this.instance, 'Not initialized');
         return instance.updatePagePath(page_path);
-    };
-    Gtag.prototype.sendAnalytics = function (event, data) {
-        var _this = this;
-        return new Promise(function (resolve) {
-            _this.gtag('event', event, __assign(__assign({}, data), { event_callback: function () {
+    }
+    sendAnalytics(event, data) {
+        return new Promise((resolve) => {
+            this.gtag('event', event, Object.assign(Object.assign({}, data), { event_callback: () => {
                     resolve();
-                }, event_timeout: 2000, page_location: Gtag.getInitialPage(), page_referrer: Gtag.getInitialReferrer(), send_to: _this.ga4id }));
+                }, event_timeout: 2000, page_location: Gtag.getInitialPage(), page_referrer: Gtag.getInitialReferrer(), send_to: this.ga4id }));
         });
-    };
-    Gtag.prototype.sendAdwords = function (event, data) {
-        var _this = this;
-        return new Promise(function (resolve) {
-            _this.gtag('event', 'conversion', __assign(__assign({}, data), { event_callback: function () {
+    }
+    sendAdwords(event, data) {
+        return new Promise((resolve) => {
+            this.gtag('event', 'conversion', Object.assign(Object.assign({}, data), { event_callback: () => {
                     resolve();
-                }, event_timeout: 2000, send_to: "".concat(_this.awid, "/").concat(event) }));
+                }, event_timeout: 2000, send_to: `${this.awid}/${event}` }));
         });
-    };
-    return Gtag;
-}());
+    }
+}
 
-var Gtm = /** @class */ (function () {
-    function Gtm(containerId) {
+class Gtm {
+    constructor(containerId) {
         this.containerId = containerId;
-        var global = window;
+        const global = window;
         global.dataLayer = global.dataLayer || [];
         global.dataLayer.push({ event: 'gtm.js', 'gtm.start': new Date().getTime() });
     }
-    Gtm.getInitialQuery = function () {
+    static getInitialQuery() {
         return sessionStorage.getItem('initialQuery') || '';
-    };
-    Gtm.clearDataLayer = function () {
-        var global = window;
-        var dataLayer = global.dataLayer;
+    }
+    static clearDataLayer() {
+        const global = window;
+        const dataLayer = global.dataLayer;
         dataLayer.length = 0;
-    };
-    Gtm.init = function (containerId) {
+    }
+    static init(containerId) {
         if (!this.instance) {
             this.instance = new Gtm(containerId);
         }
         return this.instance;
-    };
-    Gtm.prototype.send = function (event, data, eventTimeout) {
-        if (eventTimeout === void 0) { eventTimeout = 500; }
-        return new Promise(function (resolve) {
+    }
+    send(event, data, eventTimeout = 500) {
+        return new Promise((resolve) => {
             var _a;
-            var global = window;
-            (_a = global.dataLayer) === null || _a === void 0 ? void 0 : _a.push(__assign(__assign({ event: event }, data), { eventCallback: function () {
+            const global = window;
+            (_a = global.dataLayer) === null || _a === void 0 ? void 0 : _a.push(Object.assign(Object.assign({ event }, data), { eventCallback: () => {
                     resolve();
-                }, eventTimeout: eventTimeout }));
+                }, eventTimeout }));
         });
-    };
-    return Gtm;
-}());
+    }
+}
 
-var GoogleBaseEvent = /** @class */ (function () {
-    function GoogleBaseEvent(name, adwordConversionId) {
+class GoogleBaseEvent {
+    constructor(name, adwordConversionId) {
         this.name = name;
         this.adwordConversionId = adwordConversionId;
     }
-    GoogleBaseEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, this.sendGtag(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            return yield this.sendGtag(data);
         });
-    };
-    GoogleBaseEvent.prototype.sendGtag = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, this.gtag().sendAnalytics(this.name, data)];
-                    case 1:
-                        _a.sent();
-                        if (!this.adwordConversionId) return [3 /*break*/, 3];
-                        return [4 /*yield*/, this.gtag().sendAdwords(this.adwordConversionId, data)];
-                    case 2:
-                        _a.sent();
-                        _a.label = 3;
-                    case 3: return [2 /*return*/];
-                }
-            });
+    }
+    sendGtag(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield this.gtag().sendAnalytics(this.name, data);
+            if (this.adwordConversionId) {
+                yield this.gtag().sendAdwords(this.adwordConversionId, data);
+            }
         });
-    };
-    GoogleBaseEvent.prototype.sendGtm = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, this.gtm().send(this.name, data)];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
+    }
+    sendGtm(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield this.gtm().send(this.name, data);
         });
-    };
-    GoogleBaseEvent.prototype.gtag = function () {
+    }
+    gtag() {
         return sdkJs.assertEx(Gtag.instance, 'Missing/uninitialized gtag');
-    };
-    GoogleBaseEvent.prototype.gtm = function () {
+    }
+    gtm() {
         return sdkJs.assertEx(Gtm.instance, 'Missing/uninitialized gtm');
-    };
-    return GoogleBaseEvent;
-}());
-
-var GoogleCustomEvent = /** @class */ (function (_super) {
-    __extends(GoogleCustomEvent, _super);
-    function GoogleCustomEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    return GoogleCustomEvent;
-}(GoogleBaseEvent));
-
-var GoogleUserEventHandler = /** @class */ (function () {
-    function GoogleUserEventHandler() {
-    }
-    GoogleUserEventHandler.prototype.testStarted = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var event;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        event = new GoogleCustomEvent('TestStarted');
-                        return [4 /*yield*/, event.send(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    }
+}
+
+class GoogleCustomEvent extends GoogleBaseEvent {
+}
+
+class GoogleUserEventHandler {
+    testStarted(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const event = new GoogleCustomEvent('TestStarted');
+            return yield event.send(data);
         });
-    };
-    GoogleUserEventHandler.prototype.funnelStarted = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var event;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        event = new GoogleCustomEvent('FunnelStarted');
-                        return [4 /*yield*/, event.send(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    }
+    funnelStarted(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const event = new GoogleCustomEvent('FunnelStarted');
+            return yield event.send(data);
         });
-    };
-    GoogleUserEventHandler.prototype.viewContent = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var event;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        event = new GoogleCustomEvent('ViewContent');
-                        return [4 /*yield*/, event.send(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    }
+    viewContent(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const event = new GoogleCustomEvent('ViewContent');
+            return yield event.send(data);
         });
-    };
-    GoogleUserEventHandler.prototype.userClick = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var event;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        event = new GoogleCustomEvent('UserClick');
-                        return [4 /*yield*/, event.send(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    }
+    userClick(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const event = new GoogleCustomEvent('UserClick');
+            return yield event.send(data);
         });
-    };
-    return GoogleUserEventHandler;
-}());
-
-var GoogleStandardEvent = /** @class */ (function (_super) {
-    __extends(GoogleStandardEvent, _super);
-    function GoogleStandardEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
     }
-    return GoogleStandardEvent;
-}(GoogleBaseEvent));
+}
 
-var GoogleStandardEvents = /** @class */ (function () {
-    function GoogleStandardEvents() {
-    }
-    GoogleStandardEvents.prototype.addPaymentInfo = function () {
+class GoogleStandardEvent extends GoogleBaseEvent {
+}
+
+class GoogleStandardEvents {
+    addPaymentInfo() {
         return new GoogleStandardEvent('add_paymennt_info');
-    };
-    GoogleStandardEvents.prototype.addShippingInfo = function () {
+    }
+    addShippingInfo() {
         return new GoogleStandardEvent('add_shipping_info');
-    };
-    GoogleStandardEvents.prototype.addToCart = function () {
+    }
+    addToCart() {
         return new GoogleStandardEvent('add_to_cart');
-    };
-    GoogleStandardEvents.prototype.addToWishList = function () {
+    }
+    addToWishList() {
         return new GoogleStandardEvent('add_to_wishlist');
-    };
-    GoogleStandardEvents.prototype.beginCheckout = function () {
+    }
+    beginCheckout() {
         return new GoogleStandardEvent('begin_checkout');
-    };
-    GoogleStandardEvents.prototype.earnVirtualCurrency = function () {
+    }
+    earnVirtualCurrency() {
         return new GoogleStandardEvent('earn_virtual_currency');
-    };
-    GoogleStandardEvents.prototype.generateLead = function () {
+    }
+    generateLead() {
         return new GoogleStandardEvent('generate_lead');
-    };
-    GoogleStandardEvents.prototype.joinGroup = function () {
+    }
+    joinGroup() {
         return new GoogleStandardEvent('join_group');
-    };
-    GoogleStandardEvents.prototype.levelEnd = function () {
+    }
+    levelEnd() {
         return new GoogleStandardEvent('level_end');
-    };
-    GoogleStandardEvents.prototype.levelStart = function () {
+    }
+    levelStart() {
         return new GoogleStandardEvent('level_start');
-    };
-    GoogleStandardEvents.prototype.levelUp = function () {
+    }
+    levelUp() {
         return new GoogleStandardEvent('level_up');
-    };
-    GoogleStandardEvents.prototype.login = function () {
+    }
+    login() {
         return new GoogleStandardEvent('login');
-    };
-    GoogleStandardEvents.prototype.postScore = function () {
+    }
+    postScore() {
         return new GoogleStandardEvent('post_score');
-    };
-    GoogleStandardEvents.prototype.purchase = function () {
+    }
+    purchase() {
         return new GoogleStandardEvent('purchase');
-    };
-    GoogleStandardEvents.prototype.refund = function () {
+    }
+    refund() {
         return new GoogleStandardEvent('refund');
-    };
-    GoogleStandardEvents.prototype.removeFromCart = function () {
+    }
+    removeFromCart() {
         return new GoogleStandardEvent('remove_from_cart');
-    };
-    GoogleStandardEvents.prototype.search = function () {
+    }
+    search() {
         return new GoogleStandardEvent('search');
-    };
-    GoogleStandardEvents.prototype.selectContent = function () {
+    }
+    selectContent() {
         return new GoogleStandardEvent('select_content');
-    };
-    GoogleStandardEvents.prototype.selectItem = function () {
+    }
+    selectItem() {
         return new GoogleStandardEvent('select_item');
-    };
-    GoogleStandardEvents.prototype.selectPromotion = function () {
+    }
+    selectPromotion() {
         return new GoogleStandardEvent('select_promotion');
-    };
-    GoogleStandardEvents.prototype.share = function () {
+    }
+    share() {
         return new GoogleStandardEvent('share');
-    };
-    GoogleStandardEvents.prototype.signUp = function () {
+    }
+    signUp() {
         return new GoogleStandardEvent('sign_up');
-    };
-    GoogleStandardEvents.prototype.spendVirtualCurrency = function () {
+    }
+    spendVirtualCurrency() {
         return new GoogleStandardEvent('spend_virtual_currency');
-    };
-    GoogleStandardEvents.prototype.tutorialBegin = function () {
+    }
+    tutorialBegin() {
         return new GoogleStandardEvent('tutorial_begin');
-    };
-    GoogleStandardEvents.prototype.tutorialComplete = function () {
+    }
+    tutorialComplete() {
         return new GoogleStandardEvent('tutorial_complete');
-    };
-    GoogleStandardEvents.prototype.unlockAchievement = function () {
+    }
+    unlockAchievement() {
         return new GoogleStandardEvent('unlock_achievement');
-    };
-    GoogleStandardEvents.prototype.viewCart = function () {
+    }
+    viewCart() {
         return new GoogleStandardEvent('view_cart');
-    };
-    GoogleStandardEvents.prototype.viewItem = function () {
+    }
+    viewItem() {
         return new GoogleStandardEvent('view_item');
-    };
-    GoogleStandardEvents.prototype.viewItemList = function () {
+    }
+    viewItemList() {
         return new GoogleStandardEvent('view_item_list');
-    };
-    GoogleStandardEvents.prototype.viewPromotion = function () {
+    }
+    viewPromotion() {
         return new GoogleStandardEvent('view_promotion');
-    };
-    return GoogleStandardEvents;
-}());
-
-var Rdt = /** @class */ (function () {
-    function Rdt() {
     }
-    Rdt.init = function (pixelId) {
+}
+
+class Rdt {
+    static init(pixelId) {
         try {
             Rdt.instance = new Rdt();
             Rdt.instance.load(pixelId);
@@ -1127,553 +859,391 @@ var Rdt = /** @class */ (function () {
         catch (ex) {
             console.error(ex);
         }
-    };
-    Rdt.getRdt = function () {
+    }
+    static getRdt() {
         if (global.rdt) {
             return global.rdt;
         }
         console.warn('Missing rdt');
-    };
-    Rdt.prototype.load = function (id) {
+    }
+    load(id) {
         try {
             Rdt.getRdt()('init', id);
         }
         catch (ex) {
             console.error(ex);
         }
-    };
-    Rdt.prototype.track = function (event, data) {
+    }
+    track(event, data) {
         try {
-            Rdt.getRdt()('track', event, __assign({}, data));
+            Rdt.getRdt()('track', event, Object.assign({}, data));
         }
         catch (ex) {
             console.error(ex);
         }
-    };
-    return Rdt;
-}());
+    }
+}
 
-var RedditBaseEvent = /** @class */ (function () {
-    function RedditBaseEvent(name) {
+class RedditBaseEvent {
+    constructor(name) {
         this.name = name;
         this.rdt = sdkJs.assertEx(Rdt.instance, 'Missing Rdt');
     }
-    RedditBaseEvent.prototype.send = function (_data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
+    send(_data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield sdkJs.delay(0); //force async to increase reporting odds
         });
-    };
-    return RedditBaseEvent;
-}());
-
-var RedditCustomEvent = /** @class */ (function (_super) {
-    __extends(RedditCustomEvent, _super);
-    function RedditCustomEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    RedditCustomEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        this.rdt.track(this.name, data);
-                        return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    return RedditCustomEvent;
-}(RedditBaseEvent));
-
-var RedditStandardEvent = /** @class */ (function (_super) {
-    __extends(RedditStandardEvent, _super);
-    function RedditStandardEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    RedditStandardEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        this.rdt.track(this.name, data);
-                        return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
+    }
+}
+
+class RedditCustomEvent extends RedditBaseEvent {
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.rdt.track(this.name, data);
+            yield sdkJs.delay(0); //force async to increase reporting odds
         });
-    };
-    return RedditStandardEvent;
-}(RedditBaseEvent));
+    }
+}
 
-var RedditStandardEvents = /** @class */ (function () {
-    function RedditStandardEvents() {
+class RedditStandardEvent extends RedditBaseEvent {
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.rdt.track(this.name, data);
+            yield sdkJs.delay(0); //force async to increase reporting odds
+        });
     }
-    RedditStandardEvents.prototype.pageView = function () {
+}
+
+class RedditStandardEvents {
+    pageView() {
         return new RedditStandardEvent('PageView');
-    };
-    RedditStandardEvents.prototype.viewContent = function () {
+    }
+    viewContent() {
         return new RedditStandardEvent('ViewContent');
-    };
-    RedditStandardEvents.prototype.addToCart = function () {
+    }
+    addToCart() {
         return new RedditStandardEvent('AddToCart');
-    };
-    RedditStandardEvents.prototype.addToWishlist = function () {
+    }
+    addToWishlist() {
         return new RedditStandardEvent('AddToWishlist');
-    };
-    RedditStandardEvents.prototype.purchase = function () {
+    }
+    purchase() {
         return new RedditStandardEvent('Purchase');
-    };
-    RedditStandardEvents.prototype.signup = function () {
+    }
+    signup() {
         return new RedditStandardEvent('SignUp');
-    };
-    RedditStandardEvents.prototype.lead = function () {
+    }
+    lead() {
         return new RedditStandardEvent('Lead');
-    };
-    RedditStandardEvents.prototype.search = function () {
+    }
+    search() {
         return new RedditStandardEvent('Search');
-    };
-    return RedditStandardEvents;
-}());
-
-var SnapTr = /** @class */ (function () {
-    function SnapTr() {
     }
-    SnapTr.getSnapTr = function () {
+}
+
+class SnapTr {
+    static getSnapTr() {
         if (global.snaptr) {
             return global.snaptr;
         }
         console.warn('Missing snaptr');
-    };
-    SnapTr.track = function (event, data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        this.getSnapTr()('track', event, data);
-                        return [4 /*yield*/, sdkJs.delay(0)];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
+    }
+    static track(event, data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.getSnapTr()('track', event, data);
+            yield sdkJs.delay(0);
         });
-    };
-    return SnapTr;
-}());
+    }
+}
 
-var SnapchatBaseEvent = /** @class */ (function () {
-    function SnapchatBaseEvent(name) {
+class SnapchatBaseEvent {
+    constructor(name) {
         this.name = name;
     }
-    SnapchatBaseEvent.prototype.send = function (_data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
+    send(_data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield sdkJs.delay(0); //force async to increase reporting odds
         });
-    };
-    return SnapchatBaseEvent;
-}());
-
-var SnapchatStandardEvent = /** @class */ (function (_super) {
-    __extends(SnapchatStandardEvent, _super);
-    function SnapchatStandardEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    SnapchatStandardEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, SnapTr.track(this.name, data)];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    return SnapchatStandardEvent;
-}(SnapchatBaseEvent));
+    }
+}
 
-var SnapchatStandardEvents = /** @class */ (function () {
-    function SnapchatStandardEvents() {
+class SnapchatStandardEvent extends SnapchatBaseEvent {
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield SnapTr.track(this.name, data);
+        });
     }
-    SnapchatStandardEvents.prototype.pageView = function () {
+}
+
+class SnapchatStandardEvents {
+    pageView() {
         return new SnapchatStandardEvent('PAGE_VIEW');
-    };
-    SnapchatStandardEvents.prototype.signUp = function () {
+    }
+    signUp() {
         return new SnapchatStandardEvent('SIGN_UP');
-    };
-    SnapchatStandardEvents.prototype.purchase = function () {
+    }
+    purchase() {
         return new SnapchatStandardEvent('PURCHASE');
-    };
-    SnapchatStandardEvents.prototype.save = function () {
+    }
+    save() {
         return new SnapchatStandardEvent('SAVE');
-    };
-    SnapchatStandardEvents.prototype.startCheckout = function () {
+    }
+    startCheckout() {
         return new SnapchatStandardEvent('START_CHECKOUT');
-    };
-    SnapchatStandardEvents.prototype.addCart = function () {
+    }
+    addCart() {
         return new SnapchatStandardEvent('ADD_CART');
-    };
-    SnapchatStandardEvents.prototype.openApp = function () {
+    }
+    openApp() {
         return new SnapchatStandardEvent('OPEN_APP');
-    };
-    SnapchatStandardEvents.prototype.viewContent = function () {
+    }
+    viewContent() {
         return new SnapchatStandardEvent('VIEW_CONTENT');
-    };
-    SnapchatStandardEvents.prototype.addBilling = function () {
+    }
+    addBilling() {
         return new SnapchatStandardEvent('ADD_BILLING');
-    };
-    SnapchatStandardEvents.prototype.search = function () {
+    }
+    search() {
         return new SnapchatStandardEvent('SEARCH');
-    };
-    SnapchatStandardEvents.prototype.subscribe = function () {
+    }
+    subscribe() {
         return new SnapchatStandardEvent('SUBSCRIBE');
-    };
-    SnapchatStandardEvents.prototype.adClick = function () {
+    }
+    adClick() {
         return new SnapchatStandardEvent('AD_CLICK');
-    };
-    SnapchatStandardEvents.prototype.adView = function () {
+    }
+    adView() {
         return new SnapchatStandardEvent('AD_VIEW');
-    };
-    SnapchatStandardEvents.prototype.completeTutorial = function () {
+    }
+    completeTutorial() {
         return new SnapchatStandardEvent('COMPLETE_TUTORIAL');
-    };
-    SnapchatStandardEvents.prototype.invite = function () {
+    }
+    invite() {
         return new SnapchatStandardEvent('INVITE');
-    };
-    SnapchatStandardEvents.prototype.login = function () {
+    }
+    login() {
         return new SnapchatStandardEvent('LOGIN');
-    };
-    SnapchatStandardEvents.prototype.share = function () {
+    }
+    share() {
         return new SnapchatStandardEvent('SHARE');
-    };
-    SnapchatStandardEvents.prototype.reserve = function () {
+    }
+    reserve() {
         return new SnapchatStandardEvent('RESERVE');
-    };
-    SnapchatStandardEvents.prototype.achievementUnlocked = function () {
+    }
+    achievementUnlocked() {
         return new SnapchatStandardEvent('ACHIEVEMENT_UNLOCKED');
-    };
-    SnapchatStandardEvents.prototype.addToWishlist = function () {
+    }
+    addToWishlist() {
         return new SnapchatStandardEvent('ADD_TO_WISHLIST');
-    };
-    SnapchatStandardEvents.prototype.spentCredits = function () {
+    }
+    spentCredits() {
         return new SnapchatStandardEvent('SPENT_CREDITS');
-    };
-    SnapchatStandardEvents.prototype.rate = function () {
+    }
+    rate() {
         return new SnapchatStandardEvent('RATE');
-    };
-    SnapchatStandardEvents.prototype.startTrial = function () {
+    }
+    startTrial() {
         return new SnapchatStandardEvent('START_TRIAL');
-    };
-    SnapchatStandardEvents.prototype.listView = function () {
+    }
+    listView() {
         return new SnapchatStandardEvent('LIST_VIEW');
-    };
-    SnapchatStandardEvents.prototype.custom1 = function () {
+    }
+    custom1() {
         return new SnapchatStandardEvent('CUSTOM_EVENT_1');
-    };
-    SnapchatStandardEvents.prototype.custom2 = function () {
+    }
+    custom2() {
         return new SnapchatStandardEvent('CUSTOM_EVENT_2');
-    };
-    SnapchatStandardEvents.prototype.custom3 = function () {
+    }
+    custom3() {
         return new SnapchatStandardEvent('CUSTOM_EVENT_3');
-    };
-    SnapchatStandardEvents.prototype.custom4 = function () {
+    }
+    custom4() {
         return new SnapchatStandardEvent('CUSTOM_EVENT_4');
-    };
-    SnapchatStandardEvents.prototype.custom5 = function () {
+    }
+    custom5() {
         return new SnapchatStandardEvent('CUSTOM_EVENT_5');
-    };
-    return SnapchatStandardEvents;
-}());
-
-var Ttq = /** @class */ (function () {
-    function Ttq() {
     }
-    Ttq.init = function (pixelId) {
+}
+
+class Ttq {
+    static init(pixelId) {
         try {
             Ttq.instance = new Ttq();
             Ttq.getTtq().load(pixelId);
             Ttq.page();
         }
         catch (ex) {
-            console.error("Ttq.init: ".concat(ex));
+            console.error(`Ttq.init: ${ex}`);
         }
-    };
-    Ttq.getTtq = function () {
+    }
+    static getTtq() {
         if (global.ttq) {
             return global.ttq;
         }
         console.warn('Missing ttq');
-    };
-    Ttq.page = function () {
+    }
+    static page() {
         try {
             Ttq.getTtq().page();
         }
         catch (ex) {
-            console.error("Ttq.page: ".concat(ex));
+            console.error(`Ttq.page: ${ex}`);
         }
-    };
-    Ttq.prototype.track = function (event, data) {
+    }
+    track(event, data) {
         try {
-            Ttq.getTtq().track(event, __assign({}, data));
+            Ttq.getTtq().track(event, Object.assign({}, data));
         }
         catch (ex) {
-            console.error("Ttq.track: ".concat(ex));
+            console.error(`Ttq.track: ${ex}`);
         }
-    };
-    return Ttq;
-}());
+    }
+}
 
-var TiktokBaseEvent = /** @class */ (function () {
-    function TiktokBaseEvent(name) {
+class TiktokBaseEvent {
+    constructor(name) {
         this.name = name;
         this.ttq = sdkJs.assertEx(Ttq.instance, 'Missing Ttq');
     }
-    TiktokBaseEvent.prototype.send = function (_data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    return TiktokBaseEvent;
-}());
-
-var TiktokCustomEvent = /** @class */ (function (_super) {
-    __extends(TiktokCustomEvent, _super);
-    function TiktokCustomEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TiktokCustomEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        this.ttq.track(this.name, data);
-                        return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
+    send(_data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield sdkJs.delay(0); //force async to increase reporting odds
         });
-    };
-    return TiktokCustomEvent;
-}(TiktokBaseEvent));
-
-var TiktokStandardEvent = /** @class */ (function (_super) {
-    __extends(TiktokStandardEvent, _super);
-    function TiktokStandardEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TiktokStandardEvent.prototype.send = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        this.ttq.track(this.name, data);
-                        return [4 /*yield*/, sdkJs.delay(0)]; //force async to increase reporting odds
-                    case 1:
-                        _a.sent(); //force async to increase reporting odds
-                        return [2 /*return*/];
-                }
-            });
+    }
+}
+
+class TiktokCustomEvent extends TiktokBaseEvent {
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.ttq.track(this.name, data);
+            yield sdkJs.delay(0); //force async to increase reporting odds
         });
-    };
-    return TiktokStandardEvent;
-}(TiktokBaseEvent));
+    }
+}
 
-var TiktokStandardEvents = /** @class */ (function () {
-    function TiktokStandardEvents() {
+class TiktokStandardEvent extends TiktokBaseEvent {
+    send(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.ttq.track(this.name, data);
+            yield sdkJs.delay(0); //force async to increase reporting odds
+        });
     }
-    TiktokStandardEvents.prototype.pageView = function () {
+}
+
+class TiktokStandardEvents {
+    pageView() {
         return new TiktokStandardEvent('Browse');
-    };
-    TiktokStandardEvents.prototype.viewContent = function () {
+    }
+    viewContent() {
         return new TiktokStandardEvent('ViewContent');
-    };
-    TiktokStandardEvents.prototype.addToCart = function () {
+    }
+    addToCart() {
         return new TiktokStandardEvent('AddToCart');
-    };
-    TiktokStandardEvents.prototype.checkout = function () {
+    }
+    checkout() {
         return new TiktokStandardEvent('Checkout');
-    };
-    TiktokStandardEvents.prototype.purchase = function () {
+    }
+    purchase() {
         return new TiktokStandardEvent('Purchase');
-    };
-    TiktokStandardEvents.prototype.registration = function () {
+    }
+    registration() {
         return new TiktokStandardEvent('Registration');
-    };
-    TiktokStandardEvents.prototype.startCheckout = function () {
+    }
+    startCheckout() {
         return new TiktokStandardEvent('StartCheckout');
-    };
-    TiktokStandardEvents.prototype.addBilling = function () {
+    }
+    addBilling() {
         return new TiktokStandardEvent('AddBilling');
-    };
-    TiktokStandardEvents.prototype.search = function () {
+    }
+    search() {
         return new TiktokStandardEvent('Search');
-    };
-    TiktokStandardEvents.prototype.viewForm = function () {
+    }
+    viewForm() {
         return new TiktokStandardEvent('ViewForm');
-    };
-    TiktokStandardEvents.prototype.clickForm = function () {
+    }
+    clickForm() {
         return new TiktokStandardEvent('ClickForm');
-    };
-    TiktokStandardEvents.prototype.submitForm = function () {
+    }
+    submitForm() {
         return new TiktokStandardEvent('SubmitForm');
-    };
-    TiktokStandardEvents.prototype.viewDownloadPage = function () {
+    }
+    viewDownloadPage() {
         return new TiktokStandardEvent('ViewDownloadPage');
-    };
-    TiktokStandardEvents.prototype.clickInDownloadPage = function () {
+    }
+    clickInDownloadPage() {
         return new TiktokStandardEvent('ClickInDownloadPage');
-    };
-    TiktokStandardEvents.prototype.clickToDownload = function () {
+    }
+    clickToDownload() {
         return new TiktokStandardEvent('ClickToDownload');
-    };
-    TiktokStandardEvents.prototype.clickButton = function () {
+    }
+    clickButton() {
         return new TiktokStandardEvent('ClickButton');
-    };
-    return TiktokStandardEvents;
-}());
+    }
+}
 
-var XyBaseEvent = /** @class */ (function () {
-    function XyBaseEvent(name) {
+class XyBaseEvent {
+    constructor(name) {
         this.name = name;
     }
-    XyBaseEvent.prototype.send = function (fields) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, pixel.XyPixel.instance.send(this.name, fields)];
-                    case 1:
-                        _a.sent();
-                        return [2 /*return*/];
-                }
-            });
+    send(fields) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield pixel.XyPixel.instance.send(this.name, fields);
         });
-    };
-    return XyBaseEvent;
-}());
-
-var XyCustomEvent = /** @class */ (function (_super) {
-    __extends(XyCustomEvent, _super);
-    function XyCustomEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    return XyCustomEvent;
-}(XyBaseEvent));
-
-var XyUserEventHandler = /** @class */ (function () {
-    function XyUserEventHandler() {
-    }
-    XyUserEventHandler.prototype.testStarted = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var event;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        event = new XyCustomEvent('TestStarted');
-                        return [4 /*yield*/, event.send(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    }
+}
+
+class XyCustomEvent extends XyBaseEvent {
+}
+
+class XyUserEventHandler {
+    testStarted(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const event = new XyCustomEvent('TestStarted');
+            return yield event.send(data);
         });
-    };
-    XyUserEventHandler.prototype.funnelStarted = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var event;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        event = new XyCustomEvent('FunnelStarted');
-                        return [4 /*yield*/, event.send(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    }
+    funnelStarted(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const event = new XyCustomEvent('FunnelStarted');
+            return yield event.send(data);
         });
-    };
-    XyUserEventHandler.prototype.viewContent = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var event;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        event = new XyCustomEvent('ViewContent');
-                        return [4 /*yield*/, event.send(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    }
+    viewContent(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const event = new XyCustomEvent('ViewContent');
+            return yield event.send(data);
         });
-    };
-    XyUserEventHandler.prototype.userClick = function (data) {
-        return __awaiter(this, void 0, void 0, function () {
-            var event;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        event = new XyCustomEvent('UserClick');
-                        return [4 /*yield*/, event.send(data)];
-                    case 1: return [2 /*return*/, _a.sent()];
-                }
-            });
+    }
+    userClick(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const event = new XyCustomEvent('UserClick');
+            return yield event.send(data);
         });
-    };
-    return XyUserEventHandler;
-}());
+    }
+}
 
-var MetaMaskEthersLoader = function (props) {
-    var children = props.children, _a = props.enabled, enabled = _a === void 0 ? true : _a;
+const MetaMaskEthersLoader = (props) => {
+    const { children, enabled = true } = props;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    var global = window;
-    var ethereum = global.ethereum;
-    var _b = __read(react.useState(), 2), error = _b[0], setError = _b[1];
-    var _c = __read(react.useState(), 2), localAddress = _c[0], setLocalAddress = _c[1];
-    var _d = __read(react.useState(0), 2), resetCount = _d[0], setResetCount = _d[1];
-    var _e = __read(react.useState(), 2), providerName = _e[0], setProviderName = _e[1];
+    const global = window;
+    const ethereum = global.ethereum;
+    const [error, setError] = react.useState();
+    const [localAddress, setLocalAddress] = react.useState();
+    const [resetCount, setResetCount] = react.useState(0);
+    const [providerName, setProviderName] = react.useState();
     if (ethereum) {
         ethereum.autoRefreshOnNetworkChange = false;
     }
-    var connect = function () { return __awaiter(void 0, void 0, void 0, function () {
+    const connect = () => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
-                case 0: return [4 /*yield*/, ((_a = global.ethereum) === null || _a === void 0 ? void 0 : _a.enable())];
-                case 1:
-                    _b.sent();
-                    return [2 /*return*/, localAddress ? [localAddress.toString()] : []];
-            }
-        });
-    }); };
-    var _f = __read(react.useState(), 2), isConnected = _f[0], setIsConnected = _f[1];
-    react.useEffect(function () {
+        yield ((_a = global.ethereum) === null || _a === void 0 ? void 0 : _a.enable());
+        return localAddress ? [localAddress.toString()] : [];
+    });
+    const [isConnected, setIsConnected] = react.useState();
+    react.useEffect(() => {
         if (ethereum && enabled) {
-            ethereum.on('accountsChanged', function (accounts) {
-                console.log("accountsChanged: ".concat(JSON.stringify(accounts)));
+            ethereum.on('accountsChanged', (accounts) => {
+                console.log(`accountsChanged: ${JSON.stringify(accounts)}`);
                 setResetCount(resetCount + 1);
                 if (accounts.length > 0) {
                     setLocalAddress(sdkJs.EthAddress.fromString(accounts[0]));
@@ -1682,7 +1252,7 @@ var MetaMaskEthersLoader = function (props) {
                     setLocalAddress(undefined);
                 }
             });
-            ethereum.on('chainChanged', function (chainId) {
+            ethereum.on('chainChanged', (chainId) => {
                 setResetCount(resetCount + 1);
                 if (chainId) {
                     setChainId(parseInt(chainId));
@@ -1693,130 +1263,103 @@ var MetaMaskEthersLoader = function (props) {
             });
         }
     }, [ethereum, resetCount, enabled]);
-    var _g = __read(react.useState(), 2), walletProvider = _g[0], setWalletProvider = _g[1];
-    var _h = __read(react.useState(), 2), provider = _h[0], setProvider = _h[1];
-    var _j = __read(react.useState(), 2), signer = _j[0], setSigner = _j[1];
-    react.useEffect(function () {
+    const [walletProvider, setWalletProvider] = react.useState();
+    const [provider, setProvider] = react.useState();
+    const [signer, setSigner] = react.useState();
+    react.useEffect(() => {
         if (enabled) {
-            var walletProvider_1 = ethereum ? new providers.Web3Provider(ethereum) : null;
-            var provider_1 = null;
-            var providerName_1 = null;
-            if (walletProvider_1) {
-                provider_1 = walletProvider_1;
-                providerName_1 = 'Meta Mask';
+            const walletProvider = ethereum ? new providers.Web3Provider(ethereum) : null;
+            let provider = null;
+            let providerName = null;
+            if (walletProvider) {
+                provider = walletProvider;
+                providerName = 'Meta Mask';
             }
             else {
-                provider_1 = new providers.InfuraProvider(1, infuraKey);
-                providerName_1 = 'Infura (Default)';
+                provider = new providers.InfuraProvider(1, infuraKey);
+                providerName = 'Infura (Default)';
             }
-            provider_1 = walletProvider_1 !== null && walletProvider_1 !== void 0 ? walletProvider_1 : provider_1;
-            setProvider(provider_1);
-            setProviderName(providerName_1);
-            setWalletProvider(walletProvider_1);
-            var signer_1 = null;
+            provider = walletProvider !== null && walletProvider !== void 0 ? walletProvider : provider;
+            setProvider(provider);
+            setProviderName(providerName);
+            setWalletProvider(walletProvider);
+            let signer = null;
             try {
-                signer_1 = walletProvider_1 === null || walletProvider_1 === void 0 ? void 0 : walletProvider_1.getSigner();
+                signer = walletProvider === null || walletProvider === void 0 ? void 0 : walletProvider.getSigner();
             }
             catch (ex) {
                 console.error(ex);
             }
-            setSigner(signer_1);
+            setSigner(signer);
         }
     }, [ethereum, isConnected, enabled]);
-    useAsyncEffect(function (isMounted) { return __awaiter(void 0, void 0, void 0, function () {
-        var localAddress_1, _a, _b, ex_1;
-        return __generator(this, function (_c) {
-            switch (_c.label) {
-                case 0:
-                    if (!(signer && enabled)) return [3 /*break*/, 4];
-                    _c.label = 1;
-                case 1:
-                    _c.trys.push([1, 3, , 4]);
-                    _b = (_a = sdkJs.EthAddress).fromString;
-                    return [4 /*yield*/, signer.getAddress()];
-                case 2:
-                    localAddress_1 = _b.apply(_a, [_c.sent()]);
-                    console.log("Setting Local Address: ".concat(localAddress_1));
-                    if (isMounted()) {
-                        setLocalAddress(localAddress_1);
-                        setIsConnected(true);
-                    }
-                    return [3 /*break*/, 4];
-                case 3:
-                    ex_1 = _c.sent();
-                    if (isMounted()) {
-                        setError(Error("localAddress: ".concat(ex_1)));
-                        setLocalAddress(undefined);
-                        setIsConnected(false);
-                    }
-                    return [3 /*break*/, 4];
-                case 4: return [2 /*return*/];
+    useAsyncEffect((isMounted) => __awaiter(void 0, void 0, void 0, function* () {
+        if (signer && enabled) {
+            try {
+                const localAddress = sdkJs.EthAddress.fromString(yield signer.getAddress());
+                console.log(`Setting Local Address: ${localAddress}`);
+                if (isMounted()) {
+                    setLocalAddress(localAddress);
+                    setIsConnected(true);
+                }
             }
-        });
-    }); }, [signer, resetCount, enabled]);
-    var _k = __read(react.useState(), 2), chainId = _k[0], setChainId = _k[1];
-    useAsyncEffect(function (isMounted) { return __awaiter(void 0, void 0, void 0, function () {
-        var chainId_1;
-        var _a;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
-                case 0:
-                    if (!enabled) return [3 /*break*/, 2];
-                    return [4 /*yield*/, (provider === null || provider === void 0 ? void 0 : provider.getNetwork())];
-                case 1:
-                    chainId_1 = (_a = (_b.sent())) === null || _a === void 0 ? void 0 : _a.chainId;
-                    if (!isMounted())
-                        return [2 /*return*/];
-                    setChainId(chainId_1);
-                    _b.label = 2;
-                case 2: return [2 /*return*/];
+            catch (ex) {
+                if (isMounted()) {
+                    setError(Error(`localAddress: ${ex}`));
+                    setLocalAddress(undefined);
+                    setIsConnected(false);
+                }
             }
-        });
-    }); }, [provider, enabled]);
-    return (jsxRuntime.jsx(EthersContext.Provider, __assign({ value: {
+        }
+    }), [signer, resetCount, enabled]);
+    const [chainId, setChainId] = react.useState();
+    useAsyncEffect((isMounted) => __awaiter(void 0, void 0, void 0, function* () {
+        var _b;
+        if (enabled) {
+            const chainId = (_b = (yield (provider === null || provider === void 0 ? void 0 : provider.getNetwork()))) === null || _b === void 0 ? void 0 : _b.chainId;
+            if (!isMounted())
+                return;
+            setChainId(chainId);
+        }
+    }), [provider, enabled]);
+    return (jsxRuntime.jsx(EthersContext.Provider, Object.assign({ value: {
             busy: false,
-            chainId: chainId,
-            connect: connect,
-            error: error,
-            isConnected: isConnected,
-            localAddress: localAddress,
-            provider: provider,
-            providerName: providerName,
+            chainId,
+            connect,
+            error,
+            isConnected,
+            localAddress,
+            provider,
+            providerName,
             signer: isConnected ? signer : undefined,
-            walletProvider: walletProvider,
+            walletProvider,
         } }, { children: children }), void 0));
 };
 
-var MyEtherWalletEthersLoader = function (props) {
-    var children = props.children;
+const MyEtherWalletEthersLoader = (props) => {
+    const { children } = props;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    var global = window;
-    var ethereum = global.ethereum;
-    var _a = __read(react.useState(), 2), error = _a[0], setError = _a[1];
-    var _b = __read(react.useState(), 2), localAddress = _b[0], setLocalAddress = _b[1];
-    var _c = __read(react.useState(), 2), providerName = _c[0], setProviderName = _c[1];
+    const global = window;
+    const ethereum = global.ethereum;
+    const [error, setError] = react.useState();
+    const [localAddress, setLocalAddress] = react.useState();
+    const [providerName, setProviderName] = react.useState();
     if (ethereum) {
         ethereum.autoRefreshOnNetworkChange = false;
     }
-    var connect = function () { return __awaiter(void 0, void 0, void 0, function () {
+    const connect = () => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
-                case 0: return [4 /*yield*/, ((_a = global.ethereum) === null || _a === void 0 ? void 0 : _a.enable())];
-                case 1:
-                    _b.sent();
-                    return [2 /*return*/, localAddress ? [localAddress.toString()] : []];
-            }
-        });
-    }); };
-    var _d = __read(react.useState(), 2), isConnected = _d[0], setIsConnected = _d[1];
-    var _e = __read(react.useState(), 2), walletProvider = _e[0], setWalletProvider = _e[1];
-    var _f = __read(react.useState(), 2), provider = _f[0], setProvider = _f[1];
-    var _g = __read(react.useState(), 2), signer = _g[0], setSigner = _g[1];
-    react.useEffect(function () {
-        var walletProvider = ethereum ? new providers.Web3Provider(ethereum) : null;
-        var provider = null;
-        var providerName = null;
+        yield ((_a = global.ethereum) === null || _a === void 0 ? void 0 : _a.enable());
+        return localAddress ? [localAddress.toString()] : [];
+    });
+    const [isConnected, setIsConnected] = react.useState();
+    const [walletProvider, setWalletProvider] = react.useState();
+    const [provider, setProvider] = react.useState();
+    const [signer, setSigner] = react.useState();
+    react.useEffect(() => {
+        const walletProvider = ethereum ? new providers.Web3Provider(ethereum) : null;
+        let provider = null;
+        let providerName = null;
         if (walletProvider) {
             provider = walletProvider;
             providerName = 'MyEtherWallet';
@@ -1828,7 +1371,7 @@ var MyEtherWalletEthersLoader = function (props) {
         setProvider(provider);
         setProviderName(providerName);
         setWalletProvider(walletProvider);
-        var signer = null;
+        let signer = null;
         try {
             signer = walletProvider === null || walletProvider === void 0 ? void 0 : walletProvider.getSigner();
         }
@@ -1837,175 +1380,131 @@ var MyEtherWalletEthersLoader = function (props) {
         }
         setSigner(signer);
     }, [ethereum, isConnected]);
-    useAsyncEffect(function (isMounted) { return __awaiter(void 0, void 0, void 0, function () {
-        var localAddress_1, _a, _b, ex_1;
-        return __generator(this, function (_c) {
-            switch (_c.label) {
-                case 0:
-                    if (!signer) return [3 /*break*/, 4];
-                    _c.label = 1;
-                case 1:
-                    _c.trys.push([1, 3, , 4]);
-                    _b = (_a = sdkJs.EthAddress).fromString;
-                    return [4 /*yield*/, signer.getAddress()];
-                case 2:
-                    localAddress_1 = _b.apply(_a, [_c.sent()]);
-                    if (isMounted()) {
-                        setLocalAddress(localAddress_1);
-                        setIsConnected(true);
-                    }
-                    return [3 /*break*/, 4];
-                case 3:
-                    ex_1 = _c.sent();
-                    if (isMounted()) {
-                        setError(Error("localAddress: ".concat(ex_1)));
-                        setLocalAddress(undefined);
-                        setIsConnected(false);
-                    }
-                    return [3 /*break*/, 4];
-                case 4: return [2 /*return*/];
+    useAsyncEffect((isMounted) => __awaiter(void 0, void 0, void 0, function* () {
+        if (signer) {
+            try {
+                const localAddress = sdkJs.EthAddress.fromString(yield signer.getAddress());
+                if (isMounted()) {
+                    setLocalAddress(localAddress);
+                    setIsConnected(true);
+                }
             }
-        });
-    }); }, [signer]);
-    var _h = __read(react.useState(), 2), chainId = _h[0], setChainId = _h[1];
-    useAsyncEffect(function (isMounted) { return __awaiter(void 0, void 0, void 0, function () {
-        var chainId;
-        var _a;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
-                case 0: return [4 /*yield*/, (provider === null || provider === void 0 ? void 0 : provider.getNetwork())];
-                case 1:
-                    chainId = (_a = (_b.sent())) === null || _a === void 0 ? void 0 : _a.chainId;
-                    if (!isMounted())
-                        return [2 /*return*/];
-                    setChainId(chainId);
-                    return [2 /*return*/];
+            catch (ex) {
+                if (isMounted()) {
+                    setError(Error(`localAddress: ${ex}`));
+                    setLocalAddress(undefined);
+                    setIsConnected(false);
+                }
             }
-        });
-    }); }, [provider]);
-    return (jsxRuntime.jsx(EthersContext.Provider, __assign({ value: {
+        }
+    }), [signer]);
+    const [chainId, setChainId] = react.useState();
+    useAsyncEffect((isMounted) => __awaiter(void 0, void 0, void 0, function* () {
+        var _b;
+        const chainId = (_b = (yield (provider === null || provider === void 0 ? void 0 : provider.getNetwork()))) === null || _b === void 0 ? void 0 : _b.chainId;
+        if (!isMounted())
+            return;
+        setChainId(chainId);
+    }), [provider]);
+    return (jsxRuntime.jsx(EthersContext.Provider, Object.assign({ value: {
             busy: false,
-            chainId: chainId,
-            connect: connect,
-            error: error,
-            isConnected: isConnected,
-            localAddress: localAddress,
-            provider: provider,
-            providerName: providerName,
+            chainId,
+            connect,
+            error,
+            isConnected,
+            localAddress,
+            provider,
+            providerName,
             signer: isConnected ? signer : undefined,
-            walletProvider: walletProvider,
+            walletProvider,
         } }, { children: children }), void 0));
 };
 
-var OperaEthersLoader = function (props) {
+const OperaEthersLoader = (props) => {
     var _a, _b, _c, _d, _e, _f;
-    var children = props.children;
+    const { children } = props;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    var global = window;
-    var ethereum = global.ethereum;
-    var _g = __read(react.useState(), 2), error = _g[0], setError = _g[1];
-    var _h = __read(react.useState(), 2), signer = _h[0], setSigner = _h[1];
-    var _j = __read(react.useState(), 2), provider = _j[0], setProvider = _j[1];
-    var _k = __read(react.useState(((_c = (_b = (_a = global.ethereum) === null || _a === void 0 ? void 0 : _a.addresses) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0) > 0 ? sdkJs.EthAddress.fromString((_e = (_d = global.ethereum) === null || _d === void 0 ? void 0 : _d.addresses) === null || _e === void 0 ? void 0 : _e[0]) : null), 2), localAddress = _k[0], setLocalAddress = _k[1];
-    var chainId = (ethereum === null || ethereum === void 0 ? void 0 : ethereum.chainId) ? parseInt(ethereum === null || ethereum === void 0 ? void 0 : ethereum.chainId) : 1;
-    var isConnected = (_f = ethereum === null || ethereum === void 0 ? void 0 : ethereum.isConnected()) !== null && _f !== void 0 ? _f : false;
-    useAsyncEffect(function (mounted) { return __awaiter(void 0, void 0, void 0, function () {
-        var operaProvider, provider_1, signer_1, localAddress_1, _a, _b, ex_1;
-        return __generator(this, function (_c) {
-            switch (_c.label) {
-                case 0:
-                    if (!ethereum) return [3 /*break*/, 4];
-                    ethereum.enable();
-                    operaProvider = new providers.Web3Provider(ethereum);
-                    provider_1 = operaProvider;
-                    signer_1 = operaProvider.getSigner();
-                    _c.label = 1;
-                case 1:
-                    _c.trys.push([1, 3, , 4]);
-                    _b = (_a = sdkJs.EthAddress).fromString;
-                    return [4 /*yield*/, signer_1.getAddress()];
-                case 2:
-                    localAddress_1 = _b.apply(_a, [_c.sent()]);
-                    ethereum.autoRefreshOnNetworkChange = false;
-                    if (mounted()) {
-                        setSigner(signer_1);
-                        setProvider(provider_1);
-                        setLocalAddress(localAddress_1);
-                    }
-                    return [3 /*break*/, 4];
-                case 3:
-                    ex_1 = _c.sent();
-                    if (mounted()) {
-                        setError(Error("localAddress: ".concat(ex_1)));
-                    }
-                    return [3 /*break*/, 4];
-                case 4: return [2 /*return*/];
+    const global = window;
+    const ethereum = global.ethereum;
+    const [error, setError] = react.useState();
+    const [signer, setSigner] = react.useState();
+    const [provider, setProvider] = react.useState();
+    const [localAddress, setLocalAddress] = react.useState(((_c = (_b = (_a = global.ethereum) === null || _a === void 0 ? void 0 : _a.addresses) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0) > 0 ? sdkJs.EthAddress.fromString((_e = (_d = global.ethereum) === null || _d === void 0 ? void 0 : _d.addresses) === null || _e === void 0 ? void 0 : _e[0]) : null);
+    const chainId = (ethereum === null || ethereum === void 0 ? void 0 : ethereum.chainId) ? parseInt(ethereum === null || ethereum === void 0 ? void 0 : ethereum.chainId) : 1;
+    const isConnected = (_f = ethereum === null || ethereum === void 0 ? void 0 : ethereum.isConnected()) !== null && _f !== void 0 ? _f : false;
+    useAsyncEffect((mounted) => __awaiter(void 0, void 0, void 0, function* () {
+        if (ethereum) {
+            ethereum.enable();
+            const operaProvider = new providers.Web3Provider(ethereum);
+            const provider = operaProvider;
+            const signer = operaProvider.getSigner();
+            try {
+                const localAddress = sdkJs.EthAddress.fromString(yield signer.getAddress());
+                ethereum.autoRefreshOnNetworkChange = false;
+                if (mounted()) {
+                    setSigner(signer);
+                    setProvider(provider);
+                    setLocalAddress(localAddress);
+                }
             }
-        });
-    }); }, [ethereum]);
-    return (jsxRuntime.jsx(EthersContext.Provider, __assign({ value: {
+            catch (ex) {
+                if (mounted()) {
+                    setError(Error(`localAddress: ${ex}`));
+                }
+            }
+        }
+    }), [ethereum]);
+    return (jsxRuntime.jsx(EthersContext.Provider, Object.assign({ value: {
             busy: false,
-            chainId: chainId,
-            error: error,
-            isConnected: isConnected,
-            localAddress: localAddress,
-            provider: provider,
-            signer: signer,
+            chainId,
+            error,
+            isConnected,
+            localAddress,
+            provider,
+            signer,
         } }, { children: children }), void 0));
 };
 
-var TrustEthersLoader = function (props) {
-    var children = props.children;
+const TrustEthersLoader = (props) => {
+    const { children } = props;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    var global = window;
-    var _a = __read(react.useState(), 2), error = _a[0], setError = _a[1];
-    var _b = __read(react.useState(), 2), localAddress = _b[0], setLocalAddress = _b[1];
-    var trustProvider = new providers.Web3Provider(global.ethereum);
-    var signer = trustProvider.getSigner();
-    var chainId = 1;
-    var provider = trustProvider;
-    useAsyncEffect(function (mounted) { return __awaiter(void 0, void 0, void 0, function () {
-        var localAddress_1, _a, _b, ex_1;
-        return __generator(this, function (_c) {
-            switch (_c.label) {
-                case 0:
-                    if (!signer) return [3 /*break*/, 4];
-                    _c.label = 1;
-                case 1:
-                    _c.trys.push([1, 3, , 4]);
-                    _b = (_a = sdkJs.EthAddress).fromString;
-                    return [4 /*yield*/, signer.getAddress()];
-                case 2:
-                    localAddress_1 = _b.apply(_a, [_c.sent()]);
-                    if (mounted()) {
-                        setLocalAddress(localAddress_1);
-                    }
-                    return [3 /*break*/, 4];
-                case 3:
-                    ex_1 = _c.sent();
-                    if (mounted()) {
-                        setError(Error("localAddress: ".concat(ex_1)));
-                    }
-                    return [3 /*break*/, 4];
-                case 4: return [2 /*return*/];
+    const global = window;
+    const [error, setError] = react.useState();
+    const [localAddress, setLocalAddress] = react.useState();
+    const trustProvider = new providers.Web3Provider(global.ethereum);
+    const signer = trustProvider.getSigner();
+    const chainId = 1;
+    const provider = trustProvider;
+    useAsyncEffect((mounted) => __awaiter(void 0, void 0, void 0, function* () {
+        if (signer) {
+            try {
+                const localAddress = sdkJs.EthAddress.fromString(yield signer.getAddress());
+                if (mounted()) {
+                    setLocalAddress(localAddress);
+                }
             }
-        });
-    }); }, [signer]);
-    return (jsxRuntime.jsx(EthersContext.Provider, __assign({ value: {
+            catch (ex) {
+                if (mounted()) {
+                    setError(Error(`localAddress: ${ex}`));
+                }
+            }
+        }
+    }), [signer]);
+    return (jsxRuntime.jsx(EthersContext.Provider, Object.assign({ value: {
             busy: false,
-            chainId: chainId,
-            error: error,
-            localAddress: localAddress,
-            provider: provider,
-            signer: signer,
+            chainId,
+            error,
+            localAddress,
+            provider,
+            signer,
         } }, { children: children }), void 0));
 };
 
-var EthersLoader = function (props) {
+const EthersLoader = (props) => {
     var _a, _b, _c, _d;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    var global = window;
-    var children = props.children;
+    const global = window;
+    const { children } = props;
     if ((_a = global.ethereum) === null || _a === void 0 ? void 0 : _a.isMetaMask) {
         return jsxRuntime.jsx(MetaMaskEthersLoader, { children: children }, void 0);
     }
@@ -2024,11 +1523,11 @@ var EthersLoader = function (props) {
     return jsxRuntime.jsx(InfuraEthersLoader, { children: children }, void 0);
 };
 
-var NetworkSettingsContext = react.createContext({});
+const NetworkSettingsContext = react.createContext({});
 
-var NetworkSettingsLoader = function (props) {
-    var children = props.children;
-    return (jsxRuntime.jsx(NetworkSettingsContext.Provider, __assign({ value: {
+const NetworkSettingsLoader = (props) => {
+    const { children } = props;
+    return (jsxRuntime.jsx(NetworkSettingsContext.Provider, Object.assign({ value: {
             xyBondAddress: sdkJs.EthAddress.fromString('0x1a024A698EEBdB86ccf3fCaF2F589839bdc066AD'),
             xyFhrMerkleSendAddress: sdkJs.EthAddress.fromString('0x46FEEBDffC8076D9E5fd8a11CF1508810472A79f'),
             xyGovernanceAddress: sdkJs.EthAddress.fromString('0x01925d0fFE4a6a6162B51ba611e3D4780Fc2dF42'),
@@ -2036,16 +1535,15 @@ var NetworkSettingsLoader = function (props) {
         } }, { children: children }), void 0));
 };
 
-var UserEventsContext = react.createContext({});
+const UserEventsContext = react.createContext({});
 
-var UserEventsLoader = function (_a) {
-    var userEvents = _a.userEvents, children = _a.children;
-    return jsxRuntime.jsx(UserEventsContext.Provider, __assign({ value: { userEvents: userEvents } }, { children: children }), void 0);
+const UserEventsLoader = ({ userEvents, children }) => {
+    return jsxRuntime.jsx(UserEventsContext.Provider, Object.assign({ value: { userEvents } }, { children: children }), void 0);
 };
 
-var calcSpacing = function (theme, values) {
-    for (var i = 0; i < values.length; i++) {
-        var value = values[i];
+const calcSpacing = (theme, values) => {
+    for (let i = 0; i < values.length; i++) {
+        const value = values[i];
         if (value !== undefined) {
             if (typeof value === 'string') {
                 return value;
@@ -2057,63 +1555,77 @@ var calcSpacing = function (theme, values) {
     }
 };
 
-var mergeBoxlikeStyles = function (theme, props, defaultProps) {
-    var _a = __assign(__assign({}, defaultProps), props), alignContent = _a.alignContent, alignItems = _a.alignItems, alignSelf = _a.alignSelf, bgcolor = _a.bgcolor, border = _a.border, borderColor = _a.borderColor, display = _a.display, flexGrow = _a.flexGrow, flexShrink = _a.flexShrink, flexDirection = _a.flexDirection, flexWrap = _a.flexWrap, justifyContent = _a.justifyContent, justifyItems = _a.justifyItems, justifySelf = _a.justifySelf, height = _a.height, minHeight = _a.minHeight, minWidth = _a.minWidth, margin = _a.margin, marginX = _a.marginX, marginY = _a.marginY, marginTop = _a.marginTop, marginLeft = _a.marginLeft, marginRight = _a.marginRight, marginBottom = _a.marginBottom, padding = _a.padding, paddingX = _a.paddingX, paddingY = _a.paddingY, paddingTop = _a.paddingTop, paddingLeft = _a.paddingLeft, paddingRight = _a.paddingRight, paddingBottom = _a.paddingBottom, position = _a.position, style = _a.style, width = _a.width, rootProps = __rest(_a, ["alignContent", "alignItems", "alignSelf", "bgcolor", "border", "borderColor", "display", "flexGrow", "flexShrink", "flexDirection", "flexWrap", "justifyContent", "justifyItems", "justifySelf", "height", "minHeight", "minWidth", "margin", "marginX", "marginY", "marginTop", "marginLeft", "marginRight", "marginBottom", "padding", "paddingX", "paddingY", "paddingTop", "paddingLeft", "paddingRight", "paddingBottom", "position", "style", "width"]);
-    var mergedStyle = __assign({ alignContent: alignContent, alignItems: alignItems, alignSelf: alignSelf, backgroundColor: bgcolor, border: border, borderColor: borderColor, display: display, flexDirection: flexDirection, flexGrow: flexGrow, flexShrink: flexShrink, flexWrap: flexWrap, height: height, justifyContent: justifyContent, justifyItems: justifyItems, justifySelf: justifySelf, marginBottom: calcSpacing(theme, [marginBottom, marginY, margin]), marginLeft: calcSpacing(theme, [marginLeft, marginX, margin]), marginRight: calcSpacing(theme, [marginRight, marginX, margin]), marginTop: calcSpacing(theme, [marginTop, marginY, margin]), minHeight: minHeight, minWidth: minWidth, paddingBottom: calcSpacing(theme, [paddingBottom, paddingY, padding]), paddingLeft: calcSpacing(theme, [paddingLeft, paddingX, padding]), paddingRight: calcSpacing(theme, [paddingRight, paddingX, padding]), paddingTop: calcSpacing(theme, [paddingTop, paddingY, padding]), position: position, width: width }, style);
-    return __assign(__assign({}, rootProps), { style: mergedStyle });
-};
-
-var ButtonExBase = function (props) {
-    var theme = material.useTheme();
-    var _a = mergeBoxlikeStyles(theme, props), busy = _a.busy, _b = _a.busyVariant, busyVariant = _b === void 0 ? 'linear' : _b, busyOpacity = _a.busyOpacity, onClick = _a.onClick, children = _a.children, rootProps = __rest(_a, ["busy", "busyVariant", "busyOpacity", "onClick", "children"]);
-    var localOnClick = function (event) {
+const mergeBoxlikeStyles = (theme, props, defaultProps) => {
+    const _a = Object.assign(Object.assign({}, defaultProps), props), { alignContent, alignItems, alignSelf, bgcolor, border, borderColor, display, flexGrow, flexShrink, flexDirection, flexWrap, justifyContent, justifyItems, justifySelf, height, minHeight, minWidth, margin, marginX, marginY, marginTop, marginLeft, marginRight, marginBottom, padding, paddingX, paddingY, paddingTop, paddingLeft, paddingRight, paddingBottom, position, style, width } = _a, rootProps = __rest(_a, ["alignContent", "alignItems", "alignSelf", "bgcolor", "border", "borderColor", "display", "flexGrow", "flexShrink", "flexDirection", "flexWrap", "justifyContent", "justifyItems", "justifySelf", "height", "minHeight", "minWidth", "margin", "marginX", "marginY", "marginTop", "marginLeft", "marginRight", "marginBottom", "padding", "paddingX", "paddingY", "paddingTop", "paddingLeft", "paddingRight", "paddingBottom", "position", "style", "width"]);
+    const mergedStyle = Object.assign({ alignContent,
+        alignItems,
+        alignSelf, backgroundColor: bgcolor, border,
+        borderColor,
+        display,
+        flexDirection,
+        flexGrow,
+        flexShrink,
+        flexWrap,
+        height,
+        justifyContent,
+        justifyItems,
+        justifySelf, marginBottom: calcSpacing(theme, [marginBottom, marginY, margin]), marginLeft: calcSpacing(theme, [marginLeft, marginX, margin]), marginRight: calcSpacing(theme, [marginRight, marginX, margin]), marginTop: calcSpacing(theme, [marginTop, marginY, margin]), minHeight,
+        minWidth, paddingBottom: calcSpacing(theme, [paddingBottom, paddingY, padding]), paddingLeft: calcSpacing(theme, [paddingLeft, paddingX, padding]), paddingRight: calcSpacing(theme, [paddingRight, paddingX, padding]), paddingTop: calcSpacing(theme, [paddingTop, paddingY, padding]), position,
+        width }, style);
+    return Object.assign(Object.assign({}, rootProps), { style: mergedStyle });
+};
+
+const ButtonExBase = (props) => {
+    const theme = material.useTheme();
+    const _a = mergeBoxlikeStyles(theme, props), { busy, busyVariant = 'linear', busyOpacity, onClick, children } = _a, rootProps = __rest(_a, ["busy", "busyVariant", "busyOpacity", "onClick", "children"]);
+    const localOnClick = (event) => {
         if (!busy) {
             onClick === null || onClick === void 0 ? void 0 : onClick(event);
         }
     };
-    return (jsxRuntime.jsxs(material.Button, __assign({ onClick: localOnClick }, rootProps, { children: [busy && busyVariant === 'linear' ? jsxRuntime.jsx(BusyLinearProgress, { rounded: true, opacity: busyOpacity !== null && busyOpacity !== void 0 ? busyOpacity : 0 }, void 0) : null, busy && busyVariant === 'circular' ? (jsxRuntime.jsx(BusyCircularProgress, { rounded: true, size: 24, opacity: busyOpacity !== null && busyOpacity !== void 0 ? busyOpacity : 0.5 }, void 0)) : null, children] }), void 0));
+    return (jsxRuntime.jsxs(material.Button, Object.assign({ onClick: localOnClick }, rootProps, { children: [busy && busyVariant === 'linear' ? jsxRuntime.jsx(BusyLinearProgress, { rounded: true, opacity: busyOpacity !== null && busyOpacity !== void 0 ? busyOpacity : 0 }, void 0) : null, busy && busyVariant === 'circular' ? (jsxRuntime.jsx(BusyCircularProgress, { rounded: true, size: 24, opacity: busyOpacity !== null && busyOpacity !== void 0 ? busyOpacity : 0.5 }, void 0)) : null, children] }), void 0));
 };
 
-var ButtonExTo = function (_a) {
-    var to = _a.to, toOptions = _a.toOptions, onClick = _a.onClick, props = __rest(_a, ["to", "toOptions", "onClick"]);
-    var navigate = reactRouterDom.useNavigate();
-    var localOnClick = function (event) {
+const ButtonExTo = (_a) => {
+    var { to, toOptions, onClick } = _a, props = __rest(_a, ["to", "toOptions", "onClick"]);
+    const navigate = reactRouterDom.useNavigate();
+    const localOnClick = (event) => {
         onClick === null || onClick === void 0 ? void 0 : onClick(event);
         if (to) {
             navigate(to, toOptions);
         }
     };
-    return jsxRuntime.jsx(ButtonExBase, __assign({ onClick: localOnClick }, props), void 0);
+    return jsxRuntime.jsx(ButtonExBase, Object.assign({ onClick: localOnClick }, props), void 0);
 };
 
-var ButtonEx = function (_a) {
-    var to = _a.to, props = __rest(_a, ["to"]);
+const ButtonEx = (_a) => {
+    var { to } = _a, props = __rest(_a, ["to"]);
     if (to) {
-        return jsxRuntime.jsx(ButtonExTo, __assign({ to: to }, props), void 0);
+        return jsxRuntime.jsx(ButtonExTo, Object.assign({ to: to }, props), void 0);
     }
     else {
-        return jsxRuntime.jsx(ButtonExBase, __assign({}, props), void 0);
+        return jsxRuntime.jsx(ButtonExBase, Object.assign({}, props), void 0);
     }
 };
 
-var CookieConsentBody = function (_a) {
-    var acceptOnScroll = _a.acceptOnScroll, _b = _a.acceptOnTimer, acceptOnTimer = _b === void 0 ? 0 : _b, onAccept = _a.onAccept, props = __rest(_a, ["acceptOnScroll", "acceptOnTimer", "onAccept"]);
-    var _c = useCookieConsent(), accepted = _c.accepted, setAccepted = _c.setAccepted, storageName = _c.storageName;
-    var onScroll = function () {
+const CookieConsentBody = (_a) => {
+    var { acceptOnScroll, acceptOnTimer = 0, onAccept } = _a, props = __rest(_a, ["acceptOnScroll", "acceptOnTimer", "onAccept"]);
+    const { accepted, setAccepted, storageName } = useCookieConsent();
+    const onScroll = () => {
         //hide it one the user has scrolled at least one page
         if (window.scrollY > window.innerHeight && !accepted) {
             onAcceptClick();
         }
     };
-    react.useEffect(function () {
+    react.useEffect(() => {
         if (acceptOnScroll) {
             window.addEventListener('scroll', onScroll);
-            return function () {
+            return () => {
                 window.removeEventListener('scroll', onScroll);
             };
         }
     });
-    var onAcceptClick = function () {
+    const onAcceptClick = () => {
         if (setAccepted) {
             setAccepted === null || setAccepted === void 0 ? void 0 : setAccepted(true);
         }
@@ -2123,21 +1635,21 @@ var CookieConsentBody = function (_a) {
         onAccept === null || onAccept === void 0 ? void 0 : onAccept(true);
     };
     if (acceptOnTimer > 0 && !accepted) {
-        setTimeout(function () {
+        setTimeout(() => {
             onAcceptClick();
         }, acceptOnTimer);
     }
     if (!storageName) {
-        return (jsxRuntime.jsx(FlexRow, __assign({ justifyContent: "center", paddingY: 2 }, props, { children: jsxRuntime.jsx(material.Typography, __assign({ color: "error", variant: "body1" }, { children: "Missing CookieConsentContext" }), void 0) }), void 0));
+        return (jsxRuntime.jsx(FlexRow, Object.assign({ justifyContent: "center", paddingY: 2 }, props, { children: jsxRuntime.jsx(material.Typography, Object.assign({ color: "error", variant: "body1" }, { children: "Missing CookieConsentContext" }), void 0) }), void 0));
     }
-    return accepted ? null : (jsxRuntime.jsxs(FlexRow, __assign({ justifyContent: "space-between" }, props, { children: [jsxRuntime.jsxs(material.Typography, __assign({ variant: "body2", margin: 2 }, { children: ['This site uses ', jsxRuntime.jsx(material.Link, __assign({ href: "https://cookiesandyou.com/", rel: "noopener noreferrer", target: "_blank" }, { children: "cookies" }), void 0), ' and ', jsxRuntime.jsx(material.Link, __assign({ href: "https://policies.google.com/technologies/partner-sites", rel: "noopener noreferrer", target: "_blank" }, { children: "Google\u00A0tools" }), void 0), ' to analyze traffic and for ads measurement purposes.'] }), void 0), jsxRuntime.jsx(ButtonEx, __assign({ variant: "contained", color: "secondary", onClick: onAcceptClick, margin: 2 }, { children: "Accept" }), void 0)] }), void 0));
+    return accepted ? null : (jsxRuntime.jsxs(FlexRow, Object.assign({ justifyContent: "space-between" }, props, { children: [jsxRuntime.jsxs(material.Typography, Object.assign({ variant: "body2", margin: 2 }, { children: ['This site uses ', jsxRuntime.jsx(material.Link, Object.assign({ href: "https://cookiesandyou.com/", rel: "noopener noreferrer", target: "_blank" }, { children: "cookies" }), void 0), ' and ', jsxRuntime.jsx(material.Link, Object.assign({ href: "https://policies.google.com/technologies/partner-sites", rel: "noopener noreferrer", target: "_blank" }, { children: "Google\u00A0tools" }), void 0), ' to analyze traffic and for ads measurement purposes.'] }), void 0), jsxRuntime.jsx(ButtonEx, Object.assign({ variant: "contained", color: "secondary", onClick: onAcceptClick, margin: 2 }, { children: "Accept" }), void 0)] }), void 0));
 };
 
-var CookieConsent = function (props) {
-    var storageName = useCookieConsent().storageName;
-    var Inner = function () {
-        var accepted = useCookieConsent().accepted;
-        return accepted ? null : (jsxRuntime.jsx(CookieConsentBody, __assign({ background: true, paper: true, position: "fixed", bottom: 0, maxWidth: "100vw", width: "100%", zIndex: 1000 }, props), void 0));
+const CookieConsent = (props) => {
+    const { storageName } = useCookieConsent();
+    const Inner = () => {
+        const { accepted } = useCookieConsent();
+        return accepted ? null : (jsxRuntime.jsx(CookieConsentBody, Object.assign({ background: true, paper: true, position: "fixed", bottom: 0, maxWidth: "100vw", width: "100%", zIndex: 1000 }, props), void 0));
     };
     //if not inside a context, make a context
     if (!storageName) {
@@ -2146,96 +1658,104 @@ var CookieConsent = function (props) {
     return jsxRuntime.jsx(Inner, {}, void 0);
 };
 
-var InvertableThemeContext = react.createContext({
+const InvertableThemeContext = react.createContext({
     options: {},
 });
 
-var InvertableThemeProvider = function (_a) {
-    var _b, _c;
-    var options = _a.options, children = _a.children, dark = _a.dark, _d = _a.scoped, scoped = _d === void 0 ? false : _d, _e = _a.invert, invert = _e === void 0 ? false : _e, noResponsiveFonts = _a.noResponsiveFonts;
-    var contextInvertableTheme = react.useContext(InvertableThemeContext);
-    var clonedOptions = clone__default["default"]((_b = options !== null && options !== void 0 ? options : contextInvertableTheme.options) !== null && _b !== void 0 ? _b : {});
-    clonedOptions.palette = (_c = clonedOptions.palette) !== null && _c !== void 0 ? _c : {};
+const InvertableThemeProvider = ({ options, children, dark, scoped = false, invert = false, noResponsiveFonts, }) => {
+    var _a, _b;
+    const contextInvertableTheme = react.useContext(InvertableThemeContext);
+    const clonedOptions = clone__default["default"]((_a = options !== null && options !== void 0 ? options : contextInvertableTheme.options) !== null && _a !== void 0 ? _a : {});
+    clonedOptions.palette = (_b = clonedOptions.palette) !== null && _b !== void 0 ? _b : {};
     if (invert) {
         clonedOptions.palette.mode = clonedOptions.palette.mode === 'dark' ? 'light' : 'dark';
     }
     if (dark !== undefined) {
         clonedOptions.palette.mode = dark ? 'dark' : 'light';
     }
-    var theme = styles$1.createTheme(clonedOptions);
+    let theme = styles$1.createTheme(clonedOptions);
     if (!noResponsiveFonts) {
         theme = material.responsiveFontSizes(theme);
     }
-    return scoped ? (jsxRuntime.jsx(material.ScopedCssBaseline, { children: jsxRuntime.jsx(InvertableThemeContext.Provider, __assign({ value: { options: clonedOptions } }, { children: jsxRuntime.jsx(material.ThemeProvider, __assign({ theme: theme }, { children: children }), void 0) }), void 0) }, void 0)) : (jsxRuntime.jsx(InvertableThemeContext.Provider, __assign({ value: { options: clonedOptions } }, { children: jsxRuntime.jsx(material.ThemeProvider, __assign({ theme: theme }, { children: children }), void 0) }), void 0));
+    return scoped ? (jsxRuntime.jsx(material.ScopedCssBaseline, { children: jsxRuntime.jsx(InvertableThemeContext.Provider, Object.assign({ value: { options: clonedOptions } }, { children: jsxRuntime.jsx(material.ThemeProvider, Object.assign({ theme: theme }, { children: children }), void 0) }), void 0) }, void 0)) : (jsxRuntime.jsx(InvertableThemeContext.Provider, Object.assign({ value: { options: clonedOptions } }, { children: jsxRuntime.jsx(material.ThemeProvider, Object.assign({ theme: theme }, { children: children }), void 0) }), void 0));
+};
+
+// The point of this component it to return to the top of the page on any router navigate
+const ScrollToTop = () => {
+    const { pathname } = reactRouterDom.useLocation();
+    react.useEffect(() => {
+        window.scrollTo(0, 0);
+    }, [pathname]);
+    return null;
 };
 
-var BasePage = function (_a) {
-    var disableGutters = _a.disableGutters, children = _a.children, beta = _a.beta, container = _a.container, hideFooter = _a.hideFooter, appFooter = _a.appFooter, appBar = _a.appBar, cookieConsent = _a.cookieConsent, filterBar = _a.filterBar, hideAppBar = _a.hideAppBar, hideFilterBar = _a.hideFilterBar, _b = _a.noindex, noindex = _b === void 0 ? false : _b, _c = _a.scrollToTopButton, scrollToTopButton = _c === void 0 ? false : _c, title = _a.title, props = __rest(_a, ["disableGutters", "children", "beta", "container", "hideFooter", "appFooter", "appBar", "cookieConsent", "filterBar", "hideAppBar", "hideFilterBar", "noindex", "scrollToTopButton", "title"]);
-    var theme = material.useTheme();
-    var scrollToTopAnchorId = 'scroll-to-top-anchor';
-    return (jsxRuntime.jsxs(FlexCol, __assign({ justifyContent: "flex-start", color: theme.palette.text.primary, alignItems: "stretch", width: "100%", maxWidth: "100vw", minHeight: "100vh" }, props, { children: [jsxRuntime.jsx(reactHelmet.Helmet, __assign({ title: title }, { children: noindex ? jsxRuntime.jsx("meta", { content: "noindex", name: "robots" }, void 0) : null }), void 0), scrollToTopButton ? jsxRuntime.jsx("div", { id: scrollToTopAnchorId }, void 0) : null, hideAppBar ? null : appBar, hideFilterBar ? null : filterBar, beta ? (jsxRuntime.jsx(FlexRow, __assign({ margin: 1, position: "absolute", top: 0, left: 0, bgcolor: "#cccccc88", paddingX: 1, style: { opacity: 0.5 } }, { children: jsxRuntime.jsx(material.Typography, __assign({ variant: "body2" }, { children: "Important: This page is a Beta page. It is possible that some information may not be correct." }), void 0) }), void 0)) : null, container ? (jsxRuntime.jsx(material.Container, __assign({ style: { alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1 }, maxWidth: container, disableGutters: disableGutters }, { children: children }), void 0)) : (children), hideFooter ? null : jsxRuntime.jsx("footer", { children: appFooter }, void 0), cookieConsent !== null && cookieConsent !== void 0 ? cookieConsent : (jsxRuntime.jsx(material.ScopedCssBaseline, { children: jsxRuntime.jsx(InvertableThemeProvider, __assign({ invert: true }, { children: jsxRuntime.jsx(CookieConsent, { borderRadius: 0 }, void 0) }), void 0) }, void 0)), scrollToTopButton ? (jsxRuntime.jsx(ScrollToTopButton, __assign({ anchorId: scrollToTopAnchorId }, { children: jsxRuntime.jsx(material.Fab, __assign({ "aria-label": "scroll to top", color: "secondary", size: "small" }, { children: jsxRuntime.jsx(iconsMaterial.KeyboardArrowUp, {}, void 0) }), void 0) }), void 0)) : null] }), void 0));
+const BasePage = (_a) => {
+    var { disableGutters, children, beta, container, hideFooter, appFooter, appBar, cookieConsent, filterBar, hideAppBar, hideFilterBar, noindex = false, scrollToTopButton = false, title } = _a, props = __rest(_a, ["disableGutters", "children", "beta", "container", "hideFooter", "appFooter", "appBar", "cookieConsent", "filterBar", "hideAppBar", "hideFilterBar", "noindex", "scrollToTopButton", "title"]);
+    const theme = material.useTheme();
+    const scrollToTopAnchorId = 'scroll-to-top-anchor';
+    return (jsxRuntime.jsxs(FlexCol, Object.assign({ justifyContent: "flex-start", color: theme.palette.text.primary, alignItems: "stretch", width: "100%", maxWidth: "100vw", minHeight: "100vh" }, props, { children: [jsxRuntime.jsx(ScrollToTop, {}, void 0), jsxRuntime.jsx(reactHelmet.Helmet, Object.assign({ title: title }, { children: noindex ? jsxRuntime.jsx("meta", { content: "noindex", name: "robots" }, void 0) : null }), void 0), scrollToTopButton ? jsxRuntime.jsx("div", { id: scrollToTopAnchorId }, void 0) : null, hideAppBar ? null : appBar, hideFilterBar ? null : filterBar, beta ? (jsxRuntime.jsx(FlexRow, Object.assign({ margin: 1, position: "absolute", top: 0, left: 0, bgcolor: "#cccccc88", paddingX: 1, style: { opacity: 0.5 } }, { children: jsxRuntime.jsx(material.Typography, Object.assign({ variant: "body2" }, { children: "Important: This page is a Beta page. It is possible that some information may not be correct." }), void 0) }), void 0)) : null, container ? (jsxRuntime.jsx(material.Container, Object.assign({ style: { alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1 }, maxWidth: container, disableGutters: disableGutters }, { children: children }), void 0)) : (children), hideFooter ? null : jsxRuntime.jsx("footer", { children: appFooter }, void 0), cookieConsent !== null && cookieConsent !== void 0 ? cookieConsent : (jsxRuntime.jsx(material.ScopedCssBaseline, { children: jsxRuntime.jsx(InvertableThemeProvider, Object.assign({ invert: true }, { children: jsxRuntime.jsx(CookieConsent, { borderRadius: 0 }, void 0) }), void 0) }, void 0)), scrollToTopButton ? (jsxRuntime.jsx(ScrollToTopButton, Object.assign({ anchorId: scrollToTopAnchorId }, { children: jsxRuntime.jsx(material.Fab, Object.assign({ "aria-label": "scroll to top", color: "secondary", size: "small" }, { children: jsxRuntime.jsx(iconsMaterial.KeyboardArrowUp, {}, void 0) }), void 0) }), void 0)) : null] }), void 0));
 };
 
-var getPartialPath = function (pathParts, index) {
-    var result = [];
-    for (var i = 0; i <= index; i++) {
-        result.push("".concat(pathParts[i], "/"));
+const getPartialPath = (pathParts, index) => {
+    const result = [];
+    for (let i = 0; i <= index; i++) {
+        result.push(`${pathParts[i]}/`);
     }
     return result.join('');
 };
-var BreadcrumbsEx = function (_a) {
+const BreadcrumbsEx = (_a) => {
     var _b;
-    var titles = _a.titles, _c = _a.path, path = _c === void 0 ? document.location.pathname : _c, _d = _a.separator, separator = _d === void 0 ? '|' : _d, logo = _a.logo, children = _a.children, props = __rest(_a, ["titles", "path", "separator", "logo", "children"]);
-    var pathParts = path.split('/');
+    var { titles, path = document.location.pathname, separator = '|', logo, children } = _a, props = __rest(_a, ["titles", "path", "separator", "logo", "children"]);
+    const pathParts = path.split('/');
     //if the url has a trailing '/', remove the last part
     if (((_b = pathParts[pathParts.length - 1]) === null || _b === void 0 ? void 0 : _b.length) === 0) {
         pathParts.pop();
     }
-    sdkJs.assertEx(pathParts.length - 1 === (titles === null || titles === void 0 ? void 0 : titles.length), "Path/Title length mismatch: ".concat(JSON.stringify(titles), " with ").concat(JSON.stringify(pathParts)));
-    return (jsxRuntime.jsxs(material.Breadcrumbs, __assign({ separator: separator }, props, { children: [pathParts.map(function (_pathPart, index) {
-                var path = getPartialPath(pathParts, index);
-                return (jsxRuntime.jsx(material.Link, __assign({ title: index > 0 ? titles === null || titles === void 0 ? void 0 : titles[index - 1] : 'COIN', color: index === pathParts.length - 1 ? 'textPrimary' : 'inherit', component: reactRouterDom.Link, to: path }, { children: index > 0 ? (titles === null || titles === void 0 ? void 0 : titles[index - 1]) : (jsxRuntime.jsx(FlexRow, { children: typeof logo === 'string' ? jsxRuntime.jsx("img", { src: logo }, void 0) : logo }, void 0)) }), path));
+    sdkJs.assertEx(pathParts.length - 1 === (titles === null || titles === void 0 ? void 0 : titles.length), `Path/Title length mismatch: ${JSON.stringify(titles)} with ${JSON.stringify(pathParts)}`);
+    return (jsxRuntime.jsxs(material.Breadcrumbs, Object.assign({ separator: separator }, props, { children: [pathParts.map((_pathPart, index) => {
+                const path = getPartialPath(pathParts, index);
+                return (jsxRuntime.jsx(material.Link, Object.assign({ title: index > 0 ? titles === null || titles === void 0 ? void 0 : titles[index - 1] : 'COIN', color: index === pathParts.length - 1 ? 'textPrimary' : 'inherit', component: reactRouterDom.Link, to: path }, { children: index > 0 ? (titles === null || titles === void 0 ? void 0 : titles[index - 1]) : (jsxRuntime.jsx(FlexRow, { children: typeof logo === 'string' ? jsxRuntime.jsx("img", { src: logo }, void 0) : logo }, void 0)) }), path));
             }), children] }), void 0));
 };
 
-var toAxiosError = function (error) {
+const toAxiosError = (error) => {
     return error.isAxiosError ? error : undefined;
 };
-var ErrorDialogOpen = function (_a) {
+const ErrorDialogOpen = (_a) => {
     var _b, _c;
-    var onAction = _a.onAction, _d = _a.title, title = _d === void 0 ? 'Oops. Something went wrong.' : _d, _e = _a.error, error = _e === void 0 ? Error('Unknown Error') : _e, props = __rest(_a, ["onAction", "title", "error"]);
-    var onCloseClicked = function () {
+    var { onAction, title = 'Oops. Something went wrong.', error = Error('Unknown Error') } = _a, props = __rest(_a, ["onAction", "title", "error"]);
+    const onCloseClicked = () => {
         onAction === null || onAction === void 0 ? void 0 : onAction(false);
     };
-    var onRetryClicked = function () {
+    const onRetryClicked = () => {
         onAction === null || onAction === void 0 ? void 0 : onAction(true);
     };
-    var axiosError = toAxiosError(error);
-    var message = (_b = error.message) !== null && _b !== void 0 ? _b : error.toString();
-    return (jsxRuntime.jsxs(material.Dialog, __assign({}, props, { children: [jsxRuntime.jsx(material.DialogTitle, { children: title }, void 0), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(FlexRow, { children: jsxRuntime.jsx(material.Typography, __assign({ color: "error" }, { children: axiosError ? "".concat(message, " [").concat((_c = axiosError === null || axiosError === void 0 ? void 0 : axiosError.code) !== null && _c !== void 0 ? _c : 'Connection Failure', "]") : "".concat(message) }), void 0) }, void 0) }, void 0), jsxRuntime.jsx(material.DialogActions, { children: jsxRuntime.jsxs(FlexRow, __assign({ justifyContent: "space-between", width: "100%", minWidth: "300px" }, { children: [jsxRuntime.jsx(ButtonEx, __assign({ onClick: onCloseClicked, variant: "text" }, { children: "Close" }), void 0), jsxRuntime.jsx(ButtonEx, __assign({ onClick: onRetryClicked, variant: "text" }, { children: "Retry" }), void 0)] }), void 0) }, void 0)] }), void 0));
+    const axiosError = toAxiosError(error);
+    const message = (_b = error.message) !== null && _b !== void 0 ? _b : error.toString();
+    return (jsxRuntime.jsxs(material.Dialog, Object.assign({}, props, { children: [jsxRuntime.jsx(material.DialogTitle, { children: title }, void 0), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(FlexRow, { children: jsxRuntime.jsx(material.Typography, Object.assign({ color: "error" }, { children: axiosError ? `${message} [${(_c = axiosError === null || axiosError === void 0 ? void 0 : axiosError.code) !== null && _c !== void 0 ? _c : 'Connection Failure'}]` : `${message}` }), void 0) }, void 0) }, void 0), jsxRuntime.jsx(material.DialogActions, { children: jsxRuntime.jsxs(FlexRow, Object.assign({ justifyContent: "space-between", width: "100%", minWidth: "300px" }, { children: [jsxRuntime.jsx(ButtonEx, Object.assign({ onClick: onCloseClicked, variant: "text" }, { children: "Close" }), void 0), jsxRuntime.jsx(ButtonEx, Object.assign({ onClick: onRetryClicked, variant: "text" }, { children: "Retry" }), void 0)] }), void 0) }, void 0)] }), void 0));
 };
-var ErrorDialog = function (_a) {
-    var open = _a.open, error = _a.error, props = __rest(_a, ["open", "error"]);
+const ErrorDialog = (_a) => {
+    var { open, error } = _a, props = __rest(_a, ["open", "error"]);
     if (error) {
-        return jsxRuntime.jsx(ErrorDialogOpen, __assign({ open: !!error || open, error: error }, props), void 0);
+        return jsxRuntime.jsx(ErrorDialogOpen, Object.assign({ open: !!error || open, error: error }, props), void 0);
     }
     else {
         return null;
     }
 };
 
-var MessageDialog = function (_a) {
-    var onOk = _a.onOk, onCancel = _a.onCancel, children = _a.children, title = _a.title, props = __rest(_a, ["onOk", "onCancel", "children", "title"]);
-    return (jsxRuntime.jsxs(material.Dialog, __assign({}, props, { children: [jsxRuntime.jsx(material.DialogTitle, { children: title }, void 0), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(FlexCol, __assign({ alignItems: "stretch" }, { children: children }), void 0) }, void 0), jsxRuntime.jsx(material.DialogActions, { children: jsxRuntime.jsxs(FlexRow, __assign({ justifyContent: "space-between", width: "100%" }, { children: [jsxRuntime.jsx(material.Button, __assign({ onClick: onCancel, variant: "text" }, { children: "Cancel" }), void 0), jsxRuntime.jsx(material.Button, __assign({ onClick: onOk, variant: "text" }, { children: "Ok" }), void 0)] }), void 0) }, void 0)] }), void 0));
+const MessageDialog = (_a) => {
+    var { onOk, onCancel, children, title } = _a, props = __rest(_a, ["onOk", "onCancel", "children", "title"]);
+    return (jsxRuntime.jsxs(material.Dialog, Object.assign({}, props, { children: [jsxRuntime.jsx(material.DialogTitle, { children: title }, void 0), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(FlexCol, Object.assign({ alignItems: "stretch" }, { children: children }), void 0) }, void 0), jsxRuntime.jsx(material.DialogActions, { children: jsxRuntime.jsxs(FlexRow, Object.assign({ justifyContent: "space-between", width: "100%" }, { children: [jsxRuntime.jsx(material.Button, Object.assign({ onClick: onCancel, variant: "text" }, { children: "Cancel" }), void 0), jsxRuntime.jsx(material.Button, Object.assign({ onClick: onOk, variant: "text" }, { children: "Ok" }), void 0)] }), void 0) }, void 0)] }), void 0));
 };
 
-var useBreakpoint = function () {
-    var theme = material.useTheme();
-    var xs = material.useMediaQuery(theme.breakpoints.only('xs'));
-    var sm = material.useMediaQuery(theme.breakpoints.only('sm'));
-    var md = material.useMediaQuery(theme.breakpoints.only('md'));
-    var lg = material.useMediaQuery(theme.breakpoints.only('lg'));
-    var xl = material.useMediaQuery(theme.breakpoints.only('xl'));
+const useBreakpoint = () => {
+    const theme = material.useTheme();
+    const xs = material.useMediaQuery(theme.breakpoints.only('xs'));
+    const sm = material.useMediaQuery(theme.breakpoints.only('sm'));
+    const md = material.useMediaQuery(theme.breakpoints.only('md'));
+    const lg = material.useMediaQuery(theme.breakpoints.only('lg'));
+    const xl = material.useMediaQuery(theme.breakpoints.only('xl'));
     if (xs) {
         return 'xs';
     }
@@ -2253,18 +1773,18 @@ var useBreakpoint = function () {
     }
 };
 
-var useLocalStorage = function (key, defaultValue) {
-    var _a = __read(react.useState(function () {
+const useLocalStorage = (key, defaultValue) => {
+    const [storedValue, setStoredValue] = react.useState(() => {
         try {
-            var item = getLocalStorageObject(key);
+            const item = getLocalStorageObject(key);
             return item || defaultValue;
         }
         catch (ex) {
             //Error is already logged
             return defaultValue;
         }
-    }), 2), storedValue = _a[0], setStoredValue = _a[1];
-    var setValue = function (value) {
+    });
+    const setValue = (value) => {
         console.log('setValue', value);
         setStoredValue(value);
         setLocalStorageObject(key, value);
@@ -2273,30 +1793,30 @@ var useLocalStorage = function (key, defaultValue) {
     return [storedValue, setValue];
 };
 
-var useMounted = function () {
-    var _a = __read(react.useState(true), 2), mounted = _a[0], setMounted = _a[1];
-    react.useEffect(function () {
+const useMounted = () => {
+    const [mounted, setMounted] = react.useState(true);
+    react.useEffect(() => {
         setMounted(true);
-        return function () {
+        return () => {
             // eslint-disable-next-line react-hooks/exhaustive-deps
             setMounted(false);
         };
     }, []);
-    return function () {
+    return () => {
         return mounted;
     };
 };
 
-var useNavigateToEthAddress = function () {
-    var navigate = reactRouterDom.useNavigate();
-    var navigateToEthAddress = function (address, event, page, to, toOptions, toEtherScan) {
+const useNavigateToEthAddress = () => {
+    const navigate = reactRouterDom.useNavigate();
+    const navigateToEthAddress = (address, event, page, to, toOptions, toEtherScan) => {
         var _a;
-        var openInEtherScan = toEtherScan || (!to && !page);
+        const openInEtherScan = toEtherScan || (!to && !page);
         if (openInEtherScan) {
-            window.open("https://etherscan.io/address/".concat(address.toString()), '_blank');
+            window.open(`https://etherscan.io/address/${address.toString()}`, '_blank');
         }
         else {
-            var path = (_a = to === null || to === void 0 ? void 0 : to.toString()) !== null && _a !== void 0 ? _a : "/".concat(page, "/").concat(address.toString());
+            const path = (_a = to === null || to === void 0 ? void 0 : to.toString()) !== null && _a !== void 0 ? _a : `/${page}/${address.toString()}`;
             if (event.metaKey || toEtherScan) {
                 window.open(path, '_blank');
             }
@@ -2305,63 +1825,50 @@ var useNavigateToEthAddress = function () {
             }
         }
     };
-    return { navigateToEthAddress: navigateToEthAddress };
+    return { navigateToEthAddress };
 };
 
-var useSpacing = function (value) {
-    var theme = material.useTheme();
+const useSpacing = (value) => {
+    const theme = material.useTheme();
     return theme.spacing(typeof value === 'string' ? parseInt(value) : value);
 };
 
-var useUserEvents = function () {
-    var userEvents = react.useContext(UserEventsContext).userEvents;
+const useUserEvents = () => {
+    const { userEvents } = react.useContext(UserEventsContext);
     if (!userEvents) {
         console.error('useUserEvents must be called inside a UserEventsContext');
     }
     return userEvents;
 };
 
-var supportsWebP = undefined;
-var useWebP = function (webp, alt) {
-    var _a = __read(react.useState(supportsWebP === true ? webp : supportsWebP === false ? alt : undefined), 2), img = _a[0], setImg = _a[1];
-    useAsyncEffect(function (mounted) { return __awaiter(void 0, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    if (!(supportsWebP === undefined)) return [3 /*break*/, 2];
-                    return [4 /*yield*/, getSupportsWebP()];
-                case 1:
-                    supportsWebP = _a.sent();
-                    if (mounted()) {
-                        setImg(supportsWebP ? webp : alt);
-                    }
-                    _a.label = 2;
-                case 2: return [2 /*return*/];
+let supportsWebP = undefined;
+const useWebP = (webp, alt) => {
+    const [img, setImg] = react.useState(supportsWebP === true ? webp : supportsWebP === false ? alt : undefined);
+    useAsyncEffect((mounted) => __awaiter(void 0, void 0, void 0, function* () {
+        if (supportsWebP === undefined) {
+            supportsWebP = yield getSupportsWebP();
+            if (mounted()) {
+                setImg(supportsWebP ? webp : alt);
             }
-        });
-    }); }, [supportsWebP]);
+        }
+    }), [supportsWebP]);
     return img;
 };
-var getSupportsWebP = function () { return __awaiter(void 0, void 0, void 0, function () {
-    return __generator(this, function (_a) {
-        switch (_a.label) {
-            case 0: return [4 /*yield*/, new Promise(function (resolve) {
-                    var image = new Image();
-                    image.onerror = function () { return resolve(false); };
-                    image.onload = function () { return resolve(image.width === 1); };
-                    image.src = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA=';
-                }).catch(function () { return false; })];
-            case 1: return [2 /*return*/, _a.sent()];
-        }
-    });
-}); };
+const getSupportsWebP = () => __awaiter(void 0, void 0, void 0, function* () {
+    return yield new Promise((resolve) => {
+        const image = new Image();
+        image.onerror = () => resolve(false);
+        image.onload = () => resolve(image.width === 1);
+        image.src = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA=';
+    }).catch(() => false);
+});
 
 function useWindowSize() {
-    var _a = __read(react.useState({
+    const [windowSize, setWindowSize] = react.useState({
         height: undefined,
         width: undefined,
-    }), 2), windowSize = _a[0], setWindowSize = _a[1];
-    react.useEffect(function () {
+    });
+    react.useEffect(() => {
         function handleResize() {
             setWindowSize({
                 height: window.innerHeight,
@@ -2370,25 +1877,25 @@ function useWindowSize() {
         }
         window.addEventListener('resize', handleResize);
         handleResize();
-        return function () { return window.removeEventListener('resize', handleResize); };
+        return () => window.removeEventListener('resize', handleResize);
     }, []);
     return windowSize;
 }
 
-var EthAccount = function (_a) {
-    var address = _a.address, _b = _a.icon, icon = _b === void 0 ? false : _b, _c = _a.iconSize, iconSize = _c === void 0 ? 16 : _c, _d = _a.iconOnly, iconOnly = _d === void 0 ? false : _d, _e = _a.addressLength, addressLength = _e === void 0 ? 'auto' : _e, _f = _a.fontFamily, fontFamily = _f === void 0 ? '"Source Code Pro",monospace' : _f, toEtherScan = _a.toEtherScan, onButtonClick = _a.onButtonClick, props = __rest(_a, ["address", "icon", "iconSize", "iconOnly", "addressLength", "fontFamily", "toEtherScan", "onButtonClick"]);
-    var localAddress = react.useContext(EthersContext).localAddress;
-    var theme = material.useTheme();
-    var large = material.useMediaQuery(theme.breakpoints.up('md'));
-    var isLocalAddress = address ? (localAddress === null || localAddress === void 0 ? void 0 : localAddress.toString()) === address.toString() : false;
-    var onClickLocal = function (event) {
+const EthAccount = (_a) => {
+    var { address, icon = false, iconSize = 16, iconOnly = false, addressLength = 'auto', fontFamily = '"Source Code Pro",monospace', toEtherScan, onButtonClick } = _a, props = __rest(_a, ["address", "icon", "iconSize", "iconOnly", "addressLength", "fontFamily", "toEtherScan", "onButtonClick"]);
+    const { localAddress } = react.useContext(EthersContext);
+    const theme = material.useTheme();
+    const large = material.useMediaQuery(theme.breakpoints.up('md'));
+    const isLocalAddress = address ? (localAddress === null || localAddress === void 0 ? void 0 : localAddress.toString()) === address.toString() : false;
+    const onClickLocal = (event) => {
         onButtonClick === null || onButtonClick === void 0 ? void 0 : onButtonClick(event);
         if (toEtherScan && address) {
-            window.open("https://etherscan.io/address/".concat(address.toString()), '_blank');
+            window.open(`https://etherscan.io/address/${address.toString()}`, '_blank');
         }
     };
-    var addressToDisplay = sdkJs.assertEx(address !== null && address !== void 0 ? address : sdkJs.EthAddress.fromString('0x00'), 'Bad Eth Address');
-    var testToDisplay = addressLength === 'long'
+    const addressToDisplay = sdkJs.assertEx(address !== null && address !== void 0 ? address : sdkJs.EthAddress.fromString('0x00'), 'Bad Eth Address');
+    const testToDisplay = addressLength === 'long'
         ? addressToDisplay.toString()
         : addressLength === 'short'
             ? addressToDisplay.toShortString()
@@ -2396,36 +1903,36 @@ var EthAccount = function (_a) {
                 ? addressToDisplay.toString()
                 : addressToDisplay.toShortString();
     // Note: We use the all zero address for spacing in case it is
-    return (jsxRuntime.jsx(ButtonEx, __assign({ onClick: onClickLocal, title: "0x".concat(address === null || address === void 0 ? void 0 : address.toHex()) }, props, { children: jsxRuntime.jsxs(FlexGrowRow, __assign({ justifyContent: "space-between", alignItems: "center" }, { children: [icon && address ? jsxRuntime.jsx(Identicon, { size: iconSize, value: address === null || address === void 0 ? void 0 : address.toHex() }, void 0) : null, iconOnly ? null : (jsxRuntime.jsxs(FlexRow, { children: [jsxRuntime.jsx(material.Typography, __assign({ marginLeft: icon ? 1 : 0, variant: "body1", fontFamily: fontFamily, visibility: address ? 'inherit' : 'hidden' }, { children: testToDisplay }), void 0), address ? null : (jsxRuntime.jsx(material.Typography, __assign({ position: "absolute", marginLeft: icon ? 1 : 0, variant: "body1", fontFamily: fontFamily }, { children: "-- --" }), void 0))] }, void 0)), isLocalAddress ? jsxRuntime.jsx(FlexRow, __assign({ marginLeft: 0.5 }, { children: "(You)" }), void 0) : null] }), void 0) }), void 0));
+    return (jsxRuntime.jsx(ButtonEx, Object.assign({ onClick: onClickLocal, title: `0x${address === null || address === void 0 ? void 0 : address.toHex()}` }, props, { children: jsxRuntime.jsxs(FlexGrowRow, Object.assign({ justifyContent: "space-between", alignItems: "center" }, { children: [icon && address ? jsxRuntime.jsx(Identicon, { size: iconSize, value: address === null || address === void 0 ? void 0 : address.toHex() }, void 0) : null, iconOnly ? null : (jsxRuntime.jsxs(FlexRow, { children: [jsxRuntime.jsx(material.Typography, Object.assign({ marginLeft: icon ? 1 : 0, variant: "body1", fontFamily: fontFamily, visibility: address ? 'inherit' : 'hidden' }, { children: testToDisplay }), void 0), address ? null : (jsxRuntime.jsx(material.Typography, Object.assign({ position: "absolute", marginLeft: icon ? 1 : 0, variant: "body1", fontFamily: fontFamily }, { children: "-- --" }), void 0))] }, void 0)), isLocalAddress ? jsxRuntime.jsx(FlexRow, Object.assign({ marginLeft: 0.5 }, { children: "(You)" }), void 0) : null] }), void 0) }), void 0));
 };
 
-var Experiment = function (props) {
-    var children = props.children;
+const Experiment = (props) => {
+    const { children } = props;
     return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }, void 0);
 };
 
-var OutcomesLocalStorageKey = 'outcomes';
-var ExperimentsLocalStorageKey = 'experiments';
+const OutcomesLocalStorageKey = 'outcomes';
+const ExperimentsLocalStorageKey = 'experiments';
 
-var defaultLocalStorageKey = 'testData';
-var experimentsTestData = {};
-var outcomes = {}; //prevent multi-outcome
-var saveOutcomes = function () {
+const defaultLocalStorageKey = 'testData';
+const experimentsTestData = {};
+let outcomes = {}; //prevent multi-outcome
+const saveOutcomes = () => {
     setLocalStorageObject(OutcomesLocalStorageKey, outcomes);
 };
-var loadOutcomes = function () {
+const loadOutcomes = () => {
     outcomes = getLocalStorageObject(OutcomesLocalStorageKey);
 };
-var mergeData = function (data, log) {
-    var dataArray = [];
-    for (var key in data) {
-        dataArray.push("".concat(key, "-").concat(data[key]));
+const mergeData = (data, log) => {
+    const dataArray = [];
+    for (const key in data) {
+        dataArray.push(`${key}-${data[key]}`);
     }
     log === null || log === void 0 ? void 0 : log.info('MergeData', dataArray.join('|'));
     return dataArray.join('|');
 };
-var missingKeyError = new Error('Experiment Elements must have Keys');
-var makeChildrenArray = function (children) {
+const missingKeyError = new Error('Experiment Elements must have Keys');
+const makeChildrenArray = (children) => {
     if (Array.isArray(children)) {
         return children;
     }
@@ -2433,36 +1940,25 @@ var makeChildrenArray = function (children) {
         return [children];
     }
 };
-var buildLocalStorageKey = function (localStorageProp) {
+const buildLocalStorageKey = (localStorageProp) => {
     return localStorageProp === true
         ? defaultLocalStorageKey
         : typeof localStorageProp === 'string'
             ? localStorageProp !== null && localStorageProp !== void 0 ? localStorageProp : defaultLocalStorageKey
             : '';
 };
-var calcTotalWeight = function (childList) {
-    var e_1, _a;
-    var totalWeight = 0;
-    try {
-        for (var childList_1 = __values(childList), childList_1_1 = childList_1.next(); !childList_1_1.done; childList_1_1 = childList_1.next()) {
-            var child = childList_1_1.value;
-            totalWeight += child.props.weight;
-        }
-    }
-    catch (e_1_1) { e_1 = { error: e_1_1 }; }
-    finally {
-        try {
-            if (childList_1_1 && !childList_1_1.done && (_a = childList_1.return)) _a.call(childList_1);
-        }
-        finally { if (e_1) throw e_1.error; }
+const calcTotalWeight = (childList) => {
+    let totalWeight = 0;
+    for (const child of childList) {
+        totalWeight += child.props.weight;
     }
     return totalWeight;
 };
-var saveExperimentDebugRanges = function (name, totalWeight, childList) {
-    var experiments = getLocalStorageObject(ExperimentsLocalStorageKey) || {};
+const saveExperimentDebugRanges = (name, totalWeight, childList) => {
+    const experiments = getLocalStorageObject(ExperimentsLocalStorageKey) || {};
     experiments[name] = {
-        totalWeight: totalWeight,
-        variants: childList.map(function (child) {
+        totalWeight,
+        variants: childList.map((child) => {
             var _a;
             return ({
                 name: (_a = child.key) === null || _a === void 0 ? void 0 : _a.toString(),
@@ -2472,109 +1968,114 @@ var saveExperimentDebugRanges = function (name, totalWeight, childList) {
     };
     setLocalStorageObject(ExperimentsLocalStorageKey, experiments);
 };
-var Experiments = function (props) {
-    var e_2, _a;
-    var _b, _c;
-    var name = props.name, children = props.children, _d = props.localStorageProp, localStorageProp = _d === void 0 ? true : _d;
-    var userEvents = useUserEvents();
+const Experiments = (props) => {
+    var _a, _b;
+    const { name, children, localStorageProp = true } = props;
+    const userEvents = useUserEvents();
     loadOutcomes();
-    var localStorageKey = buildLocalStorageKey(localStorageProp);
-    var childList = makeChildrenArray(children);
-    var totalWeight = calcTotalWeight(childList);
+    const localStorageKey = buildLocalStorageKey(localStorageProp);
+    const childList = makeChildrenArray(children);
+    const totalWeight = calcTotalWeight(childList);
     saveExperimentDebugRanges(name, totalWeight, childList);
-    var firstTime = outcomes[name] === undefined;
-    var targetWeight = (_b = outcomes[name]) !== null && _b !== void 0 ? _b : Math.random() * totalWeight;
+    const firstTime = outcomes[name] === undefined;
+    let targetWeight = (_a = outcomes[name]) !== null && _a !== void 0 ? _a : Math.random() * totalWeight;
     outcomes[name] = targetWeight;
     saveOutcomes();
-    try {
-        for (var childList_2 = __values(childList), childList_2_1 = childList_2.next(); !childList_2_1.done; childList_2_1 = childList_2.next()) {
-            var child = childList_2_1.value;
-            targetWeight -= child.props.weight;
-            if (targetWeight > 0)
-                continue;
-            if (!child.key) {
-                throw missingKeyError;
+    for (const child of childList) {
+        targetWeight -= child.props.weight;
+        if (targetWeight > 0)
+            continue;
+        if (!child.key) {
+            throw missingKeyError;
+        }
+        experimentsTestData[name] = (_b = child.key) === null || _b === void 0 ? void 0 : _b.toString();
+        if (firstTime) {
+            if (localStorageProp !== false) {
+                localStorage.setItem(localStorageKey, mergeData(experimentsTestData));
             }
-            experimentsTestData[name] = (_c = child.key) === null || _c === void 0 ? void 0 : _c.toString();
-            if (firstTime) {
-                if (localStorageProp !== false) {
-                    localStorage.setItem(localStorageKey, mergeData(experimentsTestData));
-                }
-                if (userEvents) {
-                    sdkJs.forget(userEvents.testStarted({ name: name, variation: child.key }));
-                }
+            if (userEvents) {
+                sdkJs.forget(userEvents.testStarted({ name, variation: child.key }));
             }
-            return child;
         }
-    }
-    catch (e_2_1) { e_2 = { error: e_2_1 }; }
-    finally {
-        try {
-            if (childList_2_1 && !childList_2_1.done && (_a = childList_2.return)) _a.call(childList_2);
-        }
-        finally { if (e_2) throw e_2.error; }
+        return child;
     }
     throw new Error('Experiment Choice Failed');
 };
 
-var ExperimentsDebugger = function (_a) {
+const ExperimentsDebugger = (_a) => {
     var props = __rest(_a, []);
-    var _b = __read(useLocalStorage(ExperimentsLocalStorageKey, {}), 1), experiments = _b[0];
-    var _c = __read(useLocalStorage(OutcomesLocalStorageKey, {}), 2), outcomes = _c[0], setOutcomes = _c[1];
-    var sumUpVariants = function (items) { return items.reduce(function (acc, curr) { return acc + curr.weight; }, 0); };
-    var experimentEntries = Object.entries(experiments);
+    const [experiments] = useLocalStorage(ExperimentsLocalStorageKey, {});
+    const [outcomes, setOutcomes] = useLocalStorage(OutcomesLocalStorageKey, {});
+    const sumUpVariants = (items) => items.reduce((acc, curr) => acc + curr.weight, 0);
+    const experimentEntries = Object.entries(experiments);
     if (!experiments || !experimentEntries.length) {
-        return (jsxRuntime.jsxs(FlexCol, __assign({ alignItems: "stretch" }, props, { children: [jsxRuntime.jsx(material.Typography, __assign({ variant: "subtitle1" }, { children: "No Experiments loaded" }), void 0), jsxRuntime.jsx(material.Typography, __assign({ variant: "subtitle2" }, { children: "Visit a page with an experiment to load the data" }), void 0)] }), void 0));
-    }
-    return (jsxRuntime.jsx(FlexCol, __assign({ alignItems: "stretch" }, props, { children: Object.entries(experiments).map(function (data) {
-            var _a = __read(data, 2), name = _a[0], experiment = _a[1];
-            var outcome = (outcomes[name] || 0);
-            var marks = __spreadArray([
-                { label: "".concat(experiment.variants[0].name, " | ").concat(experiment.variants[0].weight), value: 0 }
-            ], __read(experiment.variants.map(function (_a, index) {
-                var weight = _a.weight;
-                return ({
-                    label: index === experiment.variants.length - 1 ? 'End' : "".concat(experiment.variants[index + 1].name, " | ").concat(weight),
+        return (jsxRuntime.jsxs(FlexCol, Object.assign({ alignItems: "stretch" }, props, { children: [jsxRuntime.jsx(material.Typography, Object.assign({ variant: "subtitle1" }, { children: "No Experiments loaded" }), void 0), jsxRuntime.jsx(material.Typography, Object.assign({ variant: "subtitle2" }, { children: "Visit a page with an experiment to load the data" }), void 0)] }), void 0));
+    }
+    return (jsxRuntime.jsx(FlexCol, Object.assign({ alignItems: "stretch" }, props, { children: Object.entries(experiments).map((data) => {
+            const [name, experiment] = data;
+            const outcome = (outcomes[name] || 0);
+            const marks = [
+                { label: `${experiment.variants[0].name} | ${experiment.variants[0].weight}`, value: 0 },
+                ...experiment.variants.map(({ weight }, index) => ({
+                    label: index === experiment.variants.length - 1 ? 'End' : `${experiment.variants[index + 1].name} | ${weight}`,
                     value: index === 0 ? weight : sumUpVariants(experiment.variants.slice(0, index + 1)),
-                });
-            })), false);
-            return (jsxRuntime.jsxs(FlexCol, __assign({ alignItems: "stretch", paddingX: 4, marginBottom: 4 }, props, { children: [jsxRuntime.jsxs(FlexRow, { children: [name, ":\u00A0", outcome] }, void 0), jsxRuntime.jsx(FlexRow, { children: jsxRuntime.jsx(material.Slider, { "aria-label": "Experiment ".concat(name), defaultValue: outcome, value: outcome, marks: marks, onChange: function (e, value) {
-                                var truncated = Number((Array.isArray(value) ? value[0] : value).toFixed(2));
+                })),
+            ];
+            return (jsxRuntime.jsxs(FlexCol, Object.assign({ alignItems: "stretch", paddingX: 4, marginBottom: 4 }, props, { children: [jsxRuntime.jsxs(FlexRow, { children: [name, ":\u00A0", outcome] }, void 0), jsxRuntime.jsx(FlexRow, { children: jsxRuntime.jsx(material.Slider, { "aria-label": `Experiment ${name}`, defaultValue: outcome, value: outcome, marks: marks, onChange: (e, value) => {
+                                const truncated = Number((Array.isArray(value) ? value[0] : value).toFixed(2));
                                 outcomes[name] = truncated;
                                 // Spread operator triggers rerender
-                                setOutcomes(__assign({}, outcomes));
-                            } }, void 0) }, void 0)] }), "experiment-".concat(name)));
+                                setOutcomes(Object.assign({}, outcomes));
+                            } }, void 0) }, void 0)] }), `experiment-${name}`));
         }) }), void 0));
 };
 
-var LinkToEx = function (_a) {
-    var to = _a.to, props = __rest(_a, ["to"]);
-    return jsxRuntime.jsx(material.Link, __assign({ component: reactRouterDom.Link, to: to }, props), void 0);
+const LinkToEx = (_a) => {
+    var { to } = _a, props = __rest(_a, ["to"]);
+    return jsxRuntime.jsx(material.Link, Object.assign({ component: reactRouterDom.Link, to: to }, props), void 0);
 };
 
-var NumberStatus = function (_a) {
+const NumberStatus = (_a) => {
     var _b, _c;
-    var error = _a.error, _d = _a.format, format = _d === void 0 ? '0[.]0a' : _d, _e = _a.color, color = _e === void 0 ? 'primary' : _e, title = _a.title, value = _a.value, size = _a.size, fontSize = _a.fontSize, _f = _a.rounded, rounded = _f === void 0 ? false : _f, _g = _a.autoWidth, autoWidth = _g === void 0 ? false : _g, style = _a.style, props = __rest(_a, ["error", "format", "color", "title", "value", "size", "fontSize", "rounded", "autoWidth", "style"]);
-    var theme = material.useTheme();
-    var palette = color === 'inherit' ? undefined : theme.palette[color];
-    var bgColorTop = (_b = palette === null || palette === void 0 ? void 0 : palette.dark) !== null && _b !== void 0 ? _b : theme.palette.background.paper;
-    var bgColorBottom = (_c = palette === null || palette === void 0 ? void 0 : palette.main) !== null && _c !== void 0 ? _c : theme.palette.background.default;
-    var sizePixels = size === 'large' ? 96 : size === 'small' ? 64 : 80;
-    var calcFontSize = fontSize !== null && fontSize !== void 0 ? fontSize : sizePixels * 0.2;
-    return (jsxRuntime.jsx(ButtonEx, __assign({ size: size, padding: 0, style: __assign({ borderRadius: rounded ? theme.shape.borderRadius : 0, overflow: rounded ? 'hidden' : undefined }, style) }, props, { children: jsxRuntime.jsxs(FlexCol, __assign({ alignItems: "stretch", height: sizePixels, width: autoWidth ? '100%' : sizePixels, busy: value === undefined && !error }, { children: [jsxRuntime.jsx(FlexGrowRow, __assign({ bgcolor: bgColorTop, color: theme.palette.getContrastText(bgColorTop), fontSize: calcFontSize, fontFamily: "Source Code Pro,monospace", alignItems: "center", height: sizePixels * 0.75 }, { children: numeral__default["default"](value).format(format) }), void 0), jsxRuntime.jsx(FlexGrowRow, __assign({ bgcolor: bgColorBottom, borderTop: "1px", color: theme.palette.getContrastText(bgColorBottom), fontSize: sizePixels * 0.12, fontFamily: theme.typography.fontFamily, height: sizePixels * 0.25 }, { children: title }), void 0)] }), void 0) }), void 0));
+    var { error, format = '0[.]0a', color = 'primary', title, value, size, fontSize, rounded = false, autoWidth = false, style } = _a, props = __rest(_a, ["error", "format", "color", "title", "value", "size", "fontSize", "rounded", "autoWidth", "style"]);
+    const theme = material.useTheme();
+    const palette = color === 'inherit' ? undefined : theme.palette[color];
+    const bgColorTop = (_b = palette === null || palette === void 0 ? void 0 : palette.dark) !== null && _b !== void 0 ? _b : theme.palette.background.paper;
+    const bgColorBottom = (_c = palette === null || palette === void 0 ? void 0 : palette.main) !== null && _c !== void 0 ? _c : theme.palette.background.default;
+    const sizePixels = size === 'large' ? 96 : size === 'small' ? 64 : 80;
+    const calcFontSize = fontSize !== null && fontSize !== void 0 ? fontSize : sizePixels * 0.2;
+    return (jsxRuntime.jsx(ButtonEx, Object.assign({ size: size, padding: 0, style: Object.assign({ borderRadius: rounded ? theme.shape.borderRadius : 0, overflow: rounded ? 'hidden' : undefined }, style) }, props, { children: jsxRuntime.jsxs(FlexCol, Object.assign({ alignItems: "stretch", height: sizePixels, width: autoWidth ? '100%' : sizePixels, busy: value === undefined && !error }, { children: [jsxRuntime.jsx(FlexGrowRow, Object.assign({ bgcolor: bgColorTop, color: theme.palette.getContrastText(bgColorTop), fontSize: calcFontSize, fontFamily: "Source Code Pro,monospace", alignItems: "center", height: sizePixels * 0.75 }, { children: numeral__default["default"](value).format(format) }), void 0), jsxRuntime.jsx(FlexGrowRow, Object.assign({ bgcolor: bgColorBottom, borderTop: "1px", color: theme.palette.getContrastText(bgColorBottom), fontSize: sizePixels * 0.12, fontFamily: theme.typography.fontFamily, height: sizePixels * 0.25 }, { children: title }), void 0)] }), void 0) }), void 0));
+};
+
+const Portal = ({ children, className, el = 'div', target = 'body' }) => {
+    const [container] = react.useState(document.createElement(el));
+    if (className) {
+        container.classList.add(className);
+    }
+    react.useEffect(() => {
+        const targetElement = document.querySelector(target);
+        if (!targetElement) {
+            console.warn(`Unable to find target element: ${target}`);
+        }
+        targetElement === null || targetElement === void 0 ? void 0 : targetElement.appendChild(container);
+        return () => {
+            targetElement === null || targetElement === void 0 ? void 0 : targetElement.removeChild(container);
+        };
+    }, [container, target]);
+    return reactDom.createPortal(children, container);
 };
 
-var QuickTipButton = function (_a) {
-    var title = _a.title, children = _a.children, props = __rest(_a, ["title", "children"]);
-    var _b = __read(react.useState(false), 2), messageOpen = _b[0], setMessageOpen = _b[1];
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(material.IconButton, __assign({ onClick: function () { return setMessageOpen(true); }, size: "small" }, props, { children: jsxRuntime.jsx(ai.AiOutlineQuestionCircle, { size: 16 }, void 0) }), void 0), jsxRuntime.jsx(MessageDialog, __assign({ onOk: function () { return setMessageOpen(false); }, onCancel: function () { return setMessageOpen(false); }, onClose: function () { return setMessageOpen(false); }, open: messageOpen, title: title !== null && title !== void 0 ? title : '' }, { children: children }), void 0)] }, void 0));
+const QuickTipButton = (_a) => {
+    var { title, children } = _a, props = __rest(_a, ["title", "children"]);
+    const [messageOpen, setMessageOpen] = react.useState(false);
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(material.IconButton, Object.assign({ onClick: () => setMessageOpen(true), size: "small" }, props, { children: jsxRuntime.jsx(ai.AiOutlineQuestionCircle, { size: 16 }, void 0) }), void 0), jsxRuntime.jsx(MessageDialog, Object.assign({ onOk: () => setMessageOpen(false), onCancel: () => setMessageOpen(false), onClose: () => setMessageOpen(false), open: messageOpen, title: title !== null && title !== void 0 ? title : '' }, { children: children }), void 0)] }, void 0));
 };
 
-var RichResult = function (props) {
-    var thing = props.thing;
-    var thingWithContext = thing;
+const RichResult = (props) => {
+    const { thing } = props;
+    const thingWithContext = thing;
     thingWithContext['@context'] = 'https://schema.org';
-    return jsxRuntime.jsx("script", __assign({ type: "application/ld+json" }, { children: JSON.stringify(thingWithContext) }), void 0);
+    return jsxRuntime.jsx("script", Object.assign({ type: "application/ld+json" }, { children: JSON.stringify(thingWithContext) }), void 0);
 };
 
 exports.ActionStatusType = void 0;
@@ -2621,19 +2122,10 @@ exports.MapCategoryType = void 0;
     MapCategoryType["VenueMap"] = "VenueMap";
 })(exports.MapCategoryType || (exports.MapCategoryType = {}));
 
-// The point of this component it to return to the top of the page on any router navigate
-var ScrollToTop = function () {
-    var pathname = reactRouterDom.useLocation().pathname;
-    react.useEffect(function () {
-        window.scrollTo(0, 0);
-    }, [pathname]);
-    return null;
-};
-
 var img = "data:image/svg+xml,%3csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 238'%3e%3cdefs%3e%3cstyle%3e.cls-1%7bfill:%23999%3b%7d%3c/style%3e%3c/defs%3e%3ctitle%3eicon_gray%3c/title%3e%3cpath class='cls-1' d='M74.5%2c28.33%2c21.29%2c120.5%2c74.5%2c212.67H180.94l1.76-3%2c51.46-89.13L180.94%2c28.33ZM84.65%2c40.54h78.83L111.65%2c56.93a15.85%2c15.85%2c0%2c0%2c1%2c2%2c5l59.66-18.81L185.22%2c101a20.12%2c20.12%2c0%2c0%2c1%2c5.36-.78l-10-47.91%2c37.87%2c65.53h-7.62a24.21%2c24.21%2c0%2c0%2c1%2c.15%2c2.68%2c23.29%2c23.29%2c0%2c0%2c1-.15%2c2.68h7.62l-39.1%2c67.75%2c10.92-50.13A20.57%2c20.57%2c0%2c0%2c1%2c185%2c140l-12.88%2c59-58.37-19.53a17.61%2c17.61%2c0%2c0%2c1-1.7%2c5l47.5%2c15.92H84.65l4-6.85A20.17%2c20.17%2c0%2c0%2c1%2c83.93%2c191L80%2c197.78%2c42.67%2c133.13l37%2c32.66a20.52%2c20.52%2c0%2c0%2c1%2c3.6-4L36.69%2c120.66%2c85%2c77.79a17.45%2c17.45%2c0%2c0%2c1-3.19-4.32l-39.46%2c35L80%2c43.22l5.56%2c9.69A17.51%2c17.51%2c0%2c0%2c1%2c90.12%2c50Zm28.24%2c31.17a16.15%2c16.15%2c0%2c0%2c1-2.68%2c4.64l62%2c35.81a19.74%2c19.74%2c0%2c0%2c1%2c2.83-4.54Zm-20%2c10.51v75.33a18%2c18%2c0%2c0%2c1%2c2.47-.16%2c17.18%2c17.18%2c0%2c0%2c1%2c2.89.21v-75a11.21%2c11.21%2c0%2c0%2c1-1.29%2c0%2c17.57%2c17.57%2c0%2c0%2c1-4.07-.47Zm79.34%2c46.63-62.08%2c35.81a18.45%2c18.45%2c0%2c0%2c1%2c2.68%2c4.68l62.23-36a19.68%2c19.68%2c0%2c0%2c1-2.83-4.53Z'/%3e%3cpath class='cls-1' d='M97%2c48.58a17.06%2c17.06%2c0%2c1%2c0%2c17%2c17%2c17.08%2c17.08%2c0%2c0%2c0-17-17Zm0%2c5.36a11.7%2c11.7%2c0%2c1%2c1-11.7%2c11.69A11.65%2c11.65%2c0%2c0%2c1%2c97%2c53.94Z'/%3e%3cpath class='cls-1' d='M95.37%2c157.39a18.73%2c18.73%2c0%2c1%2c0%2c18.7%2c18.7%2c18.74%2c18.74%2c0%2c0%2c0-18.7-18.7Zm0%2c5.31A13.4%2c13.4%2c0%2c1%2c1%2c82%2c176.09a13.37%2c13.37%2c0%2c0%2c1%2c13.4-13.39Z'/%3e%3cpath class='cls-1' d='M190.73%2c100.2A20.3%2c20.3%2c0%2c1%2c0%2c211%2c120.5a20.34%2c20.34%2c0%2c0%2c0-20.3-20.3Zm0%2c5.36a14.94%2c14.94%2c0%2c1%2c1-14.94%2c14.94%2c14.88%2c14.88%2c0%2c0%2c1%2c14.94-14.94Z'/%3e%3c/svg%3e";
 
-var base10Shift = function (bn, places) {
-    var factor = new sdkJs.BigNumber(10).pow(new sdkJs.BigNumber(Math.abs(places)));
+const base10Shift = (bn, places) => {
+    const factor = new sdkJs.BigNumber(10).pow(new sdkJs.BigNumber(Math.abs(places)));
     if (places > 0) {
         return bn.mul(factor);
     }
@@ -2641,11 +2133,11 @@ var base10Shift = function (bn, places) {
         return bn.div(factor);
     }
 };
-var TokenAmount = function (_a) {
-    var _b = _a.textFontFamily, textFontFamily = _b === void 0 ? '"Source Code Pro",monospace' : _b, textColor = _a.textColor, statusColor = _a.statusColor, style = _a.style, amount = _a.amount, _c = _a.places, places = _c === void 0 ? -18 : _c, logo = _a.logo, label = _a.label, onButtonClick = _a.onButtonClick, props = __rest(_a, ["textFontFamily", "textColor", "statusColor", "style", "amount", "places", "logo", "label", "onButtonClick"]);
-    var adjustedAmount = amount ? base10Shift(amount, places).toNumber() : undefined;
-    var amountString = adjustedAmount ? Math.trunc(adjustedAmount).toLocaleString() : '-';
-    return (jsxRuntime.jsx(ButtonEx, __assign({ style: __assign({ backgroundColor: statusColor }, style), variant: "outlined", onClick: onButtonClick }, props, { children: jsxRuntime.jsxs(FlexRow, __assign({ justifyContent: "space-between", width: "100%", busy: amount === undefined, busySize: 16 }, { children: [jsxRuntime.jsxs(FlexRow, { children: [logo ? jsxRuntime.jsx("img", { src: img, height: 24 }, void 0) : null, label ? (jsxRuntime.jsx(material.Typography, __assign({ marginRight: 1, marginLeft: logo ? 1 : 0, noWrap: true, fontFamily: textFontFamily, variant: "caption" }, { children: label }), void 0)) : null] }, void 0), jsxRuntime.jsx(material.Typography, __assign({ color: textColor, noWrap: true, fontFamily: textFontFamily, variant: "body1", style: { textTransform: 'none' } }, { children: amountString }), void 0)] }), void 0) }), void 0));
+const TokenAmount = (_a) => {
+    var { textFontFamily = '"Source Code Pro",monospace', textColor, statusColor, style, amount, places = -18, logo, label, onButtonClick } = _a, props = __rest(_a, ["textFontFamily", "textColor", "statusColor", "style", "amount", "places", "logo", "label", "onButtonClick"]);
+    const adjustedAmount = amount ? base10Shift(amount, places).toNumber() : undefined;
+    const amountString = adjustedAmount ? Math.trunc(adjustedAmount).toLocaleString() : '-';
+    return (jsxRuntime.jsx(ButtonEx, Object.assign({ style: Object.assign({ backgroundColor: statusColor }, style), variant: "outlined", onClick: onButtonClick }, props, { children: jsxRuntime.jsxs(FlexRow, Object.assign({ justifyContent: "space-between", width: "100%", busy: amount === undefined, busySize: 16 }, { children: [jsxRuntime.jsxs(FlexRow, { children: [logo ? jsxRuntime.jsx("img", { src: img, height: 24 }, void 0) : null, label ? (jsxRuntime.jsx(material.Typography, Object.assign({ marginRight: 1, marginLeft: logo ? 1 : 0, noWrap: true, fontFamily: textFontFamily, variant: "caption" }, { children: label }), void 0)) : null] }, void 0), jsxRuntime.jsx(material.Typography, Object.assign({ color: textColor, noWrap: true, fontFamily: textFontFamily, variant: "body1", style: { textTransform: 'none' } }, { children: amountString }), void 0)] }), void 0) }), void 0));
 };
 
 Object.defineProperty(exports, 'useMediaQuery', {
@@ -2693,6 +2185,7 @@ exports.MessageDialog = MessageDialog;
 exports.NetworkSettingsContext = NetworkSettingsContext;
 exports.NetworkSettingsLoader = NetworkSettingsLoader;
 exports.NumberStatus = NumberStatus;
+exports.Portal = Portal;
 exports.QuickTipButton = QuickTipButton;
 exports.Rdt = Rdt;
 exports.RedditCustomEvent = RedditCustomEvent;