@empathyco/x-components 3.0.0-alpha.22 → 3.0.0-alpha.220

package/js/plugins/x-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"x-plugin.js","sources":["../../../src/plugins/x-plugin.ts"],"sourcesContent":["import { SearchAdapter } from '@empathyco/x-adapter';\nimport { deepMerge } from '@empathyco/x-deep-merge';\nimport { PluginObject, VueConstructor } from 'vue';\nimport Vuex, { Module, Store } from 'vuex';\nimport { FILTERS_REGISTRY } from '../filters/filters.registry';\nimport { AnyXStoreModule, RootXStoreState } from '../store/store.types';\nimport {\n  cleanGettersProxyCache,\n  getGettersProxyFromModule\n} from '../store/utils/getters-proxy.utils';\nimport {\n  AnySimpleStateSelector,\n  AnyStateSelector,\n  AnyStoreEmitters\n} from '../store/utils/store-emitters.utils';\nimport { RootXStoreModule } from '../store/x.module';\nimport { Dictionary, forEach } from '../utils';\nimport { AnyWire, Wiring } from '../wiring/wiring.types';\nimport { AnyXModule, XModuleName } from '../x-modules/x-modules.types';\nimport { bus } from './x-bus';\nimport { XBus } from './x-bus.types';\nimport { createXComponentAPIMixin } from './x-plugin.mixin';\nimport {\n  AnyXStoreModuleOption,\n  PrivateXModuleOptions,\n  XModuleOptions,\n  XPluginOptions\n} from './x-plugin.types';\nimport { assertXPluginOptionsAreValid } from './x-plugin.utils';\n\n/**\n * Vue plugin that initializes the properties needed by the x-components, and exposes the events bus\n * and the adapter after it has been installed.\n *\n * @public\n */\nexport class XPlugin implements PluginObject<XPluginOptions> {\n  /**\n   * {@link @empathyco/x-adapter#SearchAdapter | SearchAdapter} Is the middleware between\n   * the components and our API where data can be mapped to client needs.\n   * This property is only available after installing the plugin.\n   *\n   * @returns The installed adapter.\n   * @throws If this property is accessed before calling `Vue.use(xPlugin)`.\n   * @public\n   */\n  public static get adapter(): SearchAdapter {\n    return this.getInstance().adapter;\n  }\n\n  /**\n   * Exposed {@link XBus}, so any kind of application can subscribe to {@link XEventsTypes}\n   * without having to pass through a component.\n   * This property is only available after installing the plugin.\n   *\n   * @returns The installed bus.\n   * @throws If this property is accessed before calling `Vue.use(xPlugin)`.\n   * @public\n   */\n  public static get bus(): XBus {\n    return this.getInstance().bus;\n  }\n\n  /**\n   * {@link https://vuex.vuejs.org | Vuex Store} Is the place where all shared data\n   * is saved.\n   *\n   * @returns The installed store.\n   * @throws If this property is accessed before calling `Vue.use(xPlugin)`.\n   * @public\n   */\n  public static get store(): Store<RootXStoreState> {\n    return this.getInstance().store;\n  }\n\n  /**\n   * Safely retrieves the installed instance of the XPlugin.\n   *\n   * @returns The installed instance of the XPlugin.\n   * @throws If this method is called before calling `Vue.use(xPlugin)`.\n   * @internal\n   */\n  protected static getInstance(): XPlugin {\n    if (!this.instance) {\n      throw Error(\"XPlugin must be installed before accessing it's API.\");\n    }\n    return this.instance;\n  }\n\n  /**\n   * Record of modules that have been tried to be installed before the installation of the plugin.\n   *\n   * @internal\n   */\n  protected static pendingXModules: Partial<Record<XModuleName, AnyXModule>> = {};\n\n  /**\n   * Instance of the installed plugin. Used to expose the bus and the adapter.\n   *\n   * @internal\n   */\n  protected static instance?: XPlugin;\n\n  /**\n   * Bus for retrieving the observables when registering the wiring.\n   *\n   * @internal\n   */\n  protected bus: XBus;\n\n  /**\n   * Adapter for the API, responsible for transforming requests and responses.\n   *\n   * @internal\n   */\n  protected adapter!: SearchAdapter;\n\n  /**\n   * Set of the already installed {@link XModule | XModules} to avoid re-registering them.\n   *\n   * @internal\n   */\n  protected installedXModules = new Set<string>();\n\n  /**\n   * True if the plugin has been installed in a Vue instance, in this case\n   * {@link XModule |Xmodules} will be installed immediately. False otherwise, in this case\n   * {@link XModule | XModules} will be installed lazily when the {@link XPlugin#install} method\n   * is called.\n   *\n   * @internal\n   */\n  protected isInstalled = false;\n\n  /**\n   * The install options of the plugin, where all the customization of\n   * {@link XModule | XModules} is done.\n   *\n   * @internal\n   */\n  protected options!: XPluginOptions;\n\n  /**\n   * The Vuex store, to pass to the wires for its registration, and to register the store\n   * modules on it.\n   *\n   * @internal\n   */\n  protected store!: Store<any>;\n  /**\n   * The global Vue, passed by the install method. Used to apply the global mixin\n   * {@link createXComponentAPIMixin}, and install the {@link https://vuex.vuejs.org/ | Vuex}\n   * plugin.\n   *\n   * @internal\n   */\n  protected vue!: VueConstructor;\n\n  /**\n   * Creates a new instance of the XPlugin with the given bus passed as parameter.\n   *\n   * @param bus - The {@link XBus} implementation to use for the plugin.\n   * @public\n   */\n  public constructor(bus: XBus) {\n    this.bus = bus;\n  }\n\n  /**\n   * If the plugin has already been installed, it immediately registers a {@link XModule}. If it\n   * has not been installed yet, it stores the module in a list until the plugin is installed.\n   *\n   * @param xModule - The module to register.\n   */\n  static registerXModule(xModule: AnyXModule): void {\n    if (this.instance) {\n      this.instance.registerXModule(xModule);\n    } else {\n      this.lazyRegisterXModule(xModule);\n    }\n  }\n\n  /**\n   * Utility method for resetting the installed instance of the plugin.\n   *\n   * @remarks Use only for testing.\n   *\n   * @internal\n   */\n  static resetInstance(): void {\n    cleanGettersProxyCache();\n    this.instance = undefined;\n  }\n\n  /**\n   * Stores the {@link XModule} in a dictionary, so it can be registered later in the install\n   * process.\n   *\n   * @param xModule - The module to register.\n   * @internal\n   */\n  protected static lazyRegisterXModule(xModule: AnyXModule): void {\n    this.pendingXModules[xModule.name] = xModule;\n  }\n\n  /**\n   * Installs the plugin into the Vue instance.\n   *\n   * @param vue - The GlobalVue object.\n   * @param options - The options to install this plugin with.\n   * @throws If the XPlugin has already been installed, or the options are not valid.\n   * @internal\n   */\n  install(vue: VueConstructor, options?: XPluginOptions): void {\n    if (this.isInstalled) {\n      throw new Error('XPlugin has already been installed');\n    }\n    assertXPluginOptionsAreValid(options);\n    XPlugin.instance = this;\n    this.vue = vue;\n    this.options = options;\n    this.adapter = options.adapter;\n    this.createAdapterConfigChangedListener();\n    this.registerStore();\n    this.applyMixins();\n    this.registerFilters();\n    this.registerInitialModules();\n    this.registerPendingXModules();\n    this.isInstalled = true;\n  }\n\n  /**\n   * Performs the registration of a {@link XModule}.\n   *\n   * @param xModule - The module to register.\n   * @internal\n   */\n  protected registerXModule({ name, wiring, storeModule, storeEmitters }: AnyXModule): void {\n    if (!this.installedXModules.has(name)) {\n      this.registerStoreModule(name, storeModule);\n      this.registerWiring(name, wiring);\n      this.registerStoreEmitters(name, storeModule, storeEmitters);\n      this.installedXModules.add(name);\n    }\n  }\n\n  /**\n   * Performs the registration of the wiring, retrieving the observable for each event, and\n   * executing each wire.\n   *\n   * @param name - The name of the {@link XModule} of the wiring.\n   * @param wiring - The wiring to register.\n   * @internal\n   */\n  protected registerWiring(name: XModuleName, wiring: Partial<Wiring>): void {\n    const wiringOptions = this.getXModuleOptions(name)?.wiring;\n    const customizedWiring: Partial<Wiring> = wiringOptions\n      ? deepMerge({}, wiring, wiringOptions)\n      : wiring;\n    forEach(customizedWiring, (event, wires: Dictionary<AnyWire>) => {\n      // Obtain the observable\n      const observable = this.bus.on(event, true);\n      // Register event wires\n      forEach(wires, (_, wire) => {\n        wire(observable, this.store, this.bus.on.bind(this.bus));\n      });\n    });\n  }\n\n  /**\n   * Registers a {@link https://vuex.vuejs.org/ | Vuex} store module under the 'x' module.\n   *\n   * @param name - The module name.\n   * @param storeModule - The module definition to register.\n   * @internal\n   */\n  protected registerStoreModule(name: XModuleName, storeModule: AnyXStoreModule): void {\n    const storeModuleOptions = this.getPrivateXModuleOptions(name)?.storeModule ?? {};\n    const configOptions = this.getXModuleOptions(name)?.config;\n    const customizedStoreModule: Module<any, any> = this.customizeStoreModule(\n      storeModule,\n      storeModuleOptions,\n      configOptions\n    );\n    customizedStoreModule.namespaced = true;\n    this.store.registerModule(['x', name], customizedStoreModule);\n  }\n\n  /**\n   * Retrieves the overridden private options of an {@link XModule}.\n   *\n   * @param name - The module name.\n   * @returns Private options of the {@link XModule}.\n   * @internal\n   */\n  protected getPrivateXModuleOptions(\n    name: XModuleName\n  ): PrivateXModuleOptions<AnyXModule> | undefined {\n    return this.options.__PRIVATE__xModules?.[name];\n  }\n\n  /**\n   * Retrieves the overridden public options of an {@link XModule}.\n   *\n   * @param name - The module name.\n   * @returns Public options of the {@link XModule}.\n   * @internal\n   */\n  protected getXModuleOptions(name: XModuleName): XModuleOptions<any> | undefined {\n    return this.options.xModules?.[name];\n  }\n\n  /**\n   * Overrides a {@link https://vuex.vuejs.org/ | Vuex} store module definition.\n   *\n   * Priority of configuration merging.\n   * 1st {@link XPluginOptions.xModules | xModules XPlugin option}.\n   * 2nd {@link XPluginOptions.__PRIVATE__xModules | Private xModules XPlugin option}.\n   * 3rd {@link XStoreModule.state | Default state of the xModule}.\n   *\n   * @param defaultModule - The default store module to override.\n   * @param moduleOptions - The state, actions, mutations and getters to override the defaultModule.\n   * @param configOptions - The state config to override the moduleOptions.\n   * @returns The {@link XStoreModule} customized.\n   * @internal\n   */\n  protected customizeStoreModule(\n    { state: defaultState, ...actionsGettersMutations }: AnyXStoreModule,\n    { state: xModuleState, ...newActionsGettersMutations }: AnyXStoreModuleOption,\n    configOptions: unknown\n  ): AnyXStoreModule {\n    const configOptionsObject = configOptions ? { config: configOptions } : {};\n    const customizedModule = deepMerge({}, actionsGettersMutations, newActionsGettersMutations);\n    customizedModule.state = deepMerge(defaultState(), xModuleState, configOptionsObject);\n    return customizedModule;\n  }\n\n  /**\n   * Registers the store emitters, making them emit the event when the part of the state selected\n   * changes.\n   *\n   * @param name - The module name.\n   * @param storeModule - The store module to retrieve its state and getters.\n   * @param storeEmitters - The store emitters to register.\n   * @internal\n   */\n  protected registerStoreEmitters(\n    name: XModuleName,\n    storeModule: AnyXStoreModule,\n    storeEmitters: AnyStoreEmitters\n  ): void {\n    const storeEmittersOptions = this.getPrivateXModuleOptions(name)?.storeEmitters;\n    const customizedStoreEmitters: AnyStoreEmitters = storeEmittersOptions\n      ? deepMerge({}, storeEmitters, storeEmittersOptions)\n      : storeEmitters;\n    const safeGettersProxy = getGettersProxyFromModule(this.store.getters, name, storeModule);\n    forEach(\n      customizedStoreEmitters,\n      (event, stateSelector: AnySimpleStateSelector | AnyStateSelector) => {\n        const { selector, immediate, filter, ...options } =\n          this.normalizeStateSelector(stateSelector);\n\n        this.store.watch(\n          state => selector(state.x[name], safeGettersProxy),\n          (newValue, oldValue) => {\n            if (filter(newValue, oldValue)) {\n              this.bus.emit(event, newValue, { moduleName: name });\n            }\n          },\n          options\n        );\n\n        if (immediate) {\n          Promise.resolve().then(() => {\n            this.bus.emit(event, selector(this.store.state.x[name], safeGettersProxy));\n          });\n        }\n      }\n    );\n  }\n\n  /**\n   * Transforms a {@link AnySimpleStateSelector} into a {@link AnyStateSelector}, and sets\n   * default values for its properties.\n   *\n   * @param stateSelector - The state selector to normalize.\n   * @returns A {@link AnyStateSelector} with all the properties set.\n   * @internal\n   */\n  protected normalizeStateSelector(\n    stateSelector: AnySimpleStateSelector | AnyStateSelector\n  ): Required<AnyStateSelector> {\n    const normalizedSelector = this.isSimpleSelector(stateSelector)\n      ? { selector: stateSelector }\n      : stateSelector;\n    return {\n      deep: false,\n      immediate: false,\n      filter: () => true,\n      ...normalizedSelector\n    };\n  }\n\n  /**\n   * Registers the {@link https://vuex.vuejs.org/ | Vuex} store. If the store has not been passed\n   * through the {@link XPluginOptions} object, it creates one, and injects it in the Vue\n   * prototype. Then it register an x module in the store, to safe scope all the\n   * {@link XModule | XModules} dynamically installed.\n   *\n   * @internal\n   */\n  protected registerStore(): void {\n    this.vue.use(Vuex); // We can safely install Vuex because if it is already installed Vue\n    // will simply ignore it\n    this.store =\n      this.options.store ??\n      new Store({\n        strict: process.env.NODE_ENV !== 'production'\n      });\n    if (!this.options.store) {\n      this.vue.prototype.$store = this.store;\n    }\n    this.store.registerModule('x', RootXStoreModule);\n  }\n\n  /**\n   * Applies the {@link createXComponentAPIMixin} mixin in the global Vue.\n   *\n   * @internal\n   */\n  protected applyMixins(): void {\n    this.vue.mixin(createXComponentAPIMixin(this.bus));\n  }\n\n  /**\n   * Registers the initial {@link XModule | XModules} during the {@link XPlugin} installation.\n   *\n   * @internal\n   */\n  protected registerInitialModules(): void {\n    this.options.initialXModules?.forEach(xModule => {\n      this.registerXModule(xModule);\n    });\n  }\n\n  /**\n   * Registers the pending {@link XModule | XModules}, that requested to be registered before the\n   * installation of the plugin.\n   *\n   * @internal\n   */\n  protected registerPendingXModules(): void {\n    forEach(XPlugin.pendingXModules, (_, xModule) => {\n      this.registerXModule(xModule);\n    });\n    XPlugin.pendingXModules = {};\n  }\n\n  /**\n   * If the received adapter supports it, it registers a listener to emit the\n   * {@link XEventsTypes.AdapterConfigChanged} event whenever the config of it changes.\n   *\n   * @internal\n   */\n  protected createAdapterConfigChangedListener(): void {\n    this.options.adapter.addConfigChangedListener?.(newAdapterConfig => {\n      this.bus.emit('AdapterConfigChanged', newAdapterConfig);\n    });\n  }\n\n  /**\n   * Checks if a the type of the store emitter selector is simple or complex. This selector can be\n   * a function if it is simple or an object with the selector and other options if it is complex.\n   *\n   * @param stateSelector - The store emitter selector.\n   * @returns A boolean which flags if the stateSelector is simple (function) or complex (object).\n   * @internal\n   */\n  protected isSimpleSelector(\n    stateSelector: AnySimpleStateSelector | AnyStateSelector\n  ): stateSelector is AnySimpleStateSelector {\n    return typeof stateSelector === 'function';\n  }\n\n  /**\n   * Registers filters globally.\n   *\n   * @internal\n   */\n  protected registerFilters(): void {\n    forEach(FILTERS_REGISTRY, (filterName, filterFunction) =>\n      this.vue.filter(filterName, filterFunction)\n    );\n  }\n}\n\n/**\n * Vue plugin that modifies each component instance, extending them with the\n * {@link XComponentAPI | X Component API }.\n *\n * @example\n * Minimal installation example. A search adapter is needed for the plugin to work, and connect to\n * the API.\n * ```typescript\n * const adapter = new EmpathyAdapterBuilder()\n *  .withConfiguration({instance: 'my-instance-id'})\n *  .build();\n * Vue.use(xPlugin, { adapter });\n * ```\n *\n * @example\n * If you are using {@link https://vuex.vuejs.org/ | Vuex} in your project you must install its\n *   plugin, and instantiate an store before installing the XPlugin:\n * ```typescript\n * Vue.use(Vuex);\n * const store = new Store({ ... });\n * Vue.use(xPlugin, { adapter, store });\n * ```\n * @public\n */\nexport const xPlugin = new XPlugin(bus);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"x-plugin.js","sources":["../../../src/plugins/x-plugin.ts"],"sourcesContent":["import { deepMerge } from '@empathyco/x-deep-merge';\nimport { forEach, Dictionary } from '@empathyco/x-utils';\nimport { PluginObject, VueConstructor } from 'vue';\nimport Vuex, { Module, Store } from 'vuex';\nimport { XComponentsAdapter } from '@empathyco/x-types';\nimport { AnyXStoreModule, RootXStoreState } from '../store/store.types';\nimport { cleanGettersProxyCache } from '../store/utils/getters-proxy.utils';\nimport { RootXStoreModule } from '../store/x.module';\nimport { XEvent } from '../wiring/events.types';\nimport { AnyWire } from '../wiring/wiring.types';\nimport { AnyXModule, XModuleName } from '../x-modules/x-modules.types';\nimport { sendWiringToDevtools } from './devtools/wiring.devtools';\nimport { bus } from './x-bus';\nimport { XBus } from './x-bus.types';\nimport { registerStoreEmitters } from './x-emitters';\nimport { createXComponentAPIMixin } from './x-plugin.mixin';\nimport { AnyXStoreModuleOption, XModuleOptions, XPluginOptions } from './x-plugin.types';\nimport { assertXPluginOptionsAreValid } from './x-plugin.utils';\n\n/**\n * Vue plugin that initializes the properties needed by the x-components, and exposes the events bus\n * and the adapter after it has been installed.\n *\n * @public\n */\nexport class XPlugin implements PluginObject<XPluginOptions> {\n  /**\n   * {@link @empathyco/x-typesm#XComponentsAdapter | XComponentsAdapter} Is the middleware\n   * between the components and our API where data can be mapped to client needs.\n   * This property is only available after installing the plugin.\n   *\n   * @returns The installed adapter.\n   * @throws If this property is accessed before calling `Vue.use(xPlugin)`.\n   * @public\n   */\n  public static get adapter(): XComponentsAdapter {\n    return this.getInstance().adapter;\n  }\n\n  /**\n   * Exposed {@link XBus}, so any kind of application can subscribe to {@link XEventsTypes}\n   * without having to pass through a component.\n   * This property is only available after installing the plugin.\n   *\n   * @returns The installed bus.\n   * @throws If this property is accessed before calling `Vue.use(xPlugin)`.\n   * @public\n   */\n  public static get bus(): XBus {\n    return this.getInstance().bus;\n  }\n\n  /**\n   * {@link https://vuex.vuejs.org | Vuex Store} Is the place where all shared data\n   * is saved.\n   *\n   * @returns The installed store.\n   * @throws If this property is accessed before calling `Vue.use(xPlugin)`.\n   * @public\n   */\n  public static get store(): Store<RootXStoreState> {\n    return this.getInstance().store;\n  }\n\n  /**\n   * Safely retrieves the installed instance of the XPlugin.\n   *\n   * @returns The installed instance of the XPlugin.\n   * @throws If this method is called before calling `Vue.use(xPlugin)`.\n   * @internal\n   */\n  protected static getInstance(): XPlugin {\n    if (!this.instance) {\n      throw Error(\"XPlugin must be installed before accessing it's API.\");\n    }\n    return this.instance;\n  }\n\n  /**\n   * Record of modules that have been tried to be installed before the installation of the plugin.\n   *\n   * @internal\n   */\n  protected static pendingXModules: Partial<Record<XModuleName, AnyXModule>> = {};\n\n  /**\n   * Instance of the installed plugin. Used to expose the bus and the adapter.\n   *\n   * @internal\n   */\n  protected static instance?: XPlugin;\n\n  public wiring: Partial<Record<XModuleName, Partial<Record<XEvent, string[]>>>> = {};\n  /**\n   * Bus for retrieving the observables when registering the wiring.\n   *\n   * @internal\n   */\n  protected bus: XBus;\n\n  /**\n   * Adapter for the API, responsible for transforming requests and responses.\n   *\n   * @internal\n   */\n  protected adapter!: XComponentsAdapter;\n\n  /**\n   * Set of the already installed {@link XModule | XModules} to avoid re-registering them.\n   *\n   * @internal\n   */\n  protected installedXModules = new Set<string>();\n\n  /**\n   * True if the plugin has been installed in a Vue instance, in this case\n   * {@link XModule |Xmodules} will be installed immediately. False otherwise, in this case\n   * {@link XModule | XModules} will be installed lazily when the {@link XPlugin#install} method\n   * is called.\n   *\n   * @internal\n   */\n  protected isInstalled = false;\n\n  /**\n   * The installation options of the plugin, where all the customization of\n   * {@link XModule | XModules} is done.\n   *\n   * @internal\n   */\n  protected options!: XPluginOptions;\n\n  /**\n   * The Vuex store, to pass to the wires for its registration, and to register the store\n   * modules on it.\n   *\n   * @internal\n   */\n  protected store!: Store<any>;\n  /**\n   * The global Vue, passed by the installation method. Used to apply the global mixin\n   * {@link createXComponentAPIMixin}, and install the {@link https://vuex.vuejs.org/ | Vuex}\n   * plugin.\n   *\n   * @internal\n   */\n  protected vue!: VueConstructor;\n\n  /**\n   * Creates a new instance of the XPlugin with the given bus passed as parameter.\n   *\n   * @param bus - The {@link XBus} implementation to use for the plugin.\n   *\n   * @public\n   */\n  public constructor(bus: XBus) {\n    this.bus = bus;\n  }\n\n  /**\n   * If the plugin has already been installed, it immediately registers a {@link XModule}. If it\n   * has not been installed yet, it stores the module in a list until the plugin is installed.\n   *\n   * @param xModule - The module to register.\n   *\n   * @public\n   */\n  static registerXModule(xModule: AnyXModule): void {\n    if (this.instance) {\n      this.instance.registerXModule(xModule);\n    } else {\n      this.lazyRegisterXModule(xModule);\n    }\n  }\n\n  /**\n   * Utility method for resetting the installed instance of the plugin.\n   *\n   * @remarks Use only for testing.\n   *\n   * @internal\n   */\n  static resetInstance(): void {\n    cleanGettersProxyCache();\n    this.instance = undefined;\n  }\n\n  /**\n   * Stores the {@link XModule} in a dictionary, so it can be registered later in the installation\n   * process.\n   *\n   * @param xModule - The module to register.\n   *\n   * @internal\n   */\n  protected static lazyRegisterXModule(xModule: AnyXModule): void {\n    this.pendingXModules[xModule.name] = xModule;\n  }\n\n  /**\n   * Installs the plugin into the Vue instance.\n   *\n   * @param vue - The GlobalVue object.\n   * @param options - The options to install this plugin with.\n   * @throws If the XPlugin has already been installed, or the options are not valid.\n   *\n   * @internal\n   */\n  install(vue: VueConstructor, options?: XPluginOptions): void {\n    if (this.isInstalled) {\n      throw new Error('XPlugin has already been installed');\n    }\n    assertXPluginOptionsAreValid(options);\n    XPlugin.instance = this;\n    this.vue = vue;\n    this.options = options;\n    this.adapter = options.adapter;\n    this.registerStore();\n    this.applyMixins();\n    this.registerInitialModules();\n    this.registerPendingXModules();\n    this.isInstalled = true;\n  }\n\n  /**\n   * Performs the registration of a {@link XModule}.\n   *\n   * @param xModule - The module to register.\n   *\n   * @internal\n   */\n  protected registerXModule(xModule: AnyXModule): void {\n    if (!this.installedXModules.has(xModule.name)) {\n      const customizedXModule = this.customizeXModule(xModule);\n      this.registerStoreModule(customizedXModule);\n      this.registerStoreEmitters(customizedXModule);\n      // The wiring must be registered after the store emitters\n      // to allow lazy loaded modules work properly.\n      this.registerWiring(customizedXModule);\n      this.installedXModules.add(xModule.name);\n      this.bus.emit('ModuleRegistered', xModule.name);\n    }\n  }\n\n  /**\n   * Performs a customization of a {@link XModule} using the XPlugin public and private options.\n   *\n   * @param xModule - The module to customize.\n   * @returns The customized xModule.\n   *\n   * @internal\n   */\n  protected customizeXModule({\n    name,\n    wiring,\n    storeModule,\n    storeEmitters,\n    ...restXModule\n  }: AnyXModule): AnyXModule {\n    const { wiring: wiringOptions, config }: XModuleOptions<XModuleName> =\n      this.options.xModules?.[name] ?? {};\n\n    const { storeModule: storeModuleOptions, storeEmitters: emittersOptions } =\n      this.options.__PRIVATE__xModules?.[name] ?? {};\n\n    return {\n      name,\n      wiring: wiringOptions ? deepMerge({}, wiring, wiringOptions) : wiring,\n      storeModule: this.customizeStoreModule(storeModule, storeModuleOptions ?? {}, config),\n      storeEmitters: emittersOptions\n        ? deepMerge({}, storeEmitters, emittersOptions)\n        : storeEmitters,\n      ...restXModule\n    };\n  }\n\n  /**\n   * Performs the registration of the wiring, retrieving the observable for each event, and\n   * executing each wire.\n   *\n   * @param xModule - The {@link XModule} to register its wiring.\n   *\n   * @internal\n   */\n  protected registerWiring({ wiring, name }: AnyXModule): void {\n    sendWiringToDevtools(name, wiring);\n    forEach(wiring, (event, wires: Dictionary<AnyWire>) => {\n      // Obtain the observable\n      const observable = this.bus.on(event, true);\n      // Register event wires\n      forEach(wires, (_, wire) => {\n        wire(observable, this.store, this.bus.on.bind(this.bus));\n      });\n    });\n  }\n\n  /**\n   * Registers a {@link https://vuex.vuejs.org/ | Vuex} store module under the 'x' module.\n   *\n   * @param xModule - The {@link XModule} to register its Store Module.\n   *\n   * @internal\n   */\n  protected registerStoreModule({ name, storeModule }: AnyXModule): void {\n    (storeModule as Module<any, any>).namespaced = true;\n    this.store.registerModule(['x', name], storeModule);\n  }\n\n  /**\n   * Overrides a {@link https://vuex.vuejs.org/ | Vuex} store module definition.\n   *\n   * Priority of configuration merging.\n   * 1st {@link XPluginOptions.xModules | xModules XPlugin option}.\n   * 2nd {@link XPluginOptions.__PRIVATE__xModules | Private xModules XPlugin option}.\n   * 3rd {@link XStoreModule.state | Default state of the xModule}.\n   *\n   * @param defaultModule - The default store module to override.\n   * @param moduleOptions - The state, actions, mutations and getters to override the defaultModule.\n   * @param configOptions - The state config to override the moduleOptions.\n   * @returns The {@link XStoreModule} customized.\n   *\n   * @internal\n   */\n  protected customizeStoreModule(\n    { state: defaultState, ...actionsGettersMutations }: AnyXStoreModule,\n    { state: xModuleState, ...newActionsGettersMutations }: AnyXStoreModuleOption,\n    configOptions: unknown\n  ): AnyXStoreModule {\n    const configOptionsObject = configOptions ? { config: configOptions } : {};\n    const customizedModule = deepMerge({}, actionsGettersMutations, newActionsGettersMutations);\n    customizedModule.state = deepMerge(defaultState(), xModuleState, configOptionsObject);\n    return customizedModule;\n  }\n\n  /**\n   * Registers the store emitters, making them emit the event when the part of the state selected\n   * changes.\n   *\n   * @param xModule - The {@link XModule} to register its Store Emitters.\n   *\n   * @internal\n   */\n  protected registerStoreEmitters(xModule: AnyXModule): void {\n    registerStoreEmitters(xModule, this.bus, this.store);\n  }\n\n  /**\n   * Registers the {@link https://vuex.vuejs.org/ | Vuex} store. If the store has not been passed\n   * through the {@link XPluginOptions} object, it creates one, and injects it in the Vue\n   * prototype. Then it registers an x module in the store, to safe scope all the\n   * {@link XModule | XModules} dynamically installed.\n   *\n   * @internal\n   */\n  protected registerStore(): void {\n    this.vue.use(Vuex); // We can safely install Vuex because if it is already installed Vue\n    // will simply ignore it\n    this.store =\n      this.options.store ??\n      new Store({\n        strict: process.env.NODE_ENV !== 'production'\n      });\n    if (!this.options.store) {\n      this.vue.prototype.$store = this.store;\n    }\n    this.store.registerModule('x', RootXStoreModule);\n  }\n\n  /**\n   * Applies the {@link createXComponentAPIMixin} mixin in the global Vue.\n   *\n   * @internal\n   */\n  protected applyMixins(): void {\n    this.vue.mixin(createXComponentAPIMixin(this.bus));\n  }\n\n  /**\n   * Registers the initial {@link XModule | XModules} during the {@link XPlugin} installation.\n   *\n   * @internal\n   */\n  protected registerInitialModules(): void {\n    this.options.initialXModules?.forEach(xModule => {\n      this.registerXModule(xModule);\n    });\n  }\n\n  /**\n   * Registers the pending {@link XModule | XModules}, that requested to be registered before the\n   * installation of the plugin.\n   *\n   * @internal\n   */\n  protected registerPendingXModules(): void {\n    forEach(XPlugin.pendingXModules, (_, xModule) => {\n      this.registerXModule(xModule);\n    });\n    XPlugin.pendingXModules = {};\n  }\n}\n\n/**\n * Vue plugin that modifies each component instance, extending them with the\n * {@link XComponentAPI | X Component API }.\n *\n * @example\n * Minimal installation example. An API adapter is needed to connect the X Components with the\n * suggestions, search, or tagging APIs. In this example we are using the default Empathy's platform\n * adapter.\n *\n * ```typescript\n *  import { platformAdapter } from '@empathyco/x-adapter-platform';\n *  Vue.use(xPlugin, { adapter: platformAdapter });\n * ```\n *\n * @example\n * If you are using {@link https://vuex.vuejs.org/ | Vuex} in your project you must install its\n *   plugin, and instantiate a store before installing the XPlugin:\n * ```typescript\n * Vue.use(Vuex);\n * const store = new Store({ ... });\n * Vue.use(xPlugin, { adapter, store });\n * ```\n * @public\n */\nexport const xPlugin = new XPlugin(bus);\n"],"names":[],"mappings":"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"}

package/js/plugins/x-plugin.mixin.js

@@ -1,4 +1,3 @@
-import { __assign } from 'tslib';
 import { getXComponentXModuleName, isXComponent } from '../components/x-component.utils.js';
 import { getAliasAPI } from './x-plugin.alias.js';
 
@@ -12,20 +11,20 @@ import { getAliasAPI } from './x-plugin.alias.js';
  * @returns Mixin options which registers the component as X-Component and the $x.
  * @internal
  */
-var createXComponentAPIMixin = function (bus) { return ({
+const createXComponentAPIMixin = (bus) => ({
     inject: {
-        $origin: {
-            from: 'origin',
+        $location: {
+            from: 'location',
             default: undefined
         }
     },
-    created: function () {
+    beforeCreate() {
         this.xComponent = getRootXComponent(this);
-        var aliasAPI = getAliasAPI(this.$store);
-        var busAPI = getBusAPI(bus, this);
+        const aliasAPI = getAliasAPI(this);
+        const busAPI = getBusAPI(bus, this);
         this.$x = Object.assign(aliasAPI, busAPI);
     }
-}); };
+});
 /**
  * Creates an object containing the API related to the {@link XBus}.
  *
@@ -37,16 +36,35 @@ var createXComponentAPIMixin = function (bus) { return ({
  */
 function getBusAPI(bus, component) {
     return {
-        emit: function (event, payload, metadata) {
-            if (metadata === void 0) { metadata = {}; }
-            var xComponent = component.xComponent;
-            var moduleName = xComponent ? getXComponentXModuleName(xComponent) : null;
-            bus.emit(event, payload, __assign({ moduleName: moduleName, origin: component.$origin }, metadata));
-            xComponent === null || xComponent === void 0 ? void 0 : xComponent.$emit(event, payload);
+        emit: (event, payload, metadata = {}) => {
+            bus.emit(event, payload, createWireMetadata(component, metadata));
+            component.xComponent?.$emit(event, payload);
         },
         on: bus.on.bind(bus)
     };
 }
+/**
+ * Creates a wire metadata object based on the component and the provided metadata.
+ *
+ * @param component - The component this metadata belongs to.
+ * @param metadata - Additional metadata emitted by the component.
+ * @returns A {@link WireMetadata} object.
+ * @internal
+ */
+function createWireMetadata(component, metadata) {
+    return Object.defineProperties({
+        moduleName: getXComponentXModuleName(component.xComponent),
+        location: component.$location,
+        ...metadata
+    }, {
+        component: {
+            value: component,
+            /* FIX-ME: defining component as a non-enumerable property to ease tests changes due to
+             * cyclic dependencies in Vue component instances. */
+            enumerable: false
+        }
+    });
+}
 /**
  * Given a component, finds the root XComponent in the ancestors hierarchy.
  *
@@ -55,7 +73,7 @@ function getBusAPI(bus, component) {
  * @public
  */
 function getRootXComponent(component) {
-    var xComponent;
+    let xComponent;
     while (component !== undefined && component !== null) {
         if (isXComponent(component)) {
             xComponent = component;

package/js/plugins/x-plugin.mixin.js.map

@@ -1 +1 @@
-{"version":3,"file":"x-plugin.mixin.js","sources":["../../../src/plugins/x-plugin.mixin.ts"],"sourcesContent":["import Vue, { ComponentOptions } from 'vue';\nimport { XComponent } from '../components/x-component.types';\nimport { getXComponentXModuleName, isXComponent } from '../components/x-component.utils';\nimport { XEvent, XEventPayload } from '../wiring/events.types';\nimport { WireMetadata } from '../wiring/wiring.types';\nimport { QueryOrigin } from '../types/query-origin';\nimport { XBus } from './x-bus.types';\nimport { getAliasAPI } from './x-plugin.alias';\nimport { XComponentAPI, XComponentBusAPI } from './x-plugin.types';\n\ndeclare module 'vue/types/vue' {\n  export interface Vue {\n    $x: XComponentAPI;\n  }\n}\n\ninterface PrivateExtendedVueComponent extends Vue {\n  xComponent: XComponent | undefined;\n  $origin: QueryOrigin;\n}\n\n/**\n * Vue global mixin that adds a `$x` object to every component with the {@link XComponentAPI}.\n *\n * @remarks It adds an injection property `origin` which value is included in the metadata of each\n * event emitted with `$x.emit`.\n *\n * @param bus - The {@link XBus} to use inside the components for emitting events.\n * @returns Mixin options which registers the component as X-Component and the $x.\n * @internal\n */\nexport const createXComponentAPIMixin = (\n  bus: XBus\n): ComponentOptions<Vue> & ThisType<PrivateExtendedVueComponent> => ({\n  inject: {\n    $origin: {\n      from: 'origin',\n      default: undefined\n    }\n  },\n  created(): void {\n    this.xComponent = getRootXComponent(this);\n    const aliasAPI = getAliasAPI(this.$store);\n    const busAPI = getBusAPI(bus, this);\n    this.$x = Object.assign(aliasAPI, busAPI);\n  }\n});\n\n/**\n * Creates an object containing the API related to the {@link XBus}.\n *\n * @param bus - The global {@link XBus}.\n * @param component - The component instance.\n *\n * @returns An object containing the {@link XComponentBusAPI}.\n * @internal\n */\nexport function getBusAPI(bus: XBus, component: PrivateExtendedVueComponent): XComponentBusAPI {\n  return {\n    emit: <Event extends XEvent>(\n      event: Event,\n      payload?: XEventPayload<Event>,\n      metadata: Omit<WireMetadata, 'moduleName'> = {}\n    ) => {\n      const xComponent = component.xComponent;\n      const moduleName = xComponent ? getXComponentXModuleName(xComponent) : null;\n      bus.emit(event, payload as any, { moduleName, origin: component.$origin, ...metadata });\n      xComponent?.$emit(event, payload);\n    },\n    on: bus.on.bind(bus)\n  };\n}\n\n/**\n * Given a component, finds the root XComponent in the ancestors hierarchy.\n *\n * @param component - The component to find its root XComponent.\n * @returns The root XComponent or undefined if it has not.\n * @public\n */\nexport function getRootXComponent(component: Vue): XComponent | undefined {\n  let xComponent: XComponent | undefined;\n  while (component !== undefined && component !== null) {\n    if (isXComponent(component)) {\n      xComponent = component;\n    }\n    component = component.$parent;\n  }\n  return xComponent;\n}\n"],"names":[],"mappings":";;;;AAqBA;;;;;;;;;;IAUa,wBAAwB,GAAG,UACtC,GAAS,IACyD,QAAC;IACnE,MAAM,EAAE;QACN,OAAO,EAAE;YACP,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,SAAS;SACnB;KACF;IACD,OAAO,EAAP;QACE,IAAI,CAAC,UAAU,GAAG,iBAAiB,CAAC,IAAI,CAAC,CAAC;QAC1C,IAAM,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC1C,IAAM,MAAM,GAAG,SAAS,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;QACpC,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;KAC3C;CACF,KAAE;AAEH;;;;;;;;;SASgB,SAAS,CAAC,GAAS,EAAE,SAAsC;IACzE,OAAO;QACL,IAAI,EAAE,UACJ,KAAY,EACZ,OAA8B,EAC9B,QAA+C;YAA/C,yBAAA,EAAA,aAA+C;YAE/C,IAAM,UAAU,GAAG,SAAS,CAAC,UAAU,CAAC;YACxC,IAAM,UAAU,GAAG,UAAU,GAAG,wBAAwB,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC;YAC5E,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,OAAc,aAAI,UAAU,YAAA,EAAE,MAAM,EAAE,SAAS,CAAC,OAAO,IAAK,QAAQ,EAAG,CAAC;YACxF,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;SACnC;QACD,EAAE,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC;KACrB,CAAC;AACJ,CAAC;AAED;;;;;;;SAOgB,iBAAiB,CAAC,SAAc;IAC9C,IAAI,UAAkC,CAAC;IACvC,OAAO,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,IAAI,EAAE;QACpD,IAAI,YAAY,CAAC,SAAS,CAAC,EAAE;YAC3B,UAAU,GAAG,SAAS,CAAC;SACxB;QACD,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC;KAC/B;IACD,OAAO,UAAU,CAAC;AACpB;;;;"}
+{"version":3,"file":"x-plugin.mixin.js","sources":["../../../src/plugins/x-plugin.mixin.ts"],"sourcesContent":["import Vue, { ComponentOptions } from 'vue';\nimport { Store } from 'vuex';\nimport { getXComponentXModuleName, isXComponent } from '../components/x-component.utils';\nimport { RootXStoreState } from '../store/store.types';\nimport { XEvent, XEventPayload } from '../wiring/events.types';\nimport { WireMetadata } from '../wiring/wiring.types';\nimport { FeatureLocation } from '../types/origin';\nimport { XModuleName } from '../x-modules/x-modules.types';\nimport { XBus } from './x-bus.types';\nimport { getAliasAPI } from './x-plugin.alias';\nimport { XComponentAPI, XComponentBusAPI } from './x-plugin.types';\n\ndeclare module 'vue/types/vue' {\n  export interface Vue {\n    $x: XComponentAPI;\n  }\n}\n\ndeclare module 'vue/types/options' {\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  export interface ComponentOptions<V, Data, Methods, Computed, PropsDef, Props> {\n    xModule?: XModuleName;\n  }\n}\n\ninterface PrivateExtendedVueComponent extends Vue {\n  $location?: FeatureLocation;\n  $store: Store<{ x: Partial<RootXStoreState['x']> }>;\n  xComponent: Vue | undefined;\n}\n\n/**\n * Vue global mixin that adds a `$x` object to every component with the {@link XComponentAPI}.\n *\n * @remarks It adds an injection property `origin` which value is included in the metadata of each\n * event emitted with `$x.emit`.\n *\n * @param bus - The {@link XBus} to use inside the components for emitting events.\n * @returns Mixin options which registers the component as X-Component and the $x.\n * @internal\n */\nexport const createXComponentAPIMixin = (\n  bus: XBus\n): ComponentOptions<Vue> & ThisType<PrivateExtendedVueComponent> => ({\n  inject: {\n    $location: {\n      from: 'location',\n      default: undefined\n    }\n  },\n  beforeCreate(this: PrivateExtendedVueComponent) {\n    this.xComponent = getRootXComponent(this);\n    const aliasAPI = getAliasAPI(this);\n    const busAPI = getBusAPI(bus, this);\n    this.$x = Object.assign(aliasAPI, busAPI);\n  }\n});\n\n/**\n * Creates an object containing the API related to the {@link XBus}.\n *\n * @param bus - The global {@link XBus}.\n * @param component - The component instance.\n *\n * @returns An object containing the {@link XComponentBusAPI}.\n * @internal\n */\nexport function getBusAPI(bus: XBus, component: PrivateExtendedVueComponent): XComponentBusAPI {\n  return {\n    emit: <Event extends XEvent>(\n      event: Event,\n      payload?: XEventPayload<Event>,\n      metadata: Omit<WireMetadata, 'moduleName'> = {}\n    ) => {\n      bus.emit(event, payload as any, createWireMetadata(component, metadata));\n      component.xComponent?.$emit(event, payload);\n    },\n    on: bus.on.bind(bus)\n  };\n}\n\n/**\n * Creates a wire metadata object based on the component and the provided metadata.\n *\n * @param component - The component this metadata belongs to.\n * @param metadata - Additional metadata emitted by the component.\n * @returns A {@link WireMetadata} object.\n * @internal\n */\nfunction createWireMetadata(\n  component: PrivateExtendedVueComponent,\n  metadata: Partial<WireMetadata>\n): WireMetadata {\n  return Object.defineProperties(\n    {\n      moduleName: getXComponentXModuleName(component.xComponent),\n      location: component.$location,\n      ...metadata\n    },\n    {\n      component: {\n        value: component,\n        /* FIX-ME: defining component as a non-enumerable property to ease tests changes due to\n         * cyclic dependencies in Vue component instances. */\n        enumerable: false\n      }\n    }\n  );\n}\n\n/**\n * Given a component, finds the root XComponent in the ancestors hierarchy.\n *\n * @param component - The component to find its root XComponent.\n * @returns The root XComponent or undefined if it has not.\n * @public\n */\nexport function getRootXComponent(component: Vue): Vue | undefined {\n  let xComponent: Vue | undefined;\n  while (component !== undefined && component !== null) {\n    if (isXComponent(component)) {\n      xComponent = component;\n    }\n    component = component.$parent;\n  }\n  return xComponent;\n}\n"],"names":[],"mappings":";;;AA+BA;;;;;;;;;;MAUa,wBAAwB,GAAG,CACtC,GAAS,MAC0D;IACnE,MAAM,EAAE;QACN,SAAS,EAAE;YACT,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,SAAS;SACnB;KACF;IACD,YAAY;QACV,IAAI,CAAC,UAAU,GAAG,iBAAiB,CAAC,IAAI,CAAC,CAAC;QAC1C,MAAM,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC;QACnC,MAAM,MAAM,GAAG,SAAS,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;QACpC,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;KAC3C;CACF,EAAE;AAEH;;;;;;;;;SASgB,SAAS,CAAC,GAAS,EAAE,SAAsC;IACzE,OAAO;QACL,IAAI,EAAE,CACJ,KAAY,EACZ,OAA8B,EAC9B,WAA6C,EAAE;YAE/C,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,OAAc,EAAE,kBAAkB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;YACzE,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;SAC7C;QACD,EAAE,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC;KACrB,CAAC;AACJ,CAAC;AAED;;;;;;;;AAQA,SAAS,kBAAkB,CACzB,SAAsC,EACtC,QAA+B;IAE/B,OAAO,MAAM,CAAC,gBAAgB,CAC5B;QACE,UAAU,EAAE,wBAAwB,CAAC,SAAS,CAAC,UAAU,CAAC;QAC1D,QAAQ,EAAE,SAAS,CAAC,SAAS;QAC7B,GAAG,QAAQ;KACZ,EACD;QACE,SAAS,EAAE;YACT,KAAK,EAAE,SAAS;;;YAGhB,UAAU,EAAE,KAAK;SAClB;KACF,CACF,CAAC;AACJ,CAAC;AAED;;;;;;;SAOgB,iBAAiB,CAAC,SAAc;IAC9C,IAAI,UAA2B,CAAC;IAChC,OAAO,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,IAAI,EAAE;QACpD,IAAI,YAAY,CAAC,SAAS,CAAC,EAAE;YAC3B,UAAU,GAAG,SAAS,CAAC;SACxB;QACD,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC;KAC/B;IACD,OAAO,UAAU,CAAC;AACpB;;;;"}

package/js/plugins/x-plugin.utils.js

@@ -24,7 +24,7 @@ function assertXPluginOptionsAreValid(options) {
  * @public
  */
 function getGetterPath(moduleName, getterName) {
-    return "x/" + moduleName + "/" + getterName;
+    return `x/${moduleName}/${getterName}`;
 }
 
 export { assertXPluginOptionsAreValid, getGetterPath };

package/js/plugins/x-plugin.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"x-plugin.utils.js","sources":["../../../src/plugins/x-plugin.utils.ts"],"sourcesContent":["import { ExtractGetters, XModuleName } from '../x-modules/x-modules.types';\nimport { XPluginOptions } from './x-plugin.types';\n\n/**\n * Asserts that the passed options object is valid, providing helpful error messages.\n *\n * @param options - The options to check if they are valid.\n */\nexport function assertXPluginOptionsAreValid(\n  options: XPluginOptions | undefined\n): asserts options is XPluginOptions {\n  if (!options) {\n    throw new Error(\n      // eslint-disable-next-line max-len\n      'XPlugin needs to be installed with an options object containing at least an adapter. Please provide a valid object'\n    );\n  }\n\n  if (options.adapter == null) {\n    throw new Error(\n      // eslint-disable-next-line max-len\n      \"The options object doesn't seem to have an adapter. Please, create one and pass it through the options object\"\n    );\n  }\n}\n\n/**\n * Generates a getter path string with the module and getter name.\n *\n * @param moduleName - The module name the getter belongs to.\n * @param getterName - The getter name.\n * @returns A string representing the getter path.\n * @public\n */\nexport function getGetterPath<ModuleName extends XModuleName>(\n  moduleName: ModuleName,\n  getterName: keyof ExtractGetters<ModuleName>\n): string {\n  return `x/${moduleName}/${getterName as string}`;\n}\n"],"names":[],"mappings":"AAGA;;;;;SAKgB,4BAA4B,CAC1C,OAAmC;IAEnC,IAAI,CAAC,OAAO,EAAE;QACZ,MAAM,IAAI,KAAK;;QAEb,oHAAoH,CACrH,CAAC;KACH;IAED,IAAI,OAAO,CAAC,OAAO,IAAI,IAAI,EAAE;QAC3B,MAAM,IAAI,KAAK;;QAEb,+GAA+G,CAChH,CAAC;KACH;AACH,CAAC;AAED;;;;;;;;SAQgB,aAAa,CAC3B,UAAsB,EACtB,UAA4C;IAE5C,OAAO,OAAK,UAAU,SAAI,UAAsB,CAAC;AACnD;;;;"}
+{"version":3,"file":"x-plugin.utils.js","sources":["../../../src/plugins/x-plugin.utils.ts"],"sourcesContent":["import { ExtractGetters, XModuleName } from '../x-modules/x-modules.types';\nimport { XPluginOptions } from './x-plugin.types';\n\n/**\n * Asserts that the passed options object is valid, providing helpful error messages.\n *\n * @param options - The options to check if they are valid.\n */\nexport function assertXPluginOptionsAreValid(\n  options: XPluginOptions | undefined\n): asserts options is XPluginOptions {\n  if (!options) {\n    throw new Error(\n      // eslint-disable-next-line max-len\n      'XPlugin needs to be installed with an options object containing at least an adapter. Please provide a valid object'\n    );\n  }\n\n  if (options.adapter == null) {\n    throw new Error(\n      // eslint-disable-next-line max-len\n      \"The options object doesn't seem to have an adapter. Please, create one and pass it through the options object\"\n    );\n  }\n}\n\n/**\n * Generates a getter path string with the module and getter name.\n *\n * @param moduleName - The module name the getter belongs to.\n * @param getterName - The getter name.\n * @returns A string representing the getter path.\n * @public\n */\nexport function getGetterPath<ModuleName extends XModuleName>(\n  moduleName: ModuleName,\n  getterName: keyof ExtractGetters<ModuleName>\n): string {\n  return `x/${moduleName}/${getterName as string}`;\n}\n"],"names":[],"mappings":"AAGA;;;;;SAKgB,4BAA4B,CAC1C,OAAmC;IAEnC,IAAI,CAAC,OAAO,EAAE;QACZ,MAAM,IAAI,KAAK;;QAEb,oHAAoH,CACrH,CAAC;KACH;IAED,IAAI,OAAO,CAAC,OAAO,IAAI,IAAI,EAAE;QAC3B,MAAM,IAAI,KAAK;;QAEb,+GAA+G,CAChH,CAAC;KACH;AACH,CAAC;AAED;;;;;;;;SAQgB,aAAa,CAC3B,UAAsB,EACtB,UAA4C;IAE5C,OAAO,KAAK,UAAU,IAAI,UAAoB,EAAE,CAAC;AACnD;;;;"}

package/js/services/directional-focus-navigation.service.js

@@ -1,18 +1,18 @@
-import { __assign } from 'tslib';
+import { FOCUSABLE_SELECTORS } from '../utils/focus.js';
 
 /**
  * Implementation of {@link SpatialNavigation} using directional focus.
  *
  * @public
  */
-var DirectionalFocusNavigationService = /** @class */ (function () {
+class DirectionalFocusNavigationService {
     /**
      * Constructor for the {@link DirectionalFocusNavigationService}.
      *
      * @param container - The element that contains the navigable elements.
      * @param focusableSelectors - A comma separated string with the focusable selectors to look up.
      */
-    function DirectionalFocusNavigationService(
+    constructor(
     /**
      * The {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement | HTMLElement} that
      * contains the navigable elements.
@@ -21,10 +21,7 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
     /**
      * Comma separated focusable selectors to look up.
      */
-    // eslint-disable-next-line max-len
-    focusableSelectors) {
-        var _this = this;
-        if (focusableSelectors === void 0) { focusableSelectors = 'a, button, details, input, textarea, select, [tabindex]:not([tabindex="-1"])'; }
+    focusableSelectors = FOCUSABLE_SELECTORS) {
         this.container = container;
         this.focusableSelectors = focusableSelectors;
         /**
@@ -56,10 +53,10 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
          * Set of functions to filter out candidates based on the navigation's direction.
          */
         this.filterFunction = {
-            ArrowUp: function (candidateRect) { return _this.isBelow(_this.originRect, candidateRect); },
-            ArrowRight: function (candidateRect) { return _this.isRightSide(candidateRect, _this.originRect); },
-            ArrowDown: function (candidateRect) { return _this.isBelow(candidateRect, _this.originRect); },
-            ArrowLeft: function (candidateRect) { return _this.isRightSide(_this.originRect, candidateRect); }
+            ArrowUp: (candidateRect) => this.isBelow(this.originRect, candidateRect),
+            ArrowRight: (candidateRect) => this.isRightSide(candidateRect, this.originRect),
+            ArrowDown: (candidateRect) => this.isBelow(candidateRect, this.originRect),
+            ArrowLeft: (candidateRect) => this.isRightSide(this.originRect, candidateRect)
         };
     }
     /**
@@ -71,21 +68,21 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      *
      * @returns The element to navigate to.
      */
-    DirectionalFocusNavigationService.prototype.navigateTo = function (arrowKey) {
-        var rawCandidates = this.getFocusableElements();
+    navigateTo(arrowKey) {
+        const rawCandidates = this.getFocusableElements();
         this.direction = arrowKey;
         this.updateOrigin();
         return this.getBestCandidate(rawCandidates);
-    };
+    }
     /**
      * Gets focusable elements within the container.
      *
      * @returns List of focusable elements.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.getFocusableElements = function () {
+    getFocusableElements() {
         return Array.from(this.container.querySelectorAll(this.focusableSelectors));
-    };
+    }
     /**
      * Updates the origin with the current document active element.
      *
@@ -93,11 +90,11 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * This also covers cases when the user might have iterated through the DOM using the TAB or
      * SHIFT+TAB keys.
      */
-    DirectionalFocusNavigationService.prototype.updateOrigin = function () {
-        var newOrigin = document.activeElement;
+    updateOrigin() {
+        const newOrigin = document.activeElement;
         this.origin = newOrigin;
         this.originRect = newOrigin.getBoundingClientRect();
-    };
+    }
     /**
      * Finds the closest candidate to the origin from a list of candidates.
      *
@@ -109,19 +106,18 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns The closest candidate to the origin or origin if there's none.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.getBestCandidate = function (rawCandidates) {
-        var _this = this;
-        var candidates = this.filterCandidates(rawCandidates);
-        var bestCandidate = this.origin;
-        candidates.reduce(function (bestCurrentScore, candidate) {
-            var bestScore = Math.min(bestCurrentScore, _this.getDistanceScore(candidate));
+    getBestCandidate(rawCandidates) {
+        const candidates = this.filterCandidates(rawCandidates);
+        let bestCandidate = this.origin;
+        candidates.reduce((bestCurrentScore, candidate) => {
+            const bestScore = Math.min(bestCurrentScore, this.getDistanceScore(candidate));
             if (bestScore !== bestCurrentScore) {
                 bestCandidate = candidate;
             }
             return bestScore;
         }, Number.MAX_SAFE_INTEGER);
         return bestCandidate;
-    };
+    }
     /**
      * Filters out candidates that can't be candidates based on the direction of the navigation and
      * if they are visible and enabled.
@@ -131,10 +127,9 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns List of filtered candidates.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.filterCandidates = function (rawCandidates) {
-        var _this = this;
-        return rawCandidates.filter(function (candidate) { return _this.isValidCandidate(candidate); });
-    };
+    filterCandidates(rawCandidates) {
+        return rawCandidates.filter(candidate => this.isValidCandidate(candidate));
+    }
     /**
      * Checks if the provided candidate is not the origin, is visible, enabled  and in the correct
      * direction to be a valid candidate.
@@ -143,12 +138,12 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns If the candidate is valid for the navigation.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.isValidCandidate = function (candidate) {
+    isValidCandidate(candidate) {
         return (candidate !== this.origin &&
             this.isCandidateVisible(candidate) &&
             this.hasFocusCompatibleAttributes(candidate) &&
             this.isInNavigateDirection(candidate));
-    };
+    }
     /**
      * Checks if the provided candidate is visible.
      *
@@ -156,12 +151,12 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns If the candidate is visible.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.isCandidateVisible = function (candidate) {
-        var candidateStyle = window.getComputedStyle(candidate, null);
+    isCandidateVisible(candidate) {
+        const candidateStyle = window.getComputedStyle(candidate, null);
         return !!(candidate.offsetWidth &&
             candidate.offsetHeight &&
             candidateStyle.visibility === 'visible');
-    };
+    }
     /**
      * Checks if the provided candidate is disabled and if the tabindex allows the element to be
      * focused.
@@ -170,9 +165,9 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns If candidate's attributes allow it to be focused.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.hasFocusCompatibleAttributes = function (candidate) {
+    hasFocusCompatibleAttributes(candidate) {
         return !candidate.getAttribute('disabled') && candidate.getAttribute('tabindex') !== '-1';
-    };
+    }
     /**
      * Checks if the provided candidate is in the direction the navigation is going.
      *
@@ -180,9 +175,9 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns If the candidate is in the correct direction.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.isInNavigateDirection = function (candidate) {
+    isInNavigateDirection(candidate) {
         return this.filterFunction[this.direction](candidate.getBoundingClientRect());
-    };
+    }
     /**
      * Calculates the candidate's score for it to be the next element to navigateTo to based on a
      * formula that takes into account euclidean distance, displacement, alignment and
@@ -193,19 +188,19 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns The candidate score for best candidate.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.getDistanceScore = function (candidate) {
-        var candidateRect = candidate.getBoundingClientRect();
-        var _a = this.getComparisionPoints(candidateRect), candidatePoint = _a[0], originPoint = _a[1];
-        var absoluteDistances = {
+    getDistanceScore(candidate) {
+        const candidateRect = candidate.getBoundingClientRect();
+        const { 0: candidatePoint, 1: originPoint } = this.getComparisionPoints(candidateRect);
+        const absoluteDistances = {
             x: Math.abs(candidatePoint.x - originPoint.x),
             y: Math.abs(candidatePoint.y - originPoint.y)
         };
-        var euclideanDistance = Math.sqrt(Math.pow(absoluteDistances.x, 2) + Math.pow(absoluteDistances.y, 2));
-        var intersection = this.getIntersection(this.originRect, candidateRect);
-        var _b = this.getDisplacementAndAlignment(candidateRect, intersection, absoluteDistances), displacement = _b.displacement, alignment = _b.alignment;
-        var projectedArea = Math.sqrt(intersection.area) / this.intersectionAreaWeight;
+        const euclideanDistance = Math.sqrt(Math.pow(absoluteDistances.x, 2) + Math.pow(absoluteDistances.y, 2));
+        const intersection = this.getIntersection(this.originRect, candidateRect);
+        const { displacement, alignment } = this.getDisplacementAndAlignment(candidateRect, intersection, absoluteDistances);
+        const projectedArea = Math.sqrt(intersection.area) / this.intersectionAreaWeight;
         return euclideanDistance + displacement - alignment - projectedArea;
-    };
+    }
     /**
      * Gets the closest point to origin within the candidate and to the candidate within the origin
      * based on the navigation direction.
@@ -215,13 +210,16 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns The candidate's closest Points to the origin.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.getComparisionPoints = function (candidateRect) {
-        var points = [
+    getComparisionPoints(candidateRect) {
+        const points = [
             { x: 0, y: 0 },
             { x: 0, y: 0 }
         ];
-        return __assign(__assign({}, this.setParallelPointValues(points, candidateRect)), this.setOrthogonalPointValues(points, candidateRect));
-    };
+        return {
+            ...this.setParallelPointValues(points, candidateRect),
+            ...this.setOrthogonalPointValues(points, candidateRect)
+        };
+    }
     /**
      * Set parallel values between candidate and origin based on the navigation direction and
      * returns them.
@@ -232,8 +230,7 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns Candidate and origin points with parallel values set.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.setParallelPointValues = function (_a, candidateRect) {
-        var candidatePoint = _a[0], originPoint = _a[1];
+    setParallelPointValues({ 0: candidatePoint, 1: originPoint }, candidateRect) {
         switch (this.direction) {
             case 'ArrowUp':
                 candidatePoint.y = Math.min(candidateRect.bottom, this.originRect.top);
@@ -253,7 +250,7 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
                 break;
         }
         return [candidatePoint, originPoint];
-    };
+    }
     /**
      * Set orthogonal values between candidate and origin based on the navigation direction and
      * returns them.
@@ -264,8 +261,7 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns Candidate and origin points with orthogonal values set.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.setOrthogonalPointValues = function (_a, candidateRect) {
-        var candidatePoint = _a[0], originPoint = _a[1];
+    setOrthogonalPointValues({ 0: candidatePoint, 1: originPoint }, candidateRect) {
         switch (this.direction) {
             case 'ArrowUp':
             case 'ArrowDown':
@@ -299,7 +295,7 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
                 break;
         }
         return [candidatePoint, originPoint];
-    };
+    }
     /**
      * Calculates the displacement and alignment values for the candidate relative to the origin.
      *
@@ -310,11 +306,11 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns Displacement and alignment values.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.getDisplacementAndAlignment = function (candidateRect, intersection, absoluteDistances) {
-        var areAligned = this.areAligned(this.originRect, candidateRect);
-        var alignBias = 0;
-        var orthogonalBias = 0;
-        var displacement = 0;
+    getDisplacementAndAlignment(candidateRect, intersection, absoluteDistances) {
+        const areAligned = this.areAligned(this.originRect, candidateRect);
+        let alignBias = 0;
+        let orthogonalBias = 0;
+        let displacement = 0;
         switch (this.direction) {
             case 'ArrowUp':
             case 'ArrowDown':
@@ -337,8 +333,8 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
                 displacement = (absoluteDistances.y + orthogonalBias) * this.orthogonalWeightHorizontal;
                 break;
         }
-        return { displacement: displacement, alignment: alignBias * this.alignWeight };
-    };
+        return { displacement, alignment: alignBias * this.alignWeight };
+    }
     /**
      * Calculates the projected intersection between two
      * {@link https://developer.mozilla.org/en-US/docs/Web/API/DOMRect | rects}.
@@ -349,13 +345,13 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns The intersection.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.getIntersection = function (rect1, rect2) {
-        var intersection = { width: 0, height: 0, area: 0 };
-        var topLeftPoint = {
+    getIntersection(rect1, rect2) {
+        const intersection = { width: 0, height: 0, area: 0 };
+        const topLeftPoint = {
             x: Math.max(rect1.left, rect2.left),
             y: Math.max(rect1.top, rect2.top)
         };
-        var bottomRightPoint = {
+        const bottomRightPoint = {
             x: Math.min(rect1.right, rect2.right),
             y: Math.min(rect1.bottom, rect2.bottom)
         };
@@ -365,7 +361,7 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
             intersection.area = intersection.width * intersection.height;
         }
         return intersection;
-    };
+    }
     /**
      * Checks that both DOMRect are aligned based on the provided direction.
      *
@@ -375,11 +371,11 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns If the DOMRect are aligned.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.areAligned = function (rect1, rect2) {
+    areAligned(rect1, rect2) {
         return this.direction === 'ArrowLeft' || this.direction === 'ArrowRight'
             ? rect1.bottom > rect2.top && rect1.top < rect2.bottom
             : rect1.right > rect2.left && rect1.left < rect2.right;
-    };
+    }
     /**
      * Checks that the first DOMRect is below the second one.
      *
@@ -389,13 +385,13 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns If it's below.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.isBelow = function (rect1, rect2) {
+    isBelow(rect1, rect2) {
         return (rect1.top >= rect2.bottom ||
             (rect1.top >= rect2.top &&
                 rect1.bottom > rect2.bottom &&
                 rect1.left < rect2.right &&
                 rect1.right > rect2.left));
-    };
+    }
     /**
      * Checks that the first DOMRect is to the right side of the second one.
      *
@@ -405,15 +401,14 @@ var DirectionalFocusNavigationService = /** @class */ (function () {
      * @returns If it's to the right side.
      * @internal
      */
-    DirectionalFocusNavigationService.prototype.isRightSide = function (rect1, rect2) {
+    isRightSide(rect1, rect2) {
         return (rect1.left >= rect2.right ||
             (rect1.left >= rect2.left &&
                 rect1.right > rect2.right &&
                 rect1.bottom > rect2.top &&
                 rect1.top < rect2.bottom));
-    };
-    return DirectionalFocusNavigationService;
-}());
+    }
+}
 
 export { DirectionalFocusNavigationService };
 //# sourceMappingURL=directional-focus-navigation.service.js.map