@empathyco/x-components 6.0.0-alpha.217 → 6.0.0-alpha.219

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 6.0.0-alpha.219 (2026-03-09)
+
+- feat(deep-merge-storage-service): clean up deep-merge and storage-service deps and side effects (#20 ([668130c](https://github.com/empathyco/x/commit/668130c)), closes [#2048](https://github.com/empathyco/x/issues/2048)
+
+## 6.0.0-alpha.218 (2026-03-05)
+
+- fix: rename `AiOverviewMounted` to `AiComponentMounted` across components, tests, and wiring (#2044) ([28b3c10](https://github.com/empathyco/x/commit/28b3c10)), closes [#2044](https://github.com/empathyco/x/issues/2044)
+
 ## 6.0.0-alpha.217 (2026-03-05)
 
 - feat(x-utils): recover cjs bundler ([5f9dd59](https://github.com/empathyco/x/commit/5f9dd59))

package/docs/API-reference/api/x-components.aixevents.aicomponentmounted.md

@@ -0,0 +1,11 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [AiXEvents](./x-components.aixevents.md) &gt; [AiComponentMounted](./x-components.aixevents.aicomponentmounted.md)
+
+## AiXEvents.AiComponentMounted property
+
+**Signature:**
+
+```typescript
+AiComponentMounted: void;
+```

package/docs/API-reference/api/x-components.aixevents.md

@@ -37,7 +37,7 @@ Description
 </th></tr></thead>
 <tbody><tr><td>
 
-[AiOverviewMounted](./x-components.aixevents.aioverviewmounted.md)
+[AiComponentMounted](./x-components.aixevents.aicomponentmounted.md)
 
 
 </td><td>

package/docs/API-reference/api/x-components.baseeventsmodalclose.md

@@ -22,7 +22,7 @@ _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
         default: string;
     };
 }>> & Readonly<{}>, {
-    closingEvent: "UserClickedCloseEventsModal" | "UserClickedCloseX" | "UserClickedOutOfMainModal" | "UserClickedOpenEventsModal" | "UserClickedOpenX" | "UserClickedOutOfEventsModal" | "UserOpenXProgrammatically" | "UserReachedEmpathizeTop" | "EmpathizeClosed" | "EmpathizeOpened" | "UserClosedEmpathize" | "UserPressedClearHistoryQueries" | "UserClickedEnableHistoryQueries" | "UserClickedDisableHistoryQueries" | "UserClickedConfirmDisableHistoryQueries" | "UserClickedDismissDisableHistoryQueries" | "ScrollRestoreSucceeded" | "ScrollRestoreFailed" | "UserHoveredInSearchBox" | "UserHoveredOutSearchBox" | "UserBlurredSearchBox" | "UserClickedSearchBox" | "UserFocusedSearchBox" | "UserPressedClearSearchBoxButton" | "ReloadSearchRequested" | "UserReachedResultsListEnd" | "UserClickedAbortARedirection" | "RelatedPromptsUnmounted" | "ReloadRelatedPromptsRequested" | "AiOverviewMounted";
+    closingEvent: "UserClickedCloseEventsModal" | "UserClickedCloseX" | "UserClickedOutOfMainModal" | "UserClickedOpenEventsModal" | "UserClickedOpenX" | "UserClickedOutOfEventsModal" | "UserOpenXProgrammatically" | "UserReachedEmpathizeTop" | "EmpathizeClosed" | "EmpathizeOpened" | "UserClosedEmpathize" | "UserPressedClearHistoryQueries" | "UserClickedEnableHistoryQueries" | "UserClickedDisableHistoryQueries" | "UserClickedConfirmDisableHistoryQueries" | "UserClickedDismissDisableHistoryQueries" | "ScrollRestoreSucceeded" | "ScrollRestoreFailed" | "UserHoveredInSearchBox" | "UserHoveredOutSearchBox" | "UserBlurredSearchBox" | "UserClickedSearchBox" | "UserFocusedSearchBox" | "UserPressedClearSearchBoxButton" | "ReloadSearchRequested" | "UserReachedResultsListEnd" | "UserClickedAbortARedirection" | "RelatedPromptsUnmounted" | "ReloadRelatedPromptsRequested" | "AiComponentMounted";
 }, {}, {
     BaseEventButton: import("vue").DefineComponent<{}, {}, any>;
 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>

package/docs/API-reference/api/x-components.baseeventsmodalopen.md

@@ -22,7 +22,7 @@ _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
         default: string;
     };
 }>> & Readonly<{}>, {
-    openingEvent: "UserClickedCloseEventsModal" | "UserClickedCloseX" | "UserClickedOutOfMainModal" | "UserClickedOpenEventsModal" | "UserClickedOpenX" | "UserClickedOutOfEventsModal" | "UserOpenXProgrammatically" | "UserReachedEmpathizeTop" | "EmpathizeClosed" | "EmpathizeOpened" | "UserClosedEmpathize" | "UserPressedClearHistoryQueries" | "UserClickedEnableHistoryQueries" | "UserClickedDisableHistoryQueries" | "UserClickedConfirmDisableHistoryQueries" | "UserClickedDismissDisableHistoryQueries" | "ScrollRestoreSucceeded" | "ScrollRestoreFailed" | "UserHoveredInSearchBox" | "UserHoveredOutSearchBox" | "UserBlurredSearchBox" | "UserClickedSearchBox" | "UserFocusedSearchBox" | "UserPressedClearSearchBoxButton" | "ReloadSearchRequested" | "UserReachedResultsListEnd" | "UserClickedAbortARedirection" | "RelatedPromptsUnmounted" | "ReloadRelatedPromptsRequested" | "AiOverviewMounted";
+    openingEvent: "UserClickedCloseEventsModal" | "UserClickedCloseX" | "UserClickedOutOfMainModal" | "UserClickedOpenEventsModal" | "UserClickedOpenX" | "UserClickedOutOfEventsModal" | "UserOpenXProgrammatically" | "UserReachedEmpathizeTop" | "EmpathizeClosed" | "EmpathizeOpened" | "UserClosedEmpathize" | "UserPressedClearHistoryQueries" | "UserClickedEnableHistoryQueries" | "UserClickedDisableHistoryQueries" | "UserClickedConfirmDisableHistoryQueries" | "UserClickedDismissDisableHistoryQueries" | "ScrollRestoreSucceeded" | "ScrollRestoreFailed" | "UserHoveredInSearchBox" | "UserHoveredOutSearchBox" | "UserBlurredSearchBox" | "UserClickedSearchBox" | "UserFocusedSearchBox" | "UserPressedClearSearchBoxButton" | "ReloadSearchRequested" | "UserReachedResultsListEnd" | "UserClickedAbortARedirection" | "RelatedPromptsUnmounted" | "ReloadRelatedPromptsRequested" | "AiComponentMounted";
 }, {}, {
     BaseEventButton: import("vue").DefineComponent<{}, {}, any>;
 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>

package/docs/API-reference/api/x-components.hierarchicalfilter.md

@@ -198,7 +198,7 @@ _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
         AiSuggestionsSearchChanged?: import("@empathyco/x-types").AiSuggestionSearch[] | undefined;
         UserClickedAiOverviewExpandButton?: boolean | undefined;
         UserClickedAnAiOverviewResult?: import("@empathyco/x-types").Result | undefined;
-        AiOverviewMounted?: void | undefined;
+        AiComponentMounted?: void | undefined;
     }>;
     innerCssClasses: import("vue").ComputedRef<(string | Dictionary<boolean>)[]>;
     renderedChildrenFilters: import("vue").ComputedRef<HierarchicalFilterModel[]>;

package/docs/API-reference/api/x-components.md

@@ -3130,6 +3130,8 @@ Options for wire operators that delay subscribers.
 
 </td><td>
 
+TypingHTMLElement interface.
+
 
 </td></tr>
 <tr><td>

package/docs/API-reference/api/x-components.simplefilter.md

@@ -195,7 +195,7 @@ _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
         AiSuggestionsSearchChanged?: import("@empathyco/x-types").AiSuggestionSearch[] | undefined;
         UserClickedAiOverviewExpandButton?: boolean | undefined;
         UserClickedAnAiOverviewResult?: import("@empathyco/x-types").Result | undefined;
-        AiOverviewMounted?: void | undefined;
+        AiComponentMounted?: void | undefined;
     }>;
     innerCssClasses: import("vue").ComputedRef<(string | Dictionary<boolean>)[]>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{

package/docs/API-reference/api/x-components.snippetcallbacks.md

@@ -185,7 +185,7 @@ _default: import("vue").DefineComponent<{}, {
         AiSuggestionsSearchChanged: (payload: import("@empathyco/x-types").AiSuggestionSearch[], metadata: WireMetadata) => unknown;
         UserClickedAiOverviewExpandButton: (payload: boolean, metadata: WireMetadata) => unknown;
         UserClickedAnAiOverviewResult: (payload: import("@empathyco/x-types").Result, metadata: WireMetadata) => unknown;
-        AiOverviewMounted: (payload: undefined, metadata: WireMetadata) => unknown;
+        AiComponentMounted: (payload: undefined, metadata: WireMetadata) => unknown;
     }>>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {
     GlobalXBus: import("vue").DefineComponent<{}, {}, any>;

package/docs/API-reference/api/x-components.typinghtmlelement.md

@@ -4,6 +4,8 @@
 
 ## TypingHTMLElement interface
 
+TypingHTMLElement interface.
+
 **Signature:**
 
 ```typescript

package/docs/API-reference/api/x-types.aisuggestionquery.categories.md

@@ -0,0 +1,11 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-types](./x-types.md) &gt; [AiSuggestionQuery](./x-types.aisuggestionquery.md) &gt; [categories](./x-types.aisuggestionquery.categories.md)
+
+## AiSuggestionQuery.categories property
+
+**Signature:**
+
+```typescript
+categories: string[];
+```

package/docs/API-reference/api/x-types.aisuggestionquery.md

@@ -0,0 +1,73 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-types](./x-types.md) &gt; [AiSuggestionQuery](./x-types.aisuggestionquery.md)
+
+## AiSuggestionQuery interface
+
+Data for each query suggested.
+
+**Signature:**
+
+```typescript
+export interface AiSuggestionQuery 
+```
+
+## Properties
+
+<table><thead><tr><th>
+
+Property
+
+
+</th><th>
+
+Modifiers
+
+
+</th><th>
+
+Type
+
+
+</th><th>
+
+Description
+
+
+</th></tr></thead>
+<tbody><tr><td>
+
+[categories](./x-types.aisuggestionquery.categories.md)
+
+
+</td><td>
+
+
+</td><td>
+
+string\[\]
+
+
+</td><td>
+
+
+</td></tr>
+<tr><td>
+
+[query](./x-types.aisuggestionquery.query.md)
+
+
+</td><td>
+
+
+</td><td>
+
+string
+
+
+</td><td>
+
+
+</td></tr>
+</tbody></table>
+

package/docs/API-reference/api/x-types.aisuggestionquery.query.md

@@ -0,0 +1,11 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-types](./x-types.md) &gt; [AiSuggestionQuery](./x-types.aisuggestionquery.md) &gt; [query](./x-types.aisuggestionquery.query.md)
+
+## AiSuggestionQuery.query property
+
+**Signature:**
+
+```typescript
+query: string;
+```

package/docs/API-reference/api/x-types.aisuggestiontagging.md

@@ -0,0 +1,90 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-types](./x-types.md) &gt; [AiSuggestionTagging](./x-types.aisuggestiontagging.md)
+
+## AiSuggestionTagging interface
+
+Interface for the AI suggestion tagging.
+
+**Signature:**
+
+```typescript
+export interface AiSuggestionTagging 
+```
+
+## Properties
+
+<table><thead><tr><th>
+
+Property
+
+
+</th><th>
+
+Modifiers
+
+
+</th><th>
+
+Type
+
+
+</th><th>
+
+Description
+
+
+</th></tr></thead>
+<tbody><tr><td>
+
+[searchQueries](./x-types.aisuggestiontagging.searchqueries.md)
+
+
+</td><td>
+
+
+</td><td>
+
+Record&lt;string, { toolingDisplay: [TaggingRequest](./x-types.taggingrequest.md)<!-- -->; toolingDisplayClick: [TaggingRequest](./x-types.taggingrequest.md)<!-- -->; toolingDisplayAdd2Cart: [TaggingRequest](./x-types.taggingrequest.md)<!-- -->; }&gt;
+
+
+</td><td>
+
+
+</td></tr>
+<tr><td>
+
+[toolingDisplay](./x-types.aisuggestiontagging.toolingdisplay.md)
+
+
+</td><td>
+
+
+</td><td>
+
+[TaggingRequest](./x-types.taggingrequest.md)
+
+
+</td><td>
+
+
+</td></tr>
+<tr><td>
+
+[toolingDisplayClick](./x-types.aisuggestiontagging.toolingdisplayclick.md)
+
+
+</td><td>
+
+
+</td><td>
+
+[TaggingRequest](./x-types.taggingrequest.md)
+
+
+</td><td>
+
+
+</td></tr>
+</tbody></table>
+

package/docs/API-reference/api/x-types.aisuggestiontagging.searchqueries.md

@@ -0,0 +1,15 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-types](./x-types.md) &gt; [AiSuggestionTagging](./x-types.aisuggestiontagging.md) &gt; [searchQueries](./x-types.aisuggestiontagging.searchqueries.md)
+
+## AiSuggestionTagging.searchQueries property
+
+**Signature:**
+
+```typescript
+searchQueries: Record<string, {
+        toolingDisplay: TaggingRequest;
+        toolingDisplayClick: TaggingRequest;
+        toolingDisplayAdd2Cart: TaggingRequest;
+    }>;
+```

package/docs/API-reference/api/x-types.aisuggestiontagging.toolingdisplay.md

@@ -0,0 +1,11 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-types](./x-types.md) &gt; [AiSuggestionTagging](./x-types.aisuggestiontagging.md) &gt; [toolingDisplay](./x-types.aisuggestiontagging.toolingdisplay.md)
+
+## AiSuggestionTagging.toolingDisplay property
+
+**Signature:**
+
+```typescript
+toolingDisplay: TaggingRequest;
+```

package/docs/API-reference/api/x-types.aisuggestiontagging.toolingdisplayclick.md

@@ -0,0 +1,11 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-types](./x-types.md) &gt; [AiSuggestionTagging](./x-types.aisuggestiontagging.md) &gt; [toolingDisplayClick](./x-types.aisuggestiontagging.toolingdisplayclick.md)
+
+## AiSuggestionTagging.toolingDisplayClick property
+
+**Signature:**
+
+```typescript
+toolingDisplayClick: TaggingRequest;
+```

package/docs/API-reference/api/x-types.md

@@ -191,6 +191,17 @@ Request for the question endpoint.
 Response for the question endpoint.
 
 
+</td></tr>
+<tr><td>
+
+[AiSuggestionQuery](./x-types.aisuggestionquery.md)
+
+
+</td><td>
+
+Data for each query suggested.
+
+
 </td></tr>
 <tr><td>
 
@@ -235,6 +246,17 @@ Request for the suggestions-search endpoint.
 Response for the AI suggestions search endpoint.
 
 
+</td></tr>
+<tr><td>
+
+[AiSuggestionTagging](./x-types.aisuggestiontagging.md)
+
+
+</td><td>
+
+Interface for the AI suggestion tagging.
+
+
 </td></tr>
 <tr><td>
 

package/js/directives/typing.js

@@ -1,6 +1,5 @@
 /**
  * Typing directive.
- *
  * @public
  */
 const typing = {
@@ -22,6 +21,7 @@ const typing = {
  *
  * @param el - The HTML element where the typing animation will be displayed.
  * @param options - Options for the behavior of the animation.
+ * @internal
  */
 function execute(el, options) {
     const { text, speed = 1, targetAttr = '' } = options;

package/js/directives/typing.js.map

@@ -1 +1 @@
-{"version":3,"file":"typing.js","sources":["../../../src/directives/typing.ts"],"sourcesContent":["import type { Directive } from 'vue'\n\n/**\n * TypingOptions interface.\n *\n * @public\n */\nexport interface TypingOptions {\n  /**\n   * The text (plain or html) that will be typed into the target element.\n   */\n  text: string\n  /**\n   * The typing speed in milliseconds per character.\n   *\n   */\n  speed?: number\n  /**\n   * The attribute of the HTML element where the typed text will be placed.\n   * If not specified, the text will be set as content (innerHTML).\n   *\n   * @example 'placeholder'\n   */\n  targetAttr?: string\n}\n\nexport interface TypingHTMLElement extends HTMLElement {\n  __timeoutId?: number\n}\n\n/**\n * Typing directive.\n *\n * @public\n */\nexport const typing: Directive<TypingHTMLElement, TypingOptions> = {\n  mounted(el, binding) {\n    execute(el, binding.value)\n  },\n\n  updated(el, binding) {\n    if (binding.value.text !== binding.oldValue?.text) {\n      clearTimeout(el.__timeoutId)\n      execute(el, binding.value)\n    }\n  },\n\n  unmounted(el) {\n    clearTimeout(el.__timeoutId)\n  },\n}\n\n/**\n * Execute a typing animation in an HTML element.\n *\n * @param el - The HTML element where the typing animation will be displayed.\n * @param options - Options for the behavior of the animation.\n */\nfunction execute(el: TypingHTMLElement, options: TypingOptions) {\n  const { text, speed = 1, targetAttr = '' } = options\n\n  if (!text) {\n    console.error('v-typing: \"text\" is required.')\n    return\n  }\n\n  let index = 0\n\n  const updateContent = (value: string) => {\n    if (targetAttr) {\n      el.setAttribute(targetAttr, value)\n    } else {\n      el.innerHTML = value\n    }\n  }\n\n  const type = () => {\n    if (index < text.length) {\n      updateContent(text.slice(0, index + 1))\n      index++\n      el.__timeoutId = setTimeout(type, speed) as unknown as number\n    } else {\n      updateContent(text)\n      clearTimeout(el.__timeoutId)\n      el.__timeoutId = undefined\n    }\n  }\n\n  type()\n}\n"],"names":[],"mappings":"AA8BA;;;;AAIG;AACI,MAAM,MAAM,GAAgD;IACjE,OAAO,CAAC,EAAE,EAAE,OAAO,EAAA;AACjB,QAAA,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC,KAAK,CAAC;IAC5B,CAAC;IAED,OAAO,CAAC,EAAE,EAAE,OAAO,EAAA;AACjB,QAAA,IAAI,OAAO,CAAC,KAAK,CAAC,IAAI,KAAK,OAAO,CAAC,QAAQ,EAAE,IAAI,EAAE;AACjD,YAAA,YAAY,CAAC,EAAE,CAAC,WAAW,CAAC;AAC5B,YAAA,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC,KAAK,CAAC;QAC5B;IACF,CAAC;AAED,IAAA,SAAS,CAAC,EAAE,EAAA;AACV,QAAA,YAAY,CAAC,EAAE,CAAC,WAAW,CAAC;IAC9B,CAAC;;AAGH;;;;;AAKG;AACH,SAAS,OAAO,CAAC,EAAqB,EAAE,OAAsB,EAAA;AAC5D,IAAA,MAAM,EAAE,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,UAAU,GAAG,EAAE,EAAE,GAAG,OAAO;IAEpD,IAAI,CAAC,IAAI,EAAE;AACT,QAAA,OAAO,CAAC,KAAK,CAAC,+BAA+B,CAAC;QAC9C;IACF;IAEA,IAAI,KAAK,GAAG,CAAC;AAEb,IAAA,MAAM,aAAa,GAAG,CAAC,KAAa,KAAI;QACtC,IAAI,UAAU,EAAE;AACd,YAAA,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,KAAK,CAAC;QACpC;aAAO;AACL,YAAA,EAAE,CAAC,SAAS,GAAG,KAAK;QACtB;AACF,IAAA,CAAC;IAED,MAAM,IAAI,GAAG,MAAK;AAChB,QAAA,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,EAAE;AACvB,YAAA,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;AACvC,YAAA,KAAK,EAAE;YACP,EAAE,CAAC,WAAW,GAAG,UAAU,CAAC,IAAI,EAAE,KAAK,CAAsB;QAC/D;aAAO;YACL,aAAa,CAAC,IAAI,CAAC;AACnB,YAAA,YAAY,CAAC,EAAE,CAAC,WAAW,CAAC;AAC5B,YAAA,EAAE,CAAC,WAAW,GAAG,SAAS;QAC5B;AACF,IAAA,CAAC;AAED,IAAA,IAAI,EAAE;AACR;;;;"}
+{"version":3,"file":"typing.js","sources":["../../../src/directives/typing.ts"],"sourcesContent":["import type { Directive } from 'vue'\n\n/**\n * TypingOptions interface.\n * @public\n */\nexport interface TypingOptions {\n  /**\n   * The text (plain or html) that will be typed into the target element.\n   */\n  text: string\n  /**\n   * The typing speed in milliseconds per character.\n   *\n   */\n  speed?: number\n  /**\n   * The attribute of the HTML element where the typed text will be placed.\n   * If not specified, the text will be set as content (innerHTML).\n   *\n   * @example 'placeholder'\n   */\n  targetAttr?: string\n}\n\n/**\n * TypingHTMLElement interface.\n * @public\n */\nexport interface TypingHTMLElement extends HTMLElement {\n  __timeoutId?: number\n}\n\n/**\n * Typing directive.\n * @public\n */\nexport const typing: Directive<TypingHTMLElement, TypingOptions> = {\n  mounted(el, binding) {\n    execute(el, binding.value)\n  },\n\n  updated(el, binding) {\n    if (binding.value.text !== binding.oldValue?.text) {\n      clearTimeout(el.__timeoutId)\n      execute(el, binding.value)\n    }\n  },\n\n  unmounted(el) {\n    clearTimeout(el.__timeoutId)\n  },\n}\n\n/**\n * Execute a typing animation in an HTML element.\n *\n * @param el - The HTML element where the typing animation will be displayed.\n * @param options - Options for the behavior of the animation.\n * @internal\n */\nfunction execute(el: TypingHTMLElement, options: TypingOptions) {\n  const { text, speed = 1, targetAttr = '' } = options\n\n  if (!text) {\n    console.error('v-typing: \"text\" is required.')\n    return\n  }\n\n  let index = 0\n\n  const updateContent = (value: string) => {\n    if (targetAttr) {\n      el.setAttribute(targetAttr, value)\n    } else {\n      el.innerHTML = value\n    }\n  }\n\n  const type = () => {\n    if (index < text.length) {\n      updateContent(text.slice(0, index + 1))\n      index++\n      el.__timeoutId = setTimeout(type, speed) as unknown as number\n    } else {\n      updateContent(text)\n      clearTimeout(el.__timeoutId)\n      el.__timeoutId = undefined\n    }\n  }\n\n  type()\n}\n"],"names":[],"mappings":"AAiCA;;;AAGG;AACI,MAAM,MAAM,GAAgD;IACjE,OAAO,CAAC,EAAE,EAAE,OAAO,EAAA;AACjB,QAAA,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC,KAAK,CAAC;IAC5B,CAAC;IAED,OAAO,CAAC,EAAE,EAAE,OAAO,EAAA;AACjB,QAAA,IAAI,OAAO,CAAC,KAAK,CAAC,IAAI,KAAK,OAAO,CAAC,QAAQ,EAAE,IAAI,EAAE;AACjD,YAAA,YAAY,CAAC,EAAE,CAAC,WAAW,CAAC;AAC5B,YAAA,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC,KAAK,CAAC;QAC5B;IACF,CAAC;AAED,IAAA,SAAS,CAAC,EAAE,EAAA;AACV,QAAA,YAAY,CAAC,EAAE,CAAC,WAAW,CAAC;IAC9B,CAAC;;AAGH;;;;;;AAMG;AACH,SAAS,OAAO,CAAC,EAAqB,EAAE,OAAsB,EAAA;AAC5D,IAAA,MAAM,EAAE,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,UAAU,GAAG,EAAE,EAAE,GAAG,OAAO;IAEpD,IAAI,CAAC,IAAI,EAAE;AACT,QAAA,OAAO,CAAC,KAAK,CAAC,+BAA+B,CAAC;QAC9C;IACF;IAEA,IAAI,KAAK,GAAG,CAAC;AAEb,IAAA,MAAM,aAAa,GAAG,CAAC,KAAa,KAAI;QACtC,IAAI,UAAU,EAAE;AACd,YAAA,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,KAAK,CAAC;QACpC;aAAO;AACL,YAAA,EAAE,CAAC,SAAS,GAAG,KAAK;QACtB;AACF,IAAA,CAAC;IAED,MAAM,IAAI,GAAG,MAAK;AAChB,QAAA,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,EAAE;AACvB,YAAA,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;AACvC,YAAA,KAAK,EAAE;YACP,EAAE,CAAC,WAAW,GAAG,UAAU,CAAC,IAAI,EAAE,KAAK,CAAsB;QAC/D;aAAO;YACL,aAAa,CAAC,IAAI,CAAC;AACnB,YAAA,YAAY,CAAC,EAAE,CAAC,WAAW,CAAC;AAC5B,YAAA,EAAE,CAAC,WAAW,GAAG,SAAS;QAC5B;AACF,IAAA,CAAC;AAED,IAAA,IAAI,EAAE;AACR;;;;"}

package/js/plugins/x-plugin.js

@@ -1,5 +1,4 @@
-import { deepMerge } from '@empathyco/x-deep-merge';
-import { forEach } from '@empathyco/x-utils';
+import { deepMerge, forEach } from '@empathyco/x-utils';
 import { createStore } from 'vuex';
 import { cleanGettersProxyCache } from '../store/utils/getters-proxy.utils.js';
 import { RootXStoreModule } from '../store/x.module.js';

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

@@ -1 +1 @@
-{"version":3,"file":"x-plugin.js","sources":["../../../src/plugins/x-plugin.ts"],"sourcesContent":["import type { XComponentsAdapter } from '@empathyco/x-types'\nimport type { Dictionary } from '@empathyco/x-utils'\nimport type { Observable } from 'rxjs'\nimport type { App } from 'vue'\nimport type { Module, Store } from 'vuex'\nimport type { AnyXStoreModule, RootXStoreState } from '../store/store.types'\nimport type { XEvent, XEventsTypes } from '../wiring/events.types'\nimport type { AnyWire, WireMetadata } from '../wiring/wiring.types'\nimport type { EventPayload, SubjectPayload, XBus } from '../x-bus'\nimport type { AnyXModule, XModuleName } from '../x-modules/x-modules.types'\nimport type { AnyXStoreModuleOption, XModuleOptions, XPluginOptions } from './x-plugin.types'\nimport { deepMerge } from '@empathyco/x-deep-merge'\nimport { forEach } from '@empathyco/x-utils'\nimport { createStore } from 'vuex'\nimport { cleanGettersProxyCache } from '../store/utils/getters-proxy.utils'\nimport { RootXStoreModule } from '../store/x.module'\nimport { sendWiringToDevtools } from './devtools/wiring.devtools'\nimport { bus } from './x-bus'\nimport { registerStoreEmitters } from './x-emitters'\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 {\n  /**\n   * XComponentsAdapter Is the middleware between the components and our API where data can be\n   * 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 XBus, so any kind of application can subscribe to\n   * {@link XEventsTypes} 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<XEventsTypes, WireMetadata> {\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 new 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<XEventsTypes, WireMetadata>\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 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   * XModules will be installed immediately. False otherwise, in this case\n   * 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  /**\n   * The Vue application instance, passed by the installation method.\n   *\n   * @internal\n   */\n  protected app!: App\n\n  /**\n   * Creates a new instance of the XPlugin with the given bus passed as parameter.\n   *\n   * @param bus - The XBus implementation to use for the plugin.\n   *\n   * @public\n   */\n  public constructor(bus: XBus<XEventsTypes, WireMetadata>) {\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 app - The Vue application instance.\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(app: App, 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.app = app\n    this.options = options\n    this.adapter = options.adapter\n    this.registerStore()\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      this.registerWiring(customizedXModule)\n      // The wiring must be registered after the store emitters\n      // to allow lazy loaded modules work properly.\n      this.installedXModules.add(xModule.name)\n      void 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   * @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      // eslint-disable-next-line ts/no-unsafe-assignment\n      wiring: wiringOptions ? deepMerge({}, wiring, wiringOptions) : wiring,\n      storeModule: this.customizeStoreModule(storeModule, storeModuleOptions ?? {}, config),\n      // eslint-disable-next-line ts/no-unsafe-assignment\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   * @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) as unknown as Observable<\n        SubjectPayload<EventPayload<XEventsTypes, typeof event>, WireMetadata>\n      >\n      // Register event wires\n      forEach(wires, (_, wire) => {\n        wire(observable, this.store as Store<RootXStoreState>, 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   * @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   * @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    // eslint-disable-next-line ts/no-unsafe-assignment\n    const customizedModule = deepMerge({}, actionsGettersMutations, newActionsGettersMutations)\n    // eslint-disable-next-line ts/no-unsafe-assignment,ts/no-unsafe-member-access\n    customizedModule.state = deepMerge(defaultState(), xModuleState, configOptionsObject)\n    // eslint-disable-next-line ts/no-unsafe-return\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   * @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.store = this.options.store ?? createStore({})\n    this.app.use(this.store)\n    this.store.registerModule('x', RootXStoreModule)\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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"}
+{"version":3,"file":"x-plugin.js","sources":["../../../src/plugins/x-plugin.ts"],"sourcesContent":["import type { XComponentsAdapter } from '@empathyco/x-types'\nimport type { Dictionary } from '@empathyco/x-utils'\nimport type { Observable } from 'rxjs'\nimport type { App } from 'vue'\nimport type { Module, Store } from 'vuex'\nimport type { AnyXStoreModule, RootXStoreState } from '../store/store.types'\nimport type { XEvent, XEventsTypes } from '../wiring/events.types'\nimport type { AnyWire, WireMetadata } from '../wiring/wiring.types'\nimport type { EventPayload, SubjectPayload, XBus } from '../x-bus'\nimport type { AnyXModule, XModuleName } from '../x-modules/x-modules.types'\nimport type { AnyXStoreModuleOption, XModuleOptions, XPluginOptions } from './x-plugin.types'\nimport { deepMerge, forEach } from '@empathyco/x-utils'\nimport { createStore } from 'vuex'\nimport { cleanGettersProxyCache } from '../store/utils/getters-proxy.utils'\nimport { RootXStoreModule } from '../store/x.module'\nimport { sendWiringToDevtools } from './devtools/wiring.devtools'\nimport { bus } from './x-bus'\nimport { registerStoreEmitters } from './x-emitters'\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 {\n  /**\n   * XComponentsAdapter Is the middleware between the components and our API where data can be\n   * 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 XBus, so any kind of application can subscribe to\n   * {@link XEventsTypes} 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<XEventsTypes, WireMetadata> {\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 new 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<XEventsTypes, WireMetadata>\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 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   * XModules will be installed immediately. False otherwise, in this case\n   * 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  /**\n   * The Vue application instance, passed by the installation method.\n   *\n   * @internal\n   */\n  protected app!: App\n\n  /**\n   * Creates a new instance of the XPlugin with the given bus passed as parameter.\n   *\n   * @param bus - The XBus implementation to use for the plugin.\n   *\n   * @public\n   */\n  public constructor(bus: XBus<XEventsTypes, WireMetadata>) {\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 app - The Vue application instance.\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(app: App, 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.app = app\n    this.options = options\n    this.adapter = options.adapter\n    this.registerStore()\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      this.registerWiring(customizedXModule)\n      // The wiring must be registered after the store emitters\n      // to allow lazy loaded modules work properly.\n      this.installedXModules.add(xModule.name)\n      void 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   * @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      // eslint-disable-next-line ts/no-unsafe-assignment\n      wiring: wiringOptions ? deepMerge({}, wiring, wiringOptions) : wiring,\n      storeModule: this.customizeStoreModule(storeModule, storeModuleOptions ?? {}, config),\n      // eslint-disable-next-line ts/no-unsafe-assignment\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   * @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) as unknown as Observable<\n        SubjectPayload<EventPayload<XEventsTypes, typeof event>, WireMetadata>\n      >\n      // Register event wires\n      forEach(wires, (_, wire) => {\n        wire(observable, this.store as Store<RootXStoreState>, 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   * @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   * @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    // eslint-disable-next-line ts/no-unsafe-assignment\n    const customizedModule = deepMerge({}, actionsGettersMutations, newActionsGettersMutations)\n    // eslint-disable-next-line ts/no-unsafe-assignment,ts/no-unsafe-member-access\n    customizedModule.state = deepMerge(defaultState(), xModuleState, configOptionsObject)\n    // eslint-disable-next-line ts/no-unsafe-return\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   * @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.store = this.options.store ?? createStore({})\n    this.app.use(this.store)\n    this.store.registerModule('x', RootXStoreModule)\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":";;;;;;;;;AAoBA;;;;;AAKG;MACU,OAAO,CAAA;AAClB;;;;;;;;AAQG;AACI,IAAA,WAAW,OAAO,GAAA;AACvB,QAAA,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO;IACnC;AAEA;;;;;;;;AAQG;AACI,IAAA,WAAW,GAAG,GAAA;AACnB,QAAA,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG;IAC/B;AAEA;;;;;;;AAOG;AACI,IAAA,WAAW,KAAK,GAAA;AACrB,QAAA,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC,KAAK;IACjC;AAEA;;;;;;AAMG;AACO,IAAA,OAAO,WAAW,GAAA;AAC1B,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAClB,YAAA,MAAM,IAAI,KAAK,CAAC,sDAAsD,CAAC;QACzE;QACA,OAAO,IAAI,CAAC,QAAQ;IACtB;AAuEA;;;;;;AAMG;AACH,IAAA,WAAA,CAAmB,GAAqC,EAAA;QA9DjD,IAAA,CAAA,MAAM,GAAoE,EAAE;AAenF;;;;AAIG;AACO,QAAA,IAAA,CAAA,iBAAiB,GAAG,IAAI,GAAG,EAAU;AAE/C;;;;;;;AAOG;QACO,IAAA,CAAA,WAAW,GAAG,KAAK;AAiC3B,QAAA,IAAI,CAAC,GAAG,GAAG,GAAG;IAChB;AAEA;;;;;;;AAOG;IACH,OAAO,eAAe,CAAC,OAAmB,EAAA;AACxC,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,OAAO,CAAC;QACxC;aAAO;AACL,YAAA,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC;QACnC;IACF;AAEA;;;;;;AAMG;AACH,IAAA,OAAO,aAAa,GAAA;AAClB,QAAA,sBAAsB,EAAE;AACxB,QAAA,IAAI,CAAC,QAAQ,GAAG,SAAS;IAC3B;AAEA;;;;;;;AAOG;IACO,OAAO,mBAAmB,CAAC,OAAmB,EAAA;QACtD,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO;IAC9C;AAEA;;;;;;;;AAQG;IACH,OAAO,CAAC,GAAQ,EAAE,OAAwB,EAAA;AACxC,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE;AACpB,YAAA,MAAM,IAAI,KAAK,CAAC,oCAAoC,CAAC;QACvD;QACA,4BAA4B,CAAC,OAAO,CAAC;AACrC,QAAA,OAAO,CAAC,QAAQ,GAAG,IAAI;AACvB,QAAA,IAAI,CAAC,GAAG,GAAG,GAAG;AACd,QAAA,IAAI,CAAC,OAAO,GAAG,OAAO;AACtB,QAAA,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC,OAAO;QAC9B,IAAI,CAAC,aAAa,EAAE;QACpB,IAAI,CAAC,sBAAsB,EAAE;QAC7B,IAAI,CAAC,uBAAuB,EAAE;AAC9B,QAAA,IAAI,CAAC,WAAW,GAAG,IAAI;IACzB;AAEA;;;;;;AAMG;AACO,IAAA,eAAe,CAAC,OAAmB,EAAA;AAC3C,QAAA,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAC7C,MAAM,iBAAiB,GAAG,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC;AACxD,YAAA,IAAI,CAAC,mBAAmB,CAAC,iBAAiB,CAAC;AAC3C,YAAA,IAAI,CAAC,qBAAqB,CAAC,iBAAiB,CAAC;AAC7C,YAAA,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC;;;YAGtC,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC;AACxC,YAAA,KAAK,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,kBAAkB,EAAE,OAAO,CAAC,IAAI,CAAC;QACtD;IACF;AAEA;;;;;;AAMG;AACO,IAAA,gBAAgB,CAAC,EACzB,IAAI,EACJ,MAAM,EACN,WAAW,EACX,aAAa,EACb,GAAG,WAAW,EACH,EAAA;AACX,QAAA,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,GACrC,IAAI,CAAC,OAAO,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,EAAE;QAErC,MAAM,EAAE,WAAW,EAAE,kBAAkB,EAAE,aAAa,EAAE,eAAe,EAAE,GACvE,IAAI,CAAC,OAAO,CAAC,mBAAmB,GAAG,IAAI,CAAC,IAAI,EAAE;QAEhD,OAAO;YACL,IAAI;;AAEJ,YAAA,MAAM,EAAE,aAAa,GAAG,SAAS,CAAC,EAAE,EAAE,MAAM,EAAE,aAAa,CAAC,GAAG,MAAM;AACrE,YAAA,WAAW,EAAE,IAAI,CAAC,oBAAoB,CAAC,WAAW,EAAE,kBAAkB,IAAI,EAAE,EAAE,MAAM,CAAC;;AAErF,YAAA,aAAa,EAAE;kBACX,SAAS,CAAC,EAAE,EAAE,aAAa,EAAE,eAAe;AAC9C,kBAAE,aAAa;AACjB,YAAA,GAAG,WAAW;SACf;IACH;AAEA;;;;;;AAMG;AACO,IAAA,cAAc,CAAC,EAAE,MAAM,EAAE,IAAI,EAAc,EAAA;AACnD,QAAA,oBAAoB,CAAC,IAAI,EAAE,MAAM,CAAC;QAClC,OAAO,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,KAA0B,KAAI;;AAEpD,YAAA,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,CAEzC;;YAED,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,IAAI,KAAI;gBACzB,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,KAA+B,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACpF,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC,CAAC;IACJ;AAEA;;;;;AAKG;AACO,IAAA,mBAAmB,CAAC,EAAE,IAAI,EAAE,WAAW,EAAc,EAAA;AAC3D,QAAA,WAAgC,CAAC,UAAU,GAAG,IAAI;AACpD,QAAA,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,WAAW,CAAC;IACrD;AAEA;;;;;;;;;;;;;AAaG;AACO,IAAA,oBAAoB,CAC5B,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,uBAAuB,EAAmB,EACpE,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,0BAA0B,EAAyB,EAC7E,aAAsB,EAAA;AAEtB,QAAA,MAAM,mBAAmB,GAAG,aAAa,GAAG,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,EAAE;;QAE1E,MAAM,gBAAgB,GAAG,SAAS,CAAC,EAAE,EAAE,uBAAuB,EAAE,0BAA0B,CAAC;;AAE3F,QAAA,gBAAgB,CAAC,KAAK,GAAG,SAAS,CAAC,YAAY,EAAE,EAAE,YAAY,EAAE,mBAAmB,CAAC;;AAErF,QAAA,OAAO,gBAAgB;IACzB;AAEA;;;;;;AAMG;AACO,IAAA,qBAAqB,CAAC,OAAmB,EAAA;QACjD,qBAAqB,CAAC,OAAO,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC;IACtD;AAEA;;;;;;;AAOG;IACO,aAAa,GAAA;AACrB,QAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,KAAK,IAAI,WAAW,CAAC,EAAE,CAAC;QAClD,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC;QACxB,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,GAAG,EAAE,gBAAgB,CAAC;IAClD;AACA;;;;AAIG;IACO,sBAAsB,GAAA;QAC9B,IAAI,CAAC,OAAO,CAAC,eAAe,EAAE,OAAO,CAAC,OAAO,IAAG;AAC9C,YAAA,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC;AAC/B,QAAA,CAAC,CAAC;IACJ;AAEA;;;;;AAKG;IACO,uBAAuB,GAAA;QAC/B,OAAO,CAAC,OAAO,CAAC,eAAe,EAAE,CAAC,CAAC,EAAE,OAAO,KAAI;AAC9C,YAAA,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC;AAC/B,QAAA,CAAC,CAAC;AACF,QAAA,OAAO,CAAC,eAAe,GAAG,EAAE;IAC9B;;AA/SA;;;;AAIG;AACc,OAAA,CAAA,eAAe,GAA6C,EAA7C;AA6SlC;;;;;;;;;;;;;;;;;;;;;;;AAuBG;MACU,OAAO,GAAG,IAAI,OAAO,CAAC,GAAG;;;;"}

package/js/utils/storage.js

@@ -1,12 +1,11 @@
-import { BrowserStorageService } from '@empathyco/x-storage-service';
+import { BrowserStorageService } from '@empathyco/x-utils';
 import { noOp } from './function.js';
 
 /**
- * Service instance of {@link @empathyco/x-storage-service#StorageService | storage service} if
+ * Service instance of {@link @empathyco/x-utils#StorageService | storage service} if
  * localStorage is available.
- * If not, required {@link @empathyco/x-storage-service#StorageService | storage service} functions
+ * If not, required {@link @empathyco/x-utils#StorageService | storage service} functions
  * are initialized with empty implementations.
- *
  * @internal
  */
 const localStorageService = typeof localStorage !== 'undefined'

package/js/utils/storage.js.map

@@ -1 +1 @@
-{"version":3,"file":"storage.js","sources":["../../../src/utils/storage.ts"],"sourcesContent":["import type { StorageService } from '@empathyco/x-storage-service'\nimport { BrowserStorageService } from '@empathyco/x-storage-service'\nimport { noOp } from './function'\n\n/**\n * Service instance of {@link @empathyco/x-storage-service#StorageService | storage service} if\n * localStorage is available.\n * If not, required {@link @empathyco/x-storage-service#StorageService | storage service} functions\n * are initialized with empty implementations.\n *\n * @internal\n */\nexport const localStorageService: StorageService =\n  typeof localStorage !== 'undefined'\n    ? new BrowserStorageService(localStorage, 'x')\n    : {\n        clear: noOp,\n        getItem: noOp,\n        setItem: noOp,\n        removeItem: noOp,\n      }\n"],"names":[],"mappings":";;;AAIA;;;;;;;AAOG;AACI,MAAM,mBAAmB,GAC9B,OAAO,YAAY,KAAK;AACtB,MAAE,IAAI,qBAAqB,CAAC,YAAY,EAAE,GAAG;AAC7C,MAAE;AACE,QAAA,KAAK,EAAE,IAAI;AACX,QAAA,OAAO,EAAE,IAAI;AACb,QAAA,OAAO,EAAE,IAAI;AACb,QAAA,UAAU,EAAE,IAAI;;;;;"}
+{"version":3,"file":"storage.js","sources":["../../../src/utils/storage.ts"],"sourcesContent":["import type { StorageService } from '@empathyco/x-utils'\nimport { BrowserStorageService } from '@empathyco/x-utils'\nimport { noOp } from './function'\n\n/**\n * Service instance of {@link @empathyco/x-utils#StorageService | storage service} if\n * localStorage is available.\n * If not, required {@link @empathyco/x-utils#StorageService | storage service} functions\n * are initialized with empty implementations.\n * @internal\n */\nexport const localStorageService: StorageService =\n  typeof localStorage !== 'undefined'\n    ? new BrowserStorageService(localStorage, 'x')\n    : {\n        clear: noOp,\n        getItem: noOp,\n        setItem: noOp,\n        removeItem: noOp,\n      }\n"],"names":[],"mappings":";;;AAIA;;;;;;AAMG;AACI,MAAM,mBAAmB,GAC9B,OAAO,YAAY,KAAK;AACtB,MAAE,IAAI,qBAAqB,CAAC,YAAY,EAAE,GAAG;AAC7C,MAAE;AACE,QAAA,KAAK,EAAE,IAAI;AACX,QAAA,OAAO,EAAE,IAAI;AACb,QAAA,OAAO,EAAE,IAAI;AACb,QAAA,UAAU,EAAE,IAAI;;;;;"}

package/js/x-modules/ai/components/ai-carousel.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ai-carousel.vue.js","sources":["../../../../../src/x-modules/ai/components/ai-carousel.vue"],"sourcesContent":["<template>\n  <CollapseHeight>\n    <div v-if=\"suggestionsSearch.length\" class=\"x-ai-carousel\">\n      <DisplayEmitter\n        :payload=\"tagging?.toolingDisplay ?? emptyTaggingRequest\"\n        :event-metadata=\"{\n          feature: 'ai_carousel',\n          displayOriginalQuery: query || 'ai-carousel-without-query',\n          replaceable: false,\n        }\"\n        data-test=\"ai-carousel-display-emitter\"\n      >\n        <span\n          class=\"x-ai-carousel-title\"\n          :class=\"{ 'x-ai-carousel-title--expanded': titleExpanded }\"\n          data-test=\"ai-carousel-title\"\n          @click=\"toggleTitleExpansion\"\n        >\n          <AIStarIcon class=\"x-ai-carousel-title-icon\" />\n          <ChangeHeight>\n            <span\n              ref=\"titleRef\"\n              class=\"x-ai-carousel-title-text\"\n              :class=\"{ 'x-ai-carousel-title-text--expanded': titleExpanded }\"\n            >\n              {{ title }}\n            </span>\n          </ChangeHeight>\n          <button\n            v-if=\"isTitleOverflowing\"\n            class=\"x-ai-carousel-title-button\"\n            data-test=\"ai-carousel-title-button\"\n            :aria-label=\"titleExpanded ? 'Collapse' : 'Expand'\"\n          >\n            <ChevronDownIcon\n              class=\"x-ai-carousel-title-button-icon\"\n              :class=\"{ 'x-ai-carousel-title-button-icon--expanded': titleExpanded }\"\n            />\n          </button>\n        </span>\n      </DisplayEmitter>\n      <slot name=\"sliding-panel\" :suggestions=\"suggestionsSearch\" :tagging=\"tagging\">\n        <SlidingPanel\n          :class=\"slidingPanelClasses\"\n          :scroll-container-class=\"slidingPanelContainerClasses\"\n          :button-class=\"slidingPanelButtonsClasses\"\n          :reset-on-content-change=\"false\"\n        >\n          <template #sliding-panel-addons=\"{ arrivedState }\">\n            <slot name=\"sliding-panels-addons\" :arrived-state=\"arrivedState\" />\n          </template>\n          <template #sliding-panel-left-button>\n            <slot name=\"sliding-panels-left-button\" />\n          </template>\n          <template #sliding-panel-right-button>\n            <slot name=\"sliding-panels-right-button\" />\n          </template>\n          <div class=\"x-flex x-gap-8\">\n            <ul class=\"x-ai-carousel-suggestion-results\">\n              <DisplayClickProvider\n                v-for=\"suggestion in suggestionsSearch\"\n                :key=\"suggestion.query\"\n                :tooling-display-tagging=\"\n                  tagging?.searchQueries[suggestion.query].toolingDisplayClick\n                \"\n                :tooling-add2-cart-tagging=\"\n                  tagging?.searchQueries[suggestion.query].toolingDisplayAdd2Cart\n                \"\n                result-feature=\"ai_carousel\"\n              >\n                <li\n                  v-for=\"result in suggestion.results\"\n                  :key=\"result.id\"\n                  data-test=\"ai-carousel-suggestion-result\"\n                >\n                  <!-- @slot (required) result card -->\n                  <slot name=\"result\" :result=\"result\" />\n                </li>\n              </DisplayClickProvider>\n            </ul>\n          </div>\n        </SlidingPanel>\n      </slot>\n      <slot name=\"extra-content\" />\n      <slot name=\"cta-button\" />\n    </div>\n  </CollapseHeight>\n</template>\n\n<script lang=\"ts\">\nimport type { TaggingRequest } from '@empathyco/x-types'\nimport { useResizeObserver } from '@vueuse/core'\nimport { computed, defineComponent, ref, watch } from 'vue'\nimport {\n  AIStarIcon,\n  ChangeHeight,\n  ChevronDownIcon,\n  CollapseHeight,\n  DisplayClickProvider,\n  SlidingPanel,\n} from '../../../components'\nimport DisplayEmitter from '../../../components/display-emitter.vue'\nimport { use$x, useState } from '../../../composables'\nimport { aiXModule } from '../x-module'\n\nexport default defineComponent({\n  xModule: aiXModule.name,\n  components: {\n    ChangeHeight,\n    DisplayClickProvider,\n    DisplayEmitter,\n    CollapseHeight,\n    AIStarIcon,\n    ChevronDownIcon,\n    SlidingPanel,\n  },\n  props: {\n    /* The title text displayed */\n    title: {\n      type: String,\n    },\n    /* The classes added to the sliding panel. */\n    slidingPanelClasses: {\n      type: String,\n    },\n    /* The classes added to the sliding panel container. */\n    slidingPanelContainerClasses: {\n      type: String,\n    },\n    /* The classes added to the sliding panel buttons. */\n    slidingPanelButtonsClasses: {\n      type: String,\n    },\n  },\n  setup(props) {\n    const $x = use$x()\n    const { query, isNoResults, suggestionsSearch, queries, tagging } = useState('ai')\n    const emptyTaggingRequest: TaggingRequest = { url: '', params: {} }\n\n    const titleRef = ref<HTMLElement | null>(null)\n    const titleExpanded = ref(false)\n    const isTitleOverflowing = ref(false)\n\n    /**\n     * Checks if the title is overflowing and updates the state.\n     */\n    function updateTitleOverflow() {\n      if (titleExpanded.value) {\n        return\n      }\n      if (titleRef.value) {\n        isTitleOverflowing.value = titleRef.value.scrollWidth > titleRef.value.clientWidth\n      }\n    }\n\n    /**\n     * Toggles the title expanded state if it is overflowing.\n     */\n    function toggleTitleExpansion() {\n      if (isTitleOverflowing.value) {\n        titleExpanded.value = !titleExpanded.value\n      }\n    }\n\n    const title = computed(() => {\n      if (!props.title) {\n        const queriesList = new Intl.ListFormat('en', {\n          style: 'long',\n          type: 'conjunction',\n        }).format(queries.value.map(({ query }) => query))\n        return `Searching for ${queriesList}`\n      }\n      return props.title\n    })\n\n    watch(queries, () => {\n      if (queries.value.length > 0) {\n        $x.emit('AiSuggestionsSearchRequestUpdated')\n      }\n    })\n\n    useResizeObserver(titleRef, updateTitleOverflow)\n\n    return {\n      emptyTaggingRequest,\n      isNoResults,\n      isTitleOverflowing,\n      queries,\n      query,\n      suggestionsSearch,\n      tagging,\n      title,\n      titleExpanded,\n      titleRef,\n      toggleTitleExpansion,\n    }\n  },\n})\n</script>\n<style lang=\"css\">\n.x-ai-carousel {\n  --color: var(--x-ai-carousel-color, #bbc9cf);\n  --color-lighter: var(--x-ai-carousel-color-lighter, color-mix(in srgb, var(--color) 25%, white));\n\n  padding: 8px 0;\n  position: relative;\n  border-radius: 1.5rem;\n  background-color: var(--color-lighter);\n}\n\n.x-ai-carousel-title {\n  display: flex;\n  font-size: 12px;\n  gap: 8px;\n  align-items: flex-start;\n  margin: 0 14px 8px;\n  cursor: pointer;\n}\n.x-ai-carousel-title-text {\n  display: block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.x-ai-carousel-title-text--expanded {\n  white-space: normal;\n}\n.x-ai-carousel-title-icon {\n  height: 1rem;\n  aspect-ratio: 1 / 1;\n  color: var(--color);\n  flex-shrink: 0;\n  margin-bottom: auto;\n}\n.x-ai-carousel-title-button {\n  background: none;\n  border: none;\n  padding: 0;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--color);\n  margin-bottom: auto;\n}\n.x-ai-carousel-title-button-icon {\n  height: 1rem;\n  aspect-ratio: 1 / 1;\n  transition: transform 0.3s ease;\n}\n.x-ai-carousel-title-button-icon--expanded {\n  transform: rotate(180deg);\n}\n.x-ai-carousel-suggestion-results {\n  display: flex;\n  gap: 1rem;\n  padding-left: 1rem;\n  padding-right: 1rem;\n}\n</style>\n"],"names":["_createBlock","_withCtx","_openBlock","_createElementBlock","_createVNode","_createElementVNode","_normalizeClass","_renderSlot","_Fragment","_renderList","_createCommentVNode"],"mappings":"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"}
+{"version":3,"file":"ai-carousel.vue.js","sources":["../../../../../src/x-modules/ai/components/ai-carousel.vue"],"sourcesContent":["<template>\n  <CollapseHeight>\n    <div v-if=\"suggestionsSearch.length\" class=\"x-ai-carousel\">\n      <DisplayEmitter\n        :payload=\"tagging?.toolingDisplay ?? emptyTaggingRequest\"\n        :event-metadata=\"{\n          feature: 'ai_carousel',\n          displayOriginalQuery: query || 'ai-carousel-without-query',\n          replaceable: false,\n        }\"\n        data-test=\"ai-carousel-display-emitter\"\n      >\n        <span\n          class=\"x-ai-carousel-title\"\n          :class=\"{ 'x-ai-carousel-title--expanded': titleExpanded }\"\n          data-test=\"ai-carousel-title\"\n          @click=\"toggleTitleExpansion\"\n        >\n          <AIStarIcon class=\"x-ai-carousel-title-icon\" />\n          <ChangeHeight>\n            <span\n              ref=\"titleRef\"\n              class=\"x-ai-carousel-title-text\"\n              :class=\"{ 'x-ai-carousel-title-text--expanded': titleExpanded }\"\n            >\n              {{ title }}\n            </span>\n          </ChangeHeight>\n          <button\n            v-if=\"isTitleOverflowing\"\n            class=\"x-ai-carousel-title-button\"\n            data-test=\"ai-carousel-title-button\"\n            :aria-label=\"titleExpanded ? 'Collapse' : 'Expand'\"\n          >\n            <ChevronDownIcon\n              class=\"x-ai-carousel-title-button-icon\"\n              :class=\"{ 'x-ai-carousel-title-button-icon--expanded': titleExpanded }\"\n            />\n          </button>\n        </span>\n      </DisplayEmitter>\n      <slot name=\"sliding-panel\" :suggestions=\"suggestionsSearch\" :tagging=\"tagging\">\n        <SlidingPanel\n          :class=\"slidingPanelClasses\"\n          :scroll-container-class=\"slidingPanelContainerClasses\"\n          :button-class=\"slidingPanelButtonsClasses\"\n          :reset-on-content-change=\"false\"\n        >\n          <template #sliding-panel-addons=\"{ arrivedState }\">\n            <slot name=\"sliding-panels-addons\" :arrived-state=\"arrivedState\" />\n          </template>\n          <template #sliding-panel-left-button>\n            <slot name=\"sliding-panels-left-button\" />\n          </template>\n          <template #sliding-panel-right-button>\n            <slot name=\"sliding-panels-right-button\" />\n          </template>\n          <div class=\"x-flex x-gap-8\">\n            <ul class=\"x-ai-carousel-suggestion-results\">\n              <DisplayClickProvider\n                v-for=\"suggestion in suggestionsSearch\"\n                :key=\"suggestion.query\"\n                :tooling-display-tagging=\"\n                  tagging?.searchQueries[suggestion.query].toolingDisplayClick\n                \"\n                :tooling-add2-cart-tagging=\"\n                  tagging?.searchQueries[suggestion.query].toolingDisplayAdd2Cart\n                \"\n                result-feature=\"ai_carousel\"\n              >\n                <li\n                  v-for=\"result in suggestion.results\"\n                  :key=\"result.id\"\n                  data-test=\"ai-carousel-suggestion-result\"\n                >\n                  <!-- @slot (required) result card -->\n                  <slot name=\"result\" :result=\"result\" />\n                </li>\n              </DisplayClickProvider>\n            </ul>\n          </div>\n        </SlidingPanel>\n      </slot>\n      <slot name=\"extra-content\" />\n      <slot name=\"cta-button\" />\n    </div>\n  </CollapseHeight>\n</template>\n\n<script lang=\"ts\">\nimport type { TaggingRequest } from '@empathyco/x-types'\nimport { useResizeObserver } from '@vueuse/core'\nimport { computed, defineComponent, onMounted, ref, watch } from 'vue'\nimport {\n  AIStarIcon,\n  ChangeHeight,\n  ChevronDownIcon,\n  CollapseHeight,\n  DisplayClickProvider,\n  SlidingPanel,\n} from '../../../components'\nimport DisplayEmitter from '../../../components/display-emitter.vue'\nimport { use$x, useState } from '../../../composables'\nimport { aiXModule } from '../x-module'\n\nexport default defineComponent({\n  xModule: aiXModule.name,\n  components: {\n    ChangeHeight,\n    DisplayClickProvider,\n    DisplayEmitter,\n    CollapseHeight,\n    AIStarIcon,\n    ChevronDownIcon,\n    SlidingPanel,\n  },\n  props: {\n    /* The title text displayed */\n    title: {\n      type: String,\n    },\n    /* The classes added to the sliding panel. */\n    slidingPanelClasses: {\n      type: String,\n    },\n    /* The classes added to the sliding panel container. */\n    slidingPanelContainerClasses: {\n      type: String,\n    },\n    /* The classes added to the sliding panel buttons. */\n    slidingPanelButtonsClasses: {\n      type: String,\n    },\n  },\n  setup(props) {\n    const $x = use$x()\n    const { query, isNoResults, suggestionsSearch, queries, tagging } = useState('ai')\n    const emptyTaggingRequest: TaggingRequest = { url: '', params: {} }\n\n    const titleRef = ref<HTMLElement | null>(null)\n    const titleExpanded = ref(false)\n    const isTitleOverflowing = ref(false)\n\n    /**\n     * Checks if the title is overflowing and updates the state.\n     */\n    function updateTitleOverflow() {\n      if (titleExpanded.value) {\n        return\n      }\n      if (titleRef.value) {\n        isTitleOverflowing.value = titleRef.value.scrollWidth > titleRef.value.clientWidth\n      }\n    }\n\n    /**\n     * Toggles the title expanded state if it is overflowing.\n     */\n    function toggleTitleExpansion() {\n      if (isTitleOverflowing.value) {\n        titleExpanded.value = !titleExpanded.value\n      }\n    }\n\n    const title = computed(() => {\n      if (!props.title) {\n        const queriesList = new Intl.ListFormat('en', {\n          style: 'long',\n          type: 'conjunction',\n        }).format(queries.value.map(({ query }) => query))\n        return `Searching for ${queriesList}`\n      }\n      return props.title\n    })\n\n    watch(queries, () => {\n      if (queries.value.length > 0) {\n        $x.emit('AiSuggestionsSearchRequestUpdated')\n      }\n    })\n\n    onMounted(() => {\n      $x.emit('AiComponentMounted', undefined, { feature: 'ai_carousel' })\n    })\n\n    useResizeObserver(titleRef, updateTitleOverflow)\n\n    return {\n      emptyTaggingRequest,\n      isNoResults,\n      isTitleOverflowing,\n      queries,\n      query,\n      suggestionsSearch,\n      tagging,\n      title,\n      titleExpanded,\n      titleRef,\n      toggleTitleExpansion,\n    }\n  },\n})\n</script>\n<style lang=\"css\">\n.x-ai-carousel {\n  --color: var(--x-ai-carousel-color, #bbc9cf);\n  --color-lighter: var(--x-ai-carousel-color-lighter, color-mix(in srgb, var(--color) 25%, white));\n\n  padding: 8px 0;\n  position: relative;\n  border-radius: 1.5rem;\n  background-color: var(--color-lighter);\n}\n\n.x-ai-carousel-title {\n  display: flex;\n  font-size: 12px;\n  gap: 8px;\n  align-items: flex-start;\n  margin: 0 14px 8px;\n  cursor: pointer;\n}\n.x-ai-carousel-title-text {\n  display: block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.x-ai-carousel-title-text--expanded {\n  white-space: normal;\n}\n.x-ai-carousel-title-icon {\n  height: 1rem;\n  aspect-ratio: 1 / 1;\n  color: var(--color);\n  flex-shrink: 0;\n  margin-bottom: auto;\n}\n.x-ai-carousel-title-button {\n  background: none;\n  border: none;\n  padding: 0;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--color);\n  margin-bottom: auto;\n}\n.x-ai-carousel-title-button-icon {\n  height: 1rem;\n  aspect-ratio: 1 / 1;\n  transition: transform 0.3s ease;\n}\n.x-ai-carousel-title-button-icon--expanded {\n  transform: rotate(180deg);\n}\n.x-ai-carousel-suggestion-results {\n  display: flex;\n  gap: 1rem;\n  padding-left: 1rem;\n  padding-right: 1rem;\n}\n</style>\n"],"names":["_createBlock","_withCtx","_openBlock","_createElementBlock","_createVNode","_createElementVNode","_normalizeClass","_renderSlot","_Fragment","_renderList","_createCommentVNode"],"mappings":"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"}

package/js/x-modules/ai/components/ai-carousel.vue2.js

@@ -1,5 +1,5 @@
 import { useResizeObserver } from '@vueuse/core';
-import { defineComponent, ref, computed, watch } from 'vue';
+import { defineComponent, ref, computed, watch, onMounted } from 'vue';
 import '../../../components/animations/animate-clip-path/animate-clip-path.style.css.js';
 import '../../../components/animations/animate-scale/animate-scale.style.css.js';
 import '../../../components/animations/animate-translate/animate-translate.style.css.js';
@@ -178,6 +178,9 @@ var _sfc_main = defineComponent({
                 $x.emit('AiSuggestionsSearchRequestUpdated');
             }
         });
+        onMounted(() => {
+            $x.emit('AiComponentMounted', undefined, { feature: 'ai_carousel' });
+        });
         useResizeObserver(titleRef, updateTitleOverflow);
         return {
             emptyTaggingRequest,