@empathyco/x-components 3.0.0-alpha.30 → 3.0.0-alpha.301

package/js/plugins/devtools/devtools.plugin.js

@@ -0,0 +1,31 @@
+import { setupDevtoolsPlugin } from '@vue/devtools-api';
+import { setupTimelinePlugin } from './timeline.devtools.js';
+import { setupWiringDevtools } from './wiring.devtools.js';
+
+/**
+ * Setups a plugin for the Vue's devtools adding:
+ * - {@link XEvent}s timeline. Every event is recorded in time, and its payload and metadata can be
+ * inspected.
+ * - Wiring inspector. Events and its wires can be viewed and disabled.
+ *
+ * @param app - The Vue application the devtools should track.
+ * @beta
+ */
+function setupDevtools(app) {
+    setupDevtoolsPlugin({
+        id: 'x-components-devtools-plugin',
+        label: 'X Components',
+        packageName: '@empathyco/x-components',
+        homepage: 'https://empathy.co',
+        enableEarlyProxy: true,
+        app: app // FIXME: Infinite loop with types when inferred as a Vue2 app.
+    }, api => {
+        if (api) {
+            setupTimelinePlugin(api);
+            setupWiringDevtools(api);
+        }
+    });
+}
+
+export { setupDevtools };
+//# sourceMappingURL=devtools.plugin.js.map

package/js/plugins/devtools/devtools.plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtools.plugin.js","sources":["../../../../src/plugins/devtools/devtools.plugin.ts"],"sourcesContent":["import { setupDevtoolsPlugin, App } from '@vue/devtools-api';\nimport Vue from 'vue';\nimport { setupTimelinePlugin } from './timeline.devtools';\nimport { setupWiringDevtools } from './wiring.devtools';\n\n/**\n * Setups a plugin for the Vue's devtools adding:\n * - {@link XEvent}s timeline. Every event is recorded in time, and its payload and metadata can be\n * inspected.\n * - Wiring inspector. Events and its wires can be viewed and disabled.\n *\n * @param app - The Vue application the devtools should track.\n * @beta\n */\nexport function setupDevtools(app: Vue): void {\n  setupDevtoolsPlugin(\n    {\n      id: 'x-components-devtools-plugin',\n      label: 'X Components',\n      packageName: '@empathyco/x-components',\n      homepage: 'https://empathy.co',\n      enableEarlyProxy: true,\n      app: app as App // FIXME: Infinite loop with types when inferred as a Vue2 app.\n    },\n    api => {\n      if (api) {\n        setupTimelinePlugin(api);\n        setupWiringDevtools(api);\n      }\n    }\n  );\n}\n"],"names":[],"mappings":";;;;AAKA;;;;;;;;AAQG;AACG,SAAU,aAAa,CAAC,GAAQ,EAAA;AACpC,IAAA,mBAAmB,CACjB;AACE,QAAA,EAAE,EAAE,8BAA8B;AAClC,QAAA,KAAK,EAAE,cAAc;AACrB,QAAA,WAAW,EAAE,yBAAyB;AACtC,QAAA,QAAQ,EAAE,oBAAoB;AAC9B,QAAA,gBAAgB,EAAE,IAAI;QACtB,GAAG,EAAE,GAAU;KAChB,EACD,GAAG,IAAG;AACJ,QAAA,IAAI,GAAG,EAAE;YACP,mBAAmB,CAAC,GAAG,CAAC,CAAC;YACzB,mBAAmB,CAAC,GAAG,CAAC,CAAC;AAC1B,SAAA;AACH,KAAC,CACF,CAAC;AACJ;;;;"}

package/js/plugins/devtools/timeline.devtools.js

@@ -0,0 +1,98 @@
+import { hslToHex } from './colors.utils.js';
+
+/**
+ * Contains the devtools API.
+ */
+let devtoolsAPI;
+/**
+ * List of all the configured timeline layers for {@link XEvent}s.
+ */
+const timelineLayers = [
+    {
+        id: 'x-components-module-registered-events',
+        regex: /^ModuleRegistered$/,
+        label: 'X registered modules'
+    },
+    {
+        id: 'x-components-user-events',
+        regex: /^User/,
+        label: 'X user events'
+    },
+    {
+        id: 'x-components-request-events',
+        regex: /RequestChanged$/,
+        label: 'X request events'
+    },
+    {
+        id: 'x-components-status-change-events',
+        regex: /Changed$/,
+        label: 'X status change events'
+    },
+    {
+        id: 'x-components-miscellanea-events',
+        regex: /.*/,
+        label: 'X miscellanea events'
+    }
+];
+/** Set containing the different layer ids. */
+const layerIds = new Set(timelineLayers.map(layer => layer.id));
+/**
+ * Retrieves the timeline layer that an {@link XEvent} belongs to.
+ *
+ * @param event - The {@link XEvent} to retrieve its layer id.
+ * @returns The layer id for the {@link XEvent}.
+ */
+function getTimelineLayer(event) {
+    return timelineLayers.find(layer => layer.regex.test(event)).id;
+}
+/**
+ * Configures Vue's devtools timeline with new rows for {@link XEvent}s.
+ *
+ * @param api - Vue's devtools API.
+ * @internal
+ */
+function setupTimelinePlugin(api) {
+    devtoolsAPI = api;
+    timelineLayers.forEach(layer => api.addTimelineLayer({
+        id: layer.id,
+        label: layer.label,
+        color: hslToHex(329, 100, 50)
+    }));
+    api.on.inspectTimelineEvent(payload => {
+        if (layerIds.has(payload.layerId)) {
+            const component = payload.event.data.metadata.component;
+            if (component) {
+                api.highlightElement(component);
+            }
+        }
+    });
+}
+/**
+ * Sends the emission of an {@link XEvent} to the devtools.
+ *
+ * @param event - The emitted {@link XEvent}.
+ * @param value - An object containing both the event payload and its metadata.
+ * @internal
+ */
+function logDevtoolsXEvent(event, value) {
+    if (process.env.NODE_ENV !== 'production') {
+        devtoolsAPI?.addTimelineEvent({
+            event: {
+                title: event,
+                data: {
+                    ...value,
+                    metadata: {
+                        ...value.metadata,
+                        // FIX-ME: copying metadata.component as it is defined as a non-enumerable property.
+                        component: value.metadata.component
+                    }
+                },
+                time: devtoolsAPI?.now()
+            },
+            layerId: getTimelineLayer(event)
+        });
+    }
+}
+
+export { logDevtoolsXEvent, setupTimelinePlugin };
+//# sourceMappingURL=timeline.devtools.js.map

package/js/plugins/devtools/timeline.devtools.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"timeline.devtools.js","sources":["../../../../src/plugins/devtools/timeline.devtools.ts"],"sourcesContent":["import { DevtoolsPluginApi } from '@vue/devtools-api';\nimport { Dictionary } from '@empathyco/x-utils';\nimport { XEvent, XEventPayload } from '../../wiring/events.types';\nimport { WirePayload } from '../../wiring/wiring.types';\nimport { hslToHex } from './colors.utils';\n\n/**\n * Contains the devtools API.\n */\nlet devtoolsAPI: DevtoolsPluginApi<Dictionary> | undefined;\n\n/**\n * List of all the configured timeline layers for {@link XEvent}s.\n */\nconst timelineLayers = [\n  {\n    id: 'x-components-module-registered-events',\n    regex: /^ModuleRegistered$/,\n    label: 'X registered modules'\n  },\n  {\n    id: 'x-components-user-events',\n    regex: /^User/,\n    label: 'X user events'\n  },\n\n  {\n    id: 'x-components-request-events',\n    regex: /RequestChanged$/,\n    label: 'X request events'\n  },\n  {\n    id: 'x-components-status-change-events',\n    regex: /Changed$/,\n    label: 'X status change events'\n  },\n  {\n    id: 'x-components-miscellanea-events',\n    regex: /.*/,\n    label: 'X miscellanea events'\n  }\n];\n\n/** Set containing the different layer ids. */\nconst layerIds = new Set(timelineLayers.map(layer => layer.id));\n\n/**\n * Retrieves the timeline layer that an {@link XEvent} belongs to.\n *\n * @param event - The {@link XEvent} to retrieve its layer id.\n * @returns The layer id for the {@link XEvent}.\n */\nfunction getTimelineLayer(event: XEvent): string {\n  return timelineLayers.find(layer => layer.regex.test(event))!.id;\n}\n\n/**\n * Configures Vue's devtools timeline with new rows for {@link XEvent}s.\n *\n * @param api - Vue's devtools API.\n * @internal\n */\nexport function setupTimelinePlugin(api: DevtoolsPluginApi<Dictionary>): void {\n  devtoolsAPI = api;\n  timelineLayers.forEach(layer =>\n    api.addTimelineLayer({\n      id: layer.id,\n      label: layer.label,\n      color: hslToHex(329, 100, 50)\n    })\n  );\n  api.on.inspectTimelineEvent(payload => {\n    if (layerIds.has(payload.layerId)) {\n      const component = (<WirePayload<unknown>>payload.event.data).metadata.component;\n      if (component) {\n        api.highlightElement(component);\n      }\n    }\n  });\n}\n\n/**\n * Sends the emission of an {@link XEvent} to the devtools.\n *\n * @param event - The emitted {@link XEvent}.\n * @param value - An object containing both the event payload and its metadata.\n * @internal\n */\nexport function logDevtoolsXEvent<Event extends XEvent>(\n  event: Event,\n  value: WirePayload<XEventPayload<Event>>\n): void {\n  if (process.env.NODE_ENV !== 'production') {\n    devtoolsAPI?.addTimelineEvent({\n      event: {\n        title: event,\n        data: {\n          ...value,\n          metadata: {\n            ...value.metadata,\n            // FIX-ME: copying metadata.component as it is defined as a non-enumerable property.\n            component: value.metadata.component\n          }\n        },\n        time: devtoolsAPI?.now()\n      },\n      layerId: getTimelineLayer(event)\n    });\n  }\n}\n"],"names":[],"mappings":";;AAMA;;AAEG;AACH,IAAI,WAAsD,CAAC;AAE3D;;AAEG;AACH,MAAM,cAAc,GAAG;AACrB,IAAA;AACE,QAAA,EAAE,EAAE,uCAAuC;AAC3C,QAAA,KAAK,EAAE,oBAAoB;AAC3B,QAAA,KAAK,EAAE,sBAAsB;AAC9B,KAAA;AACD,IAAA;AACE,QAAA,EAAE,EAAE,0BAA0B;AAC9B,QAAA,KAAK,EAAE,OAAO;AACd,QAAA,KAAK,EAAE,eAAe;AACvB,KAAA;AAED,IAAA;AACE,QAAA,EAAE,EAAE,6BAA6B;AACjC,QAAA,KAAK,EAAE,iBAAiB;AACxB,QAAA,KAAK,EAAE,kBAAkB;AAC1B,KAAA;AACD,IAAA;AACE,QAAA,EAAE,EAAE,mCAAmC;AACvC,QAAA,KAAK,EAAE,UAAU;AACjB,QAAA,KAAK,EAAE,wBAAwB;AAChC,KAAA;AACD,IAAA;AACE,QAAA,EAAE,EAAE,iCAAiC;AACrC,QAAA,KAAK,EAAE,IAAI;AACX,QAAA,KAAK,EAAE,sBAAsB;AAC9B,KAAA;CACF,CAAC;AAEF;AACA,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAC,cAAc,CAAC,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC;AAEhE;;;;;AAKG;AACH,SAAS,gBAAgB,CAAC,KAAa,EAAA;AACrC,IAAA,OAAO,cAAc,CAAC,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAE,CAAC,EAAE,CAAC;AACnE,CAAC;AAED;;;;;AAKG;AACG,SAAU,mBAAmB,CAAC,GAAkC,EAAA;IACpE,WAAW,GAAG,GAAG,CAAC;IAClB,cAAc,CAAC,OAAO,CAAC,KAAK,IAC1B,GAAG,CAAC,gBAAgB,CAAC;QACnB,EAAE,EAAE,KAAK,CAAC,EAAE;QACZ,KAAK,EAAE,KAAK,CAAC,KAAK;QAClB,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;AAC9B,KAAA,CAAC,CACH,CAAC;AACF,IAAA,GAAG,CAAC,EAAE,CAAC,oBAAoB,CAAC,OAAO,IAAG;QACpC,IAAI,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;YACjC,MAAM,SAAS,GAA0B,OAAO,CAAC,KAAK,CAAC,IAAK,CAAC,QAAQ,CAAC,SAAS,CAAC;AAChF,YAAA,IAAI,SAAS,EAAE;AACb,gBAAA,GAAG,CAAC,gBAAgB,CAAC,SAAS,CAAC,CAAC;AACjC,aAAA;AACF,SAAA;AACH,KAAC,CAAC,CAAC;AACL,CAAC;AAED;;;;;;AAMG;AACa,SAAA,iBAAiB,CAC/B,KAAY,EACZ,KAAwC,EAAA;AAExC,IAAA,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;QACzC,WAAW,EAAE,gBAAgB,CAAC;AAC5B,YAAA,KAAK,EAAE;AACL,gBAAA,KAAK,EAAE,KAAK;AACZ,gBAAA,IAAI,EAAE;AACJ,oBAAA,GAAG,KAAK;AACR,oBAAA,QAAQ,EAAE;wBACR,GAAG,KAAK,CAAC,QAAQ;;AAEjB,wBAAA,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,SAAS;AACpC,qBAAA;AACF,iBAAA;AACD,gBAAA,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE;AACzB,aAAA;AACD,YAAA,OAAO,EAAE,gBAAgB,CAAC,KAAK,CAAC;AACjC,SAAA,CAAC,CAAC;AACJ,KAAA;AACH;;;;"}

package/js/plugins/devtools/wiring.devtools.js

@@ -0,0 +1,118 @@
+import { reduce, forEach } from '@empathyco/x-utils';
+import { filter } from '../../wiring/wires.operators.js';
+import { moduleColors, hslToHex } from './colors.utils.js';
+
+/** The full list of wiring nodes for the inspector. */
+const wiringNodes = {};
+/**
+ * Record of the wires enabled/disabled status.
+ */
+const wiresStatus = {};
+/**
+ * Creates tags given a node representing a wire.
+ *
+ * @param node - The inspector node representing a {@link Wire}.
+ * @returns A list of tags for the given node.
+ */
+function createWireTags({ tags = [], id }) {
+    const newTags = [...tags];
+    if (!wiresStatus[id]) {
+        newTags.push({
+            label: 'disabled',
+            backgroundColor: hslToHex(0, 88, 30),
+            textColor: hslToHex(0, 84, 90)
+        });
+    }
+    return newTags;
+}
+/**
+ * Setups an inspector in Vue's devtools to show the wiring.
+ *
+ * @param api - Vue's devtools API.
+ * @internal
+ */
+function setupWiringDevtools(api) {
+    const inspectorId = 'wiring-inspector';
+    api.addInspector({
+        id: inspectorId,
+        label: 'X-Components Wiring'
+    });
+    api.on.getInspectorTree(payload => {
+        if (payload.inspectorId !== inspectorId) {
+            return;
+        }
+        const query = payload.filter.toLowerCase();
+        payload.rootNodes = reduce(wiringNodes, (nodes, event, eventWires) => {
+            const wiresNodes = 
+            /* If there is no active search, or the event name includes the query, we include all the
+              available wires. */
+            !query || event.toLowerCase().includes(query)
+                ? eventWires
+                : eventWires.filter(node => node.label.toLowerCase().includes(payload.filter.toLowerCase()));
+            if (wiresNodes.length) {
+                nodes.push({
+                    id: event,
+                    label: event,
+                    children: wiresNodes.map(wireNode => ({
+                        ...wireNode,
+                        tags: createWireTags(wireNode)
+                    }))
+                });
+            }
+            return nodes;
+        }, []);
+    });
+    api.on.getInspectorState(payload => {
+        if (payload.inspectorId !== inspectorId) {
+            return;
+        }
+        payload.state = {
+            status: [
+                {
+                    key: 'enabled',
+                    value: wiresStatus[payload.nodeId],
+                    editable: true
+                }
+            ]
+        };
+    });
+    api.on.editInspectorState(payload => {
+        if (payload.inspectorId === inspectorId) {
+            wiresStatus[payload.nodeId] = payload.state.value;
+            api.sendInspectorTree(inspectorId);
+        }
+    });
+}
+/**
+ * Sends the module wiring to Vue's devtools inspector. Additionally, it modifies each wire, adding
+ * a filter function to let it be enabled/disabled from the devtools.
+ *
+ * @param module - The module name this wiring belongs too.
+ * @param wiring - The wiring to save.
+ * @internal
+ */
+function sendWiringToDevtools(module, wiring) {
+    if (process.env.NODE_ENV !== 'production') {
+        forEach(wiring, (event, wires) => {
+            const eventWiring = wiringNodes[event] ?? (wiringNodes[event] = []);
+            forEach(wires, (wireName, wire) => {
+                const id = `${module}-${event}-${wireName}`;
+                wiresStatus[id] = true;
+                wires[wireName] = filter(wire, () => wiresStatus[id]);
+                eventWiring.push({
+                    id,
+                    label: wireName,
+                    tags: [
+                        {
+                            label: module,
+                            ...moduleColors[module]
+                        }
+                    ]
+                });
+            });
+        });
+    }
+}
+
+export { sendWiringToDevtools, setupWiringDevtools };
+//# sourceMappingURL=wiring.devtools.js.map

package/js/plugins/devtools/wiring.devtools.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wiring.devtools.js","sources":["../../../../src/plugins/devtools/wiring.devtools.ts"],"sourcesContent":["import { Dictionary, forEach, reduce } from '@empathyco/x-utils';\nimport { CustomInspectorNode, DevtoolsPluginApi, InspectorNodeTag } from '@vue/devtools-api';\nimport { XEvent } from '../../wiring/events.types';\nimport { filter } from '../../wiring/wires.operators';\nimport { AnyWire, Wiring } from '../../wiring/wiring.types';\nimport { XModuleName } from '../../x-modules/x-modules.types';\nimport { hslToHex, moduleColors } from './colors.utils';\n\n/** The full list of wiring nodes for the inspector. */\nconst wiringNodes: Partial<Record<XEvent, CustomInspectorNode[]>> = {};\n/**\n * Record of the wires enabled/disabled status.\n */\nconst wiresStatus: Record<string, boolean> = {};\n\n/**\n * Creates tags given a node representing a wire.\n *\n * @param node - The inspector node representing a {@link Wire}.\n * @returns A list of tags for the given node.\n */\nfunction createWireTags({ tags = [], id }: CustomInspectorNode): InspectorNodeTag[] {\n  const newTags: InspectorNodeTag[] = [...tags];\n  if (!wiresStatus[id]) {\n    newTags.push({\n      label: 'disabled',\n      backgroundColor: hslToHex(0, 88, 30),\n      textColor: hslToHex(0, 84, 90)\n    });\n  }\n  return newTags;\n}\n\n/**\n * Setups an inspector in Vue's devtools to show the wiring.\n *\n * @param api - Vue's devtools API.\n * @internal\n */\nexport function setupWiringDevtools(api: DevtoolsPluginApi<Dictionary<unknown>>): void {\n  const inspectorId = 'wiring-inspector';\n  api.addInspector({\n    id: inspectorId,\n    label: 'X-Components Wiring'\n  });\n  api.on.getInspectorTree(payload => {\n    if (payload.inspectorId !== inspectorId) {\n      return;\n    }\n    const query = payload.filter.toLowerCase();\n    payload.rootNodes = reduce(\n      wiringNodes,\n      (nodes, event, eventWires) => {\n        const wiresNodes =\n          /* If there is no active search, or the event name includes the query, we include all the\n            available wires. */\n          !query || event.toLowerCase().includes(query)\n            ? eventWires\n            : eventWires.filter(node =>\n                node.label.toLowerCase().includes(payload.filter.toLowerCase())\n              );\n        if (wiresNodes.length) {\n          nodes.push({\n            id: event,\n            label: event,\n            children: wiresNodes.map(wireNode => ({\n              ...wireNode,\n              tags: createWireTags(wireNode)\n            }))\n          });\n        }\n        return nodes;\n      },\n      <CustomInspectorNode[]>[]\n    );\n  });\n\n  api.on.getInspectorState(payload => {\n    if (payload.inspectorId !== inspectorId) {\n      return;\n    }\n    payload.state = {\n      status: [\n        {\n          key: 'enabled',\n          value: wiresStatus[payload.nodeId],\n          editable: true\n        }\n      ]\n    };\n  });\n\n  api.on.editInspectorState(payload => {\n    if (payload.inspectorId === inspectorId) {\n      wiresStatus[payload.nodeId] = payload.state.value;\n      api.sendInspectorTree(inspectorId);\n    }\n  });\n}\n\n/**\n * Sends the module wiring to Vue's devtools inspector. Additionally, it modifies each wire, adding\n * a filter function to let it be enabled/disabled from the devtools.\n *\n * @param module - The module name this wiring belongs too.\n * @param wiring - The wiring to save.\n * @internal\n */\nexport function sendWiringToDevtools(module: XModuleName, wiring: Partial<Wiring>): void {\n  if (process.env.NODE_ENV !== 'production') {\n    forEach(wiring, (event, wires: Dictionary<AnyWire>) => {\n      const eventWiring = wiringNodes[event] ?? (wiringNodes[event] = []);\n      forEach(wires, (wireName, wire) => {\n        const id = `${module}-${event}-${wireName}`;\n        wiresStatus[id] = true;\n        wires[wireName] = filter(wire, () => wiresStatus[id]);\n        eventWiring.push({\n          id,\n          label: wireName,\n          tags: [\n            {\n              label: module,\n              ...moduleColors[module]\n            }\n          ]\n        });\n      });\n    });\n  }\n}\n"],"names":[],"mappings":"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"}

package/js/plugins/x-bus.js

@@ -1,13 +1,14 @@
 import { ReplaySubject } from 'rxjs';
 import { map } from 'rxjs/operators';
+import { logDevtoolsXEvent } from './devtools/timeline.devtools.js';
 
 /**
  * Default {@link XBus} implementation.
  *
  * @public
  */
-var BaseXBus = /** @class */ (function () {
-    function BaseXBus() {
+class BaseXBus {
+    constructor() {
         /**
          * Dictionary to store the created event emitters.
          *
@@ -22,17 +23,17 @@ var BaseXBus = /** @class */ (function () {
      * @param payload - Event payload.
      * @param metadata - Information of who emits the event.
      */
-    BaseXBus.prototype.emit = function (event, payload, metadata) {
-        if (metadata === void 0) { metadata = { moduleName: null }; }
+    emit(event, payload, metadata = { moduleName: null }) {
         // Payload is defined here as an optional argument (which is wrong), but as this
         // implementation must be used with the type XBus there is no problem
-        var value = {
+        const value = {
             eventPayload: payload,
-            metadata: metadata
+            metadata
         };
-        var emitter = this.getOrCreateEmitter(event);
+        logDevtoolsXEvent(event, value);
+        const emitter = this.getOrCreateEmitter(event);
         emitter.next(value);
-    };
+    }
     /**
      * Retrieves an observable. See {@link XBus.(on:3)}.
      *
@@ -41,12 +42,11 @@ var BaseXBus = /** @class */ (function () {
      * @param withMetadata - Option to listener with info about event emitter.
      * @returns The emitter for the event passed.
      */
-    BaseXBus.prototype.on = function (event, withMetadata) {
-        if (withMetadata === void 0) { withMetadata = false; }
+    on(event, withMetadata = false) {
         return withMetadata
             ? this.getOrCreateEmitter(event)
-            : this.getOrCreateEmitter(event).pipe(map(function (value) { return value.eventPayload; }));
-    };
+            : this.getOrCreateEmitter(event).pipe(map(value => value.eventPayload));
+    }
     /**
      * Retrieves an event emitter for a given event.
      *
@@ -57,15 +57,14 @@ var BaseXBus = /** @class */ (function () {
      * new subscriber receive the last emitted value.
      * @internal
      */
-    BaseXBus.prototype.getOrCreateEmitter = function (event) {
-        var _a;
+    getOrCreateEmitter(event) {
         // TODO I Don't get why the types are not working here
-        return ((_a = this.emitters[event]) !== null && _a !== void 0 ? _a : (this.emitters[event] = new ReplaySubject(1)));
-    };
-    return BaseXBus;
-}());
-/** @internal The bus instance. Will be replaced by injection */
-var bus = new BaseXBus();
+        return (this.emitters[event] ??
+            (this.emitters[event] = new ReplaySubject(1)));
+    }
+}
+/** @internal The bus instance. Will be replaced by injection. */
+const bus = new BaseXBus();
 // TODO Remove this instantiation and replace with injection where used
 
 export { BaseXBus, bus };

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

@@ -1 +1 @@
-{"version":3,"file":"x-bus.js","sources":["../../../src/plugins/x-bus.ts"],"sourcesContent":["import { Observable, ReplaySubject } from 'rxjs';\nimport { map } from 'rxjs/operators';\nimport { XEvent, XEventPayload } from '../wiring/events.types';\nimport { WireMetadata, WirePayload } from '../wiring/wiring.types';\nimport { Emitter, Emitters, XBus } from './x-bus.types';\n\n/**\n * Default {@link XBus} implementation.\n *\n * @public\n */\nexport class BaseXBus implements XBus {\n  /**\n   * Dictionary to store the created event emitters.\n   *\n   * @internal\n   */\n  protected emitters: Emitters = {};\n\n  /**\n   * Emits an event. See {@link XBus.(emit:2)}.\n   *\n   * @param event - Event to be emitted.\n   * @param payload - Event payload.\n   * @param metadata - Information of who emits the event.\n   */\n  emit<Event extends XEvent>(\n    event: Event,\n    payload?: XEventPayload<Event>,\n    metadata: WireMetadata = { moduleName: null }\n  ): void {\n    // Payload is defined here as an optional argument (which is wrong), but as this\n    // implementation must be used with the type XBus there is no problem\n    const value: WirePayload<XEventPayload<Event>> = {\n      eventPayload: payload as any,\n      metadata\n    };\n    const emitter = this.getOrCreateEmitter(event);\n    emitter.next(value);\n  }\n\n  /**\n   * Retrieves an observable. See {@link XBus.(on:3)}.\n   *\n   * @public\n   * @param event - Event to listener.\n   * @param withMetadata - Option to listener with info about event emitter.\n   * @returns The emitter for the event passed.\n   */\n  on<Event extends XEvent>(\n    event: Event,\n    withMetadata = false\n  ): Observable<WirePayload<XEventPayload<Event>> | XEventPayload<Event>> {\n    return withMetadata\n      ? this.getOrCreateEmitter(event)\n      : this.getOrCreateEmitter(event).pipe(map(value => value.eventPayload));\n  }\n\n  /**\n   * Retrieves an event emitter for a given event.\n   *\n   * @param event - The event to retrieve the emitter for.\n   * @returns The emitter for the event passed.\n   * @remarks The emitter is implemented with a\n   * {@Link https://www.learnrxjs.io/learn-rxjs/subjects/replaysubject | ReplaySubject} to allow any\n   * new subscriber receive the last emitted value.\n   * @internal\n   */\n  protected getOrCreateEmitter<Event extends XEvent>(event: Event): Emitter<Event> {\n    // TODO I Don't get why the types are not working here\n    return (\n      this.emitters[event] ??\n      (this.emitters[event] = new ReplaySubject<WirePayload<XEventPayload<Event>>>(1) as any)\n    );\n  }\n}\n\n/** @internal The bus instance. Will be replaced by injection */\nexport const bus: XBus = new BaseXBus();\n// TODO Remove this instantiation and replace with injection where used\n"],"names":[],"mappings":";;;AAMA;;;;;;IAKA;;;;;;QAMY,aAAQ,GAAa,EAAE,CAAC;KA0DnC;;;;;;;;IAjDC,uBAAI,GAAJ,UACE,KAAY,EACZ,OAA8B,EAC9B,QAA6C;QAA7C,yBAAA,EAAA,aAA2B,UAAU,EAAE,IAAI,EAAE;;;QAI7C,IAAM,KAAK,GAAsC;YAC/C,YAAY,EAAE,OAAc;YAC5B,QAAQ,UAAA;SACT,CAAC;QACF,IAAM,OAAO,GAAG,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC/C,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACrB;;;;;;;;;IAUD,qBAAE,GAAF,UACE,KAAY,EACZ,YAAoB;QAApB,6BAAA,EAAA,oBAAoB;QAEpB,OAAO,YAAY;cACf,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;cAC9B,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,YAAY,GAAA,CAAC,CAAC,CAAC;KAC3E;;;;;;;;;;;IAYS,qCAAkB,GAA5B,UAAmD,KAAY;;;QAE7D,QACE,MAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,oCACnB,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,IAAI,aAAa,CAAoC,CAAC,CAAQ,CAAC,EACvF;KACH;IACH,eAAC;AAAD,CAAC,IAAA;AAED;IACa,GAAG,GAAS,IAAI,QAAQ,GAAG;AACxC;;;;"}
+{"version":3,"file":"x-bus.js","sources":["../../../src/plugins/x-bus.ts"],"sourcesContent":["import { Observable, ReplaySubject } from 'rxjs';\nimport { map } from 'rxjs/operators';\nimport { XEvent, XEventPayload } from '../wiring/events.types';\nimport { WireMetadata, WirePayload } from '../wiring/wiring.types';\nimport { logDevtoolsXEvent } from './devtools/timeline.devtools';\nimport { Emitter, Emitters, XBus } from './x-bus.types';\n\n/**\n * Default {@link XBus} implementation.\n *\n * @public\n */\nexport class BaseXBus implements XBus {\n  /**\n   * Dictionary to store the created event emitters.\n   *\n   * @internal\n   */\n  protected emitters: Emitters = {};\n\n  /**\n   * Emits an event. See {@link XBus.(emit:2)}.\n   *\n   * @param event - Event to be emitted.\n   * @param payload - Event payload.\n   * @param metadata - Information of who emits the event.\n   */\n  emit<Event extends XEvent>(\n    event: Event,\n    payload?: XEventPayload<Event>,\n    metadata: WireMetadata = { moduleName: null }\n  ): void {\n    // Payload is defined here as an optional argument (which is wrong), but as this\n    // implementation must be used with the type XBus there is no problem\n    const value: WirePayload<XEventPayload<Event>> = {\n      eventPayload: payload as any,\n      metadata\n    };\n    logDevtoolsXEvent(event, value);\n    const emitter = this.getOrCreateEmitter(event);\n    emitter.next(value);\n  }\n\n  /**\n   * Retrieves an observable. See {@link XBus.(on:3)}.\n   *\n   * @public\n   * @param event - Event to listener.\n   * @param withMetadata - Option to listener with info about event emitter.\n   * @returns The emitter for the event passed.\n   */\n  on<Event extends XEvent>(\n    event: Event,\n    withMetadata = false\n  ): Observable<WirePayload<XEventPayload<Event>> | XEventPayload<Event>> {\n    return withMetadata\n      ? this.getOrCreateEmitter(event)\n      : this.getOrCreateEmitter(event).pipe(map(value => value.eventPayload));\n  }\n\n  /**\n   * Retrieves an event emitter for a given event.\n   *\n   * @param event - The event to retrieve the emitter for.\n   * @returns The emitter for the event passed.\n   * @remarks The emitter is implemented with a\n   * {@Link https://www.learnrxjs.io/learn-rxjs/subjects/replaysubject | ReplaySubject} to allow any\n   * new subscriber receive the last emitted value.\n   * @internal\n   */\n  protected getOrCreateEmitter<Event extends XEvent>(event: Event): Emitter<Event> {\n    // TODO I Don't get why the types are not working here\n    return (\n      this.emitters[event] ??\n      (this.emitters[event] = new ReplaySubject<WirePayload<XEventPayload<Event>>>(1) as any)\n    );\n  }\n}\n\n/** @internal The bus instance. Will be replaced by injection. */\nexport const bus: XBus = new BaseXBus();\n// TODO Remove this instantiation and replace with injection where used\n"],"names":[],"mappings":";;;;AAOA;;;;AAIG;MACU,QAAQ,CAAA;AAArB,IAAA,WAAA,GAAA;AACE;;;;AAIG;QACO,IAAQ,CAAA,QAAA,GAAa,EAAE,CAAC;KA2DnC;AAzDC;;;;;;AAMG;IACH,IAAI,CACF,KAAY,EACZ,OAA8B,EAC9B,WAAyB,EAAE,UAAU,EAAE,IAAI,EAAE,EAAA;;;AAI7C,QAAA,MAAM,KAAK,GAAsC;AAC/C,YAAA,YAAY,EAAE,OAAc;YAC5B,QAAQ;SACT,CAAC;AACF,QAAA,iBAAiB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QAChC,MAAM,OAAO,GAAG,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;AAC/C,QAAA,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACrB;AAED;;;;;;;AAOG;AACH,IAAA,EAAE,CACA,KAAY,EACZ,YAAY,GAAG,KAAK,EAAA;AAEpB,QAAA,OAAO,YAAY;AACjB,cAAE,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;cAC9B,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC;KAC3E;AAED;;;;;;;;;AASG;AACO,IAAA,kBAAkB,CAAuB,KAAY,EAAA;;AAE7D,QAAA,QACE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;AACpB,aAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,IAAI,aAAa,CAAoC,CAAC,CAAQ,CAAC,EACvF;KACH;AACF,CAAA;AAED;AACa,MAAA,GAAG,GAAS,IAAI,QAAQ,GAAG;AACxC;;;;"}

package/js/plugins/x-emitters.js

@@ -1,7 +1,6 @@
-import { __assign, __rest } from 'tslib';
-import { debounce } from '../utils/debounce.js';
-import { forEach } from '../utils/object.js';
+import { forEach } from '@empathyco/x-utils';
 import { getGettersProxyFromModule } from '../store/utils/getters-proxy.utils.js';
+import { debounce } from '../utils/debounce.js';
 
 /**
  * Registers the store emitters, making them emit the event when the part of the state selected
@@ -13,25 +12,19 @@ import { getGettersProxyFromModule } from '../store/utils/getters-proxy.utils.js
  *
  * @internal
  */
-function registerStoreEmitters(_a, bus, store) {
-    var name = _a.name, storeEmitters = _a.storeEmitters, storeModule = _a.storeModule;
-    var safeGettersProxy = getGettersProxyFromModule(store.getters, name, storeModule);
-    forEach(storeEmitters, function (event, stateSelector) {
-        var _a = normalizeStateSelector(stateSelector, event), selector = _a.selector, immediate = _a.immediate, filter = _a.filter, options = __rest(_a, ["selector", "immediate", "filter"]);
-        var emit = function (value) {
-            bus.emit(event, value, { moduleName: name });
-        };
-        var watcherSelector = function () { return selector(store.state.x[name], safeGettersProxy); };
-        var debouncedEffect = debounceWatcherEffect(event, function (newValue, oldValue) {
+function registerStoreEmitters({ name, storeEmitters, storeModule }, bus, store) {
+    const safeGettersProxy = getGettersProxyFromModule(store.getters, name, storeModule);
+    forEach(storeEmitters, (event, stateSelector) => {
+        const { selector, immediate, filter, ...options } = normalizeStateSelector(stateSelector, event);
+        const watcherSelector = () => selector(store.state.x[name], safeGettersProxy);
+        const emit = debounceWatcherEffect(event, (newValue, oldValue) => {
             if (filter(newValue, oldValue)) {
-                emit(newValue);
+                bus.emit(event, newValue, { moduleName: name, oldValue });
             }
         });
-        store.watch(watcherSelector, debouncedEffect, options);
+        store.watch(watcherSelector, emit, options);
         if (immediate) {
-            Promise.resolve().then(function () {
-                emit(watcherSelector());
-            });
+            emit(watcherSelector());
         }
     });
 }
@@ -54,8 +47,8 @@ function debounceWatcherEffect(event, watcherEffect) {
      * keep there until the watcher callback is finally executed (after the debounce). Then this
      * `previousValue` is cleared to store the next `oldValue`.
      */
-    var previousValue = undefined;
-    var watcherCallback = debounce(function (newValue, oldValue) {
+    let previousValue = undefined;
+    let watcherCallback = debounce((newValue, oldValue) => {
         watcherEffect(newValue, oldValue);
         previousValue = undefined;
     }, 0);
@@ -63,14 +56,14 @@ function debounceWatcherEffect(event, watcherEffect) {
      * effects (requests, URL changes). If we only apply the debounce to all the events we still have
      * the problem of outer effects. */
     if (isSecondLevelEventEmitter(event)) {
-        var previousCallback_1 = watcherCallback;
-        var debouncedPreviousCallback_1 = debounce(previousCallback_1, 0);
-        watcherCallback = (function (n, o) {
-            previousCallback_1.cancel();
-            debouncedPreviousCallback_1(n, o);
+        const previousCallback = watcherCallback;
+        const debouncedPreviousCallback = debounce(previousCallback, 0);
+        watcherCallback = ((n, o) => {
+            previousCallback.cancel();
+            debouncedPreviousCallback(n, o);
         });
     }
-    return function (newValue, oldValue) {
+    return (newValue, oldValue) => {
         previousValue = previousValue !== undefined ? previousValue : oldValue;
         watcherCallback(newValue, previousValue);
     };
@@ -86,12 +79,17 @@ function debounceWatcherEffect(event, watcherEffect) {
  * @internal
  */
 function normalizeStateSelector(stateSelector, event) {
-    var normalizedSelector = isSimpleSelector(stateSelector)
+    const normalizedSelector = isSimpleSelector(stateSelector)
         ? { selector: stateSelector }
         : stateSelector;
-    return __assign({ deep: false, immediate: false, filter: isSecondLevelEventEmitter(event)
-            ? function (newValue, oldValue) { return !hasPayloadChanged(newValue, oldValue); }
-            : function () { return true; } }, normalizedSelector);
+    return {
+        deep: false,
+        immediate: false,
+        filter: isSecondLevelEventEmitter(event)
+            ? (newValue, oldValue) => !hasPayloadChanged(newValue, oldValue)
+            : () => true,
+        ...normalizedSelector
+    };
 }
 /**
  * Checks if a the type of the store emitter selector is simple or complex. This selector can be
@@ -106,7 +104,7 @@ function isSimpleSelector(stateSelector) {
     return typeof stateSelector === 'function';
 }
 // TODO: Generalize the Naming of the Events to take this into account
-var secondLevelEvents = [/RequestChanged$/, /UrlStateChanged$/];
+const secondLevelEvents = [/RequestChanged$/, /UrlStateChanged$/];
 /**
  * Function to detect if an {@link XEvent} is a "SecondLevelEvent", to treat it differently.
  *
@@ -116,7 +114,7 @@ var secondLevelEvents = [/RequestChanged$/, /UrlStateChanged$/];
  * @internal
  */
 function isSecondLevelEventEmitter(event) {
-    return secondLevelEvents.some(function (regex) { return regex.test(event); });
+    return secondLevelEvents.some(regex => regex.test(event));
 }
 /**
  * Function to filter if a payload of an {@link XEvent} has really changed or not. It only
@@ -135,12 +133,12 @@ function hasPayloadChanged(request1, request2) {
     if (!request1 || !request2) {
         return false;
     }
-    var keys1 = Object.keys(request1);
-    var keys2 = Object.keys(request2);
+    const keys1 = Object.keys(request1);
+    const keys2 = Object.keys(request2);
     if (keys1.length !== keys2.length) {
         return false;
     }
-    return !keys1.some(function (key) { return request1[key] !== request2[key]; });
+    return !keys1.some(key => request1[key] !== request2[key]);
 }
 
 export { isSimpleSelector, registerStoreEmitters };

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

@@ -1 +1 @@
-{"version":3,"file":"x-emitters.js","sources":["../../../src/plugins/x-emitters.ts"],"sourcesContent":["import { Store } from 'vuex';\nimport { getGettersProxyFromModule } from '../store/utils/getters-proxy.utils';\nimport { AnySimpleStateSelector, AnyStateSelector } from '../store/utils/store-emitters.utils';\nimport { debounce } from '../utils/debounce';\nimport { forEach } from '../utils/object';\nimport { DebouncedFunction, Dictionary } from '../utils/types';\nimport { XEvent } from '../wiring/events.types';\nimport { AnyXModule } from '../x-modules/x-modules.types';\nimport { XBus } from './x-bus.types';\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 * @param bus - The {@Link XBus} to emit the events by the Emitters.\n * @param store - The Vuex store to access to state and getters to watch them.\n *\n * @internal\n */\nexport function registerStoreEmitters(\n  { name, storeEmitters, storeModule }: AnyXModule,\n  bus: XBus,\n  store: Store<any>\n): void {\n  const safeGettersProxy = getGettersProxyFromModule(store.getters, name, storeModule);\n  forEach(storeEmitters, (event, stateSelector: AnySimpleStateSelector | AnyStateSelector) => {\n    const { selector, immediate, filter, ...options } = normalizeStateSelector(\n      stateSelector,\n      event\n    );\n\n    const emit = (value: unknown): void => {\n      bus.emit(event, value, { moduleName: name });\n    };\n    const watcherSelector = (): unknown => selector(store.state.x[name], safeGettersProxy);\n    const debouncedEffect = debounceWatcherEffect(event, (newValue, oldValue) => {\n      if (filter(newValue, oldValue)) {\n        emit(newValue);\n      }\n    });\n\n    store.watch(watcherSelector, debouncedEffect, options);\n\n    if (immediate) {\n      Promise.resolve().then(() => {\n        emit(watcherSelector());\n      });\n    }\n  });\n}\n\n/**\n * This function \"wraps\" the watcher effect (the callback of the watcher) with debounce to avoid\n * repeating events and request. Right now this function wraps every effect in a debounce and adds\n * an extra debounce to the \"SecondLevelEvent\" events, to try to delay this events after the state\n * change events.\n *\n * @param event - The {@link XEvent} to emit.\n * @param watcherEffect - The callback to execute.\n * @returns A new function with the `watcherEffect` callback wrapped in debounce.\n */\nfunction debounceWatcherEffect(\n  event: XEvent,\n  watcherEffect: (newValue: unknown, oldValue: unknown) => void\n): (newValue: unknown, oldValue: unknown) => void {\n  /*\n   * Due the debounce added to the watch callback, the `oldValue` would be the one from the last\n   * watcher execution instead of the last callback execution. This would cause problems receiving\n   * unstable oldValues, used in the Emitter filter.\n   * To solve this, we store the `oldValue` of the watcher in the `previousValue` variable, and we\n   * keep there until the watcher callback is finally executed (after the debounce). Then this\n   * `previousValue` is cleared to store the next `oldValue`.\n   */\n  let previousValue: unknown = undefined;\n\n  let watcherCallback = debounce((newValue: unknown, oldValue: unknown): void => {\n    watcherEffect(newValue, oldValue);\n    previousValue = undefined;\n  }, 0);\n  /* Only applying the extra debounce to the \"SecondLevelEvent\" events to avoid repeating outer\n   * effects (requests, URL changes). If we only apply the debounce to all the events we still have\n   * the problem of outer effects. */\n  if (isSecondLevelEventEmitter(event)) {\n    const previousCallback = watcherCallback;\n    const debouncedPreviousCallback = debounce(previousCallback, 0);\n    watcherCallback = ((n, o) => {\n      previousCallback.cancel();\n      debouncedPreviousCallback(n, o);\n    }) as DebouncedFunction<any>;\n  }\n\n  return (newValue, oldValue) => {\n    previousValue = previousValue !== undefined ? previousValue : oldValue;\n    watcherCallback(newValue, previousValue);\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 * @param event - The event name of the emitter.\n * @returns A {@link AnyStateSelector} with all the properties set.\n *\n * @internal\n */\nfunction normalizeStateSelector(\n  stateSelector: AnySimpleStateSelector | AnyStateSelector,\n  event: XEvent\n): Required<AnyStateSelector> {\n  const normalizedSelector = isSimpleSelector(stateSelector)\n    ? { selector: stateSelector }\n    : stateSelector;\n  return {\n    deep: false,\n    immediate: false,\n    filter: isSecondLevelEventEmitter(event)\n      ? (newValue, oldValue) => !hasPayloadChanged(newValue, oldValue)\n      : () => true,\n    ...normalizedSelector\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 *\n * @internal\n */\nexport function isSimpleSelector(\n  stateSelector: AnySimpleStateSelector | AnyStateSelector\n): stateSelector is AnySimpleStateSelector {\n  return typeof stateSelector === 'function';\n}\n\n// TODO: Generalize the Naming of the Events to take this into account\nconst secondLevelEvents: RegExp[] = [/RequestChanged$/, /UrlStateChanged$/];\n\n/**\n * Function to detect if an {@link XEvent} is a \"SecondLevelEvent\", to treat it differently.\n *\n * @param event - The name of the {@link XEvent} to check.\n * @returns True if is an `SecondLevelEvent`, False otherwise.\n *\n * @internal\n */\nfunction isSecondLevelEventEmitter(event: XEvent): boolean {\n  return secondLevelEvents.some(regex => regex.test(event));\n}\n/**\n * Function to filter if a payload of an {@link XEvent} has really changed or not. It only\n * compares the first level of fields and not deeply, to avoid CPU consuming task here.\n *\n * @param request1 - First request to compare.\n * @param request2 - Second request to compare.\n * @returns True if the two objects are different, false otherwise.\n *\n * @internal\n */\nfunction hasPayloadChanged<T extends Dictionary>(request1?: T, request2?: T): boolean {\n  if (request1 === request2) {\n    return true;\n  }\n  if (!request1 || !request2) {\n    return false;\n  }\n  const keys1 = Object.keys(request1);\n  const keys2 = Object.keys(request2);\n  if (keys1.length !== keys2.length) {\n    return false;\n  }\n  return !keys1.some(key => request1[key] !== request2[key]);\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"x-emitters.js","sources":["../../../src/plugins/x-emitters.ts"],"sourcesContent":["import { forEach, Dictionary } from '@empathyco/x-utils';\nimport { Store } from 'vuex';\nimport { getGettersProxyFromModule } from '../store/utils/getters-proxy.utils';\nimport { AnySimpleStateSelector, AnyStateSelector } from '../store/utils/store-emitters.utils';\nimport { debounce } from '../utils/debounce';\nimport { DebouncedFunction } from '../utils/types';\nimport { XEvent, XEventPayload } from '../wiring/events.types';\nimport { AnyXModule } from '../x-modules/x-modules.types';\nimport { XBus } from './x-bus.types';\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 * @param bus - The {@Link XBus} to emit the events by the Emitters.\n * @param store - The Vuex store to access to state and getters to watch them.\n *\n * @internal\n */\nexport function registerStoreEmitters(\n  { name, storeEmitters, storeModule }: AnyXModule,\n  bus: XBus,\n  store: Store<any>\n): void {\n  const safeGettersProxy = getGettersProxyFromModule(store.getters, name, storeModule);\n  forEach(storeEmitters, (event, stateSelector: AnySimpleStateSelector | AnyStateSelector) => {\n    const { selector, immediate, filter, ...options } = normalizeStateSelector(\n      stateSelector,\n      event\n    );\n\n    const watcherSelector = (): XEventPayload<typeof event> =>\n      selector(store.state.x[name], safeGettersProxy);\n    const emit = debounceWatcherEffect(event, (newValue, oldValue) => {\n      if (filter(newValue, oldValue)) {\n        bus.emit(event, newValue, { moduleName: name, oldValue });\n      }\n    });\n\n    store.watch(watcherSelector, emit, options);\n\n    if (immediate) {\n      emit(watcherSelector());\n    }\n  });\n}\n\n/**\n * This function \"wraps\" the watcher effect (the callback of the watcher) with debounce to avoid\n * repeating events and request. Right now this function wraps every effect in a debounce and adds\n * an extra debounce to the \"SecondLevelEvent\" events, to try to delay this events after the state\n * change events.\n *\n * @param event - The {@link XEvent} to emit.\n * @param watcherEffect - The callback to execute.\n * @returns A new function with the `watcherEffect` callback wrapped in debounce.\n */\nfunction debounceWatcherEffect<Event extends XEvent = XEvent>(\n  event: Event,\n  watcherEffect: (newValue: XEventPayload<Event>, oldValue: XEventPayload<Event>) => void\n): (newValue: XEventPayload<Event>, oldValue: XEventPayload<Event>) => void {\n  /*\n   * Due the debounce added to the watch callback, the `oldValue` would be the one from the last\n   * watcher execution instead of the last callback execution. This would cause problems receiving\n   * unstable oldValues, used in the Emitter filter.\n   * To solve this, we store the `oldValue` of the watcher in the `previousValue` variable, and we\n   * keep there until the watcher callback is finally executed (after the debounce). Then this\n   * `previousValue` is cleared to store the next `oldValue`.\n   */\n  let previousValue: XEventPayload<Event> | undefined = undefined;\n\n  let watcherCallback = debounce(\n    (newValue: XEventPayload<Event>, oldValue: XEventPayload<Event>): void => {\n      watcherEffect(newValue, oldValue);\n      previousValue = undefined;\n    },\n    0\n  );\n  /* Only applying the extra debounce to the \"SecondLevelEvent\" events to avoid repeating outer\n   * effects (requests, URL changes). If we only apply the debounce to all the events we still have\n   * the problem of outer effects. */\n  if (isSecondLevelEventEmitter(event)) {\n    const previousCallback = watcherCallback;\n    const debouncedPreviousCallback = debounce(previousCallback, 0);\n    watcherCallback = ((n, o) => {\n      previousCallback.cancel();\n      debouncedPreviousCallback(n, o);\n    }) as DebouncedFunction<any>;\n  }\n\n  return (newValue, oldValue) => {\n    previousValue = previousValue !== undefined ? previousValue : oldValue;\n    watcherCallback(newValue, previousValue);\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 * @param event - The event name of the emitter.\n * @returns A {@link AnyStateSelector} with all the properties set.\n *\n * @internal\n */\nfunction normalizeStateSelector(\n  stateSelector: AnySimpleStateSelector | AnyStateSelector,\n  event: XEvent\n): Required<AnyStateSelector> {\n  const normalizedSelector = isSimpleSelector(stateSelector)\n    ? { selector: stateSelector }\n    : stateSelector;\n  return {\n    deep: false,\n    immediate: false,\n    filter: isSecondLevelEventEmitter(event)\n      ? (newValue, oldValue) => !hasPayloadChanged(newValue, oldValue)\n      : () => true,\n    ...normalizedSelector\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 *\n * @internal\n */\nexport function isSimpleSelector(\n  stateSelector: AnySimpleStateSelector | AnyStateSelector\n): stateSelector is AnySimpleStateSelector {\n  return typeof stateSelector === 'function';\n}\n\n// TODO: Generalize the Naming of the Events to take this into account\nconst secondLevelEvents: RegExp[] = [/RequestChanged$/, /UrlStateChanged$/];\n\n/**\n * Function to detect if an {@link XEvent} is a \"SecondLevelEvent\", to treat it differently.\n *\n * @param event - The name of the {@link XEvent} to check.\n * @returns True if is an `SecondLevelEvent`, False otherwise.\n *\n * @internal\n */\nfunction isSecondLevelEventEmitter(event: XEvent): boolean {\n  return secondLevelEvents.some(regex => regex.test(event));\n}\n/**\n * Function to filter if a payload of an {@link XEvent} has really changed or not. It only\n * compares the first level of fields and not deeply, to avoid CPU consuming task here.\n *\n * @param request1 - First request to compare.\n * @param request2 - Second request to compare.\n * @returns True if the two objects are different, false otherwise.\n *\n * @internal\n */\nfunction hasPayloadChanged<T extends Dictionary>(request1?: T, request2?: T): boolean {\n  if (request1 === request2) {\n    return true;\n  }\n  if (!request1 || !request2) {\n    return false;\n  }\n  const keys1 = Object.keys(request1);\n  const keys2 = Object.keys(request2);\n  if (keys1.length !== keys2.length) {\n    return false;\n  }\n  return !keys1.some(key => request1[key] !== request2[key]);\n}\n"],"names":[],"mappings":"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"}