@empathyco/x-components 6.0.0-alpha.18 → 6.0.0-alpha.181

package/js/x-modules/ai/components/ai-overview.vue.js

@@ -0,0 +1,322 @@
+import _sfc_main from './ai-overview.vue2.js';
+import { resolveComponent, openBlock, createBlock, withCtx, createElementBlock, createElementVNode, createVNode, renderSlot, createTextVNode, toDisplayString, createCommentVNode, normalizeClass, normalizeStyle, withDirectives, Fragment, renderList, vShow, withModifiers } from 'vue';
+import './ai-overview.vue3.js';
+import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.js';
+
+const _hoisted_1 = {
+  key: 0,
+  ref: "aiOverviewRef",
+  class: "x-ai-overview",
+  "data-test": "ai-overview-wrapper"
+};
+const _hoisted_2 = { class: "x-ai-overview-main" };
+const _hoisted_3 = {
+  key: 0,
+  class: "x-ai-overview-title-loading",
+  "data-test": "ai-overview-title-loading"
+};
+const _hoisted_4 = /* @__PURE__ */ createElementVNode(
+  "span",
+  { class: "x-ai-overview-title-loading-indicator" },
+  null,
+  -1
+  /* HOISTED */
+);
+const _hoisted_5 = {
+  class: "x-ai-overview-title-loading-text",
+  "data-test": "ai-overview-title-loading-text"
+};
+const _hoisted_6 = {
+  class: "x-ai-overview-title",
+  "data-test": "ai-overview-title"
+};
+const _hoisted_7 = { class: "x-ai-overview-content-wrapper" };
+const _hoisted_8 = {
+  key: 0,
+  class: "x-ai-overview-content-title",
+  "data-test": "ai-overview-content-title"
+};
+const _hoisted_9 = ["innerHTML"];
+const _hoisted_10 = {
+  key: 1,
+  class: "x-ai-overview-suggestions",
+  "data-test": "ai-overview-suggestions-container"
+};
+const _hoisted_11 = { class: "x-ai-overview-suggestion-results" };
+const _hoisted_12 = {
+  class: "x-ai-overview-gradient",
+  "data-test": "ai-overview-gradient"
+};
+const _hoisted_13 = { class: "x-ai-overview-toggle-wrapper" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_AIStarIcon = resolveComponent("AIStarIcon");
+  const _component_DisplayEmitter = resolveComponent("DisplayEmitter");
+  const _component_Fade = resolveComponent("Fade");
+  const _component_ChangeHeight = resolveComponent("ChangeHeight");
+  const _component_SpinnerIcon = resolveComponent("SpinnerIcon");
+  const _component_ArrowRightIcon = resolveComponent("ArrowRightIcon");
+  const _component_BaseEventButton = resolveComponent("BaseEventButton");
+  const _component_SlidingPanel = resolveComponent("SlidingPanel");
+  const _component_DisplayClickProvider = resolveComponent("DisplayClickProvider");
+  const _component_CollapseHeight = resolveComponent("CollapseHeight");
+  const _component_ChevronDownIcon = resolveComponent("ChevronDownIcon");
+  return openBlock(), createBlock(_component_CollapseHeight, null, {
+    default: withCtx(() => [
+      !_ctx.isNoResults ? (openBlock(), createElementBlock(
+        "div",
+        _hoisted_1,
+        [
+          createElementVNode("div", _hoisted_2, [
+            createVNode(_component_Fade, { mode: "out-in" }, {
+              default: withCtx(() => [
+                _ctx.suggestionsLoading ? (openBlock(), createElementBlock("span", _hoisted_3, [
+                  _hoisted_4,
+                  createElementVNode("span", _hoisted_5, [
+                    renderSlot(_ctx.$slots, "title-loading", {}, () => [
+                      createTextVNode(
+                        toDisplayString(_ctx.titleLoading),
+                        1
+                        /* TEXT */
+                      )
+                    ])
+                  ])
+                ])) : (openBlock(), createBlock(_component_DisplayEmitter, {
+                  key: 1,
+                  payload: _ctx.tagging?.toolingDisplay ?? _ctx.emptyTaggingRequest,
+                  "event-metadata": {
+                    feature: "overview",
+                    displayOriginalQuery: _ctx.query || "overview-without-query",
+                    replaceable: false
+                  },
+                  "data-test": "ai-overview-display-emitter"
+                }, {
+                  default: withCtx(() => [
+                    createElementVNode("span", _hoisted_6, [
+                      createVNode(_component_AIStarIcon, { class: "x-ai-overview-title-icon" }),
+                      createTextVNode(
+                        toDisplayString(!!_ctx.title ? _ctx.title : _ctx.suggestionText),
+                        1
+                        /* TEXT */
+                      )
+                    ])
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["payload", "event-metadata"]))
+              ]),
+              _: 3
+              /* FORWARDED */
+            }),
+            createVNode(_component_ChangeHeight, null, {
+              default: withCtx(() => [
+                createElementVNode("div", _hoisted_7, [
+                  _ctx.title ? (openBlock(), createElementBlock(
+                    "span",
+                    _hoisted_8,
+                    toDisplayString(_ctx.suggestionText),
+                    1
+                    /* TEXT */
+                  )) : createCommentVNode("v-if", true),
+                  createElementVNode("div", {
+                    class: normalizeClass(_ctx.contentClasses),
+                    "data-test": "ai-overview-content",
+                    innerHTML: _ctx.parsedResponseText
+                  }, null, 10, _hoisted_9)
+                ])
+              ]),
+              _: 1
+              /* STABLE */
+            }),
+            renderSlot(_ctx.$slots, "extra-content")
+          ]),
+          createVNode(_component_CollapseHeight, {
+            style: normalizeStyle({
+              "--x-collapse-height-transition-duration": `${300 * _ctx.suggestionsSearch.length}ms`
+            }),
+            "data-test": "ai-overview-collapse-height-suggestions"
+          }, {
+            default: withCtx(() => [
+              withDirectives(createElementVNode(
+                "div",
+                null,
+                [
+                  !_ctx.suggestionsSearch.length ? (openBlock(), createBlock(_component_SpinnerIcon, {
+                    key: 0,
+                    class: "x-ai-overview-suggestions-loading",
+                    "data-test": "ai-overview-suggestions-loading"
+                  })) : (openBlock(), createElementBlock("div", _hoisted_10, [
+                    (openBlock(true), createElementBlock(
+                      Fragment,
+                      null,
+                      renderList(_ctx.suggestionsSearch, ({ query: suggestionQuery, results: queriesResults }, suggestionIndex) => {
+                        return openBlock(), createBlock(_component_DisplayEmitter, {
+                          key: suggestionQuery,
+                          payload: _ctx.tagging?.searchQueries[suggestionQuery].toolingDisplay ?? _ctx.emptyTaggingRequest,
+                          "event-metadata": {
+                            feature: "overview",
+                            displayOriginalQuery: _ctx.query || "overview-without-query",
+                            replaceable: false
+                          },
+                          "data-test": "ai-overview-query-display-emitter"
+                        }, {
+                          default: withCtx(() => [
+                            createElementVNode(
+                              "div",
+                              {
+                                class: normalizeClass(["x-ai-overview-suggestion", {
+                                  "x-ai-overview-result-animation": _ctx.shouldAnimateSuggestion
+                                }]),
+                                "data-test": "ai-overview-suggestion",
+                                style: normalizeStyle({ animationDelay: `${suggestionIndex * 300}ms` })
+                              },
+                              [
+                                createVNode(_component_BaseEventButton, {
+                                  class: "x-ai-overview-suggestion-query-btn",
+                                  events: { UserAcceptedAQuery: suggestionQuery }
+                                }, {
+                                  default: withCtx(() => [
+                                    createTextVNode(
+                                      toDisplayString(suggestionQuery) + " ",
+                                      1
+                                      /* TEXT */
+                                    ),
+                                    createVNode(_component_ArrowRightIcon, { class: "x-ai-overview-suggestion-query-btn-icon" })
+                                  ]),
+                                  _: 2
+                                  /* DYNAMIC */
+                                }, 1032, ["events"]),
+                                createVNode(_component_DisplayClickProvider, {
+                                  "tooling-display-tagging": _ctx.tagging?.searchQueries[suggestionQuery].toolingDisplayClick,
+                                  "tooling-add2-cart-tagging": _ctx.tagging?.searchQueries[suggestionQuery].toolingDisplayAdd2Cart,
+                                  "result-feature": "overview"
+                                }, {
+                                  default: withCtx(() => [
+                                    renderSlot(_ctx.$slots, "sliding-panel", { results: queriesResults }, () => [
+                                      createVNode(_component_SlidingPanel, {
+                                        class: normalizeClass(_ctx.slidingPanelsClasses),
+                                        "scroll-container-class": _ctx.slidingPanelContainersClasses,
+                                        "button-class": _ctx.slidingPanelButtonsClasses,
+                                        "reset-on-content-change": false
+                                      }, {
+                                        "sliding-panel-addons": withCtx(({ arrivedState }) => [
+                                          renderSlot(_ctx.$slots, "sliding-panels-addons", { arrivedState })
+                                        ]),
+                                        "sliding-panel-left-button": withCtx(() => [
+                                          renderSlot(_ctx.$slots, "sliding-panels-left-button")
+                                        ]),
+                                        "sliding-panel-right-button": withCtx(() => [
+                                          renderSlot(_ctx.$slots, "sliding-panels-right-button")
+                                        ]),
+                                        default: withCtx(() => [
+                                          createElementVNode("ul", _hoisted_11, [
+                                            (openBlock(true), createElementBlock(
+                                              Fragment,
+                                              null,
+                                              renderList(queriesResults, (result, resultIndex) => {
+                                                return openBlock(), createElementBlock(
+                                                  "li",
+                                                  {
+                                                    key: result.id,
+                                                    "data-test": "ai-overview-suggestion-result",
+                                                    class: normalizeClass({
+                                                      "x-ai-overview-result-animation": _ctx.shouldAnimateSuggestion
+                                                    }),
+                                                    style: normalizeStyle({
+                                                      animationDelay: `${suggestionIndex * 300 + resultIndex * 300}ms`
+                                                    })
+                                                  },
+                                                  [
+                                                    renderSlot(_ctx.$slots, "result", { result })
+                                                  ],
+                                                  6
+                                                  /* CLASS, STYLE */
+                                                );
+                                              }),
+                                              128
+                                              /* KEYED_FRAGMENT */
+                                            ))
+                                          ])
+                                        ]),
+                                        _: 2
+                                        /* DYNAMIC */
+                                      }, 1032, ["class", "scroll-container-class", "button-class"])
+                                    ])
+                                  ]),
+                                  _: 2
+                                  /* DYNAMIC */
+                                }, 1032, ["tooling-display-tagging", "tooling-add2-cart-tagging"])
+                              ],
+                              6
+                              /* CLASS, STYLE */
+                            )
+                          ]),
+                          _: 2
+                          /* DYNAMIC */
+                        }, 1032, ["payload", "event-metadata"]);
+                      }),
+                      128
+                      /* KEYED_FRAGMENT */
+                    )),
+                    renderSlot(_ctx.$slots, "suggestions-extra-content")
+                  ]))
+                ],
+                512
+                /* NEED_PATCH */
+              ), [
+                [vShow, _ctx.expanded]
+              ])
+            ]),
+            _: 3
+            /* FORWARDED */
+          }, 8, ["style"]),
+          createVNode(_component_Fade, null, {
+            default: withCtx(() => [
+              _ctx.queries.length ? (openBlock(), createElementBlock("div", {
+                key: 0,
+                class: "x-cursor-pointer",
+                "data-test": "ai-overview-toggle-button-wrapper",
+                onClick: _cache[1] || (_cache[1] = ($event) => _ctx.emitAndSetExpand(!_ctx.expanded))
+              }, [
+                withDirectives(createElementVNode(
+                  "div",
+                  _hoisted_12,
+                  null,
+                  512
+                  /* NEED_PATCH */
+                ), [
+                  [vShow, !_ctx.expanded]
+                ]),
+                createElementVNode("div", _hoisted_13, [
+                  createElementVNode("button", {
+                    class: "x-ai-overview-toggle-btn",
+                    "data-test": "ai-overview-toggle-button",
+                    onClick: _cache[0] || (_cache[0] = withModifiers(($event) => _ctx.emitAndSetExpand(!_ctx.expanded), ["stop"]))
+                  }, [
+                    createTextVNode(
+                      toDisplayString(_ctx.buttonText) + " ",
+                      1
+                      /* TEXT */
+                    ),
+                    createVNode(_component_ChevronDownIcon, {
+                      class: normalizeClass(["x-ai-overview-toggle-btn-icon", { "x-ai-overview-toggle-btn-icon-expanded": _ctx.expanded }])
+                    }, null, 8, ["class"])
+                  ])
+                ])
+              ])) : createCommentVNode("v-if", true)
+            ]),
+            _: 1
+            /* STABLE */
+          })
+        ],
+        512
+        /* NEED_PATCH */
+      )) : createCommentVNode("v-if", true)
+    ]),
+    _: 3
+    /* FORWARDED */
+  });
+}
+var aiOverview = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+
+export { aiOverview as default };
+//# sourceMappingURL=ai-overview.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ai-overview.vue.js","sources":["../../../../../src/x-modules/ai/components/ai-overview.vue"],"sourcesContent":["<template>\n  <CollapseHeight>\n    <div\n      v-if=\"!isNoResults\"\n      ref=\"aiOverviewRef\"\n      class=\"x-ai-overview\"\n      data-test=\"ai-overview-wrapper\"\n    >\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              class=\"x-ai-overview-title-loading-text\"\n              data-test=\"ai-overview-title-loading-text\"\n            >\n              <slot name=\"title-loading\">\n                {{ titleLoading }}\n              </slot>\n            </span>\n          </span>\n          <DisplayEmitter\n            v-else\n            :payload=\"tagging?.toolingDisplay ?? emptyTaggingRequest\"\n            :event-metadata=\"{\n              feature: 'overview',\n              displayOriginalQuery: query || 'overview-without-query',\n              replaceable: false,\n            }\"\n            data-test=\"ai-overview-display-emitter\"\n          >\n            <span class=\"x-ai-overview-title\" data-test=\"ai-overview-title\">\n              <AIStarIcon class=\"x-ai-overview-title-icon\" />{{ !!title ? title : suggestionText }}\n            </span>\n          </DisplayEmitter>\n        </Fade>\n        <ChangeHeight>\n          <div class=\"x-ai-overview-content-wrapper\">\n            <span\n              v-if=\"title\"\n              class=\"x-ai-overview-content-title\"\n              data-test=\"ai-overview-content-title\"\n              >{{ suggestionText }}\n            </span>\n            <div\n              :class=\"contentClasses\"\n              data-test=\"ai-overview-content\"\n              v-html=\"parsedResponseText\"\n            />\n          </div>\n        </ChangeHeight>\n        <slot name=\"extra-content\" />\n      </div>\n      <CollapseHeight\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\">\n          <SpinnerIcon\n            v-if=\"!suggestionsSearch.length\"\n            class=\"x-ai-overview-suggestions-loading\"\n            data-test=\"ai-overview-suggestions-loading\"\n          />\n          <div\n            v-else\n            class=\"x-ai-overview-suggestions\"\n            data-test=\"ai-overview-suggestions-container\"\n          >\n            <DisplayEmitter\n              v-for=\"(\n                { query: suggestionQuery, results: queriesResults }, suggestionIndex\n              ) in suggestionsSearch\"\n              :key=\"suggestionQuery\"\n              :payload=\"\n                tagging?.searchQueries[suggestionQuery].toolingDisplay ?? emptyTaggingRequest\n              \"\n              :event-metadata=\"{\n                feature: 'overview',\n                displayOriginalQuery: query || 'overview-without-query',\n                replaceable: false,\n              }\"\n              data-test=\"ai-overview-query-display-emitter\"\n            >\n              <div\n                class=\"x-ai-overview-suggestion\"\n                data-test=\"ai-overview-suggestion\"\n                :class=\"{\n                  'x-ai-overview-result-animation': shouldAnimateSuggestion,\n                }\"\n                :style=\"{ animationDelay: `${suggestionIndex * 300}ms` }\"\n              >\n                <BaseEventButton\n                  class=\"x-ai-overview-suggestion-query-btn\"\n                  :events=\"{ UserAcceptedAQuery: suggestionQuery }\"\n                >\n                  {{ suggestionQuery }}\n                  <ArrowRightIcon class=\"x-ai-overview-suggestion-query-btn-icon\" />\n                </BaseEventButton>\n\n                <DisplayClickProvider\n                  :tooling-display-tagging=\"\n                    tagging?.searchQueries[suggestionQuery].toolingDisplayClick\n                  \"\n                  :tooling-add2-cart-tagging=\"\n                    tagging?.searchQueries[suggestionQuery].toolingDisplayAdd2Cart\n                  \"\n                  result-feature=\"overview\"\n                >\n                  <slot name=\"sliding-panel\" :results=\"queriesResults\">\n                    <SlidingPanel\n                      :class=\"slidingPanelsClasses\"\n                      :scroll-container-class=\"slidingPanelContainersClasses\"\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                      <ul class=\"x-ai-overview-suggestion-results\">\n                        <li\n                          v-for=\"(result, resultIndex) in queriesResults\"\n                          :key=\"result.id\"\n                          data-test=\"ai-overview-suggestion-result\"\n                          :class=\"{\n                            'x-ai-overview-result-animation': shouldAnimateSuggestion,\n                          }\"\n                          :style=\"{\n                            animationDelay: `${suggestionIndex * 300 + resultIndex * 300}ms`,\n                          }\"\n                        >\n                          <!-- @slot (required) result card -->\n                          <slot name=\"result\" :result=\"result\" />\n                        </li>\n                      </ul>\n                    </SlidingPanel>\n                  </slot>\n                </DisplayClickProvider>\n              </div>\n            </DisplayEmitter>\n            <slot name=\"suggestions-extra-content\" />\n          </div>\n        </div>\n      </CollapseHeight>\n\n      <Fade>\n        <div\n          v-if=\"queries.length\"\n          class=\"x-cursor-pointer\"\n          data-test=\"ai-overview-toggle-button-wrapper\"\n          @click=\"emitAndSetExpand(!expanded)\"\n        >\n          <div v-show=\"!expanded\" class=\"x-ai-overview-gradient\" data-test=\"ai-overview-gradient\" />\n          <div class=\"x-ai-overview-toggle-wrapper\">\n            <button\n              class=\"x-ai-overview-toggle-btn\"\n              data-test=\"ai-overview-toggle-button\"\n              @click.stop=\"emitAndSetExpand(!expanded)\"\n            >\n              {{ buttonText }}\n              <ChevronDownIcon\n                class=\"x-ai-overview-toggle-btn-icon\"\n                :class=\"{ 'x-ai-overview-toggle-btn-icon-expanded': expanded }\"\n              />\n            </button>\n          </div>\n        </div>\n      </Fade>\n    </div>\n  </CollapseHeight>\n</template>\n\n<script lang=\"ts\">\nimport type { TaggingRequest } from '@empathyco/x-types'\nimport { marked } from 'marked'\nimport { computed, defineComponent, onMounted, ref, watch } from 'vue'\nimport {\n  AIStarIcon,\n  ArrowRightIcon,\n  BaseEventButton,\n  ChangeHeight,\n  ChevronDownIcon,\n  CollapseHeight,\n  DisplayClickProvider,\n  Fade,\n  SlidingPanel,\n  SpinnerIcon,\n} from '../../../components'\nimport DisplayEmitter from '../../../components/display-emitter.vue'\nimport { use$x, 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    SpinnerIcon,\n    DisplayEmitter,\n    DisplayClickProvider,\n  },\n  props: {\n    /* The text displayed when the question ended loading */\n    title: {\n      type: String,\n    },\n    /* The text displayed when the question is loading. */\n    titleLoading: {\n      type: String,\n      default: 'Generating with Empathy AI',\n    },\n    /* The text displayed on the toggle button when collapsed. */\n    expandText: {\n      type: String,\n      default: 'Show more',\n    },\n    /* The text displayed on the toggle button when expanded. */\n    collapseText: {\n      type: String,\n      default: 'Show less',\n    },\n    /* Auto expand the AI Overview when there are queries in AI and no-results in search. */\n    autoExpandInSearchNoResults: {\n      type: Boolean,\n      default: true,\n    },\n    /* The classes added to the parsed response text container. */\n    contentClasses: {\n      type: String,\n    },\n    /* The classes added to each sliding panel for each query. */\n    slidingPanelsClasses: {\n      type: String,\n    },\n    /* The classes added to each sliding panel container of each query. */\n    slidingPanelContainersClasses: {\n      type: String,\n    },\n    /* The classes added to each sliding panel button of each query. */\n    slidingPanelButtonsClasses: {\n      type: String,\n    },\n  },\n  setup(props) {\n    const $x = use$x()\n    const { query } = useGetter('ai')\n    const {\n      suggestionText,\n      responseText,\n      suggestionsSearch,\n      suggestionsLoading,\n      tagging,\n      isNoResults,\n      queries,\n    } = useState('ai')\n\n    const emptyTaggingRequest: TaggingRequest = { url: '', params: {} }\n\n    const aiOverviewRef = ref<HTMLDivElement | null>(null)\n    const expanded = ref(false)\n    const shouldAnimateSuggestion = ref(true)\n    const parsedResponseText = computed(() => marked.parse(responseText.value))\n\n    const buttonText = computed(() => (expanded.value ? props.collapseText : props.expandText))\n\n    function emitAndSetExpand(isExpanded: boolean) {\n      $x.emit('UserClickedAiOverviewExpandButton', expanded.value, {\n        suggestionText: suggestionText.value,\n        toolingDisplayClick: tagging.value?.toolingDisplayClick,\n      })\n\n      expanded.value = isExpanded\n      if (!expanded.value) {\n        aiOverviewRef.value?.scrollIntoView({ behavior: 'smooth' })\n        shouldAnimateSuggestion.value = false\n      }\n    }\n\n    /* Expand AIOverview programmatically when the `autoExpandInSearchNoResults` prop is active,\n    the request for suggestions has ended; there are queries in AI and no-results in search. */\n    watch([suggestionsLoading, () => $x.noResults], () => {\n      if (\n        props.autoExpandInSearchNoResults &&\n        !suggestionsLoading.value &&\n        queries.value.length &&\n        $x.noResults\n      ) {\n        emitAndSetExpand(true)\n      }\n    })\n\n    $x.on('AiSuggestionsRequestUpdated', false).subscribe(() => {\n      expanded.value = false\n      shouldAnimateSuggestion.value = true\n    })\n\n    onMounted(() => {\n      $x.emit('AiOverviewMounted', undefined, { feature: 'overview' })\n    })\n\n    return {\n      aiOverviewRef,\n      buttonText,\n      emptyTaggingRequest,\n      expanded,\n      parsedResponseText,\n      suggestionsLoading,\n      suggestionsSearch,\n      suggestionText,\n      emitAndSetExpand,\n      shouldAnimateSuggestion,\n      query,\n      tagging,\n      isNoResults,\n      queries,\n    }\n  },\n})\n</script>\n\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\n  position: relative;\n  border-radius: 1.5rem;\n  background-color: var(--color-lighter);\n}\n\n.x-ai-overview-main {\n  padding: 1rem;\n  max-width: var(--x-ai-overview-main-max-width, none);\n  margin: 0 auto;\n}\n\n.x-ai-overview-title {\n  display: flex;\n  font-size: 0.875rem;\n  font-weight: 700;\n  gap: 0.25rem;\n  align-items: center;\n  margin-bottom: 0.5rem;\n}\n\n.x-ai-overview-title-loading {\n  display: flex;\n  align-items: center;\n  gap: 0.375rem;\n  margin-bottom: 0.5rem;\n}\n\n.x-ai-overview-title-loading-indicator {\n  width: 0.75rem;\n  height: 0.75rem;\n  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  border-radius: 9999px;\n  background-color: var(--color);\n}\n\n.x-ai-overview-title-loading-text {\n  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  font-size: 0.75rem;\n}\n\n.x-ai-overview-title-icon {\n  height: 1rem;\n  aspect-ratio: 1 / 1;\n  color: var(--color);\n  flex-shrink: 0;\n}\n\n.x-ai-overview-content-wrapper {\n  display: flex;\n  flex-direction: column;\n  text-align: left;\n  line-height: 1.25rem;\n}\n\n.x-ai-overview-content-title {\n  font-weight: 500;\n  margin-bottom: 8px;\n}\n\n.x-ai-overview-gradient {\n  border-radius: 1.5rem;\n  cursor: pointer;\n  content: none;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  bottom: 0;\n  background-image: linear-gradient(to bottom, transparent 0%, var(--color-lighter) 100%);\n}\n\n.x-ai-overview-toggle-wrapper {\n  display: flex;\n  position: relative;\n}\n\n.x-ai-overview-toggle-btn {\n  border-color: var(--button-color-50, #283034);\n  background-color: #ffffff;\n  color: var(--button-color-50, #283034);\n  border-radius: 9999px;\n  width: 100%;\n  margin: auto;\n  padding-right: 1rem;\n  padding-left: 1rem;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-style: solid;\n  border-width: 1px;\n  font-weight: 700;\n  min-height: 2.5rem;\n  gap: 0.5rem;\n  font-size: 0.875rem;\n}\n\n.x-ai-overview-toggle-btn:hover {\n  border-color: var(--button-color-50, #283034);\n  background-color: var(--button-color-50, #283034);\n  color: #ffffff;\n}\n\n@media (min-width: 640px) {\n  .x-ai-overview-toggle-btn {\n    transition-property: all;\n    transition-duration: 500ms;\n    transform: translateY(50%);\n    width: var(--expand-button-width, 200px);\n  }\n}\n\n.x-ai-overview-toggle-btn-icon {\n  transform: rotate(0deg);\n  height: 1rem;\n  aspect-ratio: 1 / 1;\n  transition-property: all;\n  transition-duration: 300ms;\n}\n\n.x-ai-overview-toggle-btn-icon-expanded {\n  transform: rotate(180deg);\n}\n\n.x-ai-overview-suggestion-query-btn {\n  border-color: transparent;\n  background-color: transparent;\n  margin-left: 1rem;\n  margin-right: 1rem;\n  font-weight: 700;\n  width: fit-content;\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.x-ai-overview-suggestion-query-btn-icon {\n  height: 1rem;\n  aspect-ratio: 1 / 1;\n}\n\n.x-ai-overview-suggestions {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  padding-bottom: 1rem;\n}\n\n.x-ai-overview-suggestions-loading {\n  width: 2.5rem;\n  height: 2.5rem;\n  margin: auto;\n  animation: x-spin 1s linear infinite;\n}\n\n.x-ai-overview-suggestion {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.x-ai-overview-suggestion-results {\n  display: flex;\n  gap: 1rem;\n  padding-left: 1rem;\n  padding-right: 1rem;\n}\n\n@keyframes x-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes pulse {\n  50% {\n    opacity: 0.5;\n  }\n}\n</style>\n"],"names":["_createElementVNode","_createBlock","_openBlock","_createElementBlock","_createVNode","_renderSlot","_createTextVNode","_toDisplayString","_withCtx","_createCommentVNode","_normalizeClass","_normalizeStyle","_withDirectives","_Fragment","_renderList","_vShow","_withModifiers"],"mappings":"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"}

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

@@ -0,0 +1,233 @@
+import { marked } from 'marked';
+import { defineComponent, ref, computed, watch, onMounted } from 'vue';
+import '../../../components/animations/animate-clip-path/animate-clip-path.style.scss.js';
+import '../../../components/animations/animate-scale/animate-scale.style.scss.js';
+import '../../../components/animations/animate-translate/animate-translate.style.scss.js';
+import '../../../components/animations/animate-width.vue2.js';
+import '../../../components/animations/animate-width.vue3.js';
+import ChangeHeight from '../../../components/animations/change-height.vue.js';
+import CollapseHeight from '../../../components/animations/collapse-height.vue.js';
+import '../../../components/animations/collapse-width.vue2.js';
+import '../../../components/animations/collapse-width.vue3.js';
+import '../../../components/animations/cross-fade.vue2.js';
+import '../../../components/animations/cross-fade.vue3.js';
+import '../../../components/animations/fade-and-slide.vue2.js';
+import '../../../components/animations/fade-and-slide.vue3.js';
+import Fade from '../../../components/animations/fade.vue.js';
+import '../../../components/animations/no-animation.vue.js';
+import '../../../components/animations/staggered-fade-and-slide.vue2.js';
+import '../../../components/animations/staggered-fade-and-slide.vue3.js';
+import '../../../components/auto-progress-bar.vue2.js';
+import '../../../components/auto-progress-bar.vue3.js';
+import '../../../components/base-dropdown.vue2.js';
+import '../../../components/base-dropdown.vue3.js';
+import BaseEventButton from '../../../components/base-event-button.vue.js';
+import '../../../components/base-grid.vue2.js';
+import '../../../components/base-grid.vue3.js';
+import '../../../components/base-keyboard-navigation.vue2.js';
+import '../../../components/base-rating.vue2.js';
+import '../../../components/base-rating.vue3.js';
+import '../../../components/base-slider.vue2.js';
+import '../../../components/base-slider.vue3.js';
+import '../../../components/base-switch.vue2.js';
+import '../../../components/base-switch.vue3.js';
+import '../../../components/base-teleport.vue2.js';
+import '../../../components/base-variable-column-grid.vue2.js';
+import '../../../components/column-picker/base-column-picker-dropdown.vue2.js';
+import '../../../components/column-picker/base-column-picker-list.vue2.js';
+import '../../../components/currency/base-currency.vue2.js';
+import _sfc_main$2 from '../../../components/display-click-provider.vue.js';
+import _sfc_main$1 from '../../../components/display-emitter.vue.js';
+import '../../../components/filters/labels/base-price-filter-label.vue.js';
+import '../../../components/filters/labels/base-rating-filter-label.vue2.js';
+import '../../../components/global-x-bus.vue.js';
+import '../../../components/highlight.vue2.js';
+import AIStarIcon from '../../../components/icons/ai-star.vue.js';
+import ArrowRightIcon from '../../../components/icons/arrow-right.vue.js';
+import ChevronDownIcon from '../../../components/icons/chevron-down.vue.js';
+import SpinnerIcon from '../../../components/icons/spinner.vue.js';
+import '../../../components/items-list.vue2.js';
+import '../../../components/layouts/fixed-header-and-asides-layout.vue2.js';
+import '../../../components/layouts/fixed-header-and-asides-layout.vue3.js';
+import '../../../components/layouts/multi-column-max-width-layout.vue2.js';
+import '../../../components/layouts/multi-column-max-width-layout.vue3.js';
+import '../../../components/layouts/multi-column-max-width-layout.vue4.js';
+import '../../../components/layouts/single-column-layout.vue2.js';
+import '../../../components/layouts/single-column-layout.vue3.js';
+import '../../../components/location-provider.vue.js';
+import '../../../components/modals/base-events-modal-close.vue2.js';
+import '../../../components/modals/base-events-modal-open.vue2.js';
+import '../../../components/modals/base-events-modal.vue2.js';
+import '../../../components/modals/base-id-modal-close.vue2.js';
+import '../../../components/modals/base-id-modal-open.vue2.js';
+import '../../../components/modals/base-id-modal.vue2.js';
+import '../../../components/modals/base-modal.vue2.js';
+import '../../../components/modals/base-modal.vue3.js';
+import '../../../components/modals/close-main-modal.vue2.js';
+import '../../../components/modals/main-modal.vue2.js';
+import '../../../components/modals/open-main-modal.vue2.js';
+import '../../../components/page-loader-button.vue2.js';
+import '../../../components/page-loader-button.vue3.js';
+import '../../../components/page-selector.vue2.js';
+import '../../../components/page-selector.vue3.js';
+import '../../../components/panels/base-header-toggle-panel.vue2.js';
+import '../../../components/panels/base-header-toggle-panel.vue3.js';
+import '../../../components/panels/base-id-toggle-panel-button.vue2.js';
+import '../../../components/panels/base-id-toggle-panel.vue2.js';
+import '../../../components/panels/base-tabs-panel.vue2.js';
+import '../../../components/panels/base-tabs-panel.vue3.js';
+import '../../../components/panels/base-toggle-panel.vue2.js';
+import '../../../components/result/base-result-add-to-cart.vue2.js';
+import '../../../components/result/base-result-current-price.vue2.js';
+import '../../../components/result/base-result-image.vue2.js';
+import '../../../components/result/base-result-image.vue3.js';
+import '../../../components/result/base-result-link.vue2.js';
+import '../../../components/result/base-result-link.vue3.js';
+import '../../../components/result/base-result-previous-price.vue2.js';
+import '../../../components/result/base-result-rating.vue2.js';
+import '../../../components/result/base-result-rating.vue3.js';
+import '../../../components/result/result-variant-selector.vue2.js';
+import '../../../components/result/result-variant-selector.vue3.js';
+import '../../../components/result/result-variants-provider.vue.js';
+import '../../../components/scroll/base-scroll.vue2.js';
+import '@empathyco/x-utils';
+import { use$x } from '../../../composables/use-_x.js';
+import SlidingPanel from '../../../components/sliding-panel.vue.js';
+import '../../../components/snippet-callbacks.vue2.js';
+import '../../../components/suggestions/base-suggestion.vue2.js';
+import '../../../components/suggestions/base-suggestions.vue2.js';
+import '../../../components/suggestions/base-suggestions.vue3.js';
+import '../../../composables/create-use-device.js';
+import 'vuex';
+import '@vue/devtools-api';
+import '../../../plugins/devtools/timeline.devtools.js';
+import 'rxjs/operators';
+import 'rxjs';
+import '../../../plugins/devtools/colors.utils.js';
+import '../../../plugins/x-bus.js';
+import '../../../plugins/x-plugin.js';
+import { useGetter } from '../../../composables/use-getter.js';
+import '@vueuse/core';
+import { useState } from '../../../composables/use-state.js';
+import { typing } from '../../../directives/typing.js';
+import { aiXModule } from '../x-module.js';
+
+var _sfc_main = defineComponent({
+    directives: {
+        typing,
+    },
+    xModule: aiXModule.name,
+    components: {
+        AIStarIcon,
+        ArrowRightIcon,
+        BaseEventButton,
+        ChevronDownIcon,
+        CollapseHeight,
+        ChangeHeight,
+        Fade,
+        SlidingPanel,
+        SpinnerIcon,
+        DisplayEmitter: _sfc_main$1,
+        DisplayClickProvider: _sfc_main$2,
+    },
+    props: {
+        /* The text displayed when the question ended loading */
+        title: {
+            type: String,
+        },
+        /* The text displayed when the question is loading. */
+        titleLoading: {
+            type: String,
+            default: 'Generating with Empathy AI',
+        },
+        /* The text displayed on the toggle button when collapsed. */
+        expandText: {
+            type: String,
+            default: 'Show more',
+        },
+        /* The text displayed on the toggle button when expanded. */
+        collapseText: {
+            type: String,
+            default: 'Show less',
+        },
+        /* Auto expand the AI Overview when there are queries in AI and no-results in search. */
+        autoExpandInSearchNoResults: {
+            type: Boolean,
+            default: true,
+        },
+        /* The classes added to the parsed response text container. */
+        contentClasses: {
+            type: String,
+        },
+        /* The classes added to each sliding panel for each query. */
+        slidingPanelsClasses: {
+            type: String,
+        },
+        /* The classes added to each sliding panel container of each query. */
+        slidingPanelContainersClasses: {
+            type: String,
+        },
+        /* The classes added to each sliding panel button of each query. */
+        slidingPanelButtonsClasses: {
+            type: String,
+        },
+    },
+    setup(props) {
+        const $x = use$x();
+        const { query } = useGetter('ai');
+        const { suggestionText, responseText, suggestionsSearch, suggestionsLoading, tagging, isNoResults, queries, } = useState('ai');
+        const emptyTaggingRequest = { url: '', params: {} };
+        const aiOverviewRef = ref(null);
+        const expanded = ref(false);
+        const shouldAnimateSuggestion = ref(true);
+        const parsedResponseText = computed(() => marked.parse(responseText.value));
+        const buttonText = computed(() => (expanded.value ? props.collapseText : props.expandText));
+        function emitAndSetExpand(isExpanded) {
+            $x.emit('UserClickedAiOverviewExpandButton', expanded.value, {
+                suggestionText: suggestionText.value,
+                toolingDisplayClick: tagging.value?.toolingDisplayClick,
+            });
+            expanded.value = isExpanded;
+            if (!expanded.value) {
+                aiOverviewRef.value?.scrollIntoView({ behavior: 'smooth' });
+                shouldAnimateSuggestion.value = false;
+            }
+        }
+        /* Expand AIOverview programmatically when the `autoExpandInSearchNoResults` prop is active,
+        the request for suggestions has ended; there are queries in AI and no-results in search. */
+        watch([suggestionsLoading, () => $x.noResults], () => {
+            if (props.autoExpandInSearchNoResults &&
+                !suggestionsLoading.value &&
+                queries.value.length &&
+                $x.noResults) {
+                emitAndSetExpand(true);
+            }
+        });
+        $x.on('AiSuggestionsRequestUpdated', false).subscribe(() => {
+            expanded.value = false;
+            shouldAnimateSuggestion.value = true;
+        });
+        onMounted(() => {
+            $x.emit('AiOverviewMounted', undefined, { feature: 'overview' });
+        });
+        return {
+            aiOverviewRef,
+            buttonText,
+            emptyTaggingRequest,
+            expanded,
+            parsedResponseText,
+            suggestionsLoading,
+            suggestionsSearch,
+            suggestionText,
+            emitAndSetExpand,
+            shouldAnimateSuggestion,
+            query,
+            tagging,
+            isNoResults,
+            queries,
+        };
+    },
+});
+
+export { _sfc_main as default };
+//# sourceMappingURL=ai-overview.vue2.js.map