@searchspring/snap-controller 0.20.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Searchspring
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,167 @@
+# Snap Controller
+
+<a href="https://www.npmjs.com/package/@searchspring/snap-controller"><img alt="NPM Status" src="https://img.shields.io/npm/v/@searchspring/snap-controller.svg?style=flat"></a>
+
+The heart of controlling Search, Autocomplete, & Finder functionality. The Controller is responsible for tying various Snap services together.
+
+
+## Dependencies
+
+Snap Controller is a top-level package that requires the following dependencies as services:
+
+<a href="https://www.npmjs.com/package/@searchspring/snap-client"><img alt="NPM Status" src="https://img.shields.io/npm/v/@searchspring/snap-client.svg?style=flat"></a> [@searchspring/snap-client](https://github.com/searchspring/snap/tree/main/packages/snap-client)
+
+<a href="https://www.npmjs.com/package/@searchspring/snap-store-mobx"><img alt="NPM Status" src="https://img.shields.io/npm/v/@searchspring/snap-store-mobx.svg?style=flat"></a> [@searchspring/snap-store-mobx](https://github.com/searchspring/snap/tree/main/packages/snap-store-mobx)
+
+<a href="https://www.npmjs.com/package/@searchspring/snap-url-manager"><img alt="NPM Status" src="https://img.shields.io/npm/v/@searchspring/snap-url-manager.svg?style=flat"></a> [@searchspring/snap-url-manager](https://github.com/searchspring/snap/tree/main/packages/snap-url-manager)
+
+<a href="https://www.npmjs.com/package/@searchspring/snap-event-manager"><img alt="NPM Status" src="https://img.shields.io/npm/v/@searchspring/snap-event-manager.svg?style=flat"></a> [@searchspring/snap-event-manager](https://github.com/searchspring/snap/tree/main/packages/snap-event-manager)
+
+<a href="https://www.npmjs.com/package/@searchspring/snap-profiler"><img alt="NPM Status" src="https://img.shields.io/npm/v/@searchspring/snap-profiler.svg?style=flat"></a> [@searchspring/snap-profiler](https://github.com/searchspring/snap/tree/main/packages/snap-profiler)
+
+<a href="https://www.npmjs.com/package/@searchspring/snap-logger"><img alt="NPM Status" src="https://img.shields.io/npm/v/@searchspring/snap-logger.svg?style=flat"></a> [@searchspring/snap-logger](https://github.com/searchspring/snap/tree/main/packages/snap-logger)
+
+## Installation
+
+To install the `snap-controller` package and it's services:
+
+```bash
+npm install --save @searchspring/snap-controller @searchspring/snap-client @searchspring/snap-store-mobx @searchspring/snap-url-manager @searchspring/snap-event-manager @searchspring/snap-profiler @searchspring/snap-logger
+```
+
+
+## Instantiation
+Each `Controller` must be passed a configuration object as the first parameter to the constructor, and a services object (dependencies) as the second. The contents of these objects will depend on which type of `Controller` is being instantiated. For example, a `SearchController` would usually be paired with a `SearchStore` service, and would take a `SearchControllerConfig` configuration object.
+
+The complete example below shows how a `SearchController` could be instatiated, initialized and searched:
+
+```typescript
+import { Client } from '@searchspring/snap-client';
+import { SearchStore } from '@searchspring/snap-store-mobx';
+import { UrlManager, UrlTranslator } from '@searchspring/snap-url-manager';
+import { EventManager } from '@searchspring/snap-event-manager';
+import { Profiler } from '@searchspring/snap-profiler';
+import { Logger } from '@searchspring/snap-logger';
+import { Tracker } from '@searchspring/snap-tracker';
+import { SearchController } from '@searchspring/snap-controller';
+
+const configuration = {
+	id: 'search'
+};
+
+const urlManager = new UrlManager(new UrlTranslator());
+const services = {
+	client: new Client({ siteId: 'abc123' }),
+	store: new SearchStore(configuration, { urlManager }),
+	urlManager,
+	eventManager: new EventManager(),
+	profiler: new Profiler(),
+	logger: new Logger(),
+	tracker: new Tracker(),
+}
+
+const controller = new SearchController(configuration, services);
+controller.init();
+controller.search();
+```
+
+## Configuration
+The configuration object provided during instantiation provides a way of configuring the controller for different behavior. Each controller type (`SearchController`, `AutocompleteController`, `FinderController`, etc...) has default configurations that can be modified with the instantiation configuration object. At minimum an `id` attribute is required for identifying controllers. The `id` should be unique to each *instance* of a controller.
+## Services
+Along with a configuration, each controller is passed a collection of services during instantiation. These services are then used by the controller and made available via controller methods. Sometimes controllers might share a reference to a service (the `client` service for example), but in most cases a controller will have it's own instance of a service. Some services (like the `SearchStore`) share services with the controller (in the example above, the `UrlManager` is shared).
+
+```typescript
+{ client, store, urlManager, eventManager, profiler, logger }
+```
+### client
+The `client` service makes the requests to the API when the controller `search` method is called. The response is passed onto the `store` service. This service is exposed as `controller.client`.
+
+### store
+This service mutates the API responses and adds convenience functions for common functionality. The `store` data is then used by the UI components for display. This service is exposed as `controller.store`.
+### urlManager
+`urlManager` is responsible for updating the page URL when interacting with UI components. The type of translator passed into the `UrlManager` constructor will determine the types of URLs generated. This service is exposed as `controller.urlManager`.
+### eventManager
+Middleware provide an opportunity to hook into these events they occur. Middleware are attached to events, and these events are managed by the `eventManager`. This service is exposed as `controller.eventManager`.
+
+### profiler
+Controllers may need to know how long a certain event took, the `profiler` service provides the means to track this information. This service is exposed as `controller.profiler`.
+
+### logger
+The `logger` service provides logging functionality to a controller. Each controller logs when errors in middleware and when controller events occur. The logger is responsible for sending this information to the developer console. In addition the logger may provide additional emoji or colors to use. This service is exposed as `controller.log`.
+
+## Initialization
+Invoking the `init` method is required to subscribe to changes that occur in the UrlManager. It also fires the `init` event which executes attached middleware. This can be fired manually as needed; if it was not manually fired it will happen automatically on the first call to the controller `search` method.
+
+```typescript
+controller.init();
+```
+
+## Searching
+The `search` method of a controller will run the search that is expected by leveraging the `client` service to make the request; the subsequent response will be passed to the `store` service.
+
+Most controllers will provide a means of manipulating the request and response using `beforeSearch` and `afterSearch` events respectively. Read on for details about events.
+
+```typescript
+controller.search();
+```
+
+## Stores
+Different controller types will utilize different Snap Stores (typically of the same name). Each `store` will provide different properties and methods for its unique purposes. See the documentation for more details.
+
+## Events
+Each controller will fire various events. Some of the event names are shared between controllers for consistency (ex: `beforeSearch`, `afterSearch`, `afterStore`); however the attaching of middleware and execution of it must remain separate. This is why a new `EventManager` instance is created for each controller. Middleware are attached to events via the `on` method and the functions should almost always end with `await next()` unless purposefully preventing the next attached middleware from executing.
+
+```typescript
+controller.on('init', async (eventData, next) => {
+	const { controller } = eventData;
+
+	controller.log.debug('init event has occurred');
+
+	await next();
+});
+```
+
+Note: Groups of middleware (plugins) can be attached using the `plugin` method.
+
+The data available within a middleware (first parameter) is determined by what gets passed into the `fire` method. For existing events on the controller, the `fire` method is already being called when appropriate to the event, and the `eventData` will typically be an object containing a reference to the controller and any other details that may be of importance to the particular event. Custom events can be created as needed; but keep in mind that any middleware tied to the event should be bound (using `on` or `plugin`) prior to the execution of the `fire` method.
+
+```typescript
+controller.eventManager.fire('customEventName', { thing1: 'one', thing2: 2 });
+```
+
+See the EventManager documentation for more details.
+
+## Environment
+A controller's environment is initialized at build time, and is used to control certain runtime behavior. For example, a `production` build will supress most logs while a `development` build will show them all.
+## Logging
+The logger provides a clear way of outputting details like profile data or errors to the developer console. A `production` build will supress most logs while a `development` build will show them all. The environment is automatically determined, but can be toggled during runtime by setting it to either `development` or `production`.
+
+```typescript
+controller.environment = 'development';
+```
+
+The use of `console.log()` is discouraged. Logging should be done via controller instance to help debug and navigate the sea of console logs. Each controller will output the `id` for easily deciphering which controller made the log.
+
+```typescript
+controller.log.warn('THIS IS A WARNING!');
+```
+
+Many logs are supressed depending on a development `environment` of the controller instance. The Logger documentation provides more details about the various methods, colors and emoji available.
+
+## Controller Types
+Each `Controller` has a unique configuration and set of default events; it may also provide additional methods for specific functionality.
+
+### Abstract
+The base class for all controllers.
+
+### Autocomplete
+Used for autocomplete searches.
+
+### Finder
+A specialized controller used for building custom product finders.
+
+### Recommendation
+The standard controller used for recommendation profiles.
+
+### Search
+The standard controller used on search pages and PLPs.

package/dist/cjs/Abstract/AbstractController.d.ts

@@ -0,0 +1,40 @@
+import { LogMode } from '@searchspring/snap-logger';
+import { DomTargeter } from '@searchspring/snap-toolbox';
+import type { AbstractStore } from '@searchspring/snap-store-mobx';
+import type { UrlManager } from '@searchspring/snap-url-manager';
+import type { EventManager, Middleware } from '@searchspring/snap-event-manager';
+import type { Profiler } from '@searchspring/snap-profiler';
+import type { Logger } from '@searchspring/snap-logger';
+import type { Tracker } from '@searchspring/snap-tracker';
+import type { Target, OnTarget } from '@searchspring/snap-toolbox';
+import type { ControllerServices, ControllerConfig, Attachments } from '../types';
+export declare abstract class AbstractController {
+    id: string;
+    type: string;
+    config: ControllerConfig;
+    client: any;
+    store: AbstractStore;
+    urlManager: UrlManager;
+    eventManager: EventManager;
+    profiler: Profiler;
+    log: Logger;
+    tracker: Tracker;
+    targeters: {
+        [key: string]: DomTargeter;
+    };
+    private _initialized;
+    private _environment;
+    get initialized(): boolean;
+    constructor(config: ControllerConfig, { client, store, urlManager, eventManager, profiler, logger, tracker }: ControllerServices);
+    createTargeter(target: Target, onTarget: OnTarget, document?: Document): DomTargeter;
+    addTargeter(target: DomTargeter): DomTargeter;
+    set environment(env: LogMode);
+    get environment(): LogMode;
+    init(): Promise<void>;
+    retarget(): void;
+    abstract search(): Promise<void>;
+    plugin(func: (cntrlr: AbstractController, ...args: any[]) => Promise<void>, ...args: unknown[]): Promise<void>;
+    on<T>(event: string, ...func: Middleware<T>[]): void;
+    use(attachments: Attachments): void;
+}
+//# sourceMappingURL=AbstractController.d.ts.map

package/dist/cjs/Abstract/AbstractController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AbstractController.d.ts","sourceRoot":"","sources":["../../../src/Abstract/AbstractController.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACpD,OAAO,EAAE,WAAW,EAAgB,MAAM,4BAA4B,CAAC;AAGvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACjE,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAC;AACjF,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAEnE,OAAO,KAAK,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAGlF,8BAAsB,kBAAkB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,SAAc;IAClB,MAAM,EAAE,gBAAgB,CAAC;IACzB,MAAM,MAAC;IACP,KAAK,EAAE,aAAa,CAAC;IACrB,UAAU,EAAE,UAAU,CAAC;IACvB,YAAY,EAAE,YAAY,CAAC;IAC3B,QAAQ,EAAE,QAAQ,CAAC;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE;QACjB,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,CAAC;KAC3B,CAAM;IAEP,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,YAAY,CAAsB;IAE1C,IAAI,WAAW,IAAI,OAAO,CAEzB;gBAEW,MAAM,EAAE,gBAAgB,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,kBAAkB;IAyEzH,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAAE,QAAQ,GAAG,WAAW;IAIpF,WAAW,CAAC,MAAM,EAAE,WAAW,GAAG,WAAW;IASpD,IAAW,WAAW,CAAC,GAAG,EAAE,OAAO,EAKlC;IAED,IAAW,WAAW,IAAI,OAAO,CAEhC;IAEY,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IA+C3B,QAAQ,IAAI,IAAI;aAMP,MAAM,IAAI,OAAO,CAAC,IAAI,CAAC;IAE1B,MAAM,CAAC,IAAI,EAAE,CAAC,MAAM,EAAE,kBAAkB,EAAE,GAAG,IAAI,OAAA,KAAK,OAAO,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC;IAI7G,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI;IAIpD,GAAG,CAAC,WAAW,EAAE,WAAW,GAAG,IAAI;CAoC1C"}

package/dist/cjs/Abstract/AbstractController.js

@@ -0,0 +1,281 @@
+"use strict";
+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;
+    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 };
+    }
+};
+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));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AbstractController = void 0;
+var snap_logger_1 = require("@searchspring/snap-logger");
+var snap_toolbox_1 = require("@searchspring/snap-toolbox");
+var SS_DEV_COOKIE = 'ssDev';
+var AbstractController = /** @class */ (function () {
+    function AbstractController(config, _a) {
+        var client = _a.client, store = _a.store, urlManager = _a.urlManager, eventManager = _a.eventManager, profiler = _a.profiler, logger = _a.logger, tracker = _a.tracker;
+        var _b, _c, _d;
+        this.type = 'abstract';
+        this.targeters = {};
+        this._initialized = false;
+        this._environment = snap_logger_1.LogMode.PRODUCTION;
+        if (typeof config != 'object' || typeof config.id != 'string' || !config.id.match(/^[a-zA-Z0-9_-]*$/)) {
+            throw new Error("Invalid config passed to controller. The \"id\" attribute must be an alphanumeric string.");
+        }
+        if (typeof client != 'object' || typeof client.search != 'function') {
+            throw new Error("Invalid service 'client' passed to controller. Missing \"search\" function.");
+        }
+        if (typeof store != 'object' || typeof store.update != 'function') {
+            throw new Error("Invalid service 'store' passed to controller. Missing \"update\" function.");
+        }
+        if (typeof urlManager != 'object' || typeof urlManager.subscribe != 'function') {
+            throw new Error("Invalid service 'urlManager' passed to controller. Missing \"subscribe\" function.");
+        }
+        if (typeof eventManager != 'object' || typeof eventManager.on != 'function') {
+            throw new Error("Invalid service 'eventManager' passed to controller. Missing \"on\" function.");
+        }
+        if (typeof eventManager != 'object' || typeof eventManager.fire != 'function') {
+            throw new Error("Invalid service 'eventManager' passed to controller. Missing \"fire\" function.");
+        }
+        if (typeof profiler != 'object' || typeof profiler.setNamespace != 'function') {
+            throw new Error("Invalid service 'profiler' passed to controller. Missing \"setNamespace\" function.");
+        }
+        if (typeof profiler != 'object' || typeof profiler.create != 'function') {
+            throw new Error("Invalid service 'profiler' passed to controller. Missing \"create\" function.");
+        }
+        if (typeof logger != 'object' || typeof logger.dev != 'function') {
+            throw new Error("Invalid service 'logger' passed to controller. Missing \"dev\" function.");
+        }
+        if (typeof tracker != 'object' || typeof tracker.track != 'object') {
+            throw new Error("Invalid service 'tracker' passed to controller. Missing \"track\" object.");
+        }
+        window.searchspring = window.searchspring || {};
+        window.searchspring.controller = window.searchspring.controller || {};
+        if (window.searchspring.controller[config.id]) {
+            throw new Error("Controller with id '".concat(config.id, "' is already defined"));
+        }
+        window.searchspring.controller[config.id] = this;
+        this.id = config.id;
+        this.config = config;
+        this.client = client;
+        this.store = store;
+        this.urlManager = urlManager;
+        this.eventManager = eventManager;
+        this.profiler = profiler;
+        this.log = logger;
+        this.tracker = tracker;
+        // configure the logger
+        this.log.setNamespace(this.config.id);
+        // set namespaces
+        this.profiler.setNamespace(this.config.id);
+        // set environment
+        if ((_d = (_c = (_b = (0, snap_toolbox_1.url)(window.location.href)) === null || _b === void 0 ? void 0 : _b.params) === null || _c === void 0 ? void 0 : _c.query) === null || _d === void 0 ? void 0 : _d.dev) {
+            snap_toolbox_1.cookies.set(SS_DEV_COOKIE, '1', 'Lax', 0);
+        }
+        var dev = snap_toolbox_1.cookies.get(SS_DEV_COOKIE);
+        this.environment = (dev === '1' ? 'development' : process.env.NODE_ENV);
+    }
+    Object.defineProperty(AbstractController.prototype, "initialized", {
+        get: function () {
+            return this._initialized;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    AbstractController.prototype.createTargeter = function (target, onTarget, document) {
+        return this.addTargeter(new snap_toolbox_1.DomTargeter([target], onTarget, document));
+    };
+    AbstractController.prototype.addTargeter = function (target) {
+        var _a;
+        var firstTarget = target.getTargets()[0];
+        var targetName = (_a = firstTarget === null || firstTarget === void 0 ? void 0 : firstTarget.name) !== null && _a !== void 0 ? _a : firstTarget === null || firstTarget === void 0 ? void 0 : firstTarget.selector;
+        if (targetName && !this.targeters[targetName]) {
+            this.targeters[targetName] = target;
+            return target;
+        }
+    };
+    Object.defineProperty(AbstractController.prototype, "environment", {
+        get: function () {
+            return this._environment;
+        },
+        set: function (env) {
+            if (Object.values(snap_logger_1.LogMode).includes(env)) {
+                this._environment = env;
+                this.log.setMode(env);
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    AbstractController.prototype.init = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var initProfile, err_1, err_2;
+            var _this = this;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (this._initialized) {
+                            this.log.warn("'init' middleware recalled");
+                        }
+                        initProfile = this.profiler.create({ type: 'event', name: 'init', context: this.config }).start();
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 6, , 7]);
+                        _a.label = 2;
+                    case 2:
+                        _a.trys.push([2, 4, , 5]);
+                        return [4 /*yield*/, this.eventManager.fire('init', {
+                                controller: this,
+                            })];
+                    case 3:
+                        _a.sent();
+                        return [3 /*break*/, 5];
+                    case 4:
+                        err_1 = _a.sent();
+                        if ((err_1 === null || err_1 === void 0 ? void 0 : err_1.message) == 'cancelled') {
+                            this.log.warn("'init' middleware cancelled");
+                        }
+                        else {
+                            this.log.error("error in 'init' middleware");
+                            throw err_1;
+                        }
+                        return [3 /*break*/, 5];
+                    case 5: return [3 /*break*/, 7];
+                    case 6:
+                        err_2 = _a.sent();
+                        if (err_2) {
+                            console.error(err_2);
+                        }
+                        return [3 /*break*/, 7];
+                    case 7:
+                        if (!this._initialized) {
+                            // subscribe to urlManager changes
+                            this.urlManager.subscribe(function (prev, next) {
+                                try {
+                                    var prevString = JSON.stringify(prev);
+                                    var nextString = JSON.stringify(next);
+                                    if (prevString !== nextString) {
+                                        _this.search();
+                                    }
+                                }
+                                catch (err) {
+                                    _this.log.error('URL state is invalid', err);
+                                }
+                            });
+                            this._initialized = true;
+                        }
+                        initProfile.stop();
+                        this.log.profile(initProfile);
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    AbstractController.prototype.retarget = function () {
+        var _this = this;
+        Object.keys(this.targeters).forEach(function (target) {
+            _this.targeters[target].retarget();
+        });
+    };
+    AbstractController.prototype.plugin = function (func) {
+        var args = [];
+        for (var _i = 1; _i < arguments.length; _i++) {
+            args[_i - 1] = arguments[_i];
+        }
+        return __awaiter(this, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, func.apply(void 0, __spreadArray([this], args, false))];
+                    case 1:
+                        _a.sent();
+                        return [2 /*return*/];
+                }
+            });
+        });
+    };
+    AbstractController.prototype.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));
+    };
+    AbstractController.prototype.use = function (attachments) {
+        var _this = this;
+        // attach plugins
+        if (attachments === null || attachments === void 0 ? void 0 : attachments.plugins) {
+            try {
+                if (!Array.isArray(attachments === null || attachments === void 0 ? void 0 : attachments.plugins)) {
+                    throw 'invalid format';
+                }
+                attachments === null || attachments === void 0 ? void 0 : attachments.plugins.forEach(function (plugin) {
+                    if (!Array.isArray(plugin)) {
+                        throw 'invalid format';
+                    }
+                    var func = plugin[0], args = plugin.slice(1);
+                    _this.plugin.apply(_this, __spreadArray([func], args, false));
+                });
+            }
+            catch (err) {
+                this.log.warn('plugins not attached - use format [func, ...args?][]');
+            }
+        }
+        // attach event middleware
+        if (attachments === null || attachments === void 0 ? void 0 : attachments.middleware) {
+            Object.keys(attachments.middleware).forEach(function (eventName) {
+                var eventMiddleware = attachments.middleware[eventName];
+                var middlewareArray;
+                if (Array.isArray(eventMiddleware)) {
+                    middlewareArray = eventMiddleware;
+                }
+                else {
+                    middlewareArray = [eventMiddleware];
+                }
+                middlewareArray.forEach(function (middleware) {
+                    _this.on(eventName, middleware);
+                });
+            });
+        }
+    };
+    return AbstractController;
+}());
+exports.AbstractController = AbstractController;

package/dist/cjs/Autocomplete/AutocompleteController.d.ts

@@ -0,0 +1,40 @@
+import { StorageStore } from '@searchspring/snap-store-mobx';
+import { AbstractController } from '../Abstract/AbstractController';
+import type { AutocompleteStore } from '@searchspring/snap-store-mobx';
+import type { AutocompleteControllerConfig, ControllerServices } from '../types';
+import type { AutocompleteRequestModel } from '@searchspring/snapi-types';
+declare type AutocompleteTrackMethods = {
+    product: {
+        click: (e: any, result: any) => void;
+    };
+};
+export declare class AutocompleteController extends AbstractController {
+    type: string;
+    store: AutocompleteStore;
+    config: AutocompleteControllerConfig;
+    storage: StorageStore;
+    constructor(config: AutocompleteControllerConfig, { client, store, urlManager, eventManager, profiler, logger, tracker }: ControllerServices);
+    track: AutocompleteTrackMethods;
+    get params(): AutocompleteRequestModel;
+    setFocused(inputElement?: HTMLInputElement): Promise<void>;
+    reset(): void;
+    handlers: {
+        input: {
+            enterKey: (e: KeyboardEvent) => Promise<void>;
+            escKey: (e: KeyboardEvent) => void;
+            focus: (e: FocusEvent) => void;
+            formSubmit: (e: any) => Promise<void>;
+            keyUp: (e: KeyboardEvent) => void;
+            timeoutDelay: any;
+        };
+        document: {
+            click: (e: MouseEvent) => void;
+        };
+    };
+    unbind(): void;
+    bind(): Promise<void>;
+    searchTrending: () => Promise<void>;
+    search: () => Promise<void>;
+}
+export {};
+//# sourceMappingURL=AutocompleteController.d.ts.map

package/dist/cjs/Autocomplete/AutocompleteController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutocompleteController.d.ts","sourceRoot":"","sources":["../../../src/Autocomplete/AutocompleteController.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAA0B,MAAM,+BAA+B,CAAC;AAErF,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAGpE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AACvE,OAAO,KAAK,EAAE,4BAA4B,EAAkD,kBAAkB,EAAa,MAAM,UAAU,CAAC;AAC5I,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AAuB1E,aAAK,wBAAwB,GAAG;IAC/B,OAAO,EAAE;QACR,KAAK,EAAE,CAAC,CAAC,KAAA,EAAE,MAAM,KAAA,KAAK,IAAI,CAAC;KAC3B,CAAC;CACF,CAAC;AAEF,qBAAa,sBAAuB,SAAQ,kBAAkB;IACtD,IAAI,SAAkB;IACtB,KAAK,EAAE,iBAAiB,CAAC;IACzB,MAAM,EAAE,4BAA4B,CAAC;IACrC,OAAO,EAAE,YAAY,CAAC;gBAEjB,MAAM,EAAE,4BAA4B,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,kBAAkB;IAkD5I,KAAK,EAAE,wBAAwB,CAO7B;IAEF,IAAI,MAAM,IAAI,wBAAwB,CA+BrC;IAEK,UAAU,CAAC,YAAY,CAAC,EAAE,gBAAgB,GAAG,OAAO,CAAC,IAAI,CAAC;IA2BhE,KAAK,IAAI,IAAI;IASb,QAAQ;;0BAEc,aAAa,KAAG,QAAQ,IAAI,CAAC;wBA6CrC,aAAa,KAAG,IAAI;uBAMrB,UAAU,KAAG,IAAI;oCAQL,QAAQ,IAAI,CAAC;uBAwCzB,aAAa,KAAG,IAAI;;;;uBA0CpB,UAAU,KAAG,IAAI;;MAS5B;IAEF,MAAM,IAAI,IAAI;IAYR,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IAgE3B,cAAc,QAAa,QAAQ,IAAI,CAAC,CAsBtC;IAEF,MAAM,QAAa,QAAQ,IAAI,CAAC,CA6G9B;CACF"}