@empathyco/x-components 6.0.0-alpha.213 → 6.0.0-alpha.215

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,19 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## 6.0.0-alpha.215 (2026-03-04)
7
+
8
+ - feat: add AI carousel component with related integration and tests ([8fe744e](https://github.com/empathyco/x/commit/8fe744e))
9
+ - feat: implement title expansion toggle in AI carousel component ([a7ce3e2](https://github.com/empathyco/x/commit/a7ce3e2))
10
+ - test: remove slot customization test from AI carousel component ([b077cc5](https://github.com/empathyco/x/commit/b077cc5))
11
+ - fix: update feature naming from 'ai-carousel' to 'ai_carousel' in component and tests ([2fb1607](https://github.com/empathyco/x/commit/2fb1607))
12
+ - fix: update feature naming from 'ai-carousel' to 'ai_carousel' in component and tests ([d95f9c4](https://github.com/empathyco/x/commit/d95f9c4))
13
+ - chore: remove Vue alias configuration from Vite setup ([168a0e3](https://github.com/empathyco/x/commit/168a0e3))
14
+
15
+ ## 6.0.0-alpha.214 (2026-03-04)
16
+
17
+ **Note:** Version bump only for package @empathyco/x-components
18
+
6
19
  ## 6.0.0-alpha.213 (2026-03-03)
7
20
 
8
21
  **Note:** Version bump only for package @empathyco/x-components
package/ai/index.js CHANGED
@@ -1,3 +1,4 @@
1
+ export { default as AiCarousel } from '../js/x-modules/ai/components/ai-carousel.vue.js';
1
2
  export { default as AiOverview } from '../js/x-modules/ai/components/ai-overview.vue.js';
2
3
  export { fetchAndSaveAiSuggestionsSearch } from '../js/x-modules/ai/store/actions/fetch-and-save-ai-suggestions-search.action.js';
3
4
  export { fetchAndSaveAiSuggestions } from '../js/x-modules/ai/store/actions/fetch-and-save-ai-suggestions.action.js';
package/core/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -0,0 +1,57 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [AiCarousel](./x-components.aicarousel.md)
4
+
5
+ ## AiCarousel variable
6
+
7
+ **Signature:**
8
+
9
+ ```typescript
10
+ _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
11
+ title: {
12
+ type: StringConstructor;
13
+ };
14
+ slidingPanelClasses: {
15
+ type: StringConstructor;
16
+ };
17
+ slidingPanelContainerClasses: {
18
+ type: StringConstructor;
19
+ };
20
+ slidingPanelButtonsClasses: {
21
+ type: StringConstructor;
22
+ };
23
+ }>, {
24
+ emptyTaggingRequest: TaggingRequest;
25
+ isNoResults: import("vue").ComputedRef<boolean>;
26
+ isTitleOverflowing: import("vue").Ref<boolean, boolean>;
27
+ queries: import("vue").ComputedRef<import("@empathyco/x-types").AiSuggestionQuery[]>;
28
+ query: import("vue").ComputedRef<string>;
29
+ suggestionsSearch: import("vue").ComputedRef<import("@empathyco/x-types").AiSuggestionSearch[]>;
30
+ tagging: import("vue").ComputedRef<import("@empathyco/x-types").AiSuggestionTagging | undefined>;
31
+ title: import("vue").ComputedRef<string>;
32
+ titleExpanded: import("vue").Ref<boolean, boolean>;
33
+ titleRef: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
34
+ toggleTitleExpansion: () => void;
35
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
36
+ title: {
37
+ type: StringConstructor;
38
+ };
39
+ slidingPanelClasses: {
40
+ type: StringConstructor;
41
+ };
42
+ slidingPanelContainerClasses: {
43
+ type: StringConstructor;
44
+ };
45
+ slidingPanelButtonsClasses: {
46
+ type: StringConstructor;
47
+ };
48
+ }>> & Readonly<{}>, {}, {}, {
49
+ ChangeHeight: import("vue").DefineComponent<{}, {}, any>;
50
+ DisplayClickProvider: import("vue").DefineComponent<{}, {}, any>;
51
+ DisplayEmitter: import("vue").DefineComponent<{}, {}, any>;
52
+ CollapseHeight: import("vue").DefineComponent<{}, {}, any>;
53
+ AIStarIcon: import("vue").DefineComponent<{}, {}, any>;
54
+ ChevronDownIcon: import("vue").DefineComponent<{}, {}, any>;
55
+ SlidingPanel: import("vue").DefineComponent<{}, {}, any>;
56
+ }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>
57
+ ```
@@ -3564,6 +3564,15 @@ Saves a new query into the history queries.
3564
3564
  Saves the selectedQueryPreview query into the history queries.
3565
3565
 
3566
3566
 
3567
+ </td></tr>
3568
+ <tr><td>
3569
+
3570
+ [AiCarousel](./x-components.aicarousel.md)
3571
+
3572
+
3573
+ </td><td>
3574
+
3575
+
3567
3576
  </td></tr>
3568
3577
  <tr><td>
3569
3578
 
@@ -9,5 +9,5 @@ The name of the tool that generated the results.
9
9
  **Signature:**
10
10
 
11
11
  ```typescript
12
- export type ResultFeature = 'search' | 'topclicked_recommendations' | 'brand_recommendations' | 'next_query_recommendations' | 'semantic_recommendations' | 'partial_results' | 'identifier_result' | 'related_prompts' | 'overview';
12
+ export type ResultFeature = 'search' | 'topclicked_recommendations' | 'brand_recommendations' | 'next_query_recommendations' | 'semantic_recommendations' | 'partial_results' | 'identifier_result' | 'related_prompts' | 'overview' | 'ai_carousel';
13
13
  ```
@@ -0,0 +1,28 @@
1
+ ---
2
+
3
+ title: AiCarousel
4
+
5
+ ---
6
+
7
+ # AiCarousel
8
+
9
+ ## Props
10
+
11
+ | Name | Description | Type | Default |
12
+ | ----------------------------------------- | ----------- | ------------------- | ------------- |
13
+ | <code>title</code> | | <code>string</code> | <code></code> |
14
+ | <code>slidingPanelClasses</code> | | <code>string</code> | <code></code> |
15
+ | <code>slidingPanelContainerClasses</code> | | <code>string</code> | <code></code> |
16
+ | <code>slidingPanelButtonsClasses</code> | | <code>string</code> | <code></code> |
17
+
18
+ ## Slots
19
+
20
+ | Name | Description | Bindings<br />(name - type - description) |
21
+ | ---------------------------------------- | ---------------------- | ----------------------------------------- |
22
+ | <code>sliding-panel</code> | | |
23
+ | <code>sliding-panels-addons</code> | | |
24
+ | <code>sliding-panels-left-button</code> | | None |
25
+ | <code>sliding-panels-right-button</code> | | None |
26
+ | <code>result</code> | (required) result card | |
27
+ | <code>extra-content</code> | | None |
28
+ | <code>cta-button</code> | | None |
package/js/index.js CHANGED
@@ -199,6 +199,7 @@ export { XPriorityBus } from './x-bus/x-bus.js';
199
199
  export { BaseXPriorityQueue, BaseXPriorityQueueNode } from './x-bus/x-priority-queue/x-priority-queue.js';
200
200
  export { BaseXAPI } from './x-installer/api/base-api.js';
201
201
  export { XInstaller } from './x-installer/x-installer/x-installer.js';
202
+ export { default as AiCarousel } from './x-modules/ai/components/ai-carousel.vue.js';
202
203
  export { default as AiOverview } from './x-modules/ai/components/ai-overview.vue.js';
203
204
  export { fetchAndSaveAiSuggestionsSearch } from './x-modules/ai/store/actions/fetch-and-save-ai-suggestions-search.action.js';
204
205
  export { fetchAndSaveAiSuggestions } from './x-modules/ai/store/actions/fetch-and-save-ai-suggestions.action.js';
package/js/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -0,0 +1,147 @@
1
+ import _sfc_main from './ai-carousel.vue2.js';
2
+ import { resolveComponent, openBlock, createBlock, withCtx, createElementBlock, createVNode, createElementVNode, normalizeClass, toDisplayString, createCommentVNode, renderSlot, Fragment, renderList } from 'vue';
3
+ import './ai-carousel.vue3.js';
4
+ import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.js';
5
+
6
+ const _hoisted_1 = {
7
+ key: 0,
8
+ class: "x-ai-carousel"
9
+ };
10
+ const _hoisted_2 = ["aria-label"];
11
+ const _hoisted_3 = { class: "x-flex x-gap-8" };
12
+ const _hoisted_4 = { class: "x-ai-carousel-suggestion-results" };
13
+ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
14
+ const _component_AIStarIcon = resolveComponent("AIStarIcon");
15
+ const _component_ChangeHeight = resolveComponent("ChangeHeight");
16
+ const _component_ChevronDownIcon = resolveComponent("ChevronDownIcon");
17
+ const _component_DisplayEmitter = resolveComponent("DisplayEmitter");
18
+ const _component_DisplayClickProvider = resolveComponent("DisplayClickProvider");
19
+ const _component_SlidingPanel = resolveComponent("SlidingPanel");
20
+ const _component_CollapseHeight = resolveComponent("CollapseHeight");
21
+ return openBlock(), createBlock(_component_CollapseHeight, null, {
22
+ default: withCtx(() => [
23
+ _ctx.suggestionsSearch.length ? (openBlock(), createElementBlock("div", _hoisted_1, [
24
+ createVNode(_component_DisplayEmitter, {
25
+ payload: _ctx.tagging?.toolingDisplay ?? _ctx.emptyTaggingRequest,
26
+ "event-metadata": {
27
+ feature: "ai_carousel",
28
+ displayOriginalQuery: _ctx.query || "ai-carousel-without-query",
29
+ replaceable: false
30
+ },
31
+ "data-test": "ai-carousel-display-emitter"
32
+ }, {
33
+ default: withCtx(() => [
34
+ createElementVNode(
35
+ "span",
36
+ {
37
+ class: normalizeClass(["x-ai-carousel-title", { "x-ai-carousel-title--expanded": _ctx.titleExpanded }]),
38
+ "data-test": "ai-carousel-title",
39
+ onClick: _cache[0] || (_cache[0] = (...args) => _ctx.toggleTitleExpansion && _ctx.toggleTitleExpansion(...args))
40
+ },
41
+ [
42
+ createVNode(_component_AIStarIcon, { class: "x-ai-carousel-title-icon" }),
43
+ createVNode(_component_ChangeHeight, null, {
44
+ default: withCtx(() => [
45
+ createElementVNode(
46
+ "span",
47
+ {
48
+ ref: "titleRef",
49
+ class: normalizeClass(["x-ai-carousel-title-text", { "x-ai-carousel-title-text--expanded": _ctx.titleExpanded }])
50
+ },
51
+ toDisplayString(_ctx.title),
52
+ 3
53
+ /* TEXT, CLASS */
54
+ )
55
+ ]),
56
+ _: 1
57
+ /* STABLE */
58
+ }),
59
+ _ctx.isTitleOverflowing ? (openBlock(), createElementBlock("button", {
60
+ key: 0,
61
+ class: "x-ai-carousel-title-button",
62
+ "data-test": "ai-carousel-title-button",
63
+ "aria-label": _ctx.titleExpanded ? "Collapse" : "Expand"
64
+ }, [
65
+ createVNode(_component_ChevronDownIcon, {
66
+ class: normalizeClass(["x-ai-carousel-title-button-icon", { "x-ai-carousel-title-button-icon--expanded": _ctx.titleExpanded }])
67
+ }, null, 8, ["class"])
68
+ ], 8, _hoisted_2)) : createCommentVNode("v-if", true)
69
+ ],
70
+ 2
71
+ /* CLASS */
72
+ )
73
+ ]),
74
+ _: 1
75
+ /* STABLE */
76
+ }, 8, ["payload", "event-metadata"]),
77
+ renderSlot(_ctx.$slots, "sliding-panel", { results: _ctx.suggestionsSearch }, () => [
78
+ createVNode(_component_SlidingPanel, {
79
+ class: normalizeClass(_ctx.slidingPanelClasses),
80
+ "scroll-container-class": _ctx.slidingPanelContainerClasses,
81
+ "button-class": _ctx.slidingPanelButtonsClasses,
82
+ "reset-on-content-change": false
83
+ }, {
84
+ "sliding-panel-addons": withCtx(({ arrivedState }) => [
85
+ renderSlot(_ctx.$slots, "sliding-panels-addons", { arrivedState })
86
+ ]),
87
+ "sliding-panel-left-button": withCtx(() => [
88
+ renderSlot(_ctx.$slots, "sliding-panels-left-button")
89
+ ]),
90
+ "sliding-panel-right-button": withCtx(() => [
91
+ renderSlot(_ctx.$slots, "sliding-panels-right-button")
92
+ ]),
93
+ default: withCtx(() => [
94
+ createElementVNode("div", _hoisted_3, [
95
+ createElementVNode("ul", _hoisted_4, [
96
+ (openBlock(true), createElementBlock(
97
+ Fragment,
98
+ null,
99
+ renderList(_ctx.suggestionsSearch, (suggestion) => {
100
+ return openBlock(), createBlock(_component_DisplayClickProvider, {
101
+ key: suggestion.query,
102
+ "tooling-display-tagging": _ctx.tagging?.searchQueries[suggestion.query].toolingDisplayClick,
103
+ "tooling-add2-cart-tagging": _ctx.tagging?.searchQueries[suggestion.query].toolingDisplayAdd2Cart,
104
+ "result-feature": "ai_carousel"
105
+ }, {
106
+ default: withCtx(() => [
107
+ (openBlock(true), createElementBlock(
108
+ Fragment,
109
+ null,
110
+ renderList(suggestion.results, (result) => {
111
+ return openBlock(), createElementBlock("li", {
112
+ key: result.id,
113
+ "data-test": "ai-carousel-suggestion-result"
114
+ }, [
115
+ renderSlot(_ctx.$slots, "result", { result })
116
+ ]);
117
+ }),
118
+ 128
119
+ /* KEYED_FRAGMENT */
120
+ ))
121
+ ]),
122
+ _: 2
123
+ /* DYNAMIC */
124
+ }, 1032, ["tooling-display-tagging", "tooling-add2-cart-tagging"]);
125
+ }),
126
+ 128
127
+ /* KEYED_FRAGMENT */
128
+ ))
129
+ ])
130
+ ])
131
+ ]),
132
+ _: 3
133
+ /* FORWARDED */
134
+ }, 8, ["class", "scroll-container-class", "button-class"])
135
+ ]),
136
+ renderSlot(_ctx.$slots, "extra-content"),
137
+ renderSlot(_ctx.$slots, "cta-button")
138
+ ])) : createCommentVNode("v-if", true)
139
+ ]),
140
+ _: 3
141
+ /* FORWARDED */
142
+ });
143
+ }
144
+ var aiCarousel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
145
+
146
+ export { aiCarousel as default };
147
+ //# sourceMappingURL=ai-carousel.vue.js.map
@@ -0,0 +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\" :results=\"suggestionsSearch\">\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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"}
@@ -0,0 +1,199 @@
1
+ import { useResizeObserver } from '@vueuse/core';
2
+ import { defineComponent, ref, computed, watch } from 'vue';
3
+ import '../../../components/animations/animate-clip-path/animate-clip-path.style.css.js';
4
+ import '../../../components/animations/animate-scale/animate-scale.style.css.js';
5
+ import '../../../components/animations/animate-translate/animate-translate.style.css.js';
6
+ import '../../../components/animations/animate-width.vue2.js';
7
+ import '../../../components/animations/animate-width.vue3.js';
8
+ import ChangeHeight from '../../../components/animations/change-height.vue.js';
9
+ import CollapseHeight from '../../../components/animations/collapse-height.vue.js';
10
+ import '../../../components/animations/collapse-width.vue2.js';
11
+ import '../../../components/animations/collapse-width.vue3.js';
12
+ import '../../../components/animations/cross-fade.vue2.js';
13
+ import '../../../components/animations/cross-fade.vue3.js';
14
+ import '../../../components/animations/fade-and-slide.vue2.js';
15
+ import '../../../components/animations/fade-and-slide.vue3.js';
16
+ import '../../../components/animations/fade.vue2.js';
17
+ import '../../../components/animations/fade.vue3.js';
18
+ import '../../../components/animations/no-animation.vue.js';
19
+ import '../../../components/animations/staggered-fade-and-slide.vue2.js';
20
+ import '../../../components/animations/staggered-fade-and-slide.vue3.js';
21
+ import '../../../components/auto-progress-bar.vue2.js';
22
+ import '../../../components/auto-progress-bar.vue3.js';
23
+ import '../../../components/base-dropdown.vue2.js';
24
+ import '../../../components/base-dropdown.vue3.js';
25
+ import '../../../components/base-event-button.vue2.js';
26
+ import '../../../components/base-grid.vue2.js';
27
+ import '../../../components/base-grid.vue3.js';
28
+ import '../../../components/base-keyboard-navigation.vue2.js';
29
+ import '../../../components/base-rating.vue2.js';
30
+ import '../../../components/base-rating.vue3.js';
31
+ import '../../../components/base-slider.vue2.js';
32
+ import '../../../components/base-slider.vue3.js';
33
+ import '../../../components/base-switch.vue2.js';
34
+ import '../../../components/base-switch.vue3.js';
35
+ import '../../../components/base-teleport.vue2.js';
36
+ import '../../../components/base-variable-column-grid.vue2.js';
37
+ import '../../../components/column-picker/base-column-picker-dropdown.vue2.js';
38
+ import '../../../components/column-picker/base-column-picker-list.vue2.js';
39
+ import '../../../components/currency/base-currency.vue2.js';
40
+ import _sfc_main$2 from '../../../components/display-click-provider.vue.js';
41
+ import _sfc_main$1 from '../../../components/display-emitter.vue.js';
42
+ import '../../../components/filters/labels/base-price-filter-label.vue.js';
43
+ import '../../../components/filters/labels/base-rating-filter-label.vue2.js';
44
+ import '../../../components/global-x-bus.vue.js';
45
+ import '../../../components/highlight.vue2.js';
46
+ import AIStarIcon from '../../../components/icons/ai-star.vue.js';
47
+ import ChevronDownIcon from '../../../components/icons/chevron-down.vue.js';
48
+ import '../../../components/items-list.vue2.js';
49
+ import '../../../components/layouts/fixed-header-and-asides-layout.vue2.js';
50
+ import '../../../components/layouts/fixed-header-and-asides-layout.vue3.js';
51
+ import '../../../components/layouts/multi-column-max-width-layout.vue2.js';
52
+ import '../../../components/layouts/multi-column-max-width-layout.vue3.js';
53
+ import '../../../components/layouts/multi-column-max-width-layout.vue4.js';
54
+ import '../../../components/layouts/single-column-layout.vue2.js';
55
+ import '../../../components/layouts/single-column-layout.vue3.js';
56
+ import '../../../components/location-provider.vue.js';
57
+ import '../../../components/modals/base-events-modal-close.vue2.js';
58
+ import '../../../components/modals/base-events-modal-open.vue2.js';
59
+ import '../../../components/modals/base-events-modal.vue2.js';
60
+ import '../../../components/modals/base-id-modal-close.vue2.js';
61
+ import '../../../components/modals/base-id-modal-open.vue2.js';
62
+ import '../../../components/modals/base-id-modal.vue2.js';
63
+ import '../../../components/modals/base-modal.vue2.js';
64
+ import '../../../components/modals/base-modal.vue3.js';
65
+ import '../../../components/modals/close-main-modal.vue2.js';
66
+ import '../../../components/modals/main-modal.vue2.js';
67
+ import '../../../components/modals/open-main-modal.vue2.js';
68
+ import '../../../components/page-loader-button.vue2.js';
69
+ import '../../../components/page-loader-button.vue3.js';
70
+ import '../../../components/page-selector.vue2.js';
71
+ import '../../../components/page-selector.vue3.js';
72
+ import '../../../components/panels/base-header-toggle-panel.vue2.js';
73
+ import '../../../components/panels/base-header-toggle-panel.vue3.js';
74
+ import '../../../components/panels/base-id-toggle-panel-button.vue2.js';
75
+ import '../../../components/panels/base-id-toggle-panel.vue2.js';
76
+ import '../../../components/panels/base-tabs-panel.vue2.js';
77
+ import '../../../components/panels/base-tabs-panel.vue3.js';
78
+ import '../../../components/panels/base-toggle-panel.vue2.js';
79
+ import '../../../components/result/base-result-add-to-cart.vue2.js';
80
+ import '../../../components/result/base-result-current-price.vue2.js';
81
+ import '../../../components/result/base-result-image.vue2.js';
82
+ import '../../../components/result/base-result-image.vue3.js';
83
+ import '../../../components/result/base-result-link.vue2.js';
84
+ import '../../../components/result/base-result-link.vue3.js';
85
+ import '../../../components/result/base-result-previous-price.vue2.js';
86
+ import '../../../components/result/base-result-rating.vue2.js';
87
+ import '../../../components/result/base-result-rating.vue3.js';
88
+ import '../../../components/result/result-variant-selector.vue2.js';
89
+ import '../../../components/result/result-variant-selector.vue3.js';
90
+ import '../../../components/result/result-variants-provider.vue.js';
91
+ import '../../../components/scroll/base-scroll.vue2.js';
92
+ import '@empathyco/x-utils';
93
+ import { use$x } from '../../../composables/use-_x.js';
94
+ import SlidingPanel from '../../../components/sliding-panel.vue.js';
95
+ import '../../../components/snippet-callbacks.vue2.js';
96
+ import '../../../components/suggestions/base-suggestion.vue2.js';
97
+ import '../../../components/suggestions/base-suggestions.vue2.js';
98
+ import '../../../components/suggestions/base-suggestions.vue3.js';
99
+ import '../../../composables/create-use-device.js';
100
+ import 'vuex';
101
+ import '@vue/devtools-api';
102
+ import '../../../plugins/devtools/timeline.devtools.js';
103
+ import 'rxjs/operators';
104
+ import 'rxjs';
105
+ import '../../../plugins/devtools/colors.utils.js';
106
+ import '../../../plugins/x-bus.js';
107
+ import '../../../plugins/x-plugin.js';
108
+ import { useState } from '../../../composables/use-state.js';
109
+ import { aiXModule } from '../x-module.js';
110
+
111
+ var _sfc_main = defineComponent({
112
+ xModule: aiXModule.name,
113
+ components: {
114
+ ChangeHeight,
115
+ DisplayClickProvider: _sfc_main$2,
116
+ DisplayEmitter: _sfc_main$1,
117
+ CollapseHeight,
118
+ AIStarIcon,
119
+ ChevronDownIcon,
120
+ SlidingPanel,
121
+ },
122
+ props: {
123
+ /* The title text displayed */
124
+ title: {
125
+ type: String,
126
+ },
127
+ /* The classes added to the sliding panel. */
128
+ slidingPanelClasses: {
129
+ type: String,
130
+ },
131
+ /* The classes added to the sliding panel container. */
132
+ slidingPanelContainerClasses: {
133
+ type: String,
134
+ },
135
+ /* The classes added to the sliding panel buttons. */
136
+ slidingPanelButtonsClasses: {
137
+ type: String,
138
+ },
139
+ },
140
+ setup(props) {
141
+ const $x = use$x();
142
+ const { query, isNoResults, suggestionsSearch, queries, tagging } = useState('ai');
143
+ const emptyTaggingRequest = { url: '', params: {} };
144
+ const titleRef = ref(null);
145
+ const titleExpanded = ref(false);
146
+ const isTitleOverflowing = ref(false);
147
+ /**
148
+ * Checks if the title is overflowing and updates the state.
149
+ */
150
+ function updateTitleOverflow() {
151
+ if (titleExpanded.value) {
152
+ return;
153
+ }
154
+ if (titleRef.value) {
155
+ isTitleOverflowing.value = titleRef.value.scrollWidth > titleRef.value.clientWidth;
156
+ }
157
+ }
158
+ /**
159
+ * Toggles the title expanded state if it is overflowing.
160
+ */
161
+ function toggleTitleExpansion() {
162
+ if (isTitleOverflowing.value) {
163
+ titleExpanded.value = !titleExpanded.value;
164
+ }
165
+ }
166
+ const title = computed(() => {
167
+ if (!props.title) {
168
+ const queriesList = new Intl.ListFormat('en', {
169
+ style: 'long',
170
+ type: 'conjunction',
171
+ }).format(queries.value.map(({ query }) => query));
172
+ return `Searching for ${queriesList}`;
173
+ }
174
+ return props.title;
175
+ });
176
+ watch(queries, () => {
177
+ if (queries.value.length > 0) {
178
+ $x.emit('AiSuggestionsSearchRequestUpdated');
179
+ }
180
+ });
181
+ useResizeObserver(titleRef, updateTitleOverflow);
182
+ return {
183
+ emptyTaggingRequest,
184
+ isNoResults,
185
+ isTitleOverflowing,
186
+ queries,
187
+ query,
188
+ suggestionsSearch,
189
+ tagging,
190
+ title,
191
+ titleExpanded,
192
+ titleRef,
193
+ toggleTitleExpansion,
194
+ };
195
+ },
196
+ });
197
+
198
+ export { _sfc_main as default };
199
+ //# sourceMappingURL=ai-carousel.vue2.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ai-carousel.vue2.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\" :results=\"suggestionsSearch\">\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":["DisplayClickProvider","DisplayEmitter"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyGA,gBAAe,eAAe,CAAC;IAC7B,OAAO,EAAE,SAAS,CAAC,IAAI;AACvB,IAAA,UAAU,EAAE;QACV,YAAY;8BACZA,WAAoB;wBACpBC,WAAc;QACd,cAAc;QACd,UAAU;QACV,eAAe;QACf,YAAY;AACb,KAAA;AACD,IAAA,KAAK,EAAE;;AAEL,QAAA,KAAK,EAAE;AACL,YAAA,IAAI,EAAE,MAAM;AACb,SAAA;;AAED,QAAA,mBAAmB,EAAE;AACnB,YAAA,IAAI,EAAE,MAAM;AACb,SAAA;;AAED,QAAA,4BAA4B,EAAE;AAC5B,YAAA,IAAI,EAAE,MAAM;AACb,SAAA;;AAED,QAAA,0BAA0B,EAAE;AAC1B,YAAA,IAAI,EAAE,MAAM;AACb,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,EAAC,GAAI,KAAK,EAAC;AACjB,QAAA,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,iBAAiB,EAAE,OAAO,EAAE,OAAM,EAAE,GAAI,QAAQ,CAAC,IAAI,CAAA;QACjF,MAAM,mBAAmB,GAAmB,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,EAAE,EAAC,EAAE;AAElE,QAAA,MAAM,QAAO,GAAI,GAAG,CAAqB,IAAI,CAAA;AAC7C,QAAA,MAAM,aAAY,GAAI,GAAG,CAAC,KAAK,CAAA;AAC/B,QAAA,MAAM,qBAAqB,GAAG,CAAC,KAAK,CAAA;AAEpC;;AAEE;AACF,QAAA,SAAS,mBAAmB,GAAA;AAC1B,YAAA,IAAI,aAAa,CAAC,KAAK,EAAE;gBACvB;YACF;AACA,YAAA,IAAI,QAAQ,CAAC,KAAK,EAAE;AAClB,gBAAA,kBAAkB,CAAC,KAAI,GAAI,QAAQ,CAAC,KAAK,CAAC,cAAc,QAAQ,CAAC,KAAK,CAAC,WAAU;YACnF;QACF;AAEA;;AAEE;AACF,QAAA,SAAS,oBAAoB,GAAA;AAC3B,YAAA,IAAI,kBAAkB,CAAC,KAAK,EAAE;AAC5B,gBAAA,aAAa,CAAC,KAAI,GAAI,CAAC,aAAa,CAAC,KAAI;YAC3C;QACF;AAEA,QAAA,MAAM,KAAI,GAAI,QAAQ,CAAC,MAAI;AACzB,YAAA,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;gBAChB,MAAM,WAAU,GAAI,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE;AAC5C,oBAAA,KAAK,EAAE,MAAM;AACb,oBAAA,IAAI,EAAE,aAAa;AACpB,iBAAA,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,KAAK,KAAK,CAAC,CAAA;gBACjD,OAAO,CAAA,cAAA,EAAiB,WAAW,CAAA,CAAC;YACtC;YACA,OAAO,KAAK,CAAC,KAAI;AACnB,QAAA,CAAC,CAAA;AAED,QAAA,KAAK,CAAC,OAAO,EAAE,MAAI;YACjB,IAAI,OAAO,CAAC,KAAK,CAAC,MAAK,GAAI,CAAC,EAAE;AAC5B,gBAAA,EAAE,CAAC,IAAI,CAAC,mCAAmC,CAAA;YAC7C;AACF,QAAA,CAAC,CAAA;AAED,QAAA,iBAAiB,CAAC,QAAQ,EAAE,mBAAmB,CAAA;QAE/C,OAAO;YACL,mBAAmB;YACnB,WAAW;YACX,kBAAkB;YAClB,OAAO;YACP,KAAK;YACL,iBAAiB;YACjB,OAAO;YACP,KAAK;YACL,aAAa;YACb,QAAQ;YACR,oBAAoB;SACtB;IACF,CAAC;AACF,CAAA,CAAA;;;;"}
@@ -0,0 +1,7 @@
1
+ import injectCss from '../../../../tools/inject-css.js';
2
+
3
+ var css = ".x-ai-carousel{--color:var(--x-ai-carousel-color,#bbc9cf);--color-lighter:var(--x-ai-carousel-color-lighter,color-mix(in srgb,var(--color) 25%,#fff));background-color:var(--color-lighter);border-radius:1.5rem;padding:8px 0;position:relative}.x-ai-carousel-title{align-items:flex-start;cursor:pointer;display:flex;font-size:12px;gap:8px;margin:0 14px 8px}.x-ai-carousel-title-text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.x-ai-carousel-title-text--expanded{white-space:normal}.x-ai-carousel-title-icon{aspect-ratio:1/1;color:var(--color);flex-shrink:0;height:1rem;margin-bottom:auto}.x-ai-carousel-title-button{align-items:center;background:none;border:none;color:var(--color);cursor:pointer;display:flex;justify-content:center;margin-bottom:auto;padding:0}.x-ai-carousel-title-button-icon{aspect-ratio:1/1;height:1rem;transition:transform .3s ease}.x-ai-carousel-title-button-icon--expanded{transform:rotate(180deg)}.x-ai-carousel-suggestion-results{display:flex;gap:1rem;padding-left:1rem;padding-right:1rem}";
4
+ injectCss(css);
5
+
6
+ export { css };
7
+ //# sourceMappingURL=ai-carousel.vue3.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ai-carousel.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
@@ -21,7 +21,9 @@ const setAiQueryFromPreviewWire = wireCommit('setQuery', ({ eventPayload: { quer
21
21
  /** Fetches the AI suggestions streaming response. */
22
22
  const fetchAndSaveAiSuggestionsWire = wireDispatch('fetchAndSaveAiSuggestions');
23
23
  /** Fetches and save the AI suggestions search response. */
24
- const fetchAndSaveAiSuggestionsSearchWire = filterTruthyPayload(wireDispatch('fetchAndSaveAiSuggestionsSearch'));
24
+ const fetchAndSaveAiSuggestionsSearchWire = wireDispatch('fetchAndSaveAiSuggestionsSearch', true);
25
+ /** Fetches and save the AI suggestions search response. */
26
+ const fetchAndSaveAiSuggestionsSearchIfExpandedWire = filterTruthyPayload(wireDispatch('fetchAndSaveAiSuggestionsSearch'));
25
27
  /** Sets the AI state `relatedTags`.*/
26
28
  const setAiRelatedTagsWire = wireCommit('setAiRelatedTags');
27
29
  /** Resets the related prompts state. */
@@ -55,10 +57,12 @@ const aiWiring = createWiring({
55
57
  resetAiStateWire,
56
58
  fetchAndSaveAiSuggestionsWire,
57
59
  },
58
- // Formerly AiSuggestionsSearchRequestUpdated
59
- UserClickedAiOverviewExpandButton: {
60
+ AiSuggestionsSearchRequestUpdated: {
60
61
  fetchAndSaveAiSuggestionsSearchWire,
61
62
  },
63
+ UserClickedAiOverviewExpandButton: {
64
+ fetchAndSaveAiSuggestionsSearchIfExpandedWire,
65
+ },
62
66
  SelectedRelatedTagsChanged: {
63
67
  setAiRelatedTagsWire,
64
68
  },
@@ -1 +1 @@
1
- {"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/ai/wiring.ts"],"sourcesContent":["import {\n createWiring,\n filterTruthyPayload,\n namespacedWireCommit,\n namespacedWireCommitWithoutPayload,\n namespacedWireDispatch,\n} from '../../wiring'\n\n/** AI XModule name. */\nconst moduleName = 'ai'\n/** WireCommit for AiXModule. */\nconst wireCommit = namespacedWireCommit(moduleName)\n/** WireCommitWithoutPayload for AiXModule. */\nconst wireCommitWithoutPayload = namespacedWireCommitWithoutPayload(moduleName)\n/** WireDispatch for AiXModule.*/\nconst wireDispatch = namespacedWireDispatch(moduleName)\n\n/** Sets the AI state from URL data. */\nconst setUrlParamsWire = wireDispatch('setUrlParams')\n/** Sets the AI state `params`. */\nconst setExtraParamsWire = wireCommit('setParams')\n\n/** Sets the AI state `query`. */\nconst setAiQueryWire = wireCommit('setQuery')\n\n/** Sets the AI state `query` with the selectedQueryPreview's query. */\nconst setAiQueryFromPreviewWire = wireCommit('setQuery', ({ eventPayload: { query } }) => query)\n\n/** Fetches the AI suggestions streaming response. */\nconst fetchAndSaveAiSuggestionsWire = wireDispatch('fetchAndSaveAiSuggestions')\n\n/** Fetches and save the AI suggestions search response. */\nconst fetchAndSaveAiSuggestionsSearchWire = filterTruthyPayload(\n wireDispatch('fetchAndSaveAiSuggestionsSearch'),\n)\n\n/** Sets the AI state `relatedTags`.*/\nconst setAiRelatedTagsWire = wireCommit('setAiRelatedTags')\n\n/** Resets the related prompts state. */\nconst resetAiStateWire = wireCommitWithoutPayload('resetAiState')\n\n/** Sets the origin for the AI requests. */\nconst saveAiOriginWire = wireDispatch('saveOrigin', ({ metadata }) => metadata)\n\n/** Sets the AI state `selectedFilters`. */\nconst setSelectedFiltersWire = wireCommit('setSelectedFilters')\n\n/**\n * Wiring configuration for the {@link AiXModule | AI module}.\n *\n * @internal\n */\nexport const aiWiring = createWiring({\n ParamsLoadedFromUrl: {\n setUrlParamsWire,\n },\n ExtraParamsChanged: {\n setExtraParamsWire,\n },\n UserAcceptedAQuery: {\n setAiQueryWire,\n },\n UserAcceptedAQueryPreview: {\n setAiQueryFromPreviewWire,\n },\n UserClearedQuery: {\n setAiQueryWire,\n },\n AiSuggestionsRequestUpdated: {\n resetAiStateWire,\n fetchAndSaveAiSuggestionsWire,\n },\n // Formerly AiSuggestionsSearchRequestUpdated\n UserClickedAiOverviewExpandButton: {\n fetchAndSaveAiSuggestionsSearchWire,\n },\n SelectedRelatedTagsChanged: {\n setAiRelatedTagsWire,\n },\n SelectedFiltersForRequestChanged: {\n setSelectedFiltersWire,\n },\n AiOverviewMounted: {\n saveAiOriginWire,\n },\n})\n"],"names":[],"mappings":";;;;AAQA;AACA,MAAM,UAAU,GAAG,IAAI;AACvB;AACA,MAAM,UAAU,GAAG,oBAAoB,CAAC,UAAU,CAAC;AACnD;AACA,MAAM,wBAAwB,GAAG,kCAAkC,CAAC,UAAU,CAAC;AAC/E;AACA,MAAM,YAAY,GAAG,sBAAsB,CAAC,UAAU,CAAC;AAEvD;AACA,MAAM,gBAAgB,GAAG,YAAY,CAAC,cAAc,CAAC;AACrD;AACA,MAAM,kBAAkB,GAAG,UAAU,CAAC,WAAW,CAAC;AAElD;AACA,MAAM,cAAc,GAAG,UAAU,CAAC,UAAU,CAAC;AAE7C;AACA,MAAM,yBAAyB,GAAG,UAAU,CAAC,UAAU,EAAE,CAAC,EAAE,YAAY,EAAE,EAAE,KAAK,EAAE,EAAE,KAAK,KAAK,CAAC;AAEhG;AACA,MAAM,6BAA6B,GAAG,YAAY,CAAC,2BAA2B,CAAC;AAE/E;AACA,MAAM,mCAAmC,GAAG,mBAAmB,CAC7D,YAAY,CAAC,iCAAiC,CAAC,CAChD;AAED;AACA,MAAM,oBAAoB,GAAG,UAAU,CAAC,kBAAkB,CAAC;AAE3D;AACA,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,cAAc,CAAC;AAEjE;AACA,MAAM,gBAAgB,GAAG,YAAY,CAAC,YAAY,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,QAAQ,CAAC;AAE/E;AACA,MAAM,sBAAsB,GAAG,UAAU,CAAC,oBAAoB,CAAC;AAE/D;;;;AAIG;AACI,MAAM,QAAQ,GAAG,YAAY,CAAC;AACnC,IAAA,mBAAmB,EAAE;QACnB,gBAAgB;AACjB,KAAA;AACD,IAAA,kBAAkB,EAAE;QAClB,kBAAkB;AACnB,KAAA;AACD,IAAA,kBAAkB,EAAE;QAClB,cAAc;AACf,KAAA;AACD,IAAA,yBAAyB,EAAE;QACzB,yBAAyB;AAC1B,KAAA;AACD,IAAA,gBAAgB,EAAE;QAChB,cAAc;AACf,KAAA;AACD,IAAA,2BAA2B,EAAE;QAC3B,gBAAgB;QAChB,6BAA6B;AAC9B,KAAA;;AAED,IAAA,iCAAiC,EAAE;QACjC,mCAAmC;AACpC,KAAA;AACD,IAAA,0BAA0B,EAAE;QAC1B,oBAAoB;AACrB,KAAA;AACD,IAAA,gCAAgC,EAAE;QAChC,sBAAsB;AACvB,KAAA;AACD,IAAA,iBAAiB,EAAE;QACjB,gBAAgB;AACjB,KAAA;AACF,CAAA;;;;"}
1
+ {"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/ai/wiring.ts"],"sourcesContent":["import {\n createWiring,\n filterTruthyPayload,\n namespacedWireCommit,\n namespacedWireCommitWithoutPayload,\n namespacedWireDispatch,\n} from '../../wiring'\n\n/** AI XModule name. */\nconst moduleName = 'ai'\n/** WireCommit for AiXModule. */\nconst wireCommit = namespacedWireCommit(moduleName)\n/** WireCommitWithoutPayload for AiXModule. */\nconst wireCommitWithoutPayload = namespacedWireCommitWithoutPayload(moduleName)\n/** WireDispatch for AiXModule.*/\nconst wireDispatch = namespacedWireDispatch(moduleName)\n\n/** Sets the AI state from URL data. */\nconst setUrlParamsWire = wireDispatch('setUrlParams')\n/** Sets the AI state `params`. */\nconst setExtraParamsWire = wireCommit('setParams')\n\n/** Sets the AI state `query`. */\nconst setAiQueryWire = wireCommit('setQuery')\n\n/** Sets the AI state `query` with the selectedQueryPreview's query. */\nconst setAiQueryFromPreviewWire = wireCommit('setQuery', ({ eventPayload: { query } }) => query)\n\n/** Fetches the AI suggestions streaming response. */\nconst fetchAndSaveAiSuggestionsWire = wireDispatch('fetchAndSaveAiSuggestions')\n\n/** Fetches and save the AI suggestions search response. */\nconst fetchAndSaveAiSuggestionsSearchWire = wireDispatch('fetchAndSaveAiSuggestionsSearch', true)\n\n/** Fetches and save the AI suggestions search response. */\nconst fetchAndSaveAiSuggestionsSearchIfExpandedWire = filterTruthyPayload(\n wireDispatch('fetchAndSaveAiSuggestionsSearch'),\n)\n\n/** Sets the AI state `relatedTags`.*/\nconst setAiRelatedTagsWire = wireCommit('setAiRelatedTags')\n\n/** Resets the related prompts state. */\nconst resetAiStateWire = wireCommitWithoutPayload('resetAiState')\n\n/** Sets the origin for the AI requests. */\nconst saveAiOriginWire = wireDispatch('saveOrigin', ({ metadata }) => metadata)\n\n/** Sets the AI state `selectedFilters`. */\nconst setSelectedFiltersWire = wireCommit('setSelectedFilters')\n\n/**\n * Wiring configuration for the {@link AiXModule | AI module}.\n *\n * @internal\n */\nexport const aiWiring = createWiring({\n ParamsLoadedFromUrl: {\n setUrlParamsWire,\n },\n ExtraParamsChanged: {\n setExtraParamsWire,\n },\n UserAcceptedAQuery: {\n setAiQueryWire,\n },\n UserAcceptedAQueryPreview: {\n setAiQueryFromPreviewWire,\n },\n UserClearedQuery: {\n setAiQueryWire,\n },\n AiSuggestionsRequestUpdated: {\n resetAiStateWire,\n fetchAndSaveAiSuggestionsWire,\n },\n AiSuggestionsSearchRequestUpdated: {\n fetchAndSaveAiSuggestionsSearchWire,\n },\n UserClickedAiOverviewExpandButton: {\n fetchAndSaveAiSuggestionsSearchIfExpandedWire,\n },\n SelectedRelatedTagsChanged: {\n setAiRelatedTagsWire,\n },\n SelectedFiltersForRequestChanged: {\n setSelectedFiltersWire,\n },\n AiOverviewMounted: {\n saveAiOriginWire,\n },\n})\n"],"names":[],"mappings":";;;;AAQA;AACA,MAAM,UAAU,GAAG,IAAI;AACvB;AACA,MAAM,UAAU,GAAG,oBAAoB,CAAC,UAAU,CAAC;AACnD;AACA,MAAM,wBAAwB,GAAG,kCAAkC,CAAC,UAAU,CAAC;AAC/E;AACA,MAAM,YAAY,GAAG,sBAAsB,CAAC,UAAU,CAAC;AAEvD;AACA,MAAM,gBAAgB,GAAG,YAAY,CAAC,cAAc,CAAC;AACrD;AACA,MAAM,kBAAkB,GAAG,UAAU,CAAC,WAAW,CAAC;AAElD;AACA,MAAM,cAAc,GAAG,UAAU,CAAC,UAAU,CAAC;AAE7C;AACA,MAAM,yBAAyB,GAAG,UAAU,CAAC,UAAU,EAAE,CAAC,EAAE,YAAY,EAAE,EAAE,KAAK,EAAE,EAAE,KAAK,KAAK,CAAC;AAEhG;AACA,MAAM,6BAA6B,GAAG,YAAY,CAAC,2BAA2B,CAAC;AAE/E;AACA,MAAM,mCAAmC,GAAG,YAAY,CAAC,iCAAiC,EAAE,IAAI,CAAC;AAEjG;AACA,MAAM,6CAA6C,GAAG,mBAAmB,CACvE,YAAY,CAAC,iCAAiC,CAAC,CAChD;AAED;AACA,MAAM,oBAAoB,GAAG,UAAU,CAAC,kBAAkB,CAAC;AAE3D;AACA,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,cAAc,CAAC;AAEjE;AACA,MAAM,gBAAgB,GAAG,YAAY,CAAC,YAAY,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,QAAQ,CAAC;AAE/E;AACA,MAAM,sBAAsB,GAAG,UAAU,CAAC,oBAAoB,CAAC;AAE/D;;;;AAIG;AACI,MAAM,QAAQ,GAAG,YAAY,CAAC;AACnC,IAAA,mBAAmB,EAAE;QACnB,gBAAgB;AACjB,KAAA;AACD,IAAA,kBAAkB,EAAE;QAClB,kBAAkB;AACnB,KAAA;AACD,IAAA,kBAAkB,EAAE;QAClB,cAAc;AACf,KAAA;AACD,IAAA,yBAAyB,EAAE;QACzB,yBAAyB;AAC1B,KAAA;AACD,IAAA,gBAAgB,EAAE;QAChB,cAAc;AACf,KAAA;AACD,IAAA,2BAA2B,EAAE;QAC3B,gBAAgB;QAChB,6BAA6B;AAC9B,KAAA;AACD,IAAA,iCAAiC,EAAE;QACjC,mCAAmC;AACpC,KAAA;AACD,IAAA,iCAAiC,EAAE;QACjC,6CAA6C;AAC9C,KAAA;AACD,IAAA,0BAA0B,EAAE;QAC1B,oBAAoB;AACrB,KAAA;AACD,IAAA,gCAAgC,EAAE;QAChC,sBAAsB;AACvB,KAAA;AACD,IAAA,iBAAiB,EAAE;QACjB,gBAAgB;AACjB,KAAA;AACF,CAAA;;;;"}