@empathyco/x-components 6.0.0-alpha.136 → 6.0.0-alpha.137

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.
Files changed (13) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/docs/API-reference/api/x-components.aioverview.md +18 -6
  3. package/docs/API-reference/components/ai/x-components.ai-overview.md +12 -9
  4. package/js/x-modules/ai/components/ai-overview.vue.js +75 -50
  5. package/js/x-modules/ai/components/ai-overview.vue.js.map +1 -1
  6. package/js/x-modules/ai/components/ai-overview.vue2.js +29 -10
  7. package/js/x-modules/ai/components/ai-overview.vue2.js.map +1 -1
  8. package/js/x-modules/ai/components/ai-overview.vue3.js +1 -1
  9. package/package.json +2 -2
  10. package/report/x-components.api.json +83 -11
  11. package/report/x-components.api.md +19 -7
  12. package/types/x-modules/ai/components/ai-overview.vue.d.ts +31 -8
  13. package/types/x-modules/ai/components/ai-overview.vue.d.ts.map +1 -1
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
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.137 (2025-09-08)
7
+
8
+ * feat(AiOverview): minor component adjustments (#1867) ([554cd79](https://github.com/empathyco/x/commit/554cd79)), closes [#1867](https://github.com/empathyco/x/issues/1867)
9
+
10
+
11
+
12
+
13
+
6
14
  ## 6.0.0-alpha.136 (2025-09-05)
7
15
 
8
16
  * fix(ai): reset state handling (#1864) ([29aa62c](https://github.com/empathyco/x/commit/29aa62c)), closes [#1864](https://github.com/empathyco/x/issues/1864)
package/docs/API-reference/api/x-components.aioverview.md CHANGED
@@ -16,17 +16,24 @@ _default: import("vue").DefineComponent<{
16
16
  type: PropType<string>;
17
17
  default: string;
18
18
  };
19
- buttonText: {
19
+ expandText: {
20
+ type: PropType<string>;
21
+ default: string;
22
+ };
23
+ collapseText: {
20
24
  type: PropType<string>;
21
25
  default: string;
22
26
  };
23
27
  }, {
24
- open: () => void;
28
+ buttonText: import("vue").ComputedRef<string>;
25
29
  expanded: import("vue").Ref<boolean>;
30
+ queries: import("vue").ComputedRef<import("@empathyco/x-types").AiSuggestionQuery[]>;
26
31
  responseText: import("vue").ComputedRef<string>;
27
- suggestionText: import("vue").ComputedRef<string>;
28
- suggestionsSearch: import("vue").ComputedRef<import("@empathyco/x-types").AiSuggestionSearch[]>;
29
32
  suggestionsLoading: import("vue").ComputedRef<boolean>;
33
+ queriesResults: import("vue").ComputedRef<Record<string, import("@empathyco/x-types").Result[]>>;
34
+ suggestionsSearch: import("vue").ComputedRef<AiSuggestionSearch[]>;
35
+ suggestionText: import("vue").ComputedRef<string>;
36
+ toggleVisibility: () => void;
30
37
  }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
31
38
  title: {
32
39
  type: PropType<string>;
@@ -36,13 +43,18 @@ _default: import("vue").DefineComponent<{
36
43
  type: PropType<string>;
37
44
  default: string;
38
45
  };
39
- buttonText: {
46
+ expandText: {
47
+ type: PropType<string>;
48
+ default: string;
49
+ };
50
+ collapseText: {
40
51
  type: PropType<string>;
41
52
  default: string;
42
53
  };
43
54
  }>>, {
44
55
  title: string;
45
56
  titleLoading: string;
46
- buttonText: string;
57
+ expandText: string;
58
+ collapseText: string;
47
59
  }, {}>
48
60
  ```
package/docs/API-reference/components/ai/x-components.ai-overview.md CHANGED
@@ -8,15 +8,18 @@ title: AiOverview
8
8
 
9
9
  ## Props
10
10
 
11
- | Name | Description | Type | Default |
12
- | ------------------------- | -------------------------------------------------- | ------------------- | ----------------------------------------- |
13
- | <code>title</code> | The text displayed when the question ended loading | <code>string</code> | <code>'Empathy AI Overview'</code> |
14
- | <code>titleLoading</code> | The text displayed when the question is loading. | <code>string</code> | <code>'Generating with Empathy AI'</code> |
15
- | <code>buttonText</code> | The text displayed on the expand button. | <code>string</code> | <code>'Show more'</code> |
11
+ | Name | Description | Type | Default |
12
+ | ------------------------- | ------------------------------------------------------- | ------------------- | ----------------------------------------- |
13
+ | <code>title</code> | The text displayed when the question ended loading | <code>string</code> | <code>'Empathy AI Overview'</code> |
14
+ | <code>titleLoading</code> | The text displayed when the question is loading. | <code>string</code> | <code>'Generating with Empathy AI'</code> |
15
+ | <code>expandText</code> | The text displayed on the toggle button when collapsed. | <code>string</code> | <code>'Show more'</code> |
16
+ | <code>collapseText</code> | The text displayed on the toggle button when expanded. | <code>string</code> | <code>'Show less'</code> |
16
17
 
17
18
  ## Slots
18
19
 
19
- | Name | Description | Bindings<br />(name - type - description) |
20
- | -------------------- | -------------------------- | ----------------------------------------- |
21
- | <code>default</code> | suggestions-search content | |
22
- | <code>result</code> | (required) result card | |
20
+ | Name | Description | Bindings<br />(name - type - description) |
21
+ | -------------------------- | ---------------------------- | ----------------------------------------- |
22
+ | <code>default</code> | suggestions-search content | <br /> |
23
+ | <code>query-results</code> | suggestion query result list | |
24
+ | <code>result</code> | (required) result card | |
25
+ | <code>toggle-button</code> | toggle button | <br /><br /> |
package/js/x-modules/ai/components/ai-overview.vue.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import _sfc_main from './ai-overview.vue2.js';
2
- import { resolveComponent, resolveDirective, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, withDirectives, createTextVNode, toDisplayString, Fragment, renderList, createBlock, normalizeStyle, renderSlot, vShow, createCommentVNode } from 'vue';
2
+ import { resolveComponent, resolveDirective, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, withDirectives, createTextVNode, toDisplayString, Fragment, renderList, createBlock, normalizeStyle, renderSlot, createCommentVNode, vShow, normalizeProps, guardReactiveProps, normalizeClass } from 'vue';
3
3
  import './ai-overview.vue3.js';
4
4
  import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.js';
5
5
 
@@ -39,7 +39,7 @@ const _hoisted_8 = {
39
39
  const _hoisted_9 = { "data-test": "ai-overview-suggestions-container" };
40
40
  const _hoisted_10 = { class: "x-ai-overview-suggestions" };
41
41
  const _hoisted_11 = { class: "x-ai-overview-suggestion-results" };
42
- const _hoisted_12 = { class: "x-ai-overview-expand-wrapper" };
42
+ const _hoisted_12 = { class: "x-ai-overview-toggle-wrapper" };
43
43
  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
44
44
  const _component_AIStarIcon = resolveComponent("AIStarIcon");
45
45
  const _component_Fade = resolveComponent("Fade");
@@ -113,7 +113,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
113
113
  /* STABLE */
114
114
  })
115
115
  ]),
116
- _ctx.suggestionsSearch.length ? (openBlock(), createBlock(_component_CollapseHeight, {
116
+ _ctx.queries.length ? (openBlock(), createBlock(_component_CollapseHeight, {
117
117
  key: 0,
118
118
  style: normalizeStyle({
119
119
  "--x-collapse-height-transition-duration": `${300 * _ctx.suggestionsSearch.length}ms`
@@ -125,12 +125,15 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
125
125
  "div",
126
126
  _hoisted_9,
127
127
  [
128
- renderSlot(_ctx.$slots, "default", { suggestionsSearch: _ctx.suggestionsSearch }, () => [
128
+ renderSlot(_ctx.$slots, "default", {
129
+ suggestionsSearch: _ctx.suggestionsSearch,
130
+ queries: _ctx.queries
131
+ }, () => [
129
132
  createElementVNode("div", _hoisted_10, [
130
133
  (openBlock(true), createElementBlock(
131
134
  Fragment,
132
135
  null,
133
- renderList(_ctx.suggestionsSearch, ({ query, results }) => {
136
+ renderList(_ctx.queries, ({ query }) => {
134
137
  return openBlock(), createElementBlock("div", {
135
138
  key: query,
136
139
  class: "x-ai-overview-suggestion"
@@ -150,34 +153,41 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
150
153
  _: 2
151
154
  /* DYNAMIC */
152
155
  }, 1032, ["events"]),
153
- createVNode(
154
- _component_SlidingPanel,
155
- { "reset-on-content-change": false },
156
- {
157
- default: withCtx(() => [
158
- createElementVNode("ul", _hoisted_11, [
159
- (openBlock(true), createElementBlock(
160
- Fragment,
161
- null,
162
- renderList(results, (result) => {
163
- return openBlock(), createElementBlock("li", {
164
- key: result.id,
165
- "data-test": "ai-overview-suggestion-result"
166
- }, [
167
- renderSlot(_ctx.$slots, "result", { result })
168
- ]);
169
- }),
170
- 128
171
- /* KEYED_FRAGMENT */
172
- ))
173
- ])
174
- ]),
175
- _: 2
176
- /* DYNAMIC */
177
- },
178
- 1024
179
- /* DYNAMIC_SLOTS */
180
- )
156
+ renderSlot(_ctx.$slots, "query-results", {
157
+ queryResults: _ctx.queriesResults[query]
158
+ }, () => [
159
+ _ctx.queriesResults[query] ? (openBlock(), createBlock(
160
+ _component_SlidingPanel,
161
+ {
162
+ key: 0,
163
+ "reset-on-content-change": false
164
+ },
165
+ {
166
+ default: withCtx(() => [
167
+ createElementVNode("ul", _hoisted_11, [
168
+ (openBlock(true), createElementBlock(
169
+ Fragment,
170
+ null,
171
+ renderList(_ctx.queriesResults[query], (result) => {
172
+ return openBlock(), createElementBlock("li", {
173
+ key: result.id,
174
+ "data-test": "ai-overview-suggestion-result"
175
+ }, [
176
+ renderSlot(_ctx.$slots, "result", { result })
177
+ ]);
178
+ }),
179
+ 128
180
+ /* KEYED_FRAGMENT */
181
+ ))
182
+ ])
183
+ ]),
184
+ _: 2
185
+ /* DYNAMIC */
186
+ },
187
+ 1024
188
+ /* DYNAMIC_SLOTS */
189
+ )) : createCommentVNode("v-if", true)
190
+ ])
181
191
  ]);
182
192
  }),
183
193
  128
@@ -199,30 +209,45 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
199
209
  "div",
200
210
  null,
201
211
  [
202
- createElementVNode("div", {
203
- class: "x-ai-overview-gradient",
204
- "data-test": "ai-overview-gradient",
205
- onClick: _cache[0] || (_cache[0] = (...args) => _ctx.open && _ctx.open(...args))
206
- }),
212
+ withDirectives(createElementVNode(
213
+ "div",
214
+ {
215
+ class: "x-ai-overview-gradient",
216
+ "data-test": "ai-overview-gradient",
217
+ onClick: _cache[0] || (_cache[0] = (...args) => _ctx.toggleVisibility && _ctx.toggleVisibility(...args))
218
+ },
219
+ null,
220
+ 512
221
+ /* NEED_PATCH */
222
+ ), [
223
+ [vShow, !_ctx.expanded]
224
+ ]),
207
225
  createElementVNode("div", _hoisted_12, [
208
- createElementVNode("button", {
209
- class: "x-ai-overview-expand-btn",
210
- "data-test": "ai-overview-expand-button",
211
- onClick: _cache[1] || (_cache[1] = (...args) => _ctx.open && _ctx.open(...args))
212
- }, [
213
- createTextVNode(
214
- toDisplayString(_ctx.buttonText) + " ",
215
- 1
216
- /* TEXT */
217
- ),
218
- createVNode(_component_ChevronDownIcon, { class: "x-ai-overview-expand-btn-icon" })
226
+ renderSlot(_ctx.$slots, "toggle-button", normalizeProps(guardReactiveProps({ expanded: _ctx.expanded, toggleVisibility: _ctx.toggleVisibility, buttonText: _ctx.buttonText })), () => [
227
+ createElementVNode("button", {
228
+ class: "x-ai-overview-toggle-btn",
229
+ "data-test": "ai-overview-toggle-button",
230
+ onClick: _cache[1] || (_cache[1] = (...args) => _ctx.toggleVisibility && _ctx.toggleVisibility(...args))
231
+ }, [
232
+ createTextVNode(
233
+ toDisplayString(_ctx.buttonText) + " ",
234
+ 1
235
+ /* TEXT */
236
+ ),
237
+ createVNode(_component_ChevronDownIcon, {
238
+ class: normalizeClass([
239
+ "x-ai-overview-toggle-btn-icon",
240
+ _ctx.expanded ? "x-ai-overview-toggle-btn-icon-expanded" : "x-ai-overview-toggle-btn-icon-collapsed"
241
+ ])
242
+ }, null, 8, ["class"])
243
+ ])
219
244
  ])
220
245
  ])
221
246
  ],
222
247
  512
223
248
  /* NEED_PATCH */
224
249
  ), [
225
- [vShow, _ctx.suggestionsSearch.length && !_ctx.expanded]
250
+ [vShow, _ctx.queries.length]
226
251
  ])
227
252
  ]);
228
253
  }
package/js/x-modules/ai/components/ai-overview.vue.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ai-overview.vue.js","sources":["../../../../../src/x-modules/ai/components/ai-overview.vue"],"sourcesContent":["<template>\n <div class=\"x-ai-overview\">\n <div class=\"x-ai-overview-main\">\n <Fade mode=\"out-in\">\n <span\n v-if=\"suggestionsLoading\"\n class=\"x-ai-overview-title-loading\"\n data-test=\"ai-overview-title-loading\"\n >\n <span class=\"x-ai-overview-title-loading-indicator\" />\n <span\n v-typing=\"{ text: titleLoading, speed: 50 }\"\n class=\"x-ai-overview-title-loading-text\"\n data-test=\"ai-overview-title-loading-text\"\n />\n </span>\n <span v-else class=\"x-ai-overview-title\" data-test=\"ai-overview-title\">\n <AIStarIcon class=\"x-ai-overview-title-icon\" />{{ title }}\n </span>\n </Fade>\n <ChangeHeight>\n <div\n v-if=\"suggestionsLoading\"\n class=\"x-ai-overview-loading-content\"\n data-test=\"ai-overview-loading-content\"\n >\n <span v-for=\"i in 4\" :key=\"i\" data-test=\"ai-overview-loading-item\" />\n </div>\n <div v-else class=\"x-ai-overview-content\" data-test=\"ai-overview-content\">\n <span>{{ suggestionText }}</span>\n <p>{{ responseText }}</p>\n </div>\n </ChangeHeight>\n </div>\n <CollapseHeight\n v-if=\"suggestionsSearch.length\"\n :style=\"{\n '--x-collapse-height-transition-duration': `${300 * suggestionsSearch.length}ms`,\n }\"\n data-test=\"ai-overview-collapse-height-suggestions\"\n >\n <div v-show=\"expanded\" data-test=\"ai-overview-suggestions-container\">\n <!-- @slot suggestions-search content -->\n <slot :suggestions-search=\"suggestionsSearch\">\n <div class=\"x-ai-overview-suggestions\">\n <div\n v-for=\"{ query, results } in suggestionsSearch\"\n :key=\"query\"\n class=\"x-ai-overview-suggestion\"\n >\n <BaseEventButton\n class=\"x-ai-overview-suggestion-query-btn\"\n :events=\"{ UserAcceptedAQuery: query }\"\n >\n {{ query }}<ArrowRightIcon class=\"x-ai-overview-suggestion-query-btn-icon\" />\n </BaseEventButton>\n <SlidingPanel :reset-on-content-change=\"false\">\n <ul class=\"x-ai-overview-suggestion-results\">\n <li\n v-for=\"result in results\"\n :key=\"result.id\"\n data-test=\"ai-overview-suggestion-result\"\n >\n <!-- @slot (required) result card -->\n <slot name=\"result\" :result=\"result\" />\n </li>\n </ul>\n </SlidingPanel>\n </div>\n </div>\n </slot>\n </div>\n </CollapseHeight>\n <div v-show=\"suggestionsSearch.length && !expanded\">\n <div class=\"x-ai-overview-gradient\" data-test=\"ai-overview-gradient\" @click=\"open\" />\n <div class=\"x-ai-overview-expand-wrapper\">\n <button\n class=\"x-ai-overview-expand-btn\"\n data-test=\"ai-overview-expand-button\"\n @click=\"open\"\n >\n {{ buttonText }}\n <ChevronDownIcon class=\"x-ai-overview-expand-btn-icon\" />\n </button>\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport { defineComponent, ref, watch } from 'vue'\nimport {\n AIStarIcon,\n ArrowRightIcon,\n BaseEventButton,\n ChangeHeight,\n ChevronDownIcon,\n CollapseHeight,\n Fade,\n SlidingPanel,\n} from '../../../components'\nimport { useGetter, useState } from '../../../composables'\nimport { typing } from '../../../directives'\nimport { aiXModule } from '../x-module'\n\nexport default defineComponent({\n directives: {\n typing,\n },\n xModule: aiXModule.name,\n components: {\n AIStarIcon,\n ArrowRightIcon,\n BaseEventButton,\n ChevronDownIcon,\n CollapseHeight,\n ChangeHeight,\n Fade,\n SlidingPanel,\n },\n props: {\n /**\n * The text displayed when the question ended loading\n *\n * @public\n */\n title: {\n type: String as PropType<string>,\n default: 'Empathy AI Overview',\n },\n /**\n * The text displayed when the question is loading.\n *\n * @public\n */\n titleLoading: {\n type: String as PropType<string>,\n default: 'Generating with Empathy AI',\n },\n /**\n * The text displayed on the expand button.\n *\n * @public\n */\n buttonText: {\n type: String as PropType<string>,\n default: 'Show more',\n },\n },\n setup() {\n const { query } = useGetter('ai')\n const { suggestionText, responseText, suggestionsSearch, suggestionsLoading } = useState('ai')\n\n const expanded = ref(false)\n\n function open() {\n expanded.value = true\n }\n\n watch(query, () => (expanded.value = false))\n\n return {\n open,\n expanded,\n responseText,\n suggestionText,\n suggestionsSearch,\n suggestionsLoading,\n }\n },\n})\n</script>\n<style lang=\"css\">\n.x-ai-overview {\n --color: var(--x-ai-overview-color, #bbc9cf);\n --color-lighter: var(--x-ai-overview-color-lighter, color-mix(in srgb, var(--color) 25%, white));\n --color-lightest: var(\n --x-ai-overview-color-lightest,\n color-mix(in srgb, var(--color) 75%, white)\n );\n\n @apply x-relative x-rounded-3xl x-bg-[var(--color-lighter)];\n}\n\n.x-ai-overview-main {\n @apply x-p-16 x-rounded-lg;\n}\n\n.x-ai-overview-title-loading {\n @apply x-flex x-items-center x-gap-1.5 x-mb-8;\n}\n.x-ai-overview-title-loading-indicator {\n @apply x-size-3 x-animate-pulse x-rounded-full x-bg-[var(--color)];\n}\n.x-ai-overview-title-loading-text {\n @apply x-animate-pulse x-text-xs;\n}\n\n.x-ai-overview-title {\n @apply x-flex x-text-sm x-font-bold x-gap-4 x-items-center x-mb-8;\n}\n.x-ai-overview-title-icon {\n @apply x-icon x-text-[var(--color)];\n}\n\n.x-ai-overview-loading-content {\n @apply x-flex x-w-full x-flex-col x-gap-4 x-animate-pulse;\n}\n.x-ai-overview-loading-content > span:first-child {\n @apply x-h-16 x-w-full x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)];\n}\n.x-ai-overview-loading-content > span:nth-child(2) {\n @apply x-h-16 x-w-3/4 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color-lightest)] x-to-100% x-to-[var(--color)] x-opacity-50;\n}\n.x-ai-overview-loading-content > span:nth-child(3) {\n @apply x-h-16 x-w-11/12 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)];\n}\n.x-ai-overview-loading-content > span:nth-child(4) {\n @apply x-h-16 x-w-1/2 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)] x-opacity-75;\n}\n\n.x-ai-overview-content {\n @apply x-flex x-flex-col x-text-left x-leading-5 x-gap-2;\n}\n.x-ai-overview-content span {\n @apply x-font-medium;\n}\n\n.x-ai-overview-gradient {\n @apply x-cursor-pointer x-content-none x-absolute x-w-full x-h-80 x-bottom-5 x-bg-gradient-to-b x-from-0% x-from-transparent x-to-100% x-to-[var(--color-lighter)];\n}\n\n.x-ai-overview-expand-wrapper {\n @apply x-flex x-relative x-z-[1];\n}\n.x-ai-overview-expand-btn {\n @apply x-button x-button-outlined x-rounded-full x-w-full;\n}\n.x-ai-overview-expand-btn-icon {\n @apply x-icon;\n}\n.x-ai-overview-suggestion-query-btn {\n @apply x-button-tight x-mx-16 x-font-bold x-text-gray-900 x-w-fit x-min-h-fit x-flex x-gap-16 x-items-center;\n}\n.x-ai-overview-suggestion-query-btn-icon {\n @apply x-icon-md;\n}\n.x-ai-overview-suggestions {\n @apply x-flex x-flex-col x-gap-16 x-pb-16;\n}\n.x-ai-overview-suggestion {\n @apply x-flex x-flex-col x-gap-8;\n}\n.x-ai-overview-suggestion-results {\n @apply x-flex x-gap-16 x-px-16;\n}\n</style>\n"],"names":["_createElementVNode","_openBlock","_createElementBlock","_createVNode","_withDirectives","_createTextVNode","_toDisplayString","_Fragment","_renderList","_createBlock","_normalizeStyle","_withCtx","_renderSlot","_createCommentVNode"],"mappings":"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"}
1
+ {"version":3,"file":"ai-overview.vue.js","sources":["../../../../../src/x-modules/ai/components/ai-overview.vue"],"sourcesContent":["<template>\n <div class=\"x-ai-overview\">\n <div class=\"x-ai-overview-main\">\n <Fade mode=\"out-in\">\n <span\n v-if=\"suggestionsLoading\"\n class=\"x-ai-overview-title-loading\"\n data-test=\"ai-overview-title-loading\"\n >\n <span class=\"x-ai-overview-title-loading-indicator\" />\n <span\n v-typing=\"{ text: titleLoading, speed: 50 }\"\n class=\"x-ai-overview-title-loading-text\"\n data-test=\"ai-overview-title-loading-text\"\n />\n </span>\n <span v-else class=\"x-ai-overview-title\" data-test=\"ai-overview-title\">\n <AIStarIcon class=\"x-ai-overview-title-icon\" />{{ title }}\n </span>\n </Fade>\n <ChangeHeight>\n <div\n v-if=\"suggestionsLoading\"\n class=\"x-ai-overview-loading-content\"\n data-test=\"ai-overview-loading-content\"\n >\n <span v-for=\"i in 4\" :key=\"i\" data-test=\"ai-overview-loading-item\" />\n </div>\n <div v-else class=\"x-ai-overview-content\" data-test=\"ai-overview-content\">\n <span>{{ suggestionText }}</span>\n <p>{{ responseText }}</p>\n </div>\n </ChangeHeight>\n </div>\n <CollapseHeight\n v-if=\"queries.length\"\n :style=\"{\n '--x-collapse-height-transition-duration': `${300 * suggestionsSearch.length}ms`,\n }\"\n data-test=\"ai-overview-collapse-height-suggestions\"\n >\n <div v-show=\"expanded\" data-test=\"ai-overview-suggestions-container\">\n <!-- @slot suggestions-search content -->\n <slot :suggestions-search=\"suggestionsSearch\" :queries=\"queries\">\n <div class=\"x-ai-overview-suggestions\">\n <div v-for=\"{ query } in queries\" :key=\"query\" class=\"x-ai-overview-suggestion\">\n <BaseEventButton\n class=\"x-ai-overview-suggestion-query-btn\"\n :events=\"{ UserAcceptedAQuery: query }\"\n >\n {{ query }}<ArrowRightIcon class=\"x-ai-overview-suggestion-query-btn-icon\" />\n </BaseEventButton>\n <!-- @slot suggestion query result list -->\n <slot name=\"query-results\" :query-results=\"queriesResults[query]\">\n <SlidingPanel v-if=\"queriesResults[query]\" :reset-on-content-change=\"false\">\n <ul class=\"x-ai-overview-suggestion-results\">\n <li\n v-for=\"result in queriesResults[query]\"\n :key=\"result.id\"\n data-test=\"ai-overview-suggestion-result\"\n >\n <!-- @slot (required) result card -->\n <slot name=\"result\" :result=\"result\" />\n </li>\n </ul>\n </SlidingPanel>\n </slot>\n </div>\n </div>\n </slot>\n </div>\n </CollapseHeight>\n <div v-show=\"queries.length\">\n <div\n v-show=\"!expanded\"\n class=\"x-ai-overview-gradient\"\n data-test=\"ai-overview-gradient\"\n @click=\"toggleVisibility\"\n />\n <div class=\"x-ai-overview-toggle-wrapper\">\n <!-- @slot toggle button -->\n <slot name=\"toggle-button\" v-bind=\"{ expanded, toggleVisibility, buttonText }\">\n <button\n class=\"x-ai-overview-toggle-btn\"\n data-test=\"ai-overview-toggle-button\"\n @click=\"toggleVisibility\"\n >\n {{ buttonText }}\n <ChevronDownIcon\n class=\"x-ai-overview-toggle-btn-icon\"\n :class=\"\n expanded\n ? 'x-ai-overview-toggle-btn-icon-expanded'\n : 'x-ai-overview-toggle-btn-icon-collapsed'\n \"\n />\n </button>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport type { AiSuggestionSearch } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { computed, defineComponent, ref, watch } from 'vue'\nimport {\n AIStarIcon,\n ArrowRightIcon,\n BaseEventButton,\n ChangeHeight,\n ChevronDownIcon,\n CollapseHeight,\n Fade,\n SlidingPanel,\n} from '../../../components'\nimport { useGetter, useState } from '../../../composables'\nimport { typing } from '../../../directives'\nimport { aiXModule } from '../x-module'\n\nexport default defineComponent({\n directives: {\n typing,\n },\n xModule: aiXModule.name,\n components: {\n AIStarIcon,\n ArrowRightIcon,\n BaseEventButton,\n ChevronDownIcon,\n CollapseHeight,\n ChangeHeight,\n Fade,\n SlidingPanel,\n },\n props: {\n /**\n * The text displayed when the question ended loading\n *\n * @public\n */\n title: {\n type: String as PropType<string>,\n default: 'Empathy AI Overview',\n },\n /**\n * The text displayed when the question is loading.\n *\n * @public\n */\n titleLoading: {\n type: String as PropType<string>,\n default: 'Generating with Empathy AI',\n },\n /**\n * The text displayed on the toggle button when collapsed.\n *\n * @public\n */\n expandText: {\n type: String as PropType<string>,\n default: 'Show more',\n },\n /**\n * The text displayed on the toggle button when expanded.\n *\n * @public\n */\n collapseText: {\n type: String as PropType<string>,\n default: 'Show less',\n },\n },\n setup(props) {\n const { query } = useGetter('ai')\n const { suggestionText, responseText, queries, suggestionsSearch, suggestionsLoading } =\n useState('ai')\n\n const expanded = ref(false)\n\n const queriesResults = computed(() => {\n return suggestionsSearch.value.reduce(\n (acc: Record<string, AiSuggestionSearch['results']>, { query, results }) => {\n acc[query] = results\n return acc\n },\n {},\n )\n })\n\n const buttonText = computed(() => (expanded.value ? props.collapseText : props.expandText))\n\n function toggleVisibility() {\n expanded.value = !expanded.value\n }\n\n watch(query, () => (expanded.value = false))\n\n return {\n buttonText,\n expanded,\n queries,\n responseText,\n suggestionsLoading,\n queriesResults,\n suggestionsSearch,\n suggestionText,\n toggleVisibility,\n }\n },\n})\n</script>\n<style lang=\"css\">\n.x-ai-overview {\n --color: var(--x-ai-overview-color, #bbc9cf);\n --color-lighter: var(--x-ai-overview-color-lighter, color-mix(in srgb, var(--color) 25%, white));\n --color-lightest: var(\n --x-ai-overview-color-lightest,\n color-mix(in srgb, var(--color) 75%, white)\n );\n\n @apply x-relative x-rounded-3xl x-bg-[var(--color-lighter)];\n}\n\n.x-ai-overview-main {\n @apply x-p-16 x-rounded-lg;\n}\n\n.x-ai-overview-title-loading {\n @apply x-flex x-items-center x-gap-1.5 x-mb-8;\n}\n.x-ai-overview-title-loading-indicator {\n @apply x-size-3 x-animate-pulse x-rounded-full x-bg-[var(--color)];\n}\n.x-ai-overview-title-loading-text {\n @apply x-animate-pulse x-text-xs;\n}\n\n.x-ai-overview-title {\n @apply x-flex x-text-sm x-font-bold x-gap-4 x-items-center x-mb-8;\n}\n.x-ai-overview-title-icon {\n @apply x-icon x-text-[var(--color)];\n}\n\n.x-ai-overview-loading-content {\n @apply x-flex x-w-full x-flex-col x-gap-4 x-animate-pulse;\n}\n.x-ai-overview-loading-content > span:first-child {\n @apply x-h-16 x-w-full x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)];\n}\n.x-ai-overview-loading-content > span:nth-child(2) {\n @apply x-h-16 x-w-3/4 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color-lightest)] x-to-100% x-to-[var(--color)] x-opacity-50;\n}\n.x-ai-overview-loading-content > span:nth-child(3) {\n @apply x-h-16 x-w-11/12 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)];\n}\n.x-ai-overview-loading-content > span:nth-child(4) {\n @apply x-h-16 x-w-1/2 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)] x-opacity-75;\n}\n\n.x-ai-overview-content {\n @apply x-flex x-flex-col x-text-left x-leading-5 x-gap-2;\n}\n.x-ai-overview-content span {\n @apply x-font-medium;\n}\n\n.x-ai-overview-gradient {\n @apply x-cursor-pointer x-content-none x-absolute x-w-full x-h-80 x-bottom-5 x-bg-gradient-to-b x-from-0% x-from-transparent x-to-100% x-to-[var(--color-lighter)];\n}\n\n.x-ai-overview-toggle-wrapper {\n @apply x-flex x-relative x-z-[1];\n}\n.x-ai-overview-toggle-btn {\n @apply x-button x-button-outlined x-rounded-full x-w-full;\n}\n.x-ai-overview-toggle-btn-icon {\n @apply x-icon x-transition-all x-duration-300;\n}\n.x-ai-overview-toggle-btn-icon-expanded {\n @apply x-rotate-0;\n}\n.x-ai-overview-toggle-btn-icon-collapsed {\n @apply x-rotate-180;\n}\n.x-ai-overview-suggestion-query-btn {\n @apply x-button-tight x-mx-16 x-font-bold x-text-gray-900 x-w-fit x-min-h-fit x-flex x-gap-16 x-items-center;\n}\n.x-ai-overview-suggestion-query-btn-icon {\n @apply x-icon-md;\n}\n.x-ai-overview-suggestions {\n @apply x-flex x-flex-col x-gap-16 x-pb-16;\n}\n.x-ai-overview-suggestion {\n @apply x-flex x-flex-col x-gap-8;\n}\n.x-ai-overview-suggestion-results {\n @apply x-flex x-gap-16 x-px-16;\n}\n</style>\n"],"names":["_createElementVNode","_openBlock","_createElementBlock","_createVNode","_withDirectives","_createTextVNode","_toDisplayString","_Fragment","_renderList","_createBlock","_normalizeStyle","_withCtx","_renderSlot","_createCommentVNode","_normalizeProps","_guardReactiveProps","_normalizeClass","_vShow"],"mappings":";;;;;AACO,MAAA,UAAA,GAAA,EAAA,KAAA,EAAM,eAAe,EAAA,CAAA;AACnB,MAAA,UAAA,GAAA,EAAA,KAAA,EAAM,oBAAoB,EAAA,CAAA;;AAFnC,EAAA,GAAA,EAAA,CAAA;AAAA,EAMU,KAAM,EAAA,6BAAA;AAAA,EACN,WAAU,EAAA,2BAAA;;AAEV,MAAA,UAAA,mBAAAA,kBAAA;AAAA,EAAsD,MAAA;AAAA,EAAA,EAAhD,OAAM,uCAAuC,EAAA;AAAA,EAAA,IAAA;AAAA,EAAA,CAAA,CAAA;AAAA;AAAA,CAAA,CAAA;;EAGjD,KAAM,EAAA,kCAAA;AAAA,EACN,WAAU,EAAA,gCAAA;;;AAbtB,EAAA,GAAA,EAAA,CAAA;AAAA,EAgBqB,KAAM,EAAA,qBAAA;AAAA,EAAsB,WAAU,EAAA,mBAAA;;;AAhB3D,EAAA,GAAA,EAAA,CAAA;AAAA,EAuBU,KAAM,EAAA,+BAAA;AAAA,EACN,WAAU,EAAA,6BAAA;;;AAxBpB,EAAA,GAAA,EAAA,CAAA;AAAA,EA4BoB,KAAM,EAAA,uBAAA;AAAA,EAAwB,WAAU,EAAA,qBAAA;;AAa/B,MAAA,UAAA,GAAA,EAAA,WAAA,EAAU,mCAAmC,EAAA,CAAA;AAG3D,MAAA,WAAA,GAAA,EAAA,KAAA,EAAM,2BAA2B,EAAA,CAAA;AAW1B,MAAA,WAAA,GAAA,EAAA,KAAA,EAAM,kCAAkC,EAAA,CAAA;AAwBnD,MAAA,WAAA,GAAA,EAAA,KAAA,EAAM,8BAA8B,EAAA,CAAA;;;;;;;;;;;AA9E7C,EAAA,OAAAC,SAAA,EAAA,EAAAC,kBAAA,CAmGM,OAnGN,UAmGM,EAAA;AAAA,IAlGJF,kBAAA,CA+BM,OA/BN,UA+BM,EAAA;AAAA,MA9BJG,WAAA,CAgBO,eAhBD,EAAA,EAAA,IAAA,EAAK,QAAQ,EAAA,EAAA;AAAA,QAHzB,iBAIQ,MAWO;AAAA,UAVC,IAAA,CAAA,kBAAA,IAAAF,SAAA,EAAA,EADRC,kBAWO,CAAA,MAAA,EAXP,UAWO,EAAA;AAAA,YANL,UAAA;AAAA,YACAE,cAAA,CAAAJ,kBAAA;AAAA,cAIE,MAAA;AAAA,cAJF,UAAA;AAAA,cAIE,IAAA;AAAA,cAAA,GAAA;AAAA;AAAA,aAAA,EAAA;AAAA,cAAA,CAAA,iBAAA,EAAA,EAAA,IAAA,EAHkB,IAAY,CAAA,YAAA,EAAA,KAAA,EAAA,EAAA,EAAA,CAAA;AAAA,aAAA,CAAA;AAKlC,WAAA,CAAA,KAAAC,SAAA,EAAA,EAAAC,kBAAA,CAEO,QAFP,UAEO,EAAA;AAAA,YADLC,WAAA,CAA+C,qBAAnC,EAAA,EAAA,KAAA,EAAM,0BAA0B,EAAA,CAAA;AAAA,YAjBtDE,eAAA;AAAA,cAAAC,eAAA,CAiB4D,IAAK,CAAA,KAAA,CAAA;AAAA,cAAA,CAAA;AAAA;AAAA,aAAA;AAAA,WAAA,CAAA,CAAA;;AAjBjE,QAAA,CAAA,EAAA,CAAA;AAAA;AAAA,OAAA,CAAA;MAoBMH,WAYe,CAAA,uBAAA,EAAA,IAAA,EAAA;AAAA,QAhCrB,iBAqBQ,MAMM;AAAA,UALE,IAAA,CAAA,kBAAA,IAAAF,SAAA,EAAA,EADRC,kBAMM,CAAA,KAAA,EANN,UAMM,EAAA;AAAA,aADJD,SAAA,EAAA,EAAAC,kBAAA;AAAA,cAAqEK,QAAA;AAAA,cAAA,IAAA;AAAA,cA1B/EC,UAAA,CA0B4B,CA1B5B,EAAA,CA0BuB,CAAC,KAAA;uBAAdR,kBAAqE,CAAA,MAAA,EAAA;AAAA,kBAA/C,GAAK,EAAA,CAAA;AAAA,kBAAG,WAAU,EAAA,0BAAA;AAAA,iBAAA,CAAA,CAAA;;;;;AAE1C,WAAA,CAAA,KAAAC,SAAA,EAAA,EAAAC,kBAAA,CAGM,OAHN,UAGM,EAAA;AAAA,YAFJF,kBAAA;AAAA,cAAiC,MAAA;AAAA,cAAA,IAAA;AAAA,cAAAM,eAAA,CAAxB,IAAc,CAAA,cAAA,CAAA;AAAA,cAAA,CAAA;AAAA;AAAA,aAAA;AAAA,YACvBN,kBAAA;AAAA,cAAyB,GAAA;AAAA,cAAA,IAAA;AAAA,cAAAM,eAAA,CAAnB,IAAY,CAAA,YAAA,CAAA;AAAA,cAAA,CAAA;AAAA;AAAA,aAAA;AAAA,WAAA,CAAA,CAAA;;AA9B5B,QAAA,CAAA,EAAA,CAAA;AAAA;AAAA,OAAA,CAAA;;AAmCY,IAAA,IAAA,CAAA,OAAA,CAAQ,uBADhBG,WAqCiB,CAAA,yBAAA,EAAA;AAAA,MAvErB,GAAA,EAAA,CAAA;AAAA,MAoCO,KApCP,EAAAC,cAAA,CAAA;AAAA,QAAA,yCAAA,EAAA,CAAA,EAAA,GAAA,GAoC4E,uBAAkB,MAAM,CAAA,EAAA,CAAA;AAAA,OAAA,CAAA;MAG9F,WAAU,EAAA,yCAAA;AAAA,KAAA,EAAA;AAvChB,MAAA,OAAA,EAAAC,OAAA,CAyCM,MA6BM;AAAA,QA7BNP,cAAA,CAAAJ,kBAAA;AAAA,UA6BM,KAAA;AAAA,UA7BN,UAAA;AAAA,UA6BM;AAAA,YA3BJY,UA0BO,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAAA;AAAA,cA1BA,iBAAoB,EAAA,IAAA,CAAA,iBAAA;AAAA,cAAoB,OAAS,EAAA,IAAA,CAAA,OAAA;AAAA,aAAA,EAAxD,MA0BO;AAAA,cAzBLZ,kBAAA,CAwBM,OAxBN,WAwBM,EAAA;AAAA,iBAvBJC,SAAA,CAAA,IAAA,CAAA,EAAAC,kBAAA;AAAA,kBAsBMK,QAAA;AAAA,kBAAA,IAAA;AAAA,kBAnElBC,UAAA,CA6CqC,IA7CrC,CAAA,OAAA,EAAA,CAAA,EA6C0B,KAAK,EAAA,KAAA;wCAAnBN,kBAsBM,CAAA,KAAA,EAAA;AAAA,sBAtB6B,GAAK,EAAA,KAAA;AAAA,sBAAO,KAAM,EAAA,0BAAA;AAAA,qBAAA,EAAA;sBACnDC,WAKkB,CAAA,0BAAA,EAAA;AAAA,wBAJhB,KAAM,EAAA,oCAAA;AAAA,wBACL,MAAA,EAAM,sBAAwB,KAAK,EAAA;AAAA,uBAAA,EAAA;AAhDpD,wBAAA,OAAA,EAAAQ,OAAA,CAkDgB,MAAW;AAAA,0BAlD3BN,eAAA;AAAA,4BAAAC,eAAA,CAkDmB,KAAK,CAAA;AAAA,4BAAA,CAAA;AAAA;AAAA,2BAAA;AAAA,0BAAGH,WAAA,CAAkE,yBAAlD,EAAA,EAAA,KAAA,EAAM,yCAAyC,EAAA,CAAA;AAAA,yBAAA,CAAA;AAlD1F,wBAAA,CAAA,EAAA,CAAA;AAAA;AAAA,uBAAA,EAAA,IAAA,EAAA,CAAA,QAAA,CAAA,CAAA;sBAqDcS,UAaO,CAAA,IAAA,CAAA,MAAA,EAAA,eAAA,EAAA;AAAA,wBAbqB,YAAA,EAAe,oBAAe,KAAK,CAAA;AAAA,uBAAA,EAA/D,MAaO;AAAA,wBAZe,IAAA,CAAA,cAAA,CAAe,KAAK,CAAxC,IAAAX,SAAA,EAAA,EAAAQ,WAAA;AAAA,0BAWe,uBAAA;AAAA,0BAAA;AAAA,4BAjE/B,GAAA,EAAA,CAAA;AAAA,4BAsD4D,yBAAyB,EAAA,KAAA;AAAA,2BAAA;;AAtDrF,4BAAA,OAAA,EAAAE,OAAA,CAuDkB,MASK;AAAA,8BATLX,kBAAA,CASK,MATL,WASK,EAAA;AAAA,iCARHC,SAAA,CAAA,IAAA,CAAA,EAAAC,kBAAA;AAAA,kCAOKK,QAAA;AAAA,kCAAA,IAAA;AAAA,kCA/DzBC,UAyDuC,CAAA,IAAA,CAAA,cAAA,CAAe,KAAK,CAAA,EAzD3D,CAyD6B,MAAM,KAAA;wDADfN,kBAOK,CAAA,IAAA,EAAA;AAAA,sCALF,KAAK,MAAO,CAAA,EAAA;AAAA,sCACb,WAAU,EAAA,+BAAA;AAAA,qCAAA,EAAA;AAGV,sCAAAU,UAAA,CAAuC,yBAAlB,MAAc,EAAA,CAAA;AAAA,qCAAA,CAAA,CAAA;;;;;;;AA9DzD,4BAAA,CAAA,EAAA,CAAA;AAAA;AAAA,2BAAA;;;AAAA,yBAAA,IAAAC,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA;AAAA,uBAAA,CAAA;;;;;;;;;;;;kBAyCmB,IAAQ,CAAA,QAAA,CAAA;AAAA,SAAA,CAAA;;AAzC3B,MAAA,CAAA,EAAA,CAAA;AAAA;AAAA,KAAA,EAAA,CAAA,EAAA,CAAA,OAAA,CAAA,CAAA,IAAAA,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA;AAAA,IAwEIT,cAAA,CAAAJ,kBAAA;AAAA,MA2BM,KAAA;AAAA,MAAA,IAAA;AAAA,MAAA;AAAA,QA1BJI,cAAA,CAAAJ,kBAAA;AAAA,UAKE,KAAA;AAAA,UAAA;AAAA,YAHA,KAAM,EAAA,wBAAA;AAAA,YACN,WAAU,EAAA,sBAAA;AAAA,YACT,SAAK,MAAE,CAAA,CAAA,CAAA,KAAA,MAAA,CAAA,CAAA,CAAA,GAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,gBAAA,IAAA,IAAA,CAAA,gBAAA,CAAA,GAAA,IAAA,CAAA,CAAA;AAAA,WAAA;;;;;mBAHC,IAAQ,CAAA,QAAA,CAAA;AAAA,SAAA,CAAA;AAKnB,QAAAA,kBAAA,CAmBM,OAnBN,WAmBM,EAAA;AAAA,UAjBJY,UAAA,CAgBO,8BAjGfE,cAiF6C,CAAAC,kBAAA,CAAA,EAAA,QAAA,EAAA,IAAA,CAAA,QAAA,EAAQ,kBAAE,IAAgB,CAAA,gBAAA,EAAA,UAAA,EAAE,IAAU,CAAA,UAAA,EAAA,CAAA,CAAA,EAA3E,MAgBO;AAAA,YAfLf,kBAcS,CAAA,QAAA,EAAA;AAAA,cAbP,KAAM,EAAA,0BAAA;AAAA,cACN,WAAU,EAAA,2BAAA;AAAA,cACT,SAAK,MAAE,CAAA,CAAA,CAAA,KAAA,MAAA,CAAA,CAAA,CAAA,GAAA,CAAA,GAAA,IAAA,KAAA,IAAA,CAAA,gBAAA,IAAA,IAAA,CAAA,gBAAA,CAAA,GAAA,IAAA,CAAA,CAAA;AAAA,aAAA,EAAA;AArFpB,cAAAK,eAAA;AAAA,gBAAAC,eAAA,CAuFe,eAAU,CAAG,GAAA,GAAA;AAAA,gBAChB,CAAA;AAAA;AAAA,eAAA;AAAA,cAOEH,WAAA,CAAA,0BAAA,EAAA;AAAA,gBANA,KAzFd,EAAAa,cAAA,CAAA;AAAA,kBAyFoB,+BAAA;AAAA,kBACmB,IAAA,CAAA,QAAA,GAAA,wCAAA,GAAA,yCAAA;;;;;;;;;;AAlBtB,MAAA,CAAAC,KAAA,EAAA,IAAA,CAAA,OAAA,CAAQ,MAAM,CAAA;AAAA,KAAA,CAAA;;;;;;;"}
package/js/x-modules/ai/components/ai-overview.vue2.js CHANGED
@@ -1,4 +1,4 @@
1
- import { defineComponent, ref, watch } from 'vue';
1
+ import { defineComponent, ref, computed, watch } from 'vue';
2
2
  import '../../../components/animations/animate-clip-path/animate-clip-path.style.scss.js';
3
3
  import '../../../components/animations/animate-scale/animate-scale.style.scss.js';
4
4
  import '../../../components/animations/animate-translate/animate-translate.style.scss.js';
@@ -144,30 +144,49 @@ var _sfc_main = defineComponent({
144
144
  default: 'Generating with Empathy AI',
145
145
  },
146
146
  /**
147
- * The text displayed on the expand button.
147
+ * The text displayed on the toggle button when collapsed.
148
148
  *
149
149
  * @public
150
150
  */
151
- buttonText: {
151
+ expandText: {
152
152
  type: String,
153
153
  default: 'Show more',
154
154
  },
155
+ /**
156
+ * The text displayed on the toggle button when expanded.
157
+ *
158
+ * @public
159
+ */
160
+ collapseText: {
161
+ type: String,
162
+ default: 'Show less',
163
+ },
155
164
  },
156
- setup() {
165
+ setup(props) {
157
166
  const { query } = useGetter('ai');
158
- const { suggestionText, responseText, suggestionsSearch, suggestionsLoading } = useState('ai');
167
+ const { suggestionText, responseText, queries, suggestionsSearch, suggestionsLoading } = useState('ai');
159
168
  const expanded = ref(false);
160
- function open() {
161
- expanded.value = true;
169
+ const queriesResults = computed(() => {
170
+ return suggestionsSearch.value.reduce((acc, { query, results }) => {
171
+ acc[query] = results;
172
+ return acc;
173
+ }, {});
174
+ });
175
+ const buttonText = computed(() => (expanded.value ? props.collapseText : props.expandText));
176
+ function toggleVisibility() {
177
+ expanded.value = !expanded.value;
162
178
  }
163
179
  watch(query, () => (expanded.value = false));
164
180
  return {
165
- open,
181
+ buttonText,
166
182
  expanded,
183
+ queries,
167
184
  responseText,
168
- suggestionText,
169
- suggestionsSearch,
170
185
  suggestionsLoading,
186
+ queriesResults,
187
+ suggestionsSearch,
188
+ suggestionText,
189
+ toggleVisibility,
171
190
  };
172
191
  },
173
192
  });
package/js/x-modules/ai/components/ai-overview.vue2.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ai-overview.vue2.js","sources":["../../../../../src/x-modules/ai/components/ai-overview.vue"],"sourcesContent":["<template>\n <div class=\"x-ai-overview\">\n <div class=\"x-ai-overview-main\">\n <Fade mode=\"out-in\">\n <span\n v-if=\"suggestionsLoading\"\n class=\"x-ai-overview-title-loading\"\n data-test=\"ai-overview-title-loading\"\n >\n <span class=\"x-ai-overview-title-loading-indicator\" />\n <span\n v-typing=\"{ text: titleLoading, speed: 50 }\"\n class=\"x-ai-overview-title-loading-text\"\n data-test=\"ai-overview-title-loading-text\"\n />\n </span>\n <span v-else class=\"x-ai-overview-title\" data-test=\"ai-overview-title\">\n <AIStarIcon class=\"x-ai-overview-title-icon\" />{{ title }}\n </span>\n </Fade>\n <ChangeHeight>\n <div\n v-if=\"suggestionsLoading\"\n class=\"x-ai-overview-loading-content\"\n data-test=\"ai-overview-loading-content\"\n >\n <span v-for=\"i in 4\" :key=\"i\" data-test=\"ai-overview-loading-item\" />\n </div>\n <div v-else class=\"x-ai-overview-content\" data-test=\"ai-overview-content\">\n <span>{{ suggestionText }}</span>\n <p>{{ responseText }}</p>\n </div>\n </ChangeHeight>\n </div>\n <CollapseHeight\n v-if=\"suggestionsSearch.length\"\n :style=\"{\n '--x-collapse-height-transition-duration': `${300 * suggestionsSearch.length}ms`,\n }\"\n data-test=\"ai-overview-collapse-height-suggestions\"\n >\n <div v-show=\"expanded\" data-test=\"ai-overview-suggestions-container\">\n <!-- @slot suggestions-search content -->\n <slot :suggestions-search=\"suggestionsSearch\">\n <div class=\"x-ai-overview-suggestions\">\n <div\n v-for=\"{ query, results } in suggestionsSearch\"\n :key=\"query\"\n class=\"x-ai-overview-suggestion\"\n >\n <BaseEventButton\n class=\"x-ai-overview-suggestion-query-btn\"\n :events=\"{ UserAcceptedAQuery: query }\"\n >\n {{ query }}<ArrowRightIcon class=\"x-ai-overview-suggestion-query-btn-icon\" />\n </BaseEventButton>\n <SlidingPanel :reset-on-content-change=\"false\">\n <ul class=\"x-ai-overview-suggestion-results\">\n <li\n v-for=\"result in results\"\n :key=\"result.id\"\n data-test=\"ai-overview-suggestion-result\"\n >\n <!-- @slot (required) result card -->\n <slot name=\"result\" :result=\"result\" />\n </li>\n </ul>\n </SlidingPanel>\n </div>\n </div>\n </slot>\n </div>\n </CollapseHeight>\n <div v-show=\"suggestionsSearch.length && !expanded\">\n <div class=\"x-ai-overview-gradient\" data-test=\"ai-overview-gradient\" @click=\"open\" />\n <div class=\"x-ai-overview-expand-wrapper\">\n <button\n class=\"x-ai-overview-expand-btn\"\n data-test=\"ai-overview-expand-button\"\n @click=\"open\"\n >\n {{ buttonText }}\n <ChevronDownIcon class=\"x-ai-overview-expand-btn-icon\" />\n </button>\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport { defineComponent, ref, watch } from 'vue'\nimport {\n AIStarIcon,\n ArrowRightIcon,\n BaseEventButton,\n ChangeHeight,\n ChevronDownIcon,\n CollapseHeight,\n Fade,\n SlidingPanel,\n} from '../../../components'\nimport { useGetter, useState } from '../../../composables'\nimport { typing } from '../../../directives'\nimport { aiXModule } from '../x-module'\n\nexport default defineComponent({\n directives: {\n typing,\n },\n xModule: aiXModule.name,\n components: {\n AIStarIcon,\n ArrowRightIcon,\n BaseEventButton,\n ChevronDownIcon,\n CollapseHeight,\n ChangeHeight,\n Fade,\n SlidingPanel,\n },\n props: {\n /**\n * The text displayed when the question ended loading\n *\n * @public\n */\n title: {\n type: String as PropType<string>,\n default: 'Empathy AI Overview',\n },\n /**\n * The text displayed when the question is loading.\n *\n * @public\n */\n titleLoading: {\n type: String as PropType<string>,\n default: 'Generating with Empathy AI',\n },\n /**\n * The text displayed on the expand button.\n *\n * @public\n */\n buttonText: {\n type: String as PropType<string>,\n default: 'Show more',\n },\n },\n setup() {\n const { query } = useGetter('ai')\n const { suggestionText, responseText, suggestionsSearch, suggestionsLoading } = useState('ai')\n\n const expanded = ref(false)\n\n function open() {\n expanded.value = true\n }\n\n watch(query, () => (expanded.value = false))\n\n return {\n open,\n expanded,\n responseText,\n suggestionText,\n suggestionsSearch,\n suggestionsLoading,\n }\n },\n})\n</script>\n<style lang=\"css\">\n.x-ai-overview {\n --color: var(--x-ai-overview-color, #bbc9cf);\n --color-lighter: var(--x-ai-overview-color-lighter, color-mix(in srgb, var(--color) 25%, white));\n --color-lightest: var(\n --x-ai-overview-color-lightest,\n color-mix(in srgb, var(--color) 75%, white)\n );\n\n @apply x-relative x-rounded-3xl x-bg-[var(--color-lighter)];\n}\n\n.x-ai-overview-main {\n @apply x-p-16 x-rounded-lg;\n}\n\n.x-ai-overview-title-loading {\n @apply x-flex x-items-center x-gap-1.5 x-mb-8;\n}\n.x-ai-overview-title-loading-indicator {\n @apply x-size-3 x-animate-pulse x-rounded-full x-bg-[var(--color)];\n}\n.x-ai-overview-title-loading-text {\n @apply x-animate-pulse x-text-xs;\n}\n\n.x-ai-overview-title {\n @apply x-flex x-text-sm x-font-bold x-gap-4 x-items-center x-mb-8;\n}\n.x-ai-overview-title-icon {\n @apply x-icon x-text-[var(--color)];\n}\n\n.x-ai-overview-loading-content {\n @apply x-flex x-w-full x-flex-col x-gap-4 x-animate-pulse;\n}\n.x-ai-overview-loading-content > span:first-child {\n @apply x-h-16 x-w-full x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)];\n}\n.x-ai-overview-loading-content > span:nth-child(2) {\n @apply x-h-16 x-w-3/4 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color-lightest)] x-to-100% x-to-[var(--color)] x-opacity-50;\n}\n.x-ai-overview-loading-content > span:nth-child(3) {\n @apply x-h-16 x-w-11/12 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)];\n}\n.x-ai-overview-loading-content > span:nth-child(4) {\n @apply x-h-16 x-w-1/2 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)] x-opacity-75;\n}\n\n.x-ai-overview-content {\n @apply x-flex x-flex-col x-text-left x-leading-5 x-gap-2;\n}\n.x-ai-overview-content span {\n @apply x-font-medium;\n}\n\n.x-ai-overview-gradient {\n @apply x-cursor-pointer x-content-none x-absolute x-w-full x-h-80 x-bottom-5 x-bg-gradient-to-b x-from-0% x-from-transparent x-to-100% x-to-[var(--color-lighter)];\n}\n\n.x-ai-overview-expand-wrapper {\n @apply x-flex x-relative x-z-[1];\n}\n.x-ai-overview-expand-btn {\n @apply x-button x-button-outlined x-rounded-full x-w-full;\n}\n.x-ai-overview-expand-btn-icon {\n @apply x-icon;\n}\n.x-ai-overview-suggestion-query-btn {\n @apply x-button-tight x-mx-16 x-font-bold x-text-gray-900 x-w-fit x-min-h-fit x-flex x-gap-16 x-items-center;\n}\n.x-ai-overview-suggestion-query-btn-icon {\n @apply x-icon-md;\n}\n.x-ai-overview-suggestions {\n @apply x-flex x-flex-col x-gap-16 x-pb-16;\n}\n.x-ai-overview-suggestion {\n @apply x-flex x-flex-col x-gap-8;\n}\n.x-ai-overview-suggestion-results {\n @apply x-flex x-gap-16 x-px-16;\n}\n</style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0GA,gBAAe,eAAe,CAAC;AAC7B,IAAA,UAAU,EAAE;QACV,MAAM;AACP,KAAA;IACD,OAAO,EAAE,SAAS,CAAC,IAAI;AACvB,IAAA,UAAU,EAAE;QACV,UAAU;QACV,cAAc;QACd,eAAe;QACf,eAAe;QACf,cAAc;QACd,YAAY;QACZ,IAAI;QACJ,YAAY;AACb,KAAA;AACD,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,KAAK,EAAE;AACL,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,OAAO,EAAE,qBAAqB;AAC/B,SAAA;AACD;;;;AAIE;AACF,QAAA,YAAY,EAAE;AACZ,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,OAAO,EAAE,4BAA4B;AACtC,SAAA;AACD;;;;AAIE;AACF,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,OAAO,EAAE,WAAW;AACrB,SAAA;AACF,KAAA;IACD,KAAK,GAAA;QACH,MAAM,EAAE,KAAI,EAAI,GAAE,SAAS,CAAC,IAAI,CAAA,CAAA;AAChC,QAAA,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,iBAAiB,EAAE,oBAAqB,GAAE,QAAQ,CAAC,IAAI,CAAA,CAAA;AAE7F,QAAA,MAAM,QAAS,GAAE,GAAG,CAAC,KAAK,CAAA,CAAA;AAE1B,QAAA,SAAS,IAAI,GAAA;AACX,YAAA,QAAQ,CAAC,KAAI,GAAI,IAAG,CAAA;SACtB;AAEA,QAAA,KAAK,CAAC,KAAK,EAAE,OAAO,QAAQ,CAAC,KAAI,GAAI,KAAK,CAAC,CAAA,CAAA;QAE3C,OAAO;YACL,IAAI;YACJ,QAAQ;YACR,YAAY;YACZ,cAAc;YACd,iBAAiB;YACjB,kBAAkB;SACpB,CAAA;KACD;AACF,CAAA,CAAA;;;;"}
1
+ {"version":3,"file":"ai-overview.vue2.js","sources":["../../../../../src/x-modules/ai/components/ai-overview.vue"],"sourcesContent":["<template>\n <div class=\"x-ai-overview\">\n <div class=\"x-ai-overview-main\">\n <Fade mode=\"out-in\">\n <span\n v-if=\"suggestionsLoading\"\n class=\"x-ai-overview-title-loading\"\n data-test=\"ai-overview-title-loading\"\n >\n <span class=\"x-ai-overview-title-loading-indicator\" />\n <span\n v-typing=\"{ text: titleLoading, speed: 50 }\"\n class=\"x-ai-overview-title-loading-text\"\n data-test=\"ai-overview-title-loading-text\"\n />\n </span>\n <span v-else class=\"x-ai-overview-title\" data-test=\"ai-overview-title\">\n <AIStarIcon class=\"x-ai-overview-title-icon\" />{{ title }}\n </span>\n </Fade>\n <ChangeHeight>\n <div\n v-if=\"suggestionsLoading\"\n class=\"x-ai-overview-loading-content\"\n data-test=\"ai-overview-loading-content\"\n >\n <span v-for=\"i in 4\" :key=\"i\" data-test=\"ai-overview-loading-item\" />\n </div>\n <div v-else class=\"x-ai-overview-content\" data-test=\"ai-overview-content\">\n <span>{{ suggestionText }}</span>\n <p>{{ responseText }}</p>\n </div>\n </ChangeHeight>\n </div>\n <CollapseHeight\n v-if=\"queries.length\"\n :style=\"{\n '--x-collapse-height-transition-duration': `${300 * suggestionsSearch.length}ms`,\n }\"\n data-test=\"ai-overview-collapse-height-suggestions\"\n >\n <div v-show=\"expanded\" data-test=\"ai-overview-suggestions-container\">\n <!-- @slot suggestions-search content -->\n <slot :suggestions-search=\"suggestionsSearch\" :queries=\"queries\">\n <div class=\"x-ai-overview-suggestions\">\n <div v-for=\"{ query } in queries\" :key=\"query\" class=\"x-ai-overview-suggestion\">\n <BaseEventButton\n class=\"x-ai-overview-suggestion-query-btn\"\n :events=\"{ UserAcceptedAQuery: query }\"\n >\n {{ query }}<ArrowRightIcon class=\"x-ai-overview-suggestion-query-btn-icon\" />\n </BaseEventButton>\n <!-- @slot suggestion query result list -->\n <slot name=\"query-results\" :query-results=\"queriesResults[query]\">\n <SlidingPanel v-if=\"queriesResults[query]\" :reset-on-content-change=\"false\">\n <ul class=\"x-ai-overview-suggestion-results\">\n <li\n v-for=\"result in queriesResults[query]\"\n :key=\"result.id\"\n data-test=\"ai-overview-suggestion-result\"\n >\n <!-- @slot (required) result card -->\n <slot name=\"result\" :result=\"result\" />\n </li>\n </ul>\n </SlidingPanel>\n </slot>\n </div>\n </div>\n </slot>\n </div>\n </CollapseHeight>\n <div v-show=\"queries.length\">\n <div\n v-show=\"!expanded\"\n class=\"x-ai-overview-gradient\"\n data-test=\"ai-overview-gradient\"\n @click=\"toggleVisibility\"\n />\n <div class=\"x-ai-overview-toggle-wrapper\">\n <!-- @slot toggle button -->\n <slot name=\"toggle-button\" v-bind=\"{ expanded, toggleVisibility, buttonText }\">\n <button\n class=\"x-ai-overview-toggle-btn\"\n data-test=\"ai-overview-toggle-button\"\n @click=\"toggleVisibility\"\n >\n {{ buttonText }}\n <ChevronDownIcon\n class=\"x-ai-overview-toggle-btn-icon\"\n :class=\"\n expanded\n ? 'x-ai-overview-toggle-btn-icon-expanded'\n : 'x-ai-overview-toggle-btn-icon-collapsed'\n \"\n />\n </button>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\">\nimport type { AiSuggestionSearch } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { computed, defineComponent, ref, watch } from 'vue'\nimport {\n AIStarIcon,\n ArrowRightIcon,\n BaseEventButton,\n ChangeHeight,\n ChevronDownIcon,\n CollapseHeight,\n Fade,\n SlidingPanel,\n} from '../../../components'\nimport { useGetter, useState } from '../../../composables'\nimport { typing } from '../../../directives'\nimport { aiXModule } from '../x-module'\n\nexport default defineComponent({\n directives: {\n typing,\n },\n xModule: aiXModule.name,\n components: {\n AIStarIcon,\n ArrowRightIcon,\n BaseEventButton,\n ChevronDownIcon,\n CollapseHeight,\n ChangeHeight,\n Fade,\n SlidingPanel,\n },\n props: {\n /**\n * The text displayed when the question ended loading\n *\n * @public\n */\n title: {\n type: String as PropType<string>,\n default: 'Empathy AI Overview',\n },\n /**\n * The text displayed when the question is loading.\n *\n * @public\n */\n titleLoading: {\n type: String as PropType<string>,\n default: 'Generating with Empathy AI',\n },\n /**\n * The text displayed on the toggle button when collapsed.\n *\n * @public\n */\n expandText: {\n type: String as PropType<string>,\n default: 'Show more',\n },\n /**\n * The text displayed on the toggle button when expanded.\n *\n * @public\n */\n collapseText: {\n type: String as PropType<string>,\n default: 'Show less',\n },\n },\n setup(props) {\n const { query } = useGetter('ai')\n const { suggestionText, responseText, queries, suggestionsSearch, suggestionsLoading } =\n useState('ai')\n\n const expanded = ref(false)\n\n const queriesResults = computed(() => {\n return suggestionsSearch.value.reduce(\n (acc: Record<string, AiSuggestionSearch['results']>, { query, results }) => {\n acc[query] = results\n return acc\n },\n {},\n )\n })\n\n const buttonText = computed(() => (expanded.value ? props.collapseText : props.expandText))\n\n function toggleVisibility() {\n expanded.value = !expanded.value\n }\n\n watch(query, () => (expanded.value = false))\n\n return {\n buttonText,\n expanded,\n queries,\n responseText,\n suggestionsLoading,\n queriesResults,\n suggestionsSearch,\n suggestionText,\n toggleVisibility,\n }\n },\n})\n</script>\n<style lang=\"css\">\n.x-ai-overview {\n --color: var(--x-ai-overview-color, #bbc9cf);\n --color-lighter: var(--x-ai-overview-color-lighter, color-mix(in srgb, var(--color) 25%, white));\n --color-lightest: var(\n --x-ai-overview-color-lightest,\n color-mix(in srgb, var(--color) 75%, white)\n );\n\n @apply x-relative x-rounded-3xl x-bg-[var(--color-lighter)];\n}\n\n.x-ai-overview-main {\n @apply x-p-16 x-rounded-lg;\n}\n\n.x-ai-overview-title-loading {\n @apply x-flex x-items-center x-gap-1.5 x-mb-8;\n}\n.x-ai-overview-title-loading-indicator {\n @apply x-size-3 x-animate-pulse x-rounded-full x-bg-[var(--color)];\n}\n.x-ai-overview-title-loading-text {\n @apply x-animate-pulse x-text-xs;\n}\n\n.x-ai-overview-title {\n @apply x-flex x-text-sm x-font-bold x-gap-4 x-items-center x-mb-8;\n}\n.x-ai-overview-title-icon {\n @apply x-icon x-text-[var(--color)];\n}\n\n.x-ai-overview-loading-content {\n @apply x-flex x-w-full x-flex-col x-gap-4 x-animate-pulse;\n}\n.x-ai-overview-loading-content > span:first-child {\n @apply x-h-16 x-w-full x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)];\n}\n.x-ai-overview-loading-content > span:nth-child(2) {\n @apply x-h-16 x-w-3/4 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color-lightest)] x-to-100% x-to-[var(--color)] x-opacity-50;\n}\n.x-ai-overview-loading-content > span:nth-child(3) {\n @apply x-h-16 x-w-11/12 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)];\n}\n.x-ai-overview-loading-content > span:nth-child(4) {\n @apply x-h-16 x-w-1/2 x-rounded-full x-bg-gradient-to-r x-from-0% x-from-[var(--color)] x-to-100% x-to-[var(--color-lightest)] x-opacity-75;\n}\n\n.x-ai-overview-content {\n @apply x-flex x-flex-col x-text-left x-leading-5 x-gap-2;\n}\n.x-ai-overview-content span {\n @apply x-font-medium;\n}\n\n.x-ai-overview-gradient {\n @apply x-cursor-pointer x-content-none x-absolute x-w-full x-h-80 x-bottom-5 x-bg-gradient-to-b x-from-0% x-from-transparent x-to-100% x-to-[var(--color-lighter)];\n}\n\n.x-ai-overview-toggle-wrapper {\n @apply x-flex x-relative x-z-[1];\n}\n.x-ai-overview-toggle-btn {\n @apply x-button x-button-outlined x-rounded-full x-w-full;\n}\n.x-ai-overview-toggle-btn-icon {\n @apply x-icon x-transition-all x-duration-300;\n}\n.x-ai-overview-toggle-btn-icon-expanded {\n @apply x-rotate-0;\n}\n.x-ai-overview-toggle-btn-icon-collapsed {\n @apply x-rotate-180;\n}\n.x-ai-overview-suggestion-query-btn {\n @apply x-button-tight x-mx-16 x-font-bold x-text-gray-900 x-w-fit x-min-h-fit x-flex x-gap-16 x-items-center;\n}\n.x-ai-overview-suggestion-query-btn-icon {\n @apply x-icon-md;\n}\n.x-ai-overview-suggestions {\n @apply x-flex x-flex-col x-gap-16 x-pb-16;\n}\n.x-ai-overview-suggestion {\n @apply x-flex x-flex-col x-gap-8;\n}\n.x-ai-overview-suggestion-results {\n @apply x-flex x-gap-16 x-px-16;\n}\n</style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyHA,gBAAe,eAAe,CAAC;AAC7B,IAAA,UAAU,EAAE;QACV,MAAM;AACP,KAAA;IACD,OAAO,EAAE,SAAS,CAAC,IAAI;AACvB,IAAA,UAAU,EAAE;QACV,UAAU;QACV,cAAc;QACd,eAAe;QACf,eAAe;QACf,cAAc;QACd,YAAY;QACZ,IAAI;QACJ,YAAY;AACb,KAAA;AACD,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,KAAK,EAAE;AACL,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,OAAO,EAAE,qBAAqB;AAC/B,SAAA;AACD;;;;AAIE;AACF,QAAA,YAAY,EAAE;AACZ,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,OAAO,EAAE,4BAA4B;AACtC,SAAA;AACD;;;;AAIE;AACF,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,OAAO,EAAE,WAAW;AACrB,SAAA;AACD;;;;AAIE;AACF,QAAA,YAAY,EAAE;AACZ,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,OAAO,EAAE,WAAW;AACrB,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;QACT,MAAM,EAAE,KAAI,EAAI,GAAE,SAAS,CAAC,IAAI,CAAA,CAAA;AAChC,QAAA,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,OAAO,EAAE,iBAAiB,EAAE,oBAAqB,GACrF,QAAQ,CAAC,IAAI,CAAA,CAAA;AAEf,QAAA,MAAM,QAAS,GAAE,GAAG,CAAC,KAAK,CAAA,CAAA;AAE1B,QAAA,MAAM,cAAe,GAAE,QAAQ,CAAC,MAAM;AACpC,YAAA,OAAO,iBAAiB,CAAC,KAAK,CAAC,MAAM,CACnC,CAAC,GAAkD,EAAE,EAAE,KAAK,EAAE,OAAM,EAAG,KAAK;AAC1E,gBAAA,GAAG,CAAC,KAAK,CAAA,GAAI,OAAM,CAAA;AACnB,gBAAA,OAAO,GAAE,CAAA;aACV,EACD,EAAE,CACJ,CAAA;AACF,SAAC,CAAA,CAAA;QAED,MAAM,UAAW,GAAE,QAAQ,CAAC,OAAO,QAAQ,CAAC,KAAM,GAAE,KAAK,CAAC,YAAW,GAAI,KAAK,CAAC,UAAU,CAAC,CAAA,CAAA;AAE1F,QAAA,SAAS,gBAAgB,GAAA;AACvB,YAAA,QAAQ,CAAC,KAAI,GAAI,CAAC,QAAQ,CAAC,KAAI,CAAA;SACjC;AAEA,QAAA,KAAK,CAAC,KAAK,EAAE,OAAO,QAAQ,CAAC,KAAI,GAAI,KAAK,CAAC,CAAA,CAAA;QAE3C,OAAO;YACL,UAAU;YACV,QAAQ;YACR,OAAO;YACP,YAAY;YACZ,kBAAkB;YAClB,cAAc;YACd,iBAAiB;YACjB,cAAc;YACd,gBAAgB;SAClB,CAAA;KACD;AACF,CAAA,CAAA;;;;"}
package/js/x-modules/ai/components/ai-overview.vue3.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import injectCss from '../../../../tools/inject-css.js';
2
2
 
3
- var css = ".x-ai-overview{--color:var(--x-ai-overview-color,#bbc9cf);--color-lighter:var(--x-ai-overview-color-lighter,color-mix(in srgb,var(--color) 25%,#fff));--color-lightest:var(\n --x-ai-overview-color-lightest,color-mix(in srgb,var(--color) 75%,#fff)\n );background-color:var(--color-lighter);border-radius:1.5rem;position:relative}.x-ai-overview-main{border-radius:.5rem;padding:16px}.x-ai-overview-title-loading{align-items:center;display:flex;gap:.375rem;margin-bottom:8px}.x-ai-overview-title-loading-indicator{animation:x-pulse 2s cubic-bezier(.4,0,.6,1) infinite;background-color:var(--color);border-radius:9999px;height:.75rem;width:.75rem}.x-ai-overview-title-loading-text{animation:x-pulse 2s cubic-bezier(.4,0,.6,1) infinite;font-size:12px}.x-ai-overview-title{align-items:center;display:flex;font-size:14px;font-weight:700;gap:4px;margin-bottom:8px}.x-ai-overview-title-icon{vector-effect:non-scaling-stroke;--enableIconOffset:var(--OFF);--fontSize:14px;align-items:center;aspect-ratio:1/1;color:var(--color);display:flex;flex:0 0 auto;font-family:font-awesome;font-size:var(--enableIconOffset) var(--fontSize);height:16px;justify-content:center;margin-top:var(--enableIconOffset,calc(var(--iconVerticalOffset)*-1));transform:var(--enableIconOffset,translateY(var(--iconVerticalOffset,0)));width:auto}.x-ai-overview-loading-content{display:flex;width:100%}@keyframes x-pulse{50%{opacity:.5}}.x-ai-overview-loading-content{animation:x-pulse 2s cubic-bezier(.4,0,.6,1) infinite;flex-direction:column;gap:4px}.x-ai-overview-loading-content>span:first-child{--tw-gradient-from:var(--color) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);--tw-gradient-from-position:0%;--tw-gradient-to:var(--color-lightest) var(--tw-gradient-to-position);--tw-gradient-to-position:100%;background-image:linear-gradient(to right,var(--tw-gradient-stops));border-radius:9999px;height:16px;width:100%}.x-ai-overview-loading-content>span:nth-child(2){--tw-gradient-from:var(--color-lightest) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);--tw-gradient-from-position:0%;--tw-gradient-to:var(--color) var(--tw-gradient-to-position);--tw-gradient-to-position:100%;background-image:linear-gradient(to right,var(--tw-gradient-stops));border-radius:9999px;height:16px;opacity:.5;width:75%}.x-ai-overview-loading-content>span:nth-child(3){width:91.666667%}.x-ai-overview-loading-content>span:nth-child(3),.x-ai-overview-loading-content>span:nth-child(4){--tw-gradient-from:var(--color) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);--tw-gradient-from-position:0%;--tw-gradient-to:var(--color-lightest) var(--tw-gradient-to-position);--tw-gradient-to-position:100%;background-image:linear-gradient(to right,var(--tw-gradient-stops));border-radius:9999px;height:16px}.x-ai-overview-loading-content>span:nth-child(4){opacity:.75;width:50%}.x-ai-overview-content{display:flex;flex-direction:column;gap:2px;line-height:1.25rem;text-align:left}.x-ai-overview-content span{font-weight:500}.x-ai-overview-gradient{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);--tw-gradient-from-position:0%;--tw-gradient-to:var(--color-lighter) var(--tw-gradient-to-position);--tw-gradient-to-position:100%;--tw-content:none;background-image:linear-gradient(to bottom,var(--tw-gradient-stops));bottom:1.25rem;content:var(--tw-content);cursor:pointer;height:80px;position:absolute;width:100%}.x-ai-overview-expand-wrapper{display:flex;position:relative;z-index:1}.x-ai-overview-expand-btn{align-content:center;align-items:center;background-color:var(--button-color-50,#283034);border-style:solid;border-width:1px;box-sizing:border-box;color:#fff;cursor:pointer;display:flex;flex-flow:row nowrap;font-family:Inter,sans-serif;font-weight:700;justify-content:center;letter-spacing:0;line-height:1.4}.x-ai-overview-expand-btn:active,.x-ai-overview-expand-btn:hover{background-color:var(--button-color-75,#000);border-color:var(--button-color-75,#000)}[dir=ltr] .x-ai-overview-expand-btn{padding-left:16px}[dir=ltr] .x-ai-overview-expand-btn,[dir=rtl] .x-ai-overview-expand-btn{padding-right:16px}[dir=rtl] .x-ai-overview-expand-btn{padding-left:16px}.x-ai-overview-expand-btn{font-size:14px;gap:8px;min-height:40px}.x-ai-overview-expand-btn.x-selected{background-color:var(--button-color-75,#000);border-color:var(--button-color-75,#000)}.x-ai-overview-expand-btn.x-selected:active,.x-ai-overview-expand-btn.x-selected:hover{background-color:var(--button-color-50,#283034);border-color:var(--button-color-50,#283034)}.x-ai-overview-expand-btn{--button-disabled-border-color:#dbe2e5;background-color:#fff;border-color:var(--button-color-50,#283034);color:var(--button-color-50,#283034)}.x-ai-overview-expand-btn.x-selected,.x-ai-overview-expand-btn:active,.x-ai-overview-expand-btn:hover{background-color:var(--button-color-50,#283034);border-color:var(--button-color-50,#283034);color:#fff}.x-ai-overview-expand-btn.x-selected:active,.x-ai-overview-expand-btn.x-selected:hover{background-color:#fff;color:var(--button-color-50,#283034)}.x-ai-overview-expand-btn:disabled{cursor:not-allowed}.x-ai-overview-expand-btn:disabled,.x-ai-overview-expand-btn:disabled.x-selected{background-color:var(--button-disabled-background-color,#eef1f2);border-color:var(--button-disabled-border-color,#eef1f2);color:#dbe2e5}.x-button-group:not([class*=gap])>.x-ai-overview-expand-btn+.x-button{border-left:unset}.x-ai-overview-expand-btn{border-radius:9999px;width:100%}.x-ai-overview-expand-btn-icon{vector-effect:non-scaling-stroke;--enableIconOffset:var(--OFF);--fontSize:14px;align-items:center;aspect-ratio:1/1;display:flex;flex:0 0 auto;font-family:font-awesome;font-size:var(--enableIconOffset) var(--fontSize);height:16px;justify-content:center;margin-top:var(--enableIconOffset,calc(var(--iconVerticalOffset)*-1));transform:var(--enableIconOffset,translateY(var(--iconVerticalOffset,0)));width:auto}.x-ai-overview-suggestion-query-btn{--button-disabled-border-color:transparent;--button-disabled-background-color:transparent;background-color:transparent;border-color:transparent;color:var(--button-color-50,#283034)}.x-ai-overview-suggestion-query-btn:active,.x-ai-overview-suggestion-query-btn:hover{background-color:transparent;border-color:transparent;color:var(--button-color-75,#000)}[dir=ltr] .x-ai-overview-suggestion-query-btn{padding-left:0}[dir=ltr] .x-ai-overview-suggestion-query-btn,[dir=rtl] .x-ai-overview-suggestion-query-btn{padding-right:0}[dir=rtl] .x-ai-overview-suggestion-query-btn{padding-left:0}.x-ai-overview-suggestion-query-btn.x-selected{background-color:transparent;border-color:transparent;color:var(--button-color-75,#000)}.x-ai-overview-suggestion-query-btn.x-selected:active,.x-ai-overview-suggestion-query-btn.x-selected:hover{background-color:transparent;border-color:transparent;color:var(--button-color-50,#283034)}.x-ai-overview-suggestion-query-btn{--tw-text-opacity:1;align-items:center;color:rgb(17 24 39/var(--tw-text-opacity));display:flex;font-weight:700;gap:16px;margin-left:16px;margin-right:16px;min-height:fit-content;width:fit-content}.x-ai-overview-suggestion-query-btn-icon{--fontSize:14px;height:16px}.x-ai-overview-suggestions{display:flex;flex-direction:column;gap:16px;padding-bottom:16px}.x-ai-overview-suggestion{display:flex;flex-direction:column;gap:8px}.x-ai-overview-suggestion-results{display:flex;gap:16px;padding-left:16px;padding-right:16px}";
3
+ var css = ".x-ai-overview{--color:var(--x-ai-overview-color,#bbc9cf);--color-lighter:var(--x-ai-overview-color-lighter,color-mix(in srgb,var(--color) 25%,#fff));--color-lightest:var(\n --x-ai-overview-color-lightest,color-mix(in srgb,var(--color) 75%,#fff)\n );background-color:var(--color-lighter);border-radius:1.5rem;position:relative}.x-ai-overview-main{border-radius:.5rem;padding:16px}.x-ai-overview-title-loading{align-items:center;display:flex;gap:.375rem;margin-bottom:8px}.x-ai-overview-title-loading-indicator{animation:x-pulse 2s cubic-bezier(.4,0,.6,1) infinite;background-color:var(--color);border-radius:9999px;height:.75rem;width:.75rem}.x-ai-overview-title-loading-text{animation:x-pulse 2s cubic-bezier(.4,0,.6,1) infinite;font-size:12px}.x-ai-overview-title{align-items:center;display:flex;font-size:14px;font-weight:700;gap:4px;margin-bottom:8px}.x-ai-overview-title-icon{vector-effect:non-scaling-stroke;--enableIconOffset:var(--OFF);--fontSize:14px;align-items:center;aspect-ratio:1/1;color:var(--color);display:flex;flex:0 0 auto;font-family:font-awesome;font-size:var(--enableIconOffset) var(--fontSize);height:16px;justify-content:center;margin-top:var(--enableIconOffset,calc(var(--iconVerticalOffset)*-1));transform:var(--enableIconOffset,translateY(var(--iconVerticalOffset,0)));width:auto}.x-ai-overview-loading-content{display:flex;width:100%}@keyframes x-pulse{50%{opacity:.5}}.x-ai-overview-loading-content{animation:x-pulse 2s cubic-bezier(.4,0,.6,1) infinite;flex-direction:column;gap:4px}.x-ai-overview-loading-content>span:first-child{--tw-gradient-from:var(--color) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);--tw-gradient-from-position:0%;--tw-gradient-to:var(--color-lightest) var(--tw-gradient-to-position);--tw-gradient-to-position:100%;background-image:linear-gradient(to right,var(--tw-gradient-stops));border-radius:9999px;height:16px;width:100%}.x-ai-overview-loading-content>span:nth-child(2){--tw-gradient-from:var(--color-lightest) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);--tw-gradient-from-position:0%;--tw-gradient-to:var(--color) var(--tw-gradient-to-position);--tw-gradient-to-position:100%;background-image:linear-gradient(to right,var(--tw-gradient-stops));border-radius:9999px;height:16px;opacity:.5;width:75%}.x-ai-overview-loading-content>span:nth-child(3){width:91.666667%}.x-ai-overview-loading-content>span:nth-child(3),.x-ai-overview-loading-content>span:nth-child(4){--tw-gradient-from:var(--color) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);--tw-gradient-from-position:0%;--tw-gradient-to:var(--color-lightest) var(--tw-gradient-to-position);--tw-gradient-to-position:100%;background-image:linear-gradient(to right,var(--tw-gradient-stops));border-radius:9999px;height:16px}.x-ai-overview-loading-content>span:nth-child(4){opacity:.75;width:50%}.x-ai-overview-content{display:flex;flex-direction:column;gap:2px;line-height:1.25rem;text-align:left}.x-ai-overview-content span{font-weight:500}.x-ai-overview-gradient{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);--tw-gradient-from-position:0%;--tw-gradient-to:var(--color-lighter) var(--tw-gradient-to-position);--tw-gradient-to-position:100%;--tw-content:none;background-image:linear-gradient(to bottom,var(--tw-gradient-stops));bottom:1.25rem;content:var(--tw-content);cursor:pointer;height:80px;position:absolute;width:100%}.x-ai-overview-toggle-wrapper{display:flex;position:relative;z-index:1}.x-ai-overview-toggle-btn{align-content:center;align-items:center;background-color:var(--button-color-50,#283034);border-style:solid;border-width:1px;box-sizing:border-box;color:#fff;cursor:pointer;display:flex;flex-flow:row nowrap;font-family:Inter,sans-serif;font-weight:700;justify-content:center;letter-spacing:0;line-height:1.4}.x-ai-overview-toggle-btn:active,.x-ai-overview-toggle-btn:hover{background-color:var(--button-color-75,#000);border-color:var(--button-color-75,#000)}[dir=ltr] .x-ai-overview-toggle-btn{padding-left:16px}[dir=ltr] .x-ai-overview-toggle-btn,[dir=rtl] .x-ai-overview-toggle-btn{padding-right:16px}[dir=rtl] .x-ai-overview-toggle-btn{padding-left:16px}.x-ai-overview-toggle-btn{font-size:14px;gap:8px;min-height:40px}.x-ai-overview-toggle-btn.x-selected{background-color:var(--button-color-75,#000);border-color:var(--button-color-75,#000)}.x-ai-overview-toggle-btn.x-selected:active,.x-ai-overview-toggle-btn.x-selected:hover{background-color:var(--button-color-50,#283034);border-color:var(--button-color-50,#283034)}.x-ai-overview-toggle-btn{--button-disabled-border-color:#dbe2e5;background-color:#fff;border-color:var(--button-color-50,#283034);color:var(--button-color-50,#283034)}.x-ai-overview-toggle-btn.x-selected,.x-ai-overview-toggle-btn:active,.x-ai-overview-toggle-btn:hover{background-color:var(--button-color-50,#283034);border-color:var(--button-color-50,#283034);color:#fff}.x-ai-overview-toggle-btn.x-selected:active,.x-ai-overview-toggle-btn.x-selected:hover{background-color:#fff;color:var(--button-color-50,#283034)}.x-ai-overview-toggle-btn:disabled{cursor:not-allowed}.x-ai-overview-toggle-btn:disabled,.x-ai-overview-toggle-btn:disabled.x-selected{background-color:var(--button-disabled-background-color,#eef1f2);border-color:var(--button-disabled-border-color,#eef1f2);color:#dbe2e5}.x-button-group:not([class*=gap])>.x-ai-overview-toggle-btn+.x-button{border-left:unset}.x-ai-overview-toggle-btn{border-radius:9999px;width:100%}.x-ai-overview-toggle-btn-icon{vector-effect:non-scaling-stroke;--enableIconOffset:var(--OFF);--fontSize:14px;align-items:center;aspect-ratio:1/1;display:flex;flex:0 0 auto;font-family:font-awesome;font-size:var(--enableIconOffset) var(--fontSize);height:16px;justify-content:center;margin-top:var(--enableIconOffset,calc(var(--iconVerticalOffset)*-1));transform:var(--enableIconOffset,translateY(var(--iconVerticalOffset,0)));transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:auto}.x-ai-overview-toggle-btn-icon-expanded{--tw-rotate:0deg}.x-ai-overview-toggle-btn-icon-collapsed,.x-ai-overview-toggle-btn-icon-expanded{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.x-ai-overview-toggle-btn-icon-collapsed{--tw-rotate:180deg}.x-ai-overview-suggestion-query-btn{--button-disabled-border-color:transparent;--button-disabled-background-color:transparent;background-color:transparent;border-color:transparent;color:var(--button-color-50,#283034)}.x-ai-overview-suggestion-query-btn:active,.x-ai-overview-suggestion-query-btn:hover{background-color:transparent;border-color:transparent;color:var(--button-color-75,#000)}[dir=ltr] .x-ai-overview-suggestion-query-btn{padding-left:0}[dir=ltr] .x-ai-overview-suggestion-query-btn,[dir=rtl] .x-ai-overview-suggestion-query-btn{padding-right:0}[dir=rtl] .x-ai-overview-suggestion-query-btn{padding-left:0}.x-ai-overview-suggestion-query-btn.x-selected{background-color:transparent;border-color:transparent;color:var(--button-color-75,#000)}.x-ai-overview-suggestion-query-btn.x-selected:active,.x-ai-overview-suggestion-query-btn.x-selected:hover{background-color:transparent;border-color:transparent;color:var(--button-color-50,#283034)}.x-ai-overview-suggestion-query-btn{--tw-text-opacity:1;align-items:center;color:rgb(17 24 39/var(--tw-text-opacity));display:flex;font-weight:700;gap:16px;margin-left:16px;margin-right:16px;min-height:fit-content;width:fit-content}.x-ai-overview-suggestion-query-btn-icon{--fontSize:14px;height:16px}.x-ai-overview-suggestions{display:flex;flex-direction:column;gap:16px;padding-bottom:16px}.x-ai-overview-suggestion{display:flex;flex-direction:column;gap:8px}.x-ai-overview-suggestion-results{display:flex;gap:16px;padding-left:16px;padding-right:16px}";
4
4
  injectCss(css);
5
5
 
6
6
  export { css, css as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@empathyco/x-components",
3
- "version": "6.0.0-alpha.136",
3
+ "version": "6.0.0-alpha.137",
4
4
  "description": "Empathy X Components",
5
5
  "author": "Empathy Systems Corporation S.L.",
6
6
  "license": "Apache-2.0",
@@ -142,5 +142,5 @@
142
142
  "access": "public",
143
143
  "directory": "dist"
144
144
  },
145
- "gitHead": "be280e45cb5b2e41f5e33cb0723116eaecd818ff"
145
+ "gitHead": "dd051b7ecbd6aa309c28a768f4efefac61cacee1"
146
146
  }
package/report/x-components.api.json CHANGED
@@ -1505,7 +1505,7 @@
1505
1505
  },
1506
1506
  {
1507
1507
  "kind": "Content",
1508
- "text": "<string>;\n default: string;\n };\n buttonText: {\n type: "
1508
+ "text": "<string>;\n default: string;\n };\n expandText: {\n type: "
1509
1509
  },
1510
1510
  {
1511
1511
  "kind": "Reference",
@@ -1514,7 +1514,25 @@
1514
1514
  },
1515
1515
  {
1516
1516
  "kind": "Content",
1517
- "text": "<string>;\n default: string;\n };\n}, {\n open: () => void;\n expanded: import(\"vue\")."
1517
+ "text": "<string>;\n default: string;\n };\n collapseText: {\n type: "
1518
+ },
1519
+ {
1520
+ "kind": "Reference",
1521
+ "text": "PropType",
1522
+ "canonicalReference": "@vue/runtime-core!PropType:type"
1523
+ },
1524
+ {
1525
+ "kind": "Content",
1526
+ "text": "<string>;\n default: string;\n };\n}, {\n buttonText: import(\"vue\")."
1527
+ },
1528
+ {
1529
+ "kind": "Reference",
1530
+ "text": "ComputedRef",
1531
+ "canonicalReference": "@vue/reactivity!ComputedRef:interface"
1532
+ },
1533
+ {
1534
+ "kind": "Content",
1535
+ "text": "<string>;\n expanded: import(\"vue\")."
1518
1536
  },
1519
1537
  {
1520
1538
  "kind": "Reference",
@@ -1523,7 +1541,7 @@
1523
1541
  },
1524
1542
  {
1525
1543
  "kind": "Content",
1526
- "text": "<boolean>;\n responseText: import(\"vue\")."
1544
+ "text": "<boolean>;\n queries: import(\"vue\")."
1527
1545
  },
1528
1546
  {
1529
1547
  "kind": "Reference",
@@ -1532,7 +1550,16 @@
1532
1550
  },
1533
1551
  {
1534
1552
  "kind": "Content",
1535
- "text": "<string>;\n suggestionText: import(\"vue\")."
1553
+ "text": "<import(\"@empathyco/x-types\")."
1554
+ },
1555
+ {
1556
+ "kind": "Reference",
1557
+ "text": "AiSuggestionQuery",
1558
+ "canonicalReference": "@empathyco/x-components!AiSuggestionQuery:interface"
1559
+ },
1560
+ {
1561
+ "kind": "Content",
1562
+ "text": "[]>;\n responseText: import(\"vue\")."
1536
1563
  },
1537
1564
  {
1538
1565
  "kind": "Reference",
@@ -1541,7 +1568,7 @@
1541
1568
  },
1542
1569
  {
1543
1570
  "kind": "Content",
1544
- "text": "<string>;\n suggestionsSearch: import(\"vue\")."
1571
+ "text": "<string>;\n suggestionsLoading: import(\"vue\")."
1545
1572
  },
1546
1573
  {
1547
1574
  "kind": "Reference",
@@ -1550,7 +1577,43 @@
1550
1577
  },
1551
1578
  {
1552
1579
  "kind": "Content",
1553
- "text": "<import(\"@empathyco/x-types\")."
1580
+ "text": "<boolean>;\n queriesResults: import(\"vue\")."
1581
+ },
1582
+ {
1583
+ "kind": "Reference",
1584
+ "text": "ComputedRef",
1585
+ "canonicalReference": "@vue/reactivity!ComputedRef:interface"
1586
+ },
1587
+ {
1588
+ "kind": "Content",
1589
+ "text": "<"
1590
+ },
1591
+ {
1592
+ "kind": "Reference",
1593
+ "text": "Record",
1594
+ "canonicalReference": "!Record:type"
1595
+ },
1596
+ {
1597
+ "kind": "Content",
1598
+ "text": "<string, import(\"@empathyco/x-types\")."
1599
+ },
1600
+ {
1601
+ "kind": "Reference",
1602
+ "text": "Result",
1603
+ "canonicalReference": "@empathyco/x-components!Result:interface"
1604
+ },
1605
+ {
1606
+ "kind": "Content",
1607
+ "text": "[]>>;\n suggestionsSearch: import(\"vue\")."
1608
+ },
1609
+ {
1610
+ "kind": "Reference",
1611
+ "text": "ComputedRef",
1612
+ "canonicalReference": "@vue/reactivity!ComputedRef:interface"
1613
+ },
1614
+ {
1615
+ "kind": "Content",
1616
+ "text": "<"
1554
1617
  },
1555
1618
  {
1556
1619
  "kind": "Reference",
@@ -1559,7 +1622,7 @@
1559
1622
  },
1560
1623
  {
1561
1624
  "kind": "Content",
1562
- "text": "[]>;\n suggestionsLoading: import(\"vue\")."
1625
+ "text": "[]>;\n suggestionText: import(\"vue\")."
1563
1626
  },
1564
1627
  {
1565
1628
  "kind": "Reference",
@@ -1568,7 +1631,7 @@
1568
1631
  },
1569
1632
  {
1570
1633
  "kind": "Content",
1571
- "text": "<boolean>;\n}, unknown, {}, {}, import(\"vue\")."
1634
+ "text": "<string>;\n toggleVisibility: () => void;\n}, unknown, {}, {}, import(\"vue\")."
1572
1635
  },
1573
1636
  {
1574
1637
  "kind": "Reference",
@@ -1631,7 +1694,7 @@
1631
1694
  },
1632
1695
  {
1633
1696
  "kind": "Content",
1634
- "text": "<string>;\n default: string;\n };\n buttonText: {\n type: "
1697
+ "text": "<string>;\n default: string;\n };\n expandText: {\n type: "
1635
1698
  },
1636
1699
  {
1637
1700
  "kind": "Reference",
@@ -1640,7 +1703,16 @@
1640
1703
  },
1641
1704
  {
1642
1705
  "kind": "Content",
1643
- "text": "<string>;\n default: string;\n };\n}>>, {\n title: string;\n titleLoading: string;\n buttonText: string;\n}, {}>"
1706
+ "text": "<string>;\n default: string;\n };\n collapseText: {\n type: "
1707
+ },
1708
+ {
1709
+ "kind": "Reference",
1710
+ "text": "PropType",
1711
+ "canonicalReference": "@vue/runtime-core!PropType:type"
1712
+ },
1713
+ {
1714
+ "kind": "Content",
1715
+ "text": "<string>;\n default: string;\n };\n}>>, {\n title: string;\n titleLoading: string;\n expandText: string;\n collapseText: string;\n}, {}>"
1644
1716
  }
1645
1717
  ],
1646
1718
  "fileUrlPath": "dist/types/x-modules/ai/components/ai-overview.vue.d.ts",
@@ -1649,7 +1721,7 @@
1649
1721
  "name": "AiOverview",
1650
1722
  "variableTypeTokenRange": {
1651
1723
  "startIndex": 1,
1652
- "endIndex": 38
1724
+ "endIndex": 54
1653
1725
  }
1654
1726
  },
1655
1727
  {
package/report/x-components.api.md CHANGED
@@ -225,17 +225,24 @@ titleLoading: {
225
225
  type: PropType<string>;
226
226
  default: string;
227
227
  };
228
- buttonText: {
228
+ expandText: {
229
+ type: PropType<string>;
230
+ default: string;
231
+ };
232
+ collapseText: {
229
233
  type: PropType<string>;
230
234
  default: string;
231
235
  };
232
236
  }, {
233
- open: () => void;
237
+ buttonText: ComputedRef<string>;
234
238
  expanded: Ref<boolean>;
239
+ queries: ComputedRef<AiSuggestionQuery[]>;
235
240
  responseText: ComputedRef<string>;
236
- suggestionText: ComputedRef<string>;
237
- suggestionsSearch: ComputedRef<AiSuggestionSearch[]>;
238
241
  suggestionsLoading: ComputedRef<boolean>;
242
+ queriesResults: ComputedRef<Record<string, Result[]>>;
243
+ suggestionsSearch: ComputedRef<AiSuggestionSearch[]>;
244
+ suggestionText: ComputedRef<string>;
245
+ toggleVisibility: () => void;
239
246
  }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes< {
240
247
  title: {
241
248
  type: PropType<string>;
@@ -245,14 +252,19 @@ titleLoading: {
245
252
  type: PropType<string>;
246
253
  default: string;
247
254
  };
248
- buttonText: {
255
+ expandText: {
256
+ type: PropType<string>;
257
+ default: string;
258
+ };
259
+ collapseText: {
249
260
  type: PropType<string>;
250
261
  default: string;
251
262
  };
252
263
  }>>, {
253
264
  title: string;
254
265
  titleLoading: string;
255
- buttonText: string;
266
+ expandText: string;
267
+ collapseText: string;
256
268
  }, {}>;
257
269
 
258
270
  export { AIStarIcon }
@@ -9176,8 +9188,8 @@ export type XStoreModuleOptions<StoreModule extends AnyXStoreModule> = StoreModu
9176
9188
  // dist/types/components/filters/labels/base-price-filter-label.vue.d.ts:13:13 - (ae-forgotten-export) The symbol "RangeValue" needs to be exported by the entry point index.d.ts
9177
9189
  // dist/types/components/filters/labels/base-rating-filter-label.vue.d.ts:16:9 - (ae-forgotten-export) The symbol "BooleanFilter" needs to be exported by the entry point index.d.ts
9178
9190
  // dist/types/components/page-selector.vue.d.ts:65:5 - (ae-forgotten-export) The symbol "PageItem" needs to be exported by the entry point index.d.ts
9179
- // dist/types/components/result/base-result-add-to-cart.vue.d.ts:18:9 - (ae-forgotten-export) The symbol "Result" needs to be exported by the entry point index.d.ts
9180
9191
  // dist/types/components/suggestions/base-suggestion.vue.d.ts:31:9 - (ae-forgotten-export) The symbol "Suggestion" needs to be exported by the entry point index.d.ts
9192
+ // dist/types/x-modules/ai/components/ai-overview.vue.d.ts:46:5 - (ae-forgotten-export) The symbol "Result" needs to be exported by the entry point index.d.ts
9181
9193
  // dist/types/x-modules/device/components/device-detector.vue.d.ts:21:9 - (ae-forgotten-export) The symbol "Device" needs to be exported by the entry point index.d.ts
9182
9194
  // dist/types/x-modules/device/components/device-detector.vue.d.ts:21:9 - (ae-forgotten-export) The symbol "MaxWidth" needs to be exported by the entry point index.d.ts
9183
9195
  // dist/types/x-modules/facets/components/facets/facets.vue.d.ts:56:5 - (ae-forgotten-export) The symbol "RenderFacet" needs to be exported by the entry point index.d.ts
package/types/x-modules/ai/components/ai-overview.vue.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ import type { AiSuggestionSearch } from '@empathyco/x-types';
1
2
  import type { PropType } from 'vue';
2
3
  declare const _default: import("vue").DefineComponent<{
3
4
  /**
@@ -19,21 +20,33 @@ declare const _default: import("vue").DefineComponent<{
19
20
  default: string;
20
21
  };
21
22
  /**
22
- * The text displayed on the expand button.
23
+ * The text displayed on the toggle button when collapsed.
23
24
  *
24
25
  * @public
25
26
  */
26
- buttonText: {
27
+ expandText: {
28
+ type: PropType<string>;
29
+ default: string;
30
+ };
31
+ /**
32
+ * The text displayed on the toggle button when expanded.
33
+ *
34
+ * @public
35
+ */
36
+ collapseText: {
27
37
  type: PropType<string>;
28
38
  default: string;
29
39
  };
30
40
  }, {
31
- open: () => void;
41
+ buttonText: import("vue").ComputedRef<string>;
32
42
  expanded: import("vue").Ref<boolean>;
43
+ queries: import("vue").ComputedRef<import("@empathyco/x-types").AiSuggestionQuery[]>;
33
44
  responseText: import("vue").ComputedRef<string>;
34
- suggestionText: import("vue").ComputedRef<string>;
35
- suggestionsSearch: import("vue").ComputedRef<import("@empathyco/x-types").AiSuggestionSearch[]>;
36
45
  suggestionsLoading: import("vue").ComputedRef<boolean>;
46
+ queriesResults: import("vue").ComputedRef<Record<string, import("@empathyco/x-types").Result[]>>;
47
+ suggestionsSearch: import("vue").ComputedRef<AiSuggestionSearch[]>;
48
+ suggestionText: import("vue").ComputedRef<string>;
49
+ toggleVisibility: () => void;
37
50
  }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
38
51
  /**
39
52
  * The text displayed when the question ended loading
@@ -54,18 +67,28 @@ declare const _default: import("vue").DefineComponent<{
54
67
  default: string;
55
68
  };
56
69
  /**
57
- * The text displayed on the expand button.
70
+ * The text displayed on the toggle button when collapsed.
71
+ *
72
+ * @public
73
+ */
74
+ expandText: {
75
+ type: PropType<string>;
76
+ default: string;
77
+ };
78
+ /**
79
+ * The text displayed on the toggle button when expanded.
58
80
  *
59
81
  * @public
60
82
  */
61
- buttonText: {
83
+ collapseText: {
62
84
  type: PropType<string>;
63
85
  default: string;
64
86
  };
65
87
  }>>, {
66
88
  title: string;
67
89
  titleLoading: string;
68
- buttonText: string;
90
+ expandText: string;
91
+ collapseText: string;
69
92
  }, {}>;
70
93
  export default _default;
71
94
  //# sourceMappingURL=ai-overview.vue?vue&type=script&lang.d.ts.map
package/types/x-modules/ai/components/ai-overview.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ai-overview.vue?vue&type=script&lang.d.ts","sourceRoot":"","sources":["../../../../../src/x-modules/ai/components/ai-overview.vue?vue&type=script&lang.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;;IAgC/B;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;;;;;;;;;IAxBlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;;;;;;AAxCtC,wBAiEE"}
1
+ {"version":3,"file":"ai-overview.vue?vue&type=script&lang.d.ts","sourceRoot":"","sources":["../../../../../src/x-modules/ai/components/ai-overview.vue?vue&type=script&lang.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAA;AAC5D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;;IAgC/B;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;;;;;;;;;;;;IAjClC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;IAGlC;;;;OAIG;;cAEe,QAAQ,CAAC,MAAM,CAAC;;;;;;;;;AAjDtC,wBA0FE"}