@empathyco/x-components 3.0.0-alpha.3 → 3.0.0-alpha.300

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

@@ -0,0 +1,71 @@
+import { ReplaySubject } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { logDevtoolsXEvent } from './devtools/timeline.devtools.js';
+
+/**
+ * Default {@link XBus} implementation.
+ *
+ * @public
+ */
+class BaseXBus {
+    constructor() {
+        /**
+         * Dictionary to store the created event emitters.
+         *
+         * @internal
+         */
+        this.emitters = {};
+    }
+    /**
+     * Emits an event. See {@link XBus.(emit:2)}.
+     *
+     * @param event - Event to be emitted.
+     * @param payload - Event payload.
+     * @param metadata - Information of who emits the event.
+     */
+    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
+        const value = {
+            eventPayload: payload,
+            metadata
+        };
+        logDevtoolsXEvent(event, value);
+        const emitter = this.getOrCreateEmitter(event);
+        emitter.next(value);
+    }
+    /**
+     * Retrieves an observable. See {@link XBus.(on:3)}.
+     *
+     * @public
+     * @param event - Event to listener.
+     * @param withMetadata - Option to listener with info about event emitter.
+     * @returns The emitter for the event passed.
+     */
+    on(event, withMetadata = false) {
+        return withMetadata
+            ? this.getOrCreateEmitter(event)
+            : this.getOrCreateEmitter(event).pipe(map(value => value.eventPayload));
+    }
+    /**
+     * Retrieves an event emitter for a given event.
+     *
+     * @param event - The event to retrieve the emitter for.
+     * @returns The emitter for the event passed.
+     * @remarks The emitter is implemented with a
+     * {@Link https://www.learnrxjs.io/learn-rxjs/subjects/replaysubject | ReplaySubject} to allow any
+     * new subscriber receive the last emitted value.
+     * @internal
+     */
+    getOrCreateEmitter(event) {
+        // TODO I Don't get why the types are not working here
+        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 };
+//# sourceMappingURL=x-bus.js.map

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

@@ -0,0 +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 { 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

@@ -0,0 +1,145 @@
+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
+ * changes.
+ *
+ * @param xModule - The {@link XModule} to register its Store Emitters.
+ * @param bus - The {@Link XBus} to emit the events by the Emitters.
+ * @param store - The Vuex store to access to state and getters to watch them.
+ *
+ * @internal
+ */
+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)) {
+                bus.emit(event, newValue, { moduleName: name, oldValue });
+            }
+        });
+        store.watch(watcherSelector, emit, options);
+        if (immediate) {
+            emit(watcherSelector());
+        }
+    });
+}
+/**
+ * This function "wraps" the watcher effect (the callback of the watcher) with debounce to avoid
+ * repeating events and request. Right now this function wraps every effect in a debounce and adds
+ * an extra debounce to the "SecondLevelEvent" events, to try to delay this events after the state
+ * change events.
+ *
+ * @param event - The {@link XEvent} to emit.
+ * @param watcherEffect - The callback to execute.
+ * @returns A new function with the `watcherEffect` callback wrapped in debounce.
+ */
+function debounceWatcherEffect(event, watcherEffect) {
+    /*
+     * Due the debounce added to the watch callback, the `oldValue` would be the one from the last
+     * watcher execution instead of the last callback execution. This would cause problems receiving
+     * unstable oldValues, used in the Emitter filter.
+     * To solve this, we store the `oldValue` of the watcher in the `previousValue` variable, and we
+     * keep there until the watcher callback is finally executed (after the debounce). Then this
+     * `previousValue` is cleared to store the next `oldValue`.
+     */
+    let previousValue = undefined;
+    let watcherCallback = debounce((newValue, oldValue) => {
+        watcherEffect(newValue, oldValue);
+        previousValue = undefined;
+    }, 0);
+    /* Only applying the extra debounce to the "SecondLevelEvent" events to avoid repeating outer
+     * 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)) {
+        const previousCallback = watcherCallback;
+        const debouncedPreviousCallback = debounce(previousCallback, 0);
+        watcherCallback = ((n, o) => {
+            previousCallback.cancel();
+            debouncedPreviousCallback(n, o);
+        });
+    }
+    return (newValue, oldValue) => {
+        previousValue = previousValue !== undefined ? previousValue : oldValue;
+        watcherCallback(newValue, previousValue);
+    };
+}
+/**
+ * Transforms a {@link AnySimpleStateSelector} into a {@link AnyStateSelector}, and sets
+ * default values for its properties.
+ *
+ * @param stateSelector - The state selector to normalize.
+ * @param event - The event name of the emitter.
+ * @returns A {@link AnyStateSelector} with all the properties set.
+ *
+ * @internal
+ */
+function normalizeStateSelector(stateSelector, event) {
+    const normalizedSelector = isSimpleSelector(stateSelector)
+        ? { selector: stateSelector }
+        : stateSelector;
+    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
+ * a function if it is simple or an object with the selector and other options if it is complex.
+ *
+ * @param stateSelector - The store emitter selector.
+ * @returns A boolean which flags if the stateSelector is simple (function) or complex (object).
+ *
+ * @internal
+ */
+function isSimpleSelector(stateSelector) {
+    return typeof stateSelector === 'function';
+}
+// TODO: Generalize the Naming of the Events to take this into account
+const secondLevelEvents = [/RequestChanged$/, /UrlStateChanged$/];
+/**
+ * Function to detect if an {@link XEvent} is a "SecondLevelEvent", to treat it differently.
+ *
+ * @param event - The name of the {@link XEvent} to check.
+ * @returns True if is an `SecondLevelEvent`, False otherwise.
+ *
+ * @internal
+ */
+function isSecondLevelEventEmitter(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
+ * compares the first level of fields and not deeply, to avoid CPU consuming task here.
+ *
+ * @param request1 - First request to compare.
+ * @param request2 - Second request to compare.
+ * @returns True if the two objects are different, false otherwise.
+ *
+ * @internal
+ */
+function hasPayloadChanged(request1, request2) {
+    if (request1 === request2) {
+        return true;
+    }
+    if (!request1 || !request2) {
+        return false;
+    }
+    const keys1 = Object.keys(request1);
+    const keys2 = Object.keys(request2);
+    if (keys1.length !== keys2.length) {
+        return false;
+    }
+    return !keys1.some(key => request1[key] !== request2[key]);
+}
+
+export { isSimpleSelector, registerStoreEmitters };
+//# sourceMappingURL=x-emitters.js.map

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

@@ -0,0 +1 @@
+{"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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"}

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

@@ -0,0 +1,121 @@
+import { getGetterPath } from './x-plugin.utils.js';
+
+/**
+ * Creates an object containing the alias part of {@link XComponentAPI}.
+ *
+ * @param component - The component with the store from which retrieve the data.
+ * @returns An object containing the alias part of the {@link XComponentAPI}.
+ *
+ * @internal
+ */
+function getAliasAPI(component) {
+    const queryModules = [
+        'facets',
+        'searchBox',
+        'nextQueries',
+        'querySuggestions',
+        'relatedTags',
+        'search'
+    ];
+    const statusModules = [
+        'identifierResults',
+        'nextQueries',
+        'popularSearches',
+        'querySuggestions',
+        'recommendations',
+        'relatedTags',
+        'search'
+    ];
+    const query = queryModules.reduce((acc, moduleName) => {
+        return Object.defineProperty(acc, moduleName, {
+            get() {
+                return component.$store.state.x[moduleName]?.query ?? '';
+            },
+            enumerable: true
+        });
+    }, {});
+    const status = statusModules.reduce((acc, moduleName) => {
+        return Object.defineProperty(acc, moduleName, {
+            get() {
+                return component.$store.state.x[moduleName]?.status;
+            },
+            enumerable: true
+        });
+    }, {});
+    return {
+        query,
+        status,
+        get device() {
+            return component.$store.state.x.device?.name ?? null;
+        },
+        get facets() {
+            return component.$store.getters[getGetterPath('facets', 'facets')] ?? {};
+        },
+        get historyQueries() {
+            return component.$store.getters[getGetterPath('historyQueries', 'historyQueries')] ?? [];
+        },
+        get historyQueriesWithResults() {
+            return (component.$store.getters[getGetterPath('historyQueries', 'historyQueriesWithResults')] ?? []);
+        },
+        get fullHistoryQueries() {
+            return component.$store.state.x.historyQueries?.historyQueries ?? [];
+        },
+        get identifierResults() {
+            return component.$store.state.x.identifierResults?.identifierResults ?? [];
+        },
+        get searchBoxStatus() {
+            return component.$store.state.x.searchBox?.inputStatus ?? undefined;
+        },
+        get isEmpathizeOpen() {
+            return component.$store.state.x.empathize?.isOpen ?? false;
+        },
+        get nextQueries() {
+            return component.$store.getters[getGetterPath('nextQueries', 'nextQueries')] ?? [];
+        },
+        get noResults() {
+            return !this.totalResults && !!this.query.search && this.status.search === 'success';
+        },
+        get partialResults() {
+            return component.$store.state.x.search?.partialResults ?? [];
+        },
+        get popularSearches() {
+            return component.$store.state.x.popularSearches?.popularSearches ?? [];
+        },
+        get querySuggestions() {
+            return component.$store.state.x.querySuggestions?.suggestions ?? [];
+        },
+        get recommendations() {
+            return component.$store.state.x.recommendations?.recommendations ?? [];
+        },
+        get redirections() {
+            return component.$store.state.x.search?.redirections ?? [];
+        },
+        get relatedTags() {
+            return component.$store.getters[getGetterPath('relatedTags', 'relatedTags')] ?? [];
+        },
+        get results() {
+            return component.$store.state.x.search?.results ?? [];
+        },
+        get scroll() {
+            return component.$store.state.x.scroll?.data ?? {};
+        },
+        get selectedFilters() {
+            return component.$store.getters[getGetterPath('facets', 'selectedFilters')] ?? [];
+        },
+        get selectedRelatedTags() {
+            return component.$store.state.x.relatedTags?.selectedRelatedTags ?? [];
+        },
+        get spellcheckedQuery() {
+            return component.$store.state.x.search?.spellcheckedQuery ?? null;
+        },
+        get totalResults() {
+            return component.$store.state.x.search?.totalResults ?? 0;
+        },
+        get selectedSort() {
+            return component.$store.state.x.search?.sort ?? '';
+        }
+    };
+}
+
+export { getAliasAPI };
+//# sourceMappingURL=x-plugin.alias.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"x-plugin.alias.js","sources":["../../../src/plugins/x-plugin.alias.ts"],"sourcesContent":["import Vue from 'vue';\nimport { RequestStatus } from '../store/utils/status-store.utils';\nimport {\n  XComponentAliasAPI,\n  XComponentAliasQueryAPI,\n  XComponentAliasStatusAPI\n} from './x-plugin.types';\nimport { getGetterPath } from './x-plugin.utils';\n\n/**\n * Creates an object containing the alias part of {@link XComponentAPI}.\n *\n * @param component - The component with the store from which retrieve the data.\n * @returns An object containing the alias part of the {@link XComponentAPI}.\n *\n * @internal\n */\nexport function getAliasAPI(component: Vue): XComponentAliasAPI {\n  const queryModules = [\n    'facets',\n    'searchBox',\n    'nextQueries',\n    'querySuggestions',\n    'relatedTags',\n    'search'\n  ] as const;\n  const statusModules = [\n    'identifierResults',\n    'nextQueries',\n    'popularSearches',\n    'querySuggestions',\n    'recommendations',\n    'relatedTags',\n    'search'\n  ] as const;\n\n  const query = queryModules.reduce((acc, moduleName) => {\n    return Object.defineProperty(acc, moduleName, {\n      get(): string {\n        return component.$store.state.x[moduleName]?.query ?? '';\n      },\n      enumerable: true\n    });\n  }, {} as XComponentAliasQueryAPI);\n  const status = statusModules.reduce((acc, moduleName) => {\n    return Object.defineProperty(acc, moduleName, {\n      get(): RequestStatus | undefined {\n        return component.$store.state.x[moduleName]?.status;\n      },\n      enumerable: true\n    });\n  }, {} as XComponentAliasStatusAPI);\n\n  return {\n    query,\n    status,\n    get device() {\n      return component.$store.state.x.device?.name ?? null;\n    },\n    get facets() {\n      return component.$store.getters[getGetterPath('facets', 'facets')] ?? {};\n    },\n    get historyQueries() {\n      return component.$store.getters[getGetterPath('historyQueries', 'historyQueries')] ?? [];\n    },\n    get historyQueriesWithResults() {\n      return (\n        component.$store.getters[getGetterPath('historyQueries', 'historyQueriesWithResults')] ?? []\n      );\n    },\n    get fullHistoryQueries() {\n      return component.$store.state.x.historyQueries?.historyQueries ?? [];\n    },\n    get identifierResults() {\n      return component.$store.state.x.identifierResults?.identifierResults ?? [];\n    },\n    get searchBoxStatus() {\n      return component.$store.state.x.searchBox?.inputStatus ?? undefined;\n    },\n    get isEmpathizeOpen() {\n      return component.$store.state.x.empathize?.isOpen ?? false;\n    },\n    get nextQueries() {\n      return component.$store.getters[getGetterPath('nextQueries', 'nextQueries')] ?? [];\n    },\n    get noResults() {\n      return !this.totalResults && !!this.query.search && this.status.search === 'success';\n    },\n    get partialResults() {\n      return component.$store.state.x.search?.partialResults ?? [];\n    },\n    get popularSearches() {\n      return component.$store.state.x.popularSearches?.popularSearches ?? [];\n    },\n    get querySuggestions() {\n      return component.$store.state.x.querySuggestions?.suggestions ?? [];\n    },\n    get recommendations() {\n      return component.$store.state.x.recommendations?.recommendations ?? [];\n    },\n    get redirections() {\n      return component.$store.state.x.search?.redirections ?? [];\n    },\n    get relatedTags() {\n      return component.$store.getters[getGetterPath('relatedTags', 'relatedTags')] ?? [];\n    },\n    get results() {\n      return component.$store.state.x.search?.results ?? [];\n    },\n    get scroll() {\n      return component.$store.state.x.scroll?.data ?? {};\n    },\n    get selectedFilters() {\n      return component.$store.getters[getGetterPath('facets', 'selectedFilters')] ?? [];\n    },\n    get selectedRelatedTags() {\n      return component.$store.state.x.relatedTags?.selectedRelatedTags ?? [];\n    },\n    get spellcheckedQuery() {\n      return component.$store.state.x.search?.spellcheckedQuery ?? null;\n    },\n    get totalResults() {\n      return component.$store.state.x.search?.totalResults ?? 0;\n    },\n    get selectedSort() {\n      return component.$store.state.x.search?.sort ?? '';\n    }\n  };\n}\n"],"names":[],"mappings":"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"}