@athoscommerce/snap-preact 1.0.0

package/dist/cjs/src/Snap.js

@@ -0,0 +1,976 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(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);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["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 (g && (g = 0, op[0] && (_ = 0)), _) 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 };
+    }
+};
+var __spreadArray = (this && this.__spreadArray) || function (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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Snap = exports.STYLESHEET_CLASSNAME = exports.DEV_COOKIE = exports.BRANCH_PARAM = exports.BRANCH_COOKIE = void 0;
+var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
+var preact_1 = require("preact");
+var deepmerge_1 = __importDefault(require("deepmerge"));
+var is_plain_object_1 = require("is-plain-object");
+var mobx_1 = require("mobx");
+var snap_client_1 = require("@athoscommerce/snap-client");
+var snap_logger_1 = require("@athoscommerce/snap-logger");
+var snap_tracker_1 = require("@athoscommerce/snap-tracker");
+var snap_toolbox_1 = require("@athoscommerce/snap-toolbox");
+var snap_controller_1 = require("@athoscommerce/snap-controller");
+var getInitialUrlState_1 = require("./getInitialUrlState/getInitialUrlState");
+var createSearchController_1 = __importDefault(require("./create/createSearchController"));
+var utils_1 = require("./utils");
+var setupEvents_1 = require("./setupEvents");
+// configure MobX
+(0, mobx_1.configure)({ useProxies: 'never', isolateGlobalState: true, enforceActions: 'never' });
+exports.BRANCH_COOKIE = 'athosBranch';
+exports.BRANCH_PARAM = 'athos-preview';
+exports.DEV_COOKIE = 'athos-Dev';
+exports.STYLESHEET_CLASSNAME = 'athos-snap-bundle-styles';
+var MAX_PARENT_LEVELS = 3;
+var COMPONENT_ERROR = "Uncaught Error - Invalid value passed as the component.\nThis usually happens when you pass a JSX Element, and not a function that returns the component, in the snap config. \n\t\t\n\t\tinstead of - \n\n\ttargeters: [\n\t\t{\n\t\t\tselector: '#athos-content',\n\t\t\thideTarget: true,\n\t\t\tcomponent: <Content/>,\n\t\t},\n\t]\n\n\t\tor - \n\n\ttargeters: [\n\t\t{\n\t\t\tselector: '#athos-content',\n\t\t\thideTarget: true,\n\t\t\tcomponent: Content,\n\t\t},\n\t]\n\n\t\tplease try - \n\n\ttargeters: [\n\t\t{\n\t\t\tselector: '#athos-content',\n\t\t\thideTarget: true,\n\t\t\tcomponent: () => Content\n\t\t},\n\t]\n\nThe error above happened in the following targeter in the Snap Config";
+var Snap = /** @class */ (function () {
+    function Snap(config, services) {
+        var _this = this;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
+        this.mode = snap_toolbox_1.AppMode.production;
+        this._instantiatorPromises = {};
+        this._controllerPromises = {};
+        this.controllers = {};
+        this.getInstantiator = function (id) {
+            return _this._instantiatorPromises[id] || Promise.reject("getInstantiator could not find instantiator with id: ".concat(id));
+        };
+        this.getController = function (id) {
+            return _this._controllerPromises[id] || Promise.reject("getController could not find controller with id: ".concat(id));
+        };
+        this.getControllers = function () {
+            var controllerIds = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+                controllerIds[_i] = arguments[_i];
+            }
+            var getControllerPromises = [];
+            controllerIds.forEach(function (id) { return getControllerPromises.push(_this.getController(id)); });
+            return Promise.all(getControllerPromises);
+        };
+        // exposed method used for creating controllers dynamically - calls _createController()
+        this.createController = function (type, config, services, urlConfig, context, callback) { return __awaiter(_this, void 0, void 0, function () {
+            var _this = this;
+            return __generator(this, function (_a) {
+                if (typeof this._controllerPromises[config.id] != 'undefined') {
+                    throw new Error("Controller with id '".concat(config.id, "' is already defined"));
+                }
+                this._controllerPromises[config.id] = new Promise(function (resolve) {
+                    return _this._createController(type, config, services, urlConfig, context, function (cntrlr) { return __awaiter(_this, void 0, void 0, function () {
+                        return __generator(this, function (_a) {
+                            switch (_a.label) {
+                                case 0:
+                                    if (!(typeof callback == 'function')) return [3 /*break*/, 2];
+                                    return [4 /*yield*/, callback(cntrlr)];
+                                case 1:
+                                    _a.sent();
+                                    _a.label = 2;
+                                case 2:
+                                    resolve(cntrlr);
+                                    return [2 /*return*/];
+                            }
+                        });
+                    }); });
+                });
+                return [2 /*return*/, this._controllerPromises[config.id]];
+            });
+        }); };
+        // internal use method that creates controllers without verifying if id is in use first
+        this._createController = function (type, config, services, urlConfig, context, callback) { return __awaiter(_this, void 0, void 0, function () {
+            var importPromise, creationFunc;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        switch (type) {
+                            case snap_controller_1.ControllerTypes.autocomplete:
+                                importPromise = Promise.resolve().then(function () { return __importStar(require('./create/createAutocompleteController')); });
+                                break;
+                            case snap_controller_1.ControllerTypes.finder:
+                                importPromise = Promise.resolve().then(function () { return __importStar(require('./create/createFinderController')); });
+                                break;
+                            case snap_controller_1.ControllerTypes.recommendation:
+                                importPromise = Promise.resolve().then(function () { return __importStar(require('./create/createRecommendationController')); });
+                                break;
+                            case snap_controller_1.ControllerTypes.search:
+                            default:
+                                importPromise = Promise.resolve().then(function () { return __importStar(require('./create/createSearchController')); });
+                                break;
+                        }
+                        return [4 /*yield*/, importPromise];
+                    case 1:
+                        creationFunc = (_a.sent()).default;
+                        if (!this.controllers[config.id]) {
+                            window.athos.controller = window.athos.controller || {};
+                            window.athos.controller[config.id] = this.controllers[config.id] = creationFunc({
+                                mode: this.mode,
+                                url: (0, deepmerge_1.default)(this.config.url || {}, urlConfig || {}),
+                                controller: config,
+                                context: (0, deepmerge_1.default)(this.context || {}, context || {}),
+                            }, {
+                                client: (services === null || services === void 0 ? void 0 : services.client) || this.client,
+                                store: services === null || services === void 0 ? void 0 : services.store,
+                                urlManager: services === null || services === void 0 ? void 0 : services.urlManager,
+                                eventManager: services === null || services === void 0 ? void 0 : services.eventManager,
+                                profiler: services === null || services === void 0 ? void 0 : services.profiler,
+                                logger: services === null || services === void 0 ? void 0 : services.logger,
+                                tracker: (services === null || services === void 0 ? void 0 : services.tracker) || this.tracker,
+                            });
+                        }
+                        if (!callback) return [3 /*break*/, 3];
+                        return [4 /*yield*/, callback(this.controllers[config.id])];
+                    case 2:
+                        _a.sent();
+                        _a.label = 3;
+                    case 3: return [2 /*return*/, this.controllers[config.id]];
+                }
+            });
+        }); };
+        this.handlers = {
+            attributes: function (event) {
+                var trackerId = _this.tracker.config.id;
+                var attributeList = [
+                    "ss-".concat(trackerId, "-cart-add"),
+                    "ss-".concat(trackerId, "-cart-remove"),
+                    "ss-".concat(trackerId, "-cart-clear"),
+                    "ss-".concat(trackerId, "-cart-view"),
+                    "ss-".concat(trackerId, "-intellisuggest"),
+                    "ss-".concat(trackerId, "-intellisuggest-signature"),
+                    "href",
+                ];
+                var attributes = {};
+                var levels = 0;
+                var elem = null;
+                elem = event && event.target;
+                while (Object.keys(attributes).length == 0 && elem !== null && levels <= MAX_PARENT_LEVELS) {
+                    Object.values(elem.attributes).forEach(function (attr) {
+                        var attrName = attr.nodeName;
+                        if (attributeList.indexOf(attrName) != -1) {
+                            attributes[attrName] = elem && elem.getAttribute(attrName);
+                        }
+                    });
+                    elem = elem.parentElement;
+                    levels++;
+                }
+                if (attributes["ss-".concat(trackerId, "-cart-add")]) {
+                    // add skus to cart
+                    var skus = attributes["ss-".concat(trackerId, "-cart-add")].split(',');
+                    _this.tracker.cookies.cart.add(skus);
+                    _this.eventManager.fire('controller/recommendation/update');
+                }
+                else if (attributes["ss-".concat(trackerId, "-cart-remove")]) {
+                    // remove skus from cart
+                    var skus = attributes["ss-".concat(trackerId, "-cart-remove")].split(',');
+                    _this.tracker.cookies.cart.remove(skus);
+                    _this.eventManager.fire('controller/recommendation/update');
+                }
+                else if ("ss-".concat(trackerId, "-cart-clear") in attributes) {
+                    // clear all from cart
+                    _this.tracker.cookies.cart.clear();
+                    _this.eventManager.fire('controller/recommendation/update');
+                }
+                else if ("ss-".concat(trackerId, "-cart-view") in attributes) {
+                    // update recs
+                    _this.eventManager.fire('controller/recommendation/update');
+                }
+                else if (attributes["ss-".concat(trackerId, "-intellisuggest")] && attributes["ss-".concat(trackerId, "-intellisuggest-signature")]) {
+                    // product click is deprecated
+                    _this.tracker.track.product.click();
+                }
+            },
+            error: function (event) {
+                try {
+                    var filename = event.filename;
+                    if ((filename.includes('snapui.searchspring.io') || filename.includes('snapui.athoscommerce.io')) &&
+                        filename.endsWith('.js') &&
+                        _this.tracker.track.error) {
+                        var colno = event.colno, lineno = event.lineno, stack = event.error.stack, message = event.message, timeStamp = event.timeStamp;
+                        var href = window.location.href;
+                        var beaconPayload = {
+                            href: href,
+                            filename: filename,
+                            stack: stack,
+                            message: message,
+                            colno: colno,
+                            lineno: lineno,
+                            errortimestamp: timeStamp,
+                        };
+                        _this.tracker.track.error(beaconPayload);
+                    }
+                }
+                catch (e) {
+                    // prevent error metrics from breaking the app
+                }
+            },
+        };
+        window.removeEventListener('error', this.handlers.error);
+        window.addEventListener('error', this.handlers.error);
+        document.removeEventListener('click', this.handlers.attributes);
+        document.addEventListener('click', this.handlers.attributes);
+        this.config = config;
+        var globalContext = {};
+        try {
+            // get global context
+            globalContext = (0, snap_toolbox_1.getContext)(['shopper', 'config', 'custom', 'merchandising', 'siteId', 'currency', 'page']);
+        }
+        catch (err) {
+            console.error('Snap failed to find global context');
+        }
+        // merge configs - but only merge plain objects
+        this.config = (0, deepmerge_1.default)(this.config || {}, globalContext.config || {}, {
+            isMergeableObject: is_plain_object_1.isPlainObject,
+        });
+        this.context = (0, deepmerge_1.default)(this.config.context || {}, globalContext || {}, {
+            isMergeableObject: is_plain_object_1.isPlainObject,
+        });
+        if (!((_c = (_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.client) === null || _b === void 0 ? void 0 : _b.globals) === null || _c === void 0 ? void 0 : _c.siteId) && this.context.siteId) {
+            var defaultClientConfig = {
+                globals: {
+                    siteId: this.context.siteId,
+                },
+            };
+            this.config.client = (0, deepmerge_1.default)(defaultClientConfig, this.config.client || {});
+        }
+        if ((!(services === null || services === void 0 ? void 0 : services.client) || !(services === null || services === void 0 ? void 0 : services.tracker)) && !((_f = (_e = (_d = this.config) === null || _d === void 0 ? void 0 : _d.client) === null || _e === void 0 ? void 0 : _e.globals) === null || _f === void 0 ? void 0 : _f.siteId)) {
+            //error msg should change depending if this is a snap templates site or not.
+            if (services === null || services === void 0 ? void 0 : services.templatesStore) {
+                throw new Error("SnapTemplates: config provided must contain a valid config.siteId value");
+            }
+            else {
+                throw new Error("Snap: config provided must contain a valid config.client.globals.siteId value");
+            }
+        }
+        // segmented merchandising context -> client globals
+        if (((_g = this.config.client) === null || _g === void 0 ? void 0 : _g.globals) && ((_h = this.context.merchandising) === null || _h === void 0 ? void 0 : _h.segments)) {
+            if ((_j = this.config.client.globals) === null || _j === void 0 ? void 0 : _j.merchandising) {
+                this.config.client.globals.merchandising.segments = (0, deepmerge_1.default)(this.config.client.globals.merchandising.segments, this.context.merchandising.segments);
+            }
+            else {
+                this.config.client.globals.merchandising = {
+                    segments: this.context.merchandising.segments,
+                };
+            }
+        }
+        if (services === null || services === void 0 ? void 0 : services.templatesStore) {
+            this.templates = services.templatesStore;
+        }
+        try {
+            var urlParams = (0, snap_toolbox_1.url)(window.location.href);
+            var branchOverride_1 = ((_k = urlParams === null || urlParams === void 0 ? void 0 : urlParams.params) === null || _k === void 0 ? void 0 : _k.query[exports.BRANCH_PARAM]) || snap_toolbox_1.cookies.get(exports.BRANCH_COOKIE);
+            var cookieDomain_1 = (typeof window !== 'undefined' && window.location.hostname && '.' + window.location.hostname.replace(/^www\./, '')) || undefined;
+            /* app mode priority:
+                1. node env
+                2. config
+                3. override via query param / cookie
+            */
+            // node env
+            if (process.env.NODE_ENV && Object.values(snap_toolbox_1.AppMode).includes(process.env.NODE_ENV)) {
+                this.mode = process.env.NODE_ENV;
+            }
+            // config
+            if (this.config.mode && Object.values(snap_toolbox_1.AppMode).includes(this.config.mode)) {
+                this.mode = this.config.mode;
+            }
+            // query param / cookie override
+            if ((((_l = urlParams === null || urlParams === void 0 ? void 0 : urlParams.params) === null || _l === void 0 ? void 0 : _l.query) && 'dev' in urlParams.params.query) || !!snap_toolbox_1.cookies.get(exports.DEV_COOKIE)) {
+                if (((_m = urlParams === null || urlParams === void 0 ? void 0 : urlParams.params.query) === null || _m === void 0 ? void 0 : _m.dev) == 'false' || ((_o = urlParams === null || urlParams === void 0 ? void 0 : urlParams.params.query) === null || _o === void 0 ? void 0 : _o.dev) == '0') {
+                    snap_toolbox_1.cookies.unset(exports.DEV_COOKIE, cookieDomain_1);
+                    this.mode = snap_toolbox_1.AppMode.production;
+                }
+                else {
+                    snap_toolbox_1.cookies.set(exports.DEV_COOKIE, '1', 'Lax', 0, cookieDomain_1);
+                    this.mode = snap_toolbox_1.AppMode.development;
+                }
+            }
+            // client mode uses client config over snap config
+            if (this.config.client) {
+                this.config.client.config = this.config.client.config || {};
+                this.config.client.config.initiator = "snap/preact/".concat(snap_toolbox_1.version);
+                this.config.client.config.mode = this.config.client.config.mode || this.mode;
+            }
+            // feature check block
+            (0, utils_1.configureSnapFeatures)(this.config);
+            this.client = (services === null || services === void 0 ? void 0 : services.client) || new snap_client_1.Client(this.config.client.globals, this.config.client.config);
+            this.logger = (services === null || services === void 0 ? void 0 : services.logger) || new snap_logger_1.Logger({ prefix: 'Snap Preact ', mode: this.mode });
+            // create tracker
+            var trackerGlobals = ((_p = this.config.tracker) === null || _p === void 0 ? void 0 : _p.globals) || this.config.client.globals;
+            if ((_q = this.context.currency) === null || _q === void 0 ? void 0 : _q.code) {
+                trackerGlobals = (0, deepmerge_1.default)(trackerGlobals || {}, {
+                    currency: this.context.currency,
+                });
+            }
+            if ((_r = this.context.shopper) === null || _r === void 0 ? void 0 : _r.cart) {
+                trackerGlobals = (0, deepmerge_1.default)(trackerGlobals || {}, {
+                    cart: this.context.shopper.cart,
+                });
+            }
+            var initiatorPrefix = ((_s = window === null || window === void 0 ? void 0 : window.athos) === null || _s === void 0 ? void 0 : _s.managed) ? "managed/" : '';
+            var trackerConfig = (0, deepmerge_1.default)(((_t = this.config.tracker) === null || _t === void 0 ? void 0 : _t.config) || {}, { framework: "".concat(initiatorPrefix, "snap/preact"), mode: this.mode });
+            this.tracker = (services === null || services === void 0 ? void 0 : services.tracker) || new snap_tracker_1.Tracker(trackerGlobals, trackerConfig);
+            // log version
+            this.logger.imageText({
+                url: 'https://snapui.athoscommerce.io/favicon.svg',
+                text: "[".concat(snap_toolbox_1.version, "]"),
+                style: "color: ".concat(this.logger.colors.indigo, "; font-weight: bold;"),
+            });
+            // handle branch override
+            if (branchOverride_1 && !document.querySelector("script[".concat(exports.BRANCH_COOKIE, "]"))) {
+                this.logger.warn(":: loading branch override ~ '".concat(branchOverride_1, "' ..."));
+                // set a cookie with branch
+                if (snap_toolbox_1.featureFlags.cookies) {
+                    snap_toolbox_1.cookies.set(exports.BRANCH_COOKIE, branchOverride_1, 'Lax', 3600000, cookieDomain_1); // 1 hour
+                }
+                else {
+                    this.logger.warn('Cookies are not supported/enabled by this browser, branch overrides will not persist!');
+                }
+                // get the path and siteId from the current bundle script in case its not the same as the client config
+                var path = "https://snapui.athoscommerce.io/".concat((_v = (_u = this.config.client) === null || _u === void 0 ? void 0 : _u.globals) === null || _v === void 0 ? void 0 : _v.siteId, "/");
+                var script = document.querySelector('script[src*="//snapui.searchspring.io"], script[src*="//snapui.athoscommerce.io"]');
+                if (script) {
+                    var scriptRoot = script.getAttribute('src').match(/\/\/snapui.searchspring.io\/[a-zA-Z0-9]{6}\//);
+                    if (scriptRoot) {
+                        path = scriptRoot.toString();
+                    }
+                    else {
+                        scriptRoot = script.getAttribute('src').match(/\/\/snapui.athoscommerce.io\/[a-zA-Z0-9]{6}\//);
+                        if (scriptRoot) {
+                            path = scriptRoot.toString();
+                        }
+                    }
+                }
+                // append script with new branch in path
+                var branchScript_1 = document.createElement('script');
+                var src_1 = "".concat(path).concat(branchOverride_1, "/bundle.js");
+                branchScript_1.src = src_1;
+                branchScript_1.setAttribute(exports.BRANCH_COOKIE, branchOverride_1);
+                new snap_toolbox_1.DomTargeter([
+                    {
+                        selector: 'body',
+                        inject: {
+                            action: 'append', // before, after, append, prepend
+                            element: function () {
+                                var branchContainer = document.createElement('div');
+                                branchContainer.id = 'athos-branch-override';
+                                return branchContainer;
+                            },
+                        },
+                    },
+                ], function (target, elem) { return __awaiter(_this, void 0, void 0, function () {
+                    var props, getBundleDetails, _a, err_1, BranchOverride;
+                    return __generator(this, function (_b) {
+                        switch (_b.label) {
+                            case 0:
+                                props = {};
+                                _b.label = 1;
+                            case 1:
+                                _b.trys.push([1, 4, , 5]);
+                                return [4 /*yield*/, Promise.resolve().then(function () { return __importStar(require('./getBundleDetails/getBundleDetails')); })];
+                            case 2:
+                                getBundleDetails = (_b.sent()).getBundleDetails;
+                                _a = props;
+                                return [4 /*yield*/, getBundleDetails(src_1)];
+                            case 3:
+                                _a.details = _b.sent();
+                                return [3 /*break*/, 5];
+                            case 4:
+                                err_1 = _b.sent();
+                                props.error = err_1;
+                                return [3 /*break*/, 5];
+                            case 5: return [4 /*yield*/, Promise.resolve().then(function () { return __importStar(require('../components/src/components/Organisms/BranchOverride')); })];
+                            case 6:
+                                BranchOverride = (_b.sent()).BranchOverride;
+                                (0, preact_1.render)((0, jsx_runtime_1.jsx)(BranchOverride, __assign({}, props, { branch: branchOverride_1, onRemoveClick: function () {
+                                        snap_toolbox_1.cookies.unset(exports.BRANCH_COOKIE, cookieDomain_1);
+                                        var urlState = (0, snap_toolbox_1.url)(window.location.href);
+                                        urlState === null || urlState === void 0 ? true : delete urlState.params.query[exports.BRANCH_PARAM];
+                                        var newUrl = urlState === null || urlState === void 0 ? void 0 : urlState.url();
+                                        if (newUrl && newUrl != window.location.href) {
+                                            window.location.href = newUrl;
+                                        }
+                                        else {
+                                            window.location.reload();
+                                        }
+                                    } })), elem);
+                                // reset the global athos object
+                                try {
+                                    delete window.athos;
+                                }
+                                catch (e) {
+                                    window.athos = undefined;
+                                }
+                                document.head.appendChild(branchScript_1);
+                                return [2 /*return*/];
+                        }
+                    });
+                }); });
+                // remove snap bundle styles
+                document.querySelectorAll(".".concat(exports.STYLESHEET_CLASSNAME)).forEach(function (el) { return el.remove(); });
+                // prevent further instantiation of config
+                throw 'branch override';
+            }
+        }
+        catch (e) {
+            if (e == 'branch override') {
+                throw "".concat(this.logger.emoji.bang, " Snap instantiation halted - using branch override.");
+            }
+            this.logger.error(e);
+        }
+        // bind to window global
+        window.athos = window.athos || {};
+        window.athos.build = window.athos.build || 'modern';
+        window.athos.context = this.context;
+        if (this.client)
+            window.athos.client = this.client;
+        if (services === null || services === void 0 ? void 0 : services.templatesStore)
+            window.athos.templates = this.templates;
+        this.eventManager = (0, setupEvents_1.setupEvents)();
+        if (this.eventManager) {
+            window.athos.on = function (event) {
+                var _a;
+                var func = [];
+                for (var _i = 1; _i < arguments.length; _i++) {
+                    func[_i - 1] = arguments[_i];
+                }
+                (_a = _this.eventManager).on.apply(_a, __spreadArray([event], func, false));
+            };
+            window.athos.fire = function (event) {
+                var _a;
+                var func = [];
+                for (var _i = 1; _i < arguments.length; _i++) {
+                    func[_i - 1] = arguments[_i];
+                }
+                (_a = _this.eventManager).fire.apply(_a, __spreadArray([event], func, false));
+            };
+        }
+        // autotrack shopper id from the context
+        if ((_x = (_w = this.context) === null || _w === void 0 ? void 0 : _w.shopper) === null || _x === void 0 ? void 0 : _x.id) {
+            this.tracker.track.shopper.login({
+                id: this.context.shopper.id,
+            });
+        }
+        // create controllers
+        Object.keys(((_y = this.config) === null || _y === void 0 ? void 0 : _y.controllers) || {}).forEach(function (type) {
+            switch (type) {
+                case 'search': {
+                    _this.config.controllers[type].forEach(function (controller, index) {
+                        var _a, _b, _c, _d, _e, _f, _g, _h;
+                        try {
+                            if (typeof _this._controllerPromises[controller.config.id] != 'undefined') {
+                                _this.logger.error("Controller with id '".concat(controller.config.id, "' is already defined"));
+                                return;
+                            }
+                            var cntrlr_1 = (0, createSearchController_1.default)({
+                                mode: _this.mode,
+                                url: (0, deepmerge_1.default)(_this.config.url || {}, controller.url || {}),
+                                controller: controller.config,
+                                context: (0, deepmerge_1.default)(_this.context || {}, controller.context || {}),
+                            }, {
+                                client: ((_a = controller.services) === null || _a === void 0 ? void 0 : _a.client) || _this.client,
+                                store: (_b = controller.services) === null || _b === void 0 ? void 0 : _b.store,
+                                urlManager: (_c = controller.services) === null || _c === void 0 ? void 0 : _c.urlManager,
+                                eventManager: (_d = controller.services) === null || _d === void 0 ? void 0 : _d.eventManager,
+                                profiler: (_e = controller.services) === null || _e === void 0 ? void 0 : _e.profiler,
+                                logger: (_f = controller.services) === null || _f === void 0 ? void 0 : _f.logger,
+                                tracker: ((_g = controller.services) === null || _g === void 0 ? void 0 : _g.tracker) || _this.tracker,
+                            });
+                            window.athos.controller = window.athos.controller || {};
+                            window.athos.controller[cntrlr_1.config.id] = _this.controllers[cntrlr_1.config.id] = cntrlr_1;
+                            _this._controllerPromises[cntrlr_1.config.id] = new Promise(function (resolve) { return resolve(cntrlr_1); });
+                            var searchPromise_1 = null;
+                            var runSearch_1 = function () { return __awaiter(_this, void 0, void 0, function () {
+                                var _a;
+                                return __generator(this, function (_b) {
+                                    if (!searchPromise_1) {
+                                        // handle custom initial UrlManager state
+                                        if ((_a = controller.url) === null || _a === void 0 ? void 0 : _a.initial) {
+                                            (0, getInitialUrlState_1.getInitialUrlState)(controller.url.initial, cntrlr_1.urlManager).go({ history: 'replace' });
+                                        }
+                                        searchPromise_1 = this.controllers[controller.config.id].search();
+                                    }
+                                    return [2 /*return*/, searchPromise_1];
+                                });
+                            }); };
+                            var targetFunction_1 = function (target, elem, originalElem) { return __awaiter(_this, void 0, void 0, function () {
+                                var targetFunctionPromises, onTarget, _a, _b, _1, Component_1, err_2;
+                                var _this = this;
+                                return __generator(this, function (_c) {
+                                    switch (_c.label) {
+                                        case 0:
+                                            targetFunctionPromises = [];
+                                            if (target.renderAfterSearch) {
+                                                targetFunctionPromises.push(runSearch_1());
+                                            }
+                                            else {
+                                                targetFunctionPromises.push(Promise.resolve());
+                                                runSearch_1();
+                                            }
+                                            onTarget = target.onTarget;
+                                            _a = onTarget;
+                                            if (!_a) return [3 /*break*/, 2];
+                                            return [4 /*yield*/, onTarget(target, elem, originalElem)];
+                                        case 1:
+                                            _a = (_c.sent());
+                                            _c.label = 2;
+                                        case 2:
+                                            _a;
+                                            _c.label = 3;
+                                        case 3:
+                                            _c.trys.push([3, 5, , 6]);
+                                            targetFunctionPromises.push(target.component());
+                                            return [4 /*yield*/, Promise.all(targetFunctionPromises)];
+                                        case 4:
+                                            _b = _c.sent(), _1 = _b[0], Component_1 = _b[1];
+                                            setTimeout(function () {
+                                                (0, preact_1.render)((0, jsx_runtime_1.jsx)(Component_1, __assign({ controller: _this.controllers[controller.config.id], snap: _this }, target.props)), elem);
+                                            });
+                                            return [3 /*break*/, 6];
+                                        case 5:
+                                            err_2 = _c.sent();
+                                            this.logger.error(err_2);
+                                            this.logger.error(COMPONENT_ERROR, target);
+                                            return [3 /*break*/, 6];
+                                        case 6: return [2 /*return*/];
+                                    }
+                                });
+                            }); };
+                            (_h = controller === null || controller === void 0 ? void 0 : controller.targeters) === null || _h === void 0 ? void 0 : _h.forEach(function (target, target_index) {
+                                if (!target.selector) {
+                                    throw new Error("Targets at index ".concat(target_index, " missing selector value (string)."));
+                                }
+                                if (!target.component) {
+                                    throw new Error("Targets at index ".concat(target_index, " missing component value (Component)."));
+                                }
+                                var contextPage = _this.context.pageType && "".concat(_this.context.pageType).toLowerCase().trim();
+                                if (target.prefetch || ['search', 'category'].includes(contextPage)) {
+                                    runSearch_1();
+                                    target.component();
+                                }
+                                cntrlr_1.createTargeter(__assign({ controller: cntrlr_1 }, target), function (target, elem, originalElem) { return __awaiter(_this, void 0, void 0, function () {
+                                    var Skeleton_1;
+                                    return __generator(this, function (_a) {
+                                        switch (_a.label) {
+                                            case 0:
+                                                if (!(target && target.skeleton && elem)) return [3 /*break*/, 2];
+                                                return [4 /*yield*/, target.skeleton()];
+                                            case 1:
+                                                Skeleton_1 = _a.sent();
+                                                setTimeout(function () {
+                                                    (0, preact_1.render)((0, jsx_runtime_1.jsx)(Skeleton_1, {}), elem);
+                                                });
+                                                _a.label = 2;
+                                            case 2: return [4 /*yield*/, targetFunction_1(target, elem, originalElem)];
+                                            case 3:
+                                                _a.sent();
+                                                return [2 /*return*/];
+                                        }
+                                    });
+                                }); });
+                            });
+                        }
+                        catch (err) {
+                            _this.logger.error("Failed to instantiate ".concat(type, " controller at index ").concat(index, "."), err);
+                        }
+                    });
+                    break;
+                }
+                case 'autocomplete': {
+                    _this.config.controllers[type].forEach(function (controller, index) {
+                        if (typeof _this._controllerPromises[controller.config.id] != 'undefined') {
+                            _this.logger.error("Controller with id '".concat(controller.config.id, "' is already defined"));
+                            return;
+                        }
+                        _this._controllerPromises[controller.config.id] = new Promise(function (resolve) { return __awaiter(_this, void 0, void 0, function () {
+                            var bound_1, runBind_1, targetFunction_2, err_3;
+                            var _this = this;
+                            var _a;
+                            return __generator(this, function (_b) {
+                                switch (_b.label) {
+                                    case 0:
+                                        _b.trys.push([0, 3, , 4]);
+                                        bound_1 = false;
+                                        runBind_1 = function () {
+                                            if (!bound_1) {
+                                                bound_1 = true;
+                                                setTimeout(function () {
+                                                    _this.controllers[controller.config.id].bind();
+                                                });
+                                            }
+                                        };
+                                        targetFunction_2 = function (target, elem, originalElem) { return __awaiter(_this, void 0, void 0, function () {
+                                            var onTarget, _a, importPromises, importResolutions, Component_2, err_4;
+                                            var _this = this;
+                                            return __generator(this, function (_b) {
+                                                switch (_b.label) {
+                                                    case 0:
+                                                        onTarget = target.onTarget;
+                                                        _a = onTarget;
+                                                        if (!_a) return [3 /*break*/, 2];
+                                                        return [4 /*yield*/, onTarget(target, elem, originalElem)];
+                                                    case 1:
+                                                        _a = (_b.sent());
+                                                        _b.label = 2;
+                                                    case 2:
+                                                        _a;
+                                                        _b.label = 3;
+                                                    case 3:
+                                                        _b.trys.push([3, 5, , 6]);
+                                                        importPromises = [];
+                                                        // dynamically import the component
+                                                        importPromises.push(target.component());
+                                                        return [4 /*yield*/, Promise.all(importPromises)];
+                                                    case 4:
+                                                        importResolutions = _b.sent();
+                                                        Component_2 = importResolutions[0];
+                                                        setTimeout(function () {
+                                                            (0, preact_1.render)((0, jsx_runtime_1.jsx)(Component_2, __assign({ controller: _this.controllers[controller.config.id], input: originalElem, snap: _this }, target.props)), elem);
+                                                        });
+                                                        return [3 /*break*/, 6];
+                                                    case 5:
+                                                        err_4 = _b.sent();
+                                                        this.logger.error(err_4);
+                                                        this.logger.error(COMPONENT_ERROR, target);
+                                                        return [3 /*break*/, 6];
+                                                    case 6: return [2 /*return*/];
+                                                }
+                                            });
+                                        }); };
+                                        if (!(!(controller === null || controller === void 0 ? void 0 : controller.targeters) || (controller === null || controller === void 0 ? void 0 : controller.targeters.length) === 0)) return [3 /*break*/, 2];
+                                        return [4 /*yield*/, this._createController(snap_controller_1.ControllerTypes.autocomplete, controller.config, controller.services, controller.url, controller.context, function (cntrlr) {
+                                                if (cntrlr)
+                                                    resolve(cntrlr);
+                                            })];
+                                    case 1:
+                                        _b.sent();
+                                        runBind_1();
+                                        _b.label = 2;
+                                    case 2:
+                                        (_a = controller === null || controller === void 0 ? void 0 : controller.targeters) === null || _a === void 0 ? void 0 : _a.forEach(function (target, target_index) {
+                                            if (!target.selector) {
+                                                throw new Error("Targets at index ".concat(target_index, " missing selector value (string)."));
+                                            }
+                                            if (!target.component) {
+                                                throw new Error("Targets at index ".concat(target_index, " missing component value (Component)."));
+                                            }
+                                            var targeter = new snap_toolbox_1.DomTargeter([
+                                                __assign({ inject: {
+                                                        action: 'after', // before, after, append, prepend
+                                                        element: function () {
+                                                            var acContainer = document.createElement('div');
+                                                            acContainer.className = 'ss__autocomplete--target';
+                                                            acContainer.addEventListener('click', function (e) {
+                                                                e.stopPropagation();
+                                                            });
+                                                            return acContainer;
+                                                        },
+                                                    } }, target),
+                                            ], function (target, elem, originalElem) { return __awaiter(_this, void 0, void 0, function () {
+                                                var cntrlr;
+                                                return __generator(this, function (_a) {
+                                                    switch (_a.label) {
+                                                        case 0: return [4 /*yield*/, this._createController(snap_controller_1.ControllerTypes.autocomplete, controller.config, controller.services, controller.url, controller.context, function (cntrlr) {
+                                                                if (cntrlr)
+                                                                    resolve(cntrlr);
+                                                            })];
+                                                        case 1:
+                                                            cntrlr = _a.sent();
+                                                            runBind_1();
+                                                            targetFunction_2(__assign({ controller: cntrlr }, target), elem, originalElem);
+                                                            cntrlr.addTargeter(targeter);
+                                                            return [2 /*return*/];
+                                                    }
+                                                });
+                                            }); });
+                                        });
+                                        return [3 /*break*/, 4];
+                                    case 3:
+                                        err_3 = _b.sent();
+                                        this.logger.error("Failed to instantiate ".concat(type, " controller at index ").concat(index, "."), err_3);
+                                        return [3 /*break*/, 4];
+                                    case 4: return [2 /*return*/];
+                                }
+                            });
+                        }); });
+                    });
+                    break;
+                }
+                case 'finder': {
+                    _this.config.controllers[type].forEach(function (controller, index) {
+                        if (typeof _this._controllerPromises[controller.config.id] != 'undefined') {
+                            _this.logger.error("Controller with id '".concat(controller.config.id, "' is already defined"));
+                            return;
+                        }
+                        _this._controllerPromises[controller.config.id] = new Promise(function (resolve) {
+                            var _a;
+                            try {
+                                var searched_1 = false;
+                                var runSearch_2 = function () {
+                                    if (!searched_1) {
+                                        _this.controllers[controller.config.id].search();
+                                        searched_1 = true;
+                                    }
+                                };
+                                var targetFunction_3 = function (target, elem, originalElem) { return __awaiter(_this, void 0, void 0, function () {
+                                    var onTarget, _a, Component_3, err_5;
+                                    var _this = this;
+                                    return __generator(this, function (_b) {
+                                        switch (_b.label) {
+                                            case 0:
+                                                onTarget = target.onTarget;
+                                                _a = onTarget;
+                                                if (!_a) return [3 /*break*/, 2];
+                                                return [4 /*yield*/, onTarget(target, elem, originalElem)];
+                                            case 1:
+                                                _a = (_b.sent());
+                                                _b.label = 2;
+                                            case 2:
+                                                _a;
+                                                _b.label = 3;
+                                            case 3:
+                                                _b.trys.push([3, 5, , 6]);
+                                                return [4 /*yield*/, target.component()];
+                                            case 4:
+                                                Component_3 = _b.sent();
+                                                setTimeout(function () {
+                                                    (0, preact_1.render)((0, jsx_runtime_1.jsx)(Component_3, __assign({ controller: _this.controllers[controller.config.id], snap: _this }, target.props)), elem);
+                                                });
+                                                return [3 /*break*/, 6];
+                                            case 5:
+                                                err_5 = _b.sent();
+                                                this.logger.error(err_5);
+                                                this.logger.error(COMPONENT_ERROR, target);
+                                                return [3 /*break*/, 6];
+                                            case 6: return [2 /*return*/];
+                                        }
+                                    });
+                                }); };
+                                if (!(controller === null || controller === void 0 ? void 0 : controller.targeters) || (controller === null || controller === void 0 ? void 0 : controller.targeters.length) === 0) {
+                                    _this._createController(snap_controller_1.ControllerTypes.finder, controller.config, controller.services, controller.url, controller.context, function (cntrlr) {
+                                        if (cntrlr)
+                                            resolve(cntrlr);
+                                    });
+                                }
+                                (_a = controller === null || controller === void 0 ? void 0 : controller.targeters) === null || _a === void 0 ? void 0 : _a.forEach(function (target, target_index) {
+                                    if (!target.selector) {
+                                        throw new Error("Targets at index ".concat(target_index, " missing selector value (string)."));
+                                    }
+                                    if (!target.component) {
+                                        throw new Error("Targets at index ".concat(target_index, " missing component value (Component)."));
+                                    }
+                                    var targeter = new snap_toolbox_1.DomTargeter([__assign({}, target)], function (target, elem, originalElem) { return __awaiter(_this, void 0, void 0, function () {
+                                        var cntrlr;
+                                        return __generator(this, function (_a) {
+                                            switch (_a.label) {
+                                                case 0: return [4 /*yield*/, this._createController(snap_controller_1.ControllerTypes.finder, controller.config, controller.services, controller.url, controller.context, function (cntrlr) {
+                                                        if (cntrlr)
+                                                            resolve(cntrlr);
+                                                    })];
+                                                case 1:
+                                                    cntrlr = _a.sent();
+                                                    runSearch_2();
+                                                    targetFunction_3(__assign({ controller: cntrlr }, target), elem, originalElem);
+                                                    cntrlr.addTargeter(targeter);
+                                                    return [2 /*return*/];
+                                            }
+                                        });
+                                    }); });
+                                });
+                            }
+                            catch (err) {
+                                _this.logger.error("Failed to instantiate ".concat(type, " controller at index ").concat(index, "."), err);
+                            }
+                        });
+                    });
+                    break;
+                }
+                case 'recommendation': {
+                    _this.config.controllers[type].forEach(function (controller, index) {
+                        if (typeof _this._controllerPromises[controller.config.id] != 'undefined') {
+                            _this.logger.error("Controller with id '".concat(controller.config.id, "' is already defined"));
+                            return;
+                        }
+                        _this._controllerPromises[controller.config.id] = new Promise(function (resolve) {
+                            var _a;
+                            try {
+                                var searched_2 = false;
+                                var runSearch_3 = function () {
+                                    if (!searched_2) {
+                                        _this.controllers[controller.config.id].search();
+                                        searched_2 = true;
+                                    }
+                                };
+                                var targetFunction_4 = function (target, elem, originalElem) { return __awaiter(_this, void 0, void 0, function () {
+                                    var onTarget, _a, Component_4, err_6;
+                                    var _this = this;
+                                    return __generator(this, function (_b) {
+                                        switch (_b.label) {
+                                            case 0:
+                                                onTarget = target.onTarget;
+                                                _a = onTarget;
+                                                if (!_a) return [3 /*break*/, 2];
+                                                return [4 /*yield*/, onTarget(target, elem, originalElem)];
+                                            case 1:
+                                                _a = (_b.sent());
+                                                _b.label = 2;
+                                            case 2:
+                                                _a;
+                                                _b.label = 3;
+                                            case 3:
+                                                _b.trys.push([3, 5, , 6]);
+                                                return [4 /*yield*/, target.component()];
+                                            case 4:
+                                                Component_4 = _b.sent();
+                                                setTimeout(function () {
+                                                    (0, preact_1.render)((0, jsx_runtime_1.jsx)(Component_4, __assign({ controller: _this.controllers[controller.config.id], snap: _this }, target.props)), elem);
+                                                });
+                                                return [3 /*break*/, 6];
+                                            case 5:
+                                                err_6 = _b.sent();
+                                                this.logger.error(err_6);
+                                                this.logger.error(COMPONENT_ERROR, target);
+                                                return [3 /*break*/, 6];
+                                            case 6: return [2 /*return*/];
+                                        }
+                                    });
+                                }); };
+                                if (!(controller === null || controller === void 0 ? void 0 : controller.targeters) || (controller === null || controller === void 0 ? void 0 : controller.targeters.length) === 0) {
+                                    _this._createController(snap_controller_1.ControllerTypes.recommendation, controller.config, controller.services, controller.url, controller.context, function (cntrlr) {
+                                        if (cntrlr)
+                                            resolve(cntrlr);
+                                    });
+                                }
+                                (_a = controller === null || controller === void 0 ? void 0 : controller.targeters) === null || _a === void 0 ? void 0 : _a.forEach(function (target, target_index) {
+                                    if (!target.selector) {
+                                        throw new Error("Targets at index ".concat(target_index, " missing selector value (string)."));
+                                    }
+                                    if (!target.component) {
+                                        throw new Error("Targets at index ".concat(target_index, " missing component value (Component)."));
+                                    }
+                                    var targeter = new snap_toolbox_1.DomTargeter([__assign({}, target)], function (target, elem, originalElem) { return __awaiter(_this, void 0, void 0, function () {
+                                        var cntrlr;
+                                        return __generator(this, function (_a) {
+                                            switch (_a.label) {
+                                                case 0: return [4 /*yield*/, this._createController(snap_controller_1.ControllerTypes.recommendation, controller.config, controller.services, controller.url, controller.context, function (cntrlr) {
+                                                        if (cntrlr)
+                                                            resolve(cntrlr);
+                                                    })];
+                                                case 1:
+                                                    cntrlr = _a.sent();
+                                                    runSearch_3();
+                                                    targetFunction_4(__assign({ controller: cntrlr }, target), elem, originalElem);
+                                                    cntrlr.addTargeter(targeter);
+                                                    return [2 /*return*/];
+                                            }
+                                        });
+                                    }); });
+                                });
+                            }
+                            catch (err) {
+                                _this.logger.error("Failed to instantiate ".concat(type, " controller at index ").concat(index, "."), err);
+                            }
+                        });
+                    });
+                    break;
+                }
+            }
+        });
+        // create instantiators
+        if ((_0 = (_z = this.config) === null || _z === void 0 ? void 0 : _z.instantiators) === null || _0 === void 0 ? void 0 : _0.recommendation) {
+            try {
+                this._instantiatorPromises.recommendation = Promise.resolve().then(function () { return __importStar(require('./Instantiators/RecommendationInstantiator')); }).then(function (_a) {
+                    var RecommendationInstantiator = _a.RecommendationInstantiator;
+                    _this.config.instantiators.recommendation.mode = _this.config.instantiators.recommendation.mode || _this.mode;
+                    return new RecommendationInstantiator(_this.config.instantiators.recommendation, {
+                        client: _this.client,
+                        tracker: _this.tracker,
+                        logger: _this.logger,
+                        snap: _this,
+                    }, _this.context);
+                });
+            }
+            catch (err) {
+                this.logger.error("Failed to create Recommendations Instantiator.", err);
+            }
+        }
+    }
+    return Snap;
+}());
+exports.Snap = Snap;