@empathyco/x-components 6.0.0-alpha.26 → 6.0.0-alpha.28

package/js/x-modules/related-prompts/components/related-prompt.vue2.js

@@ -1,22 +1,30 @@
-import { defineComponent, ref } from 'vue';
+import { defineComponent } from 'vue';
 import { relatedPromptsXModule } from '../x-module.js';
 import CrossTinyIcon from '../../../components/icons/cross-tiny.vue.js';
 import PlusIcon from '../../../components/icons/plus.vue.js';
-import SlidingPanel from '../../../components/sliding-panel.vue.js';
+import '../../../composables/create-use-device.js';
+import { use$x } from '../../../composables/use-_x.js';
+import '@vue/devtools-api';
+import '../../../plugins/devtools/timeline.devtools.js';
+import '@empathyco/x-utils';
+import 'rxjs/operators';
+import 'rxjs';
+import '../../../plugins/devtools/colors.utils.js';
+import '../../../plugins/x-bus.js';
+import '../../../plugins/x-plugin.js';
+import 'vuex';
+import '@vueuse/core';
 
 /**
- * This component shows a suggested related prompt with the associated next queries.
- * It allows to select one of the next query and show it.
+ * This component shows a suggested related prompt.
  *
- * It provide slots to customize the header, the next queries list,
- * the individual next query inside the list and the selected query.
+ * It provides a slot to customize the related prompt button information.
  *
  * @public
  */
 var _sfc_main = defineComponent({
     name: 'RelatedPrompt',
     components: {
-        SlidingPanel,
         CrossTinyIcon,
         PlusIcon
     },
@@ -26,27 +34,27 @@ var _sfc_main = defineComponent({
             type: Object,
             required: true
         },
-        nextQueryButtonClass: {
-            type: String,
-            default: 'x-button-outlined'
+        isPromptVisible: {
+            type: Boolean,
+            default: false
+        },
+        isSelected: {
+            type: Boolean,
+            default: false
+        },
+        index: {
+            type: Number,
+            required: true
         }
     },
-    setup(props) {
-        const selectedNextQuery = ref(props.relatedPrompt.nextQueries[0]);
-        /**
-         * Handles the click event on a next query button.
-         *
-         * @param nextQuery - The clicked next query.
-         */
-        function onClick(nextQuery) {
-            if (selectedNextQuery.value === nextQuery) {
-                selectedNextQuery.value = '';
-            }
-            else {
-                selectedNextQuery.value = nextQuery;
-            }
-        }
-        return { selectedNextQuery, onClick };
+    setup() {
+        const x = use$x();
+        const toggleSuggestion = (index) => {
+            x.emit('UserSelectedARelatedPrompt', index);
+        };
+        return {
+            toggleSuggestion
+        };
     }
 });
 

package/js/x-modules/related-prompts/components/related-prompt.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"related-prompt.vue2.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompt.vue"],"sourcesContent":["<template>\n  <div class=\"x-related-prompt\" data-test=\"related-prompt\">\n    <div class=\"x-related-prompt__info\">\n      <slot name=\"header\" :suggestionText=\"relatedPrompt.suggestionText\">\n        {{ relatedPrompt.suggestionText }}\n      </slot>\n      <slot name=\"next-queries\" :nextQueries=\"relatedPrompt.nextQueries\">\n        <SlidingPanel :resetOnContentChange=\"false\">\n          <div class=\"x-related-prompt__sliding-panel-content\">\n            <button\n              v-for=\"(nextQuery, index) in relatedPrompt.nextQueries\"\n              :key=\"index\"\n              @click=\"onClick(nextQuery)\"\n              :class=\"[\n                'x-button',\n                { 'x-selected': selectedNextQuery === nextQuery },\n                nextQueryButtonClass\n              ]\"\n            >\n              <slot name=\"next-query\" :nextQuery=\"nextQuery\">\n                <span>{{ nextQuery }}</span>\n                <CrossTinyIcon v-if=\"selectedNextQuery === nextQuery\" class=\"x-icon\" />\n                <PlusIcon v-else class=\"x-icon\" />\n              </slot>\n            </button>\n          </div>\n        </SlidingPanel>\n      </slot>\n    </div>\n    <div class=\"x-related-prompt__query-preview\">\n      <slot name=\"selected-query\" :selectedQuery=\"selectedNextQuery\">\n        {{ selectedNextQuery }}\n      </slot>\n    </div>\n  </div>\n</template>\n<script lang=\"ts\">\n  import { defineComponent, PropType, ref } from 'vue';\n  import { RelatedPrompt } from '@empathyco/x-types';\n  import { relatedPromptsXModule } from '../x-module';\n  import CrossTinyIcon from '../../../components/icons/cross-tiny.vue';\n  import PlusIcon from '../../../components/icons/plus.vue';\n  import SlidingPanel from '../../../components/sliding-panel.vue';\n\n  /**\n   * This component shows a suggested related prompt with the associated next queries.\n   * It allows to select one of the next query and show it.\n   *\n   * It provide slots to customize the header, the next queries list,\n   * the individual next query inside the list and the selected query.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'RelatedPrompt',\n    components: {\n      SlidingPanel,\n      CrossTinyIcon,\n      PlusIcon\n    },\n    xModule: relatedPromptsXModule.name,\n    props: {\n      relatedPrompt: {\n        type: Object as PropType<RelatedPrompt>,\n        required: true\n      },\n      nextQueryButtonClass: {\n        type: String,\n        default: 'x-button-outlined'\n      }\n    },\n    setup(props) {\n      const selectedNextQuery = ref(props.relatedPrompt.nextQueries[0]);\n\n      /**\n       * Handles the click event on a next query button.\n       *\n       * @param nextQuery - The clicked next query.\n       */\n      function onClick(nextQuery: string): void {\n        if (selectedNextQuery.value === nextQuery) {\n          selectedNextQuery.value = '';\n        } else {\n          selectedNextQuery.value = nextQuery;\n        }\n      }\n\n      return { selectedNextQuery, onClick };\n    }\n  });\n</script>\n<style lang=\"css\" scoped>\n  .x-related-prompt__info {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .x-related-prompt__sliding-panel-content {\n    display: flex;\n    gap: 8px;\n  }\n</style>\n"],"names":[],"mappings":";;;;;;AA4CE;;;;;;;;AAQE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,eAAe;AACrB,IAAA,UAAU,EAAE;QACV,YAAY;QACZ,aAAa;QACb,QAAO;AACR,KAAA;IACD,OAAO,EAAE,qBAAqB,CAAC,IAAI;AACnC,IAAA,KAAK,EAAE;AACL,QAAA,aAAa,EAAE;AACb,YAAA,IAAI,EAAE,MAAiC;AACvC,YAAA,QAAQ,EAAE,IAAG;AACd,SAAA;AACD,QAAA,oBAAoB,EAAE;AACpB,YAAA,IAAI,EAAE,MAAM;AACZ,YAAA,OAAO,EAAE,mBAAkB;AAC7B,SAAA;AACD,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,iBAAkB,GAAE,GAAG,CAAC,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAA;AAEjE;;;;AAIE;QACF,SAAS,OAAO,CAAC,SAAiB,EAAA;AAChC,YAAA,IAAI,iBAAiB,CAAC,KAAI,KAAM,SAAS,EAAE;AACzC,gBAAA,iBAAiB,CAAC,KAAI,GAAI,EAAE,CAAA;AAC5B,aAAA;AAAK,iBAAA;AACL,gBAAA,iBAAiB,CAAC,QAAQ,SAAS,CAAA;AACrC,aAAA;SACF;AAEA,QAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,CAAA;KACvC;AACD,CAAA,CAAC;;;;"}
+{"version":3,"file":"related-prompt.vue2.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompt.vue"],"sourcesContent":["<template>\n  <div\n    @click=\"toggleSuggestion(index)\"\n    @keydown=\"toggleSuggestion(index)\"\n    class=\"x-related-prompt__button\"\n    :class=\"[{ 'x-related-prompt-selected__button': isSelected }]\"\n    role=\"button\"\n    aria-pressed=\"true\"\n    tabindex=\"0\"\n  >\n    <slot name=\"related-prompt-button-info\">\n      <div class=\"x-related-prompt__button-info\">\n        <span\n          class=\"x-typewritter-initial\"\n          :class=\"[{ 'x-typewritter-animation': isPromptVisible }]\"\n          :style=\"{\n            animationDelay: `${index * 0.4 + 0.05}s`,\n            '--suggestion-text-length': relatedPrompt.suggestionText.length\n          }\"\n        >\n          {{ relatedPrompt.suggestionText }}\n        </span>\n      </div>\n      <CrossTinyIcon v-if=\"isSelected\" class=\"x-icon-lg\" />\n      <PlusIcon v-else class=\"x-icon-lg\" />\n    </slot>\n  </div>\n</template>\n<script lang=\"ts\">\n  import { defineComponent, PropType } from 'vue';\n  import { RelatedPrompt } from '@empathyco/x-types';\n  import { relatedPromptsXModule } from '../x-module';\n  import CrossTinyIcon from '../../../components/icons/cross-tiny.vue';\n  import PlusIcon from '../../../components/icons/plus.vue';\n  import { use$x } from '../../../composables/index';\n\n  /**\n   * This component shows a suggested related prompt.\n   *\n   * It provides a slot to customize the related prompt button information.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'RelatedPrompt',\n    components: {\n      CrossTinyIcon,\n      PlusIcon\n    },\n    xModule: relatedPromptsXModule.name,\n    props: {\n      relatedPrompt: {\n        type: Object as PropType<RelatedPrompt>,\n        required: true\n      },\n      isPromptVisible: {\n        type: Boolean,\n        default: false\n      },\n      isSelected: {\n        type: Boolean,\n        default: false\n      },\n      index: {\n        type: Number,\n        required: true\n      }\n    },\n    setup() {\n      const x = use$x();\n\n      const toggleSuggestion = (index: number): void => {\n        x.emit('UserSelectedARelatedPrompt', index);\n      };\n\n      return {\n        toggleSuggestion\n      };\n    }\n  });\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAoCE;;;;;;AAME;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,eAAe;AACrB,IAAA,UAAU,EAAE;QACV,aAAa;QACb,QAAO;AACR,KAAA;IACD,OAAO,EAAE,qBAAqB,CAAC,IAAI;AACnC,IAAA,KAAK,EAAE;AACL,QAAA,aAAa,EAAE;AACb,YAAA,IAAI,EAAE,MAAiC;AACvC,YAAA,QAAQ,EAAE,IAAG;AACd,SAAA;AACD,QAAA,eAAe,EAAE;AACf,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,OAAO,EAAE,KAAI;AACd,SAAA;AACD,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,OAAO,EAAE,KAAI;AACd,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,IAAI,EAAE,MAAM;AACZ,YAAA,QAAQ,EAAE,IAAG;AACf,SAAA;AACD,KAAA;IACD,KAAK,GAAA;AACH,QAAA,MAAM,CAAE,GAAE,KAAK,EAAE,CAAA;AAEjB,QAAA,MAAM,gBAAe,GAAI,CAAC,KAAa,KAAW;AAChD,YAAA,CAAC,CAAC,IAAI,CAAC,4BAA4B,EAAE,KAAK,CAAC,CAAA;AAC7C,SAAC,CAAA;QAED,OAAO;YACL,gBAAe;SAChB,CAAA;KACH;AACD,CAAA,CAAC;;;;"}

package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js

@@ -0,0 +1,80 @@
+import _sfc_main from './related-prompts-tag-list.vue2.js';
+import { resolveComponent, openBlock, createElementBlock, renderSlot, createCommentVNode, createVNode, withCtx, createElementVNode, normalizeClass, Fragment, renderList, normalizeStyle, mergeProps } from 'vue';
+import './related-prompts-tag-list.vue3.js';
+import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.js';
+
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_RelatedPrompt = resolveComponent("RelatedPrompt");
+  const _component_SlidingPanel = resolveComponent("SlidingPanel");
+  return openBlock(), createElementBlock("div", null, [
+    _ctx.$slots.header ? renderSlot(_ctx.$slots, "header", { key: 0 }) : createCommentVNode("v-if", true),
+    createVNode(_component_SlidingPanel, {
+      "reset-on-content-change": true,
+      "button-class": _ctx.buttonClass,
+      "scroll-container-class": _ctx.selectedPrompt === -1 ? "desktop:x-sliding-panel-fade desktop:x-sliding-panel-fade-sm" : ""
+    }, {
+      "sliding-panel-left-button": withCtx(() => [
+        renderSlot(_ctx.$slots, "sliding-panel-left-button")
+      ]),
+      "sliding-panel-right-button": withCtx(() => [
+        renderSlot(_ctx.$slots, "sliding-panel-right-button")
+      ]),
+      default: withCtx(() => [
+        renderSlot(_ctx.$slots, "sliding-panel-content", {}, () => [
+          createElementVNode(
+            "div",
+            {
+              ref: "slidingPanelContent",
+              class: normalizeClass(["x-related-prompt__sliding-panel-content", { "x-w-[calc(100%)]": _ctx.selectedPrompt !== -1 }])
+            },
+            [
+              (openBlock(true), createElementBlock(
+                Fragment,
+                null,
+                renderList(_ctx.relatedPrompts, (suggestion, index) => {
+                  return openBlock(), createElementBlock(
+                    "div",
+                    {
+                      key: index,
+                      style: normalizeStyle({
+                        animationDelay: `${index * 0.4 + 0.05}s`
+                      }),
+                      class: normalizeClass(["x-related-prompt x-staggered-initial", [
+                        { "x-staggered-animation": _ctx.arePromptsVisible },
+                        { "x-hidden": _ctx.hidePrompt(index) },
+                        { "x-related-prompt-selected": _ctx.isSelected(index) }
+                      ]]),
+                      "data-test": "related-prompt-item"
+                    },
+                    [
+                      renderSlot(_ctx.$slots, "related-prompt-button", mergeProps({ ref_for: true }, { suggestion, index, arePromptsVisible: _ctx.arePromptsVisible, isSelected: _ctx.isSelected }), () => [
+                        createVNode(_component_RelatedPrompt, {
+                          "related-prompt": suggestion,
+                          index,
+                          "is-prompt-visible": _ctx.arePromptsVisible,
+                          "is-selected": _ctx.isSelected(index)
+                        }, null, 8, ["related-prompt", "index", "is-prompt-visible", "is-selected"])
+                      ])
+                    ],
+                    6
+                    /* CLASS, STYLE */
+                  );
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              ))
+            ],
+            2
+            /* CLASS */
+          )
+        ])
+      ]),
+      _: 3
+      /* FORWARDED */
+    }, 8, ["button-class", "scroll-container-class"])
+  ]);
+}
+var relatedPromptsTagList = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+
+export { relatedPromptsTagList as default };
+//# sourceMappingURL=related-prompts-tag-list.vue.js.map

package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"related-prompts-tag-list.vue.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompts-tag-list.vue"],"sourcesContent":["<template>\n  <div>\n    <template v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </template>\n    <SlidingPanel\n      :reset-on-content-change=\"true\"\n      :button-class=\"buttonClass\"\n      :scroll-container-class=\"\n        selectedPrompt === -1 ? 'desktop:x-sliding-panel-fade desktop:x-sliding-panel-fade-sm' : ''\n      \"\n    >\n      <template #sliding-panel-left-button>\n        <slot name=\"sliding-panel-left-button\" />\n      </template>\n\n      <slot name=\"sliding-panel-content\">\n        <div\n          ref=\"slidingPanelContent\"\n          class=\"x-related-prompt__sliding-panel-content\"\n          :class=\"{ 'x-w-[calc(100%)]': selectedPrompt !== -1 }\"\n        >\n          <div\n            v-for=\"(suggestion, index) in relatedPrompts\"\n            :key=\"index\"\n            :style=\"{\n              animationDelay: `${index * 0.4 + 0.05}s`\n            }\"\n            class=\"x-related-prompt x-staggered-initial\"\n            :class=\"[\n              { 'x-staggered-animation': arePromptsVisible },\n              { 'x-hidden': hidePrompt(index) },\n              { 'x-related-prompt-selected': isSelected(index) }\n            ]\"\n            data-test=\"related-prompt-item\"\n          >\n            <slot\n              name=\"related-prompt-button\"\n              v-bind=\"{ suggestion, index, arePromptsVisible, isSelected }\"\n            >\n              <RelatedPrompt\n                :related-prompt=\"suggestion\"\n                :index=\"index\"\n                :is-prompt-visible=\"arePromptsVisible\"\n                :is-selected=\"isSelected(index)\"\n              />\n            </slot>\n          </div>\n        </div>\n      </slot>\n\n      <template #sliding-panel-right-button>\n        <slot name=\"sliding-panel-right-button\" />\n      </template>\n    </SlidingPanel>\n  </div>\n</template>\n<script lang=\"ts\">\n  import { defineComponent, onMounted, onUnmounted, ref } from 'vue';\n  import SlidingPanel from '../../../components/sliding-panel.vue';\n  import { relatedPromptsXModule } from '../x-module';\n  import { useState } from '../../../composables/index';\n  import RelatedPrompt from './related-prompt.vue';\n\n  export default defineComponent({\n    name: 'RelatedPromptsTagList',\n    xModule: relatedPromptsXModule.name,\n    components: { RelatedPrompt, SlidingPanel },\n    props: {\n      buttonClass: String\n    },\n    setup() {\n      const { relatedPrompts, selectedPrompt } = useState('relatedPrompts', [\n        'relatedPrompts',\n        'selectedPrompt'\n      ]);\n\n      const slidingPanelContent = ref<Element>();\n      const arePromptsVisible = ref(false);\n\n      const observer = new IntersectionObserver(([entry]) => {\n        arePromptsVisible.value = entry.isIntersecting;\n      });\n\n      onMounted(() => {\n        observer.observe(slidingPanelContent.value as Element);\n      });\n\n      onUnmounted(() => {\n        observer.disconnect();\n      });\n\n      const isSelected = (index: number): boolean => selectedPrompt.value === index;\n\n      const hidePrompt = (index: number): boolean =>\n        selectedPrompt.value !== -1 && selectedPrompt.value !== index;\n\n      return {\n        arePromptsVisible,\n        hidePrompt,\n        isSelected,\n        relatedPrompts,\n        selectedPrompt,\n        slidingPanelContent\n      };\n    }\n  });\n</script>\n\n<style lang=\"css\">\n  .x-related-prompt__sliding-panel-content {\n    display: flex;\n    gap: 8px;\n  }\n\n  .x-related-prompt {\n    display: flex;\n    flex-direction: column;\n    border-radius: 12px;\n    transition-property: all;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 500ms;\n    min-height: 112px;\n    height: 100%;\n    width: 303px;\n  }\n\n  .x-related-prompt-selected {\n    width: 100% !important;\n    min-height: 0;\n    border-bottom-right-radius: 0;\n    border-bottom-left-radius: 0;\n\n    &__button {\n      width: 100% !important;\n    }\n  }\n\n  .x-related-prompt__button {\n    display: flex;\n    flex-direction: row;\n    gap: 12px;\n    justify-content: space-between;\n    align-items: start;\n    text-align: start;\n    padding: 16px;\n    transition-property: all;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 500ms;\n    flex-grow: 1;\n    width: 303px;\n  }\n\n  .x-related-prompt__button-info {\n    display: flex;\n    min-height: 32px;\n  }\n\n  @media (max-width: 743px) {\n    .x-related-prompt {\n      width: 204px;\n      &__button {\n        width: 204px;\n      }\n    }\n  }\n\n  .x-no-scrollbar::-webkit-scrollbar {\n    display: none;\n  }\n\n  .x-no-scrollbar {\n    -ms-overflow-style: none; /* IE and Edge */\n    scrollbar-width: none; /* Firefox */\n  }\n\n  .x-typewritter-initial {\n    color: #0000;\n    background: linear-gradient(-90deg, transparent 5px, #0000 0) 10px 0,\n      linear-gradient(#575757 0 0) 0 0;\n    background-size: 0 200%;\n    -webkit-background-clip: padding-box, text;\n    background-clip: padding-box, text;\n    background-repeat: no-repeat;\n  }\n\n  .x-typewritter-animation {\n    animation: typewritter calc(var(--suggestion-text-length) * 0.05s)\n      steps(var(--suggestion-text-length)) forwards;\n  }\n\n  @keyframes typewritter {\n    from {\n      background-size: 0 200%;\n    }\n    to {\n      background-size: calc(var(--suggestion-text-length) * 1ch) 200%;\n    }\n  }\n\n  .x-staggered-initial {\n    opacity: 0;\n    transform: translateY(20px);\n  }\n\n  .x-staggered-animation {\n    animation: fadeInUp 0.6s forwards;\n  }\n\n  @keyframes fadeInUp {\n    from {\n      opacity: 0;\n      transform: translateY(20px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n</style>\n"],"names":["_resolveComponent","_openBlock","_createElementBlock","_renderSlot","_createCommentVNode","_createVNode","selectedPrompt","_withCtx","_createElementVNode","relatedPrompts","_Fragment","_renderList","hidePrompt","isSelected","_mergeProps"],"mappings":";;;;;;;kCACEA,gBAsDM,CAAA,cAAA,CAAA,CAAA;AApDF,EAAA,OAAAC,SAAA,EAHN,EAAAC,kBAAA,CAAA,KAAA,EAAA,IAAA,EAAA;AAAA,IAKI,IAAA,CAAA,MAAA,CAAA,MAAA,GAAAC,UAAA,CAiDe,IAhDZ,CAAA,MAAA,EAAA,QAAA,EAAA,EAAA,GAAA,EAAA,CAAA,EAAA,CAAA,GAAAC,kBAAA,CAAA,MAAA,EAAyB,IAAI,CAAA;AAAA,IAAAC,WAAA,CAC7B,uBAAyB,EAAA;AAAA,MACzB,yBAAsB,EAAA,IAAA;AAAA,MAAA,cAAA,EAAWC,IAAc,CAAA,WAAA;AAAA,MAAA,wBAAA,EAAA,IAAA,CAAA,cAAA,KAAA,CAAA,CAAA,GAAA,8DAAA,GAAA,EAAA;;;QA2CrCH,UACiC,CAAA,IAAA,CAAA,MAAA,EAAA,2BAAA,CAAA;AAAA,OAAA,CAAA;;QApDlDA,UAiDa,CAAA,IAAA,CAAA,MAAA,EAAA,4BAAA,CAAA;AAAA,OAAA,CAAA;eAhCLI,OA+BM,CAAA,MAAA;AAAA,QAAAJ,UAAA,CA9BA,IAAqB,CAAA,MAAA,EAAA,uBAAA,EAAA,EAAA,EAAA,MAAA;AAAA,UAAAK,kBAAA;AAlBnC,YAAA,KAAA;AAAA,YAmBgB;AAAA,cAAA,GAAA,EAAA,qBAAA;oCAGN,CAtBV,yCAAA,EAAA,EAuB0CC,kBAvB1C,EAAA,IAAA,CAuBoB,cAAiB,KAAA,CAAA,CAAA,EAAA,CAAA,CAAA;AAAA,aAAA;;yBACnB,IAAK,CAAA,EAAAP,kBAAA;AAAA,gBAAAQ,QAAA;AAAA,gBAAA,IAAA;AAAA,gBAAAC,UAAA,CAAA,IAAA,CAAA,cAAA,EAAA,CAAA,UAAA,EAAA,KAAA,KAAA;yBACLV,SAzBlB,EAAA,EAAAC,kBAAA;AAAA,oBAAA,KAAA;AAAA,oBAAA;AAAA,sBAAA,GAAA,EAAA,KAAA;;wCAAA,CA4BkB,EAAA,KAAA,GAAA,GAAA,GAAA,IAAA,CAAA,CAAA,CAAA;AAAA,uBAAA,CAAA;4CAC8FU,CAAgB,sCAAA,EAAA;AAAA,wBAAA,EAAA,uBAAA,EAAA,IAAA,CAAkDC,iBAAW,EAAA;AAAA,wBAAA,EAAA,UAAA,EAAA,IAAA,CAAA,UAAA,CAAA,KAAA,CAAA,EAAA;AAKjL,wBAAA,EAAA,2BAAA,EAAU,IAAqB,CAAA,UAAA,CAAA,KAAA,CAAA,EAAA;AAAA,uBAAA,CAAA,CAAA;sBAE/B,WAUO,EAAA,qBAAA;AAAA,qBAAA;;AALF,sBAAAV,UAAA,CAAA,IAAA,CAAA,MAAA,EAAgB,uBAAU,EAAAW,UAAA,CAAA,EAAA,OAAA,EAAA,IAAA,EAAA,EAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,CAAA,iBAAA,EAAA,UAAA,EAAA,IAAA,CAAA,UAAA,EAAA,CAAA,EAAA,MAAA;AAAA,wBAAAT,WAAA,CACnB,wBAAK,EAAA;AAAA,0BACZ,gBAAA,EAAA,UAAA;AAAA,0BACA,KAAA;AAAA,0BAAA,mBAAA,EAAA,IAAA,CAAA,iBAAA;;;;;;;;;;;;;;;;AA5CjB,SAAA,CAAA;AAAA,OAAA,CAAA;;;;;;;;;;"}

package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js

@@ -0,0 +1,55 @@
+import { defineComponent, ref, onMounted, onUnmounted } from 'vue';
+import SlidingPanel from '../../../components/sliding-panel.vue.js';
+import { relatedPromptsXModule } from '../x-module.js';
+import '../../../composables/create-use-device.js';
+import '@vue/devtools-api';
+import '../../../plugins/devtools/timeline.devtools.js';
+import '@empathyco/x-utils';
+import 'rxjs/operators';
+import 'rxjs';
+import '../../../plugins/devtools/colors.utils.js';
+import '../../../plugins/x-bus.js';
+import '../../../plugins/x-plugin.js';
+import 'vuex';
+import '@vueuse/core';
+import { useState } from '../../../composables/use-state.js';
+import RelatedPrompt from './related-prompt.vue.js';
+
+var _sfc_main = defineComponent({
+    name: 'RelatedPromptsTagList',
+    xModule: relatedPromptsXModule.name,
+    components: { RelatedPrompt, SlidingPanel },
+    props: {
+        buttonClass: String
+    },
+    setup() {
+        const { relatedPrompts, selectedPrompt } = useState('relatedPrompts', [
+            'relatedPrompts',
+            'selectedPrompt'
+        ]);
+        const slidingPanelContent = ref();
+        const arePromptsVisible = ref(false);
+        const observer = new IntersectionObserver(([entry]) => {
+            arePromptsVisible.value = entry.isIntersecting;
+        });
+        onMounted(() => {
+            observer.observe(slidingPanelContent.value);
+        });
+        onUnmounted(() => {
+            observer.disconnect();
+        });
+        const isSelected = (index) => selectedPrompt.value === index;
+        const hidePrompt = (index) => selectedPrompt.value !== -1 && selectedPrompt.value !== index;
+        return {
+            arePromptsVisible,
+            hidePrompt,
+            isSelected,
+            relatedPrompts,
+            selectedPrompt,
+            slidingPanelContent
+        };
+    }
+});
+
+export { _sfc_main as default };
+//# sourceMappingURL=related-prompts-tag-list.vue2.js.map

package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"related-prompts-tag-list.vue2.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompts-tag-list.vue"],"sourcesContent":["<template>\n  <div>\n    <template v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </template>\n    <SlidingPanel\n      :reset-on-content-change=\"true\"\n      :button-class=\"buttonClass\"\n      :scroll-container-class=\"\n        selectedPrompt === -1 ? 'desktop:x-sliding-panel-fade desktop:x-sliding-panel-fade-sm' : ''\n      \"\n    >\n      <template #sliding-panel-left-button>\n        <slot name=\"sliding-panel-left-button\" />\n      </template>\n\n      <slot name=\"sliding-panel-content\">\n        <div\n          ref=\"slidingPanelContent\"\n          class=\"x-related-prompt__sliding-panel-content\"\n          :class=\"{ 'x-w-[calc(100%)]': selectedPrompt !== -1 }\"\n        >\n          <div\n            v-for=\"(suggestion, index) in relatedPrompts\"\n            :key=\"index\"\n            :style=\"{\n              animationDelay: `${index * 0.4 + 0.05}s`\n            }\"\n            class=\"x-related-prompt x-staggered-initial\"\n            :class=\"[\n              { 'x-staggered-animation': arePromptsVisible },\n              { 'x-hidden': hidePrompt(index) },\n              { 'x-related-prompt-selected': isSelected(index) }\n            ]\"\n            data-test=\"related-prompt-item\"\n          >\n            <slot\n              name=\"related-prompt-button\"\n              v-bind=\"{ suggestion, index, arePromptsVisible, isSelected }\"\n            >\n              <RelatedPrompt\n                :related-prompt=\"suggestion\"\n                :index=\"index\"\n                :is-prompt-visible=\"arePromptsVisible\"\n                :is-selected=\"isSelected(index)\"\n              />\n            </slot>\n          </div>\n        </div>\n      </slot>\n\n      <template #sliding-panel-right-button>\n        <slot name=\"sliding-panel-right-button\" />\n      </template>\n    </SlidingPanel>\n  </div>\n</template>\n<script lang=\"ts\">\n  import { defineComponent, onMounted, onUnmounted, ref } from 'vue';\n  import SlidingPanel from '../../../components/sliding-panel.vue';\n  import { relatedPromptsXModule } from '../x-module';\n  import { useState } from '../../../composables/index';\n  import RelatedPrompt from './related-prompt.vue';\n\n  export default defineComponent({\n    name: 'RelatedPromptsTagList',\n    xModule: relatedPromptsXModule.name,\n    components: { RelatedPrompt, SlidingPanel },\n    props: {\n      buttonClass: String\n    },\n    setup() {\n      const { relatedPrompts, selectedPrompt } = useState('relatedPrompts', [\n        'relatedPrompts',\n        'selectedPrompt'\n      ]);\n\n      const slidingPanelContent = ref<Element>();\n      const arePromptsVisible = ref(false);\n\n      const observer = new IntersectionObserver(([entry]) => {\n        arePromptsVisible.value = entry.isIntersecting;\n      });\n\n      onMounted(() => {\n        observer.observe(slidingPanelContent.value as Element);\n      });\n\n      onUnmounted(() => {\n        observer.disconnect();\n      });\n\n      const isSelected = (index: number): boolean => selectedPrompt.value === index;\n\n      const hidePrompt = (index: number): boolean =>\n        selectedPrompt.value !== -1 && selectedPrompt.value !== index;\n\n      return {\n        arePromptsVisible,\n        hidePrompt,\n        isSelected,\n        relatedPrompts,\n        selectedPrompt,\n        slidingPanelContent\n      };\n    }\n  });\n</script>\n\n<style lang=\"css\">\n  .x-related-prompt__sliding-panel-content {\n    display: flex;\n    gap: 8px;\n  }\n\n  .x-related-prompt {\n    display: flex;\n    flex-direction: column;\n    border-radius: 12px;\n    transition-property: all;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 500ms;\n    min-height: 112px;\n    height: 100%;\n    width: 303px;\n  }\n\n  .x-related-prompt-selected {\n    width: 100% !important;\n    min-height: 0;\n    border-bottom-right-radius: 0;\n    border-bottom-left-radius: 0;\n\n    &__button {\n      width: 100% !important;\n    }\n  }\n\n  .x-related-prompt__button {\n    display: flex;\n    flex-direction: row;\n    gap: 12px;\n    justify-content: space-between;\n    align-items: start;\n    text-align: start;\n    padding: 16px;\n    transition-property: all;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 500ms;\n    flex-grow: 1;\n    width: 303px;\n  }\n\n  .x-related-prompt__button-info {\n    display: flex;\n    min-height: 32px;\n  }\n\n  @media (max-width: 743px) {\n    .x-related-prompt {\n      width: 204px;\n      &__button {\n        width: 204px;\n      }\n    }\n  }\n\n  .x-no-scrollbar::-webkit-scrollbar {\n    display: none;\n  }\n\n  .x-no-scrollbar {\n    -ms-overflow-style: none; /* IE and Edge */\n    scrollbar-width: none; /* Firefox */\n  }\n\n  .x-typewritter-initial {\n    color: #0000;\n    background: linear-gradient(-90deg, transparent 5px, #0000 0) 10px 0,\n      linear-gradient(#575757 0 0) 0 0;\n    background-size: 0 200%;\n    -webkit-background-clip: padding-box, text;\n    background-clip: padding-box, text;\n    background-repeat: no-repeat;\n  }\n\n  .x-typewritter-animation {\n    animation: typewritter calc(var(--suggestion-text-length) * 0.05s)\n      steps(var(--suggestion-text-length)) forwards;\n  }\n\n  @keyframes typewritter {\n    from {\n      background-size: 0 200%;\n    }\n    to {\n      background-size: calc(var(--suggestion-text-length) * 1ch) 200%;\n    }\n  }\n\n  .x-staggered-initial {\n    opacity: 0;\n    transform: translateY(20px);\n  }\n\n  .x-staggered-animation {\n    animation: fadeInUp 0.6s forwards;\n  }\n\n  @keyframes fadeInUp {\n    from {\n      opacity: 0;\n      transform: translateY(20px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n</style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAgEE,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,uBAAuB;IAC7B,OAAO,EAAE,qBAAqB,CAAC,IAAI;AACnC,IAAA,UAAU,EAAE,EAAE,aAAa,EAAE,cAAc;AAC3C,IAAA,KAAK,EAAE;AACL,QAAA,WAAW,EAAE,MAAK;AACnB,KAAA;IACD,KAAK,GAAA;QACH,MAAM,EAAE,cAAc,EAAE,cAAa,EAAI,GAAE,QAAQ,CAAC,gBAAgB,EAAE;YACpE,gBAAgB;YAChB,gBAAe;AAChB,SAAA,CAAC,CAAA;AAEF,QAAA,MAAM,mBAAkB,GAAI,GAAG,EAAW,CAAA;AAC1C,QAAA,MAAM,iBAAgB,GAAI,GAAG,CAAC,KAAK,CAAC,CAAA;QAEpC,MAAM,QAAS,GAAE,IAAI,oBAAoB,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK;AACrD,YAAA,iBAAiB,CAAC,KAAM,GAAE,KAAK,CAAC,cAAc,CAAA;AAChD,SAAC,CAAC,CAAA;QAEF,SAAS,CAAC,MAAM;AACd,YAAA,QAAQ,CAAC,OAAO,CAAC,mBAAmB,CAAC,KAAgB,CAAC,CAAA;AACxD,SAAC,CAAC,CAAA;QAEF,WAAW,CAAC,MAAM;YAChB,QAAQ,CAAC,UAAU,EAAE,CAAA;AACvB,SAAC,CAAC,CAAA;AAEF,QAAA,MAAM,UAAW,GAAE,CAAC,KAAa,KAAc,cAAc,CAAC,KAAI,KAAM,KAAK,CAAA;AAE7E,QAAA,MAAM,UAAW,GAAE,CAAC,KAAa,KAC/B,cAAc,CAAC,KAAI,KAAM,CAAC,CAAA,IAAK,cAAc,CAAC,KAAM,KAAI,KAAK,CAAA;QAE/D,OAAO;YACL,iBAAiB;YACjB,UAAU;YACV,UAAU;YACV,cAAc;YACd,cAAc;YACd,mBAAkB;SACnB,CAAA;KACH;AACD,CAAA,CAAC;;;;"}

package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue3.js

@@ -0,0 +1,7 @@
+import injectCss from '../../../../tools/inject-css.js';
+
+var css = ".x-related-prompt__sliding-panel-content{display:flex;gap:8px}.x-related-prompt{border-radius:12px;display:flex;flex-direction:column;height:100%;min-height:112px;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:303px}.x-related-prompt-selected{border-bottom-left-radius:0;border-bottom-right-radius:0;min-height:0;width:100%!important}.x-related-prompt-selected__button{width:100%!important}[dir=ltr] .x-related-prompt__button{text-align:left}[dir=rtl] .x-related-prompt__button{text-align:right}.x-related-prompt__button{align-items:start;display:flex;flex-direction:row;flex-grow:1;gap:12px;justify-content:space-between;padding:16px;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:303px}.x-related-prompt__button-info{display:flex;min-height:32px}@media (max-width:743px){.x-related-prompt,.x-related-prompt__button{width:204px}}.x-no-scrollbar::-webkit-scrollbar{display:none}.x-no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.x-typewritter-initial{background:linear-gradient(-90deg,transparent 5px,#0000 0) 10px 0,linear-gradient(#575757 0 0) 0 0;background-clip:padding-box,text;background-repeat:no-repeat;background-size:0 200%;color:#0000}.x-typewritter-animation{animation:typewritter calc(var(--suggestion-text-length)*.05s) steps(var(--suggestion-text-length)) forwards}@keyframes typewritter{0%{background-size:0 200%}to{background-size:calc(var(--suggestion-text-length)*1ch) 200%}}.x-staggered-initial{opacity:0;transform:translateY(20px)}.x-staggered-animation{animation:fadeInUp .6s forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}";
+injectCss(css);
+
+export { css, css as default };
+//# sourceMappingURL=related-prompts-tag-list.vue3.js.map

package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"related-prompts-tag-list.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/js/x-modules/related-prompts/store/module.js

@@ -31,7 +31,12 @@ const relatedPromptsXStoreModule = {
             state.relatedPrompts = products;
         },
         setSelectedPrompt(state, selectedPrompt) {
-            state.selectedPrompt = selectedPrompt;
+            if (state.selectedPrompt === selectedPrompt) {
+                state.selectedPrompt = -1;
+            }
+            else {
+                state.selectedPrompt = selectedPrompt;
+            }
         },
         setSelectedQuery(state, selectedQuery) {
             state.selectedQuery = selectedQuery;
@@ -40,6 +45,9 @@ const relatedPromptsXStoreModule = {
             state.selectedQuery = -1;
             state.selectedPrompt = -1;
             state.relatedPrompts = [];
+        },
+        resetSelectedPrompt(state) {
+            state.selectedPrompt = -1;
         }
     },
     actions: {

package/js/x-modules/related-prompts/store/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sources":["../../../../../src/x-modules/related-prompts/store/module.ts"],"sourcesContent":["import { setStatus } from '../../../store/utils/status-store.utils';\nimport { setQuery } from '../../../store/utils/query.utils';\nimport { RelatedPromptsXStoreModule } from './types';\nimport {\n  cancelFetchAndSaveRelatedPrompts,\n  fetchAndSaveRelatedPrompts\n} from './actions/fetch-and-save-related-prompts.action';\nimport { fetchRelatedPrompts } from './actions/fetch-related-prompts.action';\nimport { request } from './getters/request.getter';\n\n/**\n * {@link XStoreModule} For the related prompt module.\n *\n * @internal\n */\nexport const relatedPromptsXStoreModule: RelatedPromptsXStoreModule = {\n  state: () => ({\n    query: '',\n    relatedPrompts: [],\n    selectedPrompt: -1,\n    selectedQuery: -1,\n    status: 'initial',\n    params: {}\n  }),\n  getters: {\n    request\n  },\n  mutations: {\n    setStatus,\n    setQuery,\n    setParams(state, params) {\n      state.params = params;\n    },\n    setRelatedPromptsProducts(state, products) {\n      state.relatedPrompts = products;\n    },\n    setSelectedPrompt(state, selectedPrompt) {\n      state.selectedPrompt = selectedPrompt;\n    },\n    setSelectedQuery(state, selectedQuery) {\n      state.selectedQuery = selectedQuery;\n    },\n    resetRelatedPromptsState(state) {\n      state.selectedQuery = -1;\n      state.selectedPrompt = -1;\n      state.relatedPrompts = [];\n    }\n  },\n  actions: {\n    fetchRelatedPrompts,\n    fetchAndSaveRelatedPrompts,\n    cancelFetchAndSaveRelatedPrompts\n  }\n};\n"],"names":[],"mappings":";;;;;;AAUA;;;;AAIG;AACU,MAAA,0BAA0B,GAA+B;AACpE,IAAA,KAAK,EAAE,OAAO;AACZ,QAAA,KAAK,EAAE,EAAE;AACT,QAAA,cAAc,EAAE,EAAE;QAClB,cAAc,EAAE,CAAC,CAAC;QAClB,aAAa,EAAE,CAAC,CAAC;AACjB,QAAA,MAAM,EAAE,SAAS;AACjB,QAAA,MAAM,EAAE,EAAE;KACX,CAAC;AACF,IAAA,OAAO,EAAE;QACP,OAAO;AACR,KAAA;AACD,IAAA,SAAS,EAAE;QACT,SAAS;QACT,QAAQ;QACR,SAAS,CAAC,KAAK,EAAE,MAAM,EAAA;AACrB,YAAA,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;SACvB;QACD,yBAAyB,CAAC,KAAK,EAAE,QAAQ,EAAA;AACvC,YAAA,KAAK,CAAC,cAAc,GAAG,QAAQ,CAAC;SACjC;QACD,iBAAiB,CAAC,KAAK,EAAE,cAAc,EAAA;AACrC,YAAA,KAAK,CAAC,cAAc,GAAG,cAAc,CAAC;SACvC;QACD,gBAAgB,CAAC,KAAK,EAAE,aAAa,EAAA;AACnC,YAAA,KAAK,CAAC,aAAa,GAAG,aAAa,CAAC;SACrC;AACD,QAAA,wBAAwB,CAAC,KAAK,EAAA;AAC5B,YAAA,KAAK,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC;AACzB,YAAA,KAAK,CAAC,cAAc,GAAG,CAAC,CAAC,CAAC;AAC1B,YAAA,KAAK,CAAC,cAAc,GAAG,EAAE,CAAC;SAC3B;AACF,KAAA;AACD,IAAA,OAAO,EAAE;QACP,mBAAmB;QACnB,0BAA0B;QAC1B,gCAAgC;AACjC,KAAA;;;;;"}
+{"version":3,"file":"module.js","sources":["../../../../../src/x-modules/related-prompts/store/module.ts"],"sourcesContent":["import { setStatus } from '../../../store/utils/status-store.utils';\nimport { setQuery } from '../../../store/utils/query.utils';\nimport { RelatedPromptsXStoreModule } from './types';\nimport {\n  cancelFetchAndSaveRelatedPrompts,\n  fetchAndSaveRelatedPrompts\n} from './actions/fetch-and-save-related-prompts.action';\nimport { fetchRelatedPrompts } from './actions/fetch-related-prompts.action';\nimport { request } from './getters/request.getter';\n\n/**\n * {@link XStoreModule} For the related prompt module.\n *\n * @internal\n */\nexport const relatedPromptsXStoreModule: RelatedPromptsXStoreModule = {\n  state: () => ({\n    query: '',\n    relatedPrompts: [],\n    selectedPrompt: -1,\n    selectedQuery: -1,\n    status: 'initial',\n    params: {}\n  }),\n  getters: {\n    request\n  },\n  mutations: {\n    setStatus,\n    setQuery,\n    setParams(state, params) {\n      state.params = params;\n    },\n    setRelatedPromptsProducts(state, products) {\n      state.relatedPrompts = products;\n    },\n    setSelectedPrompt(state, selectedPrompt) {\n      if (state.selectedPrompt === selectedPrompt) {\n        state.selectedPrompt = -1;\n      } else {\n        state.selectedPrompt = selectedPrompt;\n      }\n    },\n    setSelectedQuery(state, selectedQuery) {\n      state.selectedQuery = selectedQuery;\n    },\n    resetRelatedPromptsState(state) {\n      state.selectedQuery = -1;\n      state.selectedPrompt = -1;\n      state.relatedPrompts = [];\n    },\n    resetSelectedPrompt(state) {\n      state.selectedPrompt = -1;\n    }\n  },\n  actions: {\n    fetchRelatedPrompts,\n    fetchAndSaveRelatedPrompts,\n    cancelFetchAndSaveRelatedPrompts\n  }\n};\n"],"names":[],"mappings":";;;;;;AAUA;;;;AAIG;AACU,MAAA,0BAA0B,GAA+B;AACpE,IAAA,KAAK,EAAE,OAAO;AACZ,QAAA,KAAK,EAAE,EAAE;AACT,QAAA,cAAc,EAAE,EAAE;QAClB,cAAc,EAAE,CAAC,CAAC;QAClB,aAAa,EAAE,CAAC,CAAC;AACjB,QAAA,MAAM,EAAE,SAAS;AACjB,QAAA,MAAM,EAAE,EAAE;KACX,CAAC;AACF,IAAA,OAAO,EAAE;QACP,OAAO;AACR,KAAA;AACD,IAAA,SAAS,EAAE;QACT,SAAS;QACT,QAAQ;QACR,SAAS,CAAC,KAAK,EAAE,MAAM,EAAA;AACrB,YAAA,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;SACvB;QACD,yBAAyB,CAAC,KAAK,EAAE,QAAQ,EAAA;AACvC,YAAA,KAAK,CAAC,cAAc,GAAG,QAAQ,CAAC;SACjC;QACD,iBAAiB,CAAC,KAAK,EAAE,cAAc,EAAA;AACrC,YAAA,IAAI,KAAK,CAAC,cAAc,KAAK,cAAc,EAAE;AAC3C,gBAAA,KAAK,CAAC,cAAc,GAAG,CAAC,CAAC,CAAC;AAC3B,aAAA;AAAM,iBAAA;AACL,gBAAA,KAAK,CAAC,cAAc,GAAG,cAAc,CAAC;AACvC,aAAA;SACF;QACD,gBAAgB,CAAC,KAAK,EAAE,aAAa,EAAA;AACnC,YAAA,KAAK,CAAC,aAAa,GAAG,aAAa,CAAC;SACrC;AACD,QAAA,wBAAwB,CAAC,KAAK,EAAA;AAC5B,YAAA,KAAK,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC;AACzB,YAAA,KAAK,CAAC,cAAc,GAAG,CAAC,CAAC,CAAC;AAC1B,YAAA,KAAK,CAAC,cAAc,GAAG,EAAE,CAAC;SAC3B;AACD,QAAA,mBAAmB,CAAC,KAAK,EAAA;AACvB,YAAA,KAAK,CAAC,cAAc,GAAG,CAAC,CAAC,CAAC;SAC3B;AACF,KAAA;AACD,IAAA,OAAO,EAAE;QACP,mBAAmB;QACnB,0BAA0B;QAC1B,gCAAgC;AACjC,KAAA;;;;;"}

package/js/x-modules/related-prompts/wiring.js

@@ -45,6 +45,10 @@ const setRelatedPromptsExtraParams = wireCommit('setParams');
  * Resets the related prompts state.
  */
 const resetRelatedPromptsStateWire = wireCommitWithoutPayload('resetRelatedPromptsState');
+/**
+ * Resets the selected related prompt number.
+ */
+const resetSelectedPromptWire = wireCommitWithoutPayload('resetSelectedPrompt');
 /**
  * Fetches and saves the related prompts response.
  */
@@ -81,6 +85,12 @@ const relatedPromptsWiring = createWiring({
     },
     UserSelectedARelatedPromptQuery: {
         setSelectedQueryWire
+    },
+    UserAcceptedAQueryPreview: {
+        resetSelectedPromptWire
+    },
+    SearchRequestChanged: {
+        resetSelectedPromptWire
     }
 });
 

package/js/x-modules/related-prompts/wiring.js.map

@@ -1 +1 @@
-{"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/related-prompts/wiring.ts"],"sourcesContent":["import {\n  namespacedWireCommit,\n  namespacedWireCommitWithoutPayload,\n  namespacedWireDispatch,\n  namespacedWireDispatchWithoutPayload\n} from '../../wiring/namespaced-wires.factory';\nimport {\n  NamespacedWireCommit,\n  NamespacedWireCommitWithoutPayload\n} from '../../wiring/namespaced-wiring.types';\nimport { createWiring } from '../../wiring/wiring.utils';\n\n/**\n * `relatedPrompts` {@link XModuleName | XModule name}.\n */\nconst moduleName = 'relatedPrompts';\n\n/**\n * WireCommit for {@link RelatedPromptsXModule}.\n */\nconst wireCommit: NamespacedWireCommit<typeof moduleName> = namespacedWireCommit(moduleName);\n\n/**\n * WireCommitWithoutPayload for {@link RelatedPromptsXModule}.\n */\nconst wireCommitWithoutPayload: NamespacedWireCommitWithoutPayload<typeof moduleName> =\n  namespacedWireCommitWithoutPayload(moduleName);\n\n/**\n * WireDispatch for {@link RelatedPromptsXModule}.\n */\nconst wireDispatch = namespacedWireDispatch(moduleName);\n\n/**\n * WireDispatchWithoutPayload for {@link RelatedPromptsXModule}.\n */\nconst wireDispatchWithoutPayload = namespacedWireDispatchWithoutPayload(moduleName);\n\n/**\n * Sets the related prompts state `query`.\n */\nconst setRelatedPromptsQuery = wireCommit('setQuery');\n\n/**\n * Sets the related prompts state `selectedPrompt`.\n */\nconst setSelectedPromptWire = wireCommit('setSelectedPrompt');\n\n/**\n * Sets the related prompts state `selectedQuery`.\n */\nconst setSelectedQueryWire = wireCommit('setSelectedQuery');\n\n/**\n * Sets the related prompts state `query` from url params.\n */\nconst setRelatedPromptsQueryFromUrl = wireCommit(\n  'setQuery',\n  ({ eventPayload: { query } }) => query\n);\n\n/**\n * Sets the related prompts state `params`.\n */\nconst setRelatedPromptsExtraParams = wireCommit('setParams');\n\n/**\n * Resets the related prompts state.\n */\nconst resetRelatedPromptsStateWire = wireCommitWithoutPayload('resetRelatedPromptsState');\n\n/**\n * Fetches and saves the related prompts response.\n */\nconst fetchAndSaveRelatedPromptsResponseWire = wireDispatch('fetchAndSaveRelatedPrompts');\n\n/**\n * Cancels the fetch and save related prompts response.\n */\nconst cancelFetchAndSaveSearchResponseWire = wireDispatchWithoutPayload(\n  'cancelFetchAndSaveRelatedPrompts'\n);\n\n/**\n * Wiring configuration for the {@link RelatedPromptsXModule | related prompts module}.\n *\n * @internal\n */\nexport const relatedPromptsWiring = createWiring({\n  ParamsLoadedFromUrl: {\n    setRelatedPromptsQueryFromUrl\n  },\n  UserAcceptedAQuery: {\n    setRelatedPromptsQuery\n  },\n  UserClearedQuery: {\n    cancelFetchAndSaveSearchResponseWire,\n    resetRelatedPromptsStateWire,\n    setRelatedPromptsQuery\n  },\n  RelatedPromptsRequestUpdated: {\n    fetchAndSaveRelatedPromptsResponseWire\n  },\n  ExtraParamsChanged: {\n    setRelatedPromptsExtraParams\n  },\n  UserSelectedARelatedPrompt: {\n    setSelectedPromptWire\n  },\n  UserSelectedARelatedPromptQuery: {\n    setSelectedQueryWire\n  }\n});\n"],"names":[],"mappings":";;;AAYA;;AAEG;AACH,MAAM,UAAU,GAAG,gBAAgB,CAAC;AAEpC;;AAEG;AACH,MAAM,UAAU,GAA4C,oBAAoB,CAAC,UAAU,CAAC,CAAC;AAE7F;;AAEG;AACH,MAAM,wBAAwB,GAC5B,kCAAkC,CAAC,UAAU,CAAC,CAAC;AAEjD;;AAEG;AACH,MAAM,YAAY,GAAG,sBAAsB,CAAC,UAAU,CAAC,CAAC;AAExD;;AAEG;AACH,MAAM,0BAA0B,GAAG,oCAAoC,CAAC,UAAU,CAAC,CAAC;AAEpF;;AAEG;AACH,MAAM,sBAAsB,GAAG,UAAU,CAAC,UAAU,CAAC,CAAC;AAEtD;;AAEG;AACH,MAAM,qBAAqB,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;AAE9D;;AAEG;AACH,MAAM,oBAAoB,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC;AAE5D;;AAEG;AACH,MAAM,6BAA6B,GAAG,UAAU,CAC9C,UAAU,EACV,CAAC,EAAE,YAAY,EAAE,EAAE,KAAK,EAAE,EAAE,KAAK,KAAK,CACvC,CAAC;AAEF;;AAEG;AACH,MAAM,4BAA4B,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;AAE7D;;AAEG;AACH,MAAM,4BAA4B,GAAG,wBAAwB,CAAC,0BAA0B,CAAC,CAAC;AAE1F;;AAEG;AACH,MAAM,sCAAsC,GAAG,YAAY,CAAC,4BAA4B,CAAC,CAAC;AAE1F;;AAEG;AACH,MAAM,oCAAoC,GAAG,0BAA0B,CACrE,kCAAkC,CACnC,CAAC;AAEF;;;;AAIG;AACI,MAAM,oBAAoB,GAAG,YAAY,CAAC;AAC/C,IAAA,mBAAmB,EAAE;QACnB,6BAA6B;AAC9B,KAAA;AACD,IAAA,kBAAkB,EAAE;QAClB,sBAAsB;AACvB,KAAA;AACD,IAAA,gBAAgB,EAAE;QAChB,oCAAoC;QACpC,4BAA4B;QAC5B,sBAAsB;AACvB,KAAA;AACD,IAAA,4BAA4B,EAAE;QAC5B,sCAAsC;AACvC,KAAA;AACD,IAAA,kBAAkB,EAAE;QAClB,4BAA4B;AAC7B,KAAA;AACD,IAAA,0BAA0B,EAAE;QAC1B,qBAAqB;AACtB,KAAA;AACD,IAAA,+BAA+B,EAAE;QAC/B,oBAAoB;AACrB,KAAA;AACF,CAAA;;;;"}
+{"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/related-prompts/wiring.ts"],"sourcesContent":["import {\n  namespacedWireCommit,\n  namespacedWireCommitWithoutPayload,\n  namespacedWireDispatch,\n  namespacedWireDispatchWithoutPayload\n} from '../../wiring/namespaced-wires.factory';\nimport {\n  NamespacedWireCommit,\n  NamespacedWireCommitWithoutPayload\n} from '../../wiring/namespaced-wiring.types';\nimport { createWiring } from '../../wiring/wiring.utils';\n\n/**\n * `relatedPrompts` {@link XModuleName | XModule name}.\n */\nconst moduleName = 'relatedPrompts';\n\n/**\n * WireCommit for {@link RelatedPromptsXModule}.\n */\nconst wireCommit: NamespacedWireCommit<typeof moduleName> = namespacedWireCommit(moduleName);\n\n/**\n * WireCommitWithoutPayload for {@link RelatedPromptsXModule}.\n */\nconst wireCommitWithoutPayload: NamespacedWireCommitWithoutPayload<typeof moduleName> =\n  namespacedWireCommitWithoutPayload(moduleName);\n\n/**\n * WireDispatch for {@link RelatedPromptsXModule}.\n */\nconst wireDispatch = namespacedWireDispatch(moduleName);\n\n/**\n * WireDispatchWithoutPayload for {@link RelatedPromptsXModule}.\n */\nconst wireDispatchWithoutPayload = namespacedWireDispatchWithoutPayload(moduleName);\n\n/**\n * Sets the related prompts state `query`.\n */\nconst setRelatedPromptsQuery = wireCommit('setQuery');\n\n/**\n * Sets the related prompts state `selectedPrompt`.\n */\nconst setSelectedPromptWire = wireCommit('setSelectedPrompt');\n\n/**\n * Sets the related prompts state `selectedQuery`.\n */\nconst setSelectedQueryWire = wireCommit('setSelectedQuery');\n\n/**\n * Sets the related prompts state `query` from url params.\n */\nconst setRelatedPromptsQueryFromUrl = wireCommit(\n  'setQuery',\n  ({ eventPayload: { query } }) => query\n);\n\n/**\n * Sets the related prompts state `params`.\n */\nconst setRelatedPromptsExtraParams = wireCommit('setParams');\n\n/**\n * Resets the related prompts state.\n */\nconst resetRelatedPromptsStateWire = wireCommitWithoutPayload('resetRelatedPromptsState');\n\n/**\n * Resets the selected related prompt number.\n */\nconst resetSelectedPromptWire = wireCommitWithoutPayload('resetSelectedPrompt');\n\n/**\n * Fetches and saves the related prompts response.\n */\nconst fetchAndSaveRelatedPromptsResponseWire = wireDispatch('fetchAndSaveRelatedPrompts');\n\n/**\n * Cancels the fetch and save related prompts response.\n */\nconst cancelFetchAndSaveSearchResponseWire = wireDispatchWithoutPayload(\n  'cancelFetchAndSaveRelatedPrompts'\n);\n\n/**\n * Wiring configuration for the {@link RelatedPromptsXModule | related prompts module}.\n *\n * @internal\n */\nexport const relatedPromptsWiring = createWiring({\n  ParamsLoadedFromUrl: {\n    setRelatedPromptsQueryFromUrl\n  },\n  UserAcceptedAQuery: {\n    setRelatedPromptsQuery\n  },\n  UserClearedQuery: {\n    cancelFetchAndSaveSearchResponseWire,\n    resetRelatedPromptsStateWire,\n    setRelatedPromptsQuery\n  },\n  RelatedPromptsRequestUpdated: {\n    fetchAndSaveRelatedPromptsResponseWire\n  },\n  ExtraParamsChanged: {\n    setRelatedPromptsExtraParams\n  },\n  UserSelectedARelatedPrompt: {\n    setSelectedPromptWire\n  },\n  UserSelectedARelatedPromptQuery: {\n    setSelectedQueryWire\n  },\n  UserAcceptedAQueryPreview: {\n    resetSelectedPromptWire\n  },\n  SearchRequestChanged: {\n    resetSelectedPromptWire\n  }\n});\n"],"names":[],"mappings":";;;AAYA;;AAEG;AACH,MAAM,UAAU,GAAG,gBAAgB,CAAC;AAEpC;;AAEG;AACH,MAAM,UAAU,GAA4C,oBAAoB,CAAC,UAAU,CAAC,CAAC;AAE7F;;AAEG;AACH,MAAM,wBAAwB,GAC5B,kCAAkC,CAAC,UAAU,CAAC,CAAC;AAEjD;;AAEG;AACH,MAAM,YAAY,GAAG,sBAAsB,CAAC,UAAU,CAAC,CAAC;AAExD;;AAEG;AACH,MAAM,0BAA0B,GAAG,oCAAoC,CAAC,UAAU,CAAC,CAAC;AAEpF;;AAEG;AACH,MAAM,sBAAsB,GAAG,UAAU,CAAC,UAAU,CAAC,CAAC;AAEtD;;AAEG;AACH,MAAM,qBAAqB,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;AAE9D;;AAEG;AACH,MAAM,oBAAoB,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC;AAE5D;;AAEG;AACH,MAAM,6BAA6B,GAAG,UAAU,CAC9C,UAAU,EACV,CAAC,EAAE,YAAY,EAAE,EAAE,KAAK,EAAE,EAAE,KAAK,KAAK,CACvC,CAAC;AAEF;;AAEG;AACH,MAAM,4BAA4B,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;AAE7D;;AAEG;AACH,MAAM,4BAA4B,GAAG,wBAAwB,CAAC,0BAA0B,CAAC,CAAC;AAE1F;;AAEG;AACH,MAAM,uBAAuB,GAAG,wBAAwB,CAAC,qBAAqB,CAAC,CAAC;AAEhF;;AAEG;AACH,MAAM,sCAAsC,GAAG,YAAY,CAAC,4BAA4B,CAAC,CAAC;AAE1F;;AAEG;AACH,MAAM,oCAAoC,GAAG,0BAA0B,CACrE,kCAAkC,CACnC,CAAC;AAEF;;;;AAIG;AACI,MAAM,oBAAoB,GAAG,YAAY,CAAC;AAC/C,IAAA,mBAAmB,EAAE;QACnB,6BAA6B;AAC9B,KAAA;AACD,IAAA,kBAAkB,EAAE;QAClB,sBAAsB;AACvB,KAAA;AACD,IAAA,gBAAgB,EAAE;QAChB,oCAAoC;QACpC,4BAA4B;QAC5B,sBAAsB;AACvB,KAAA;AACD,IAAA,4BAA4B,EAAE;QAC5B,sCAAsC;AACvC,KAAA;AACD,IAAA,kBAAkB,EAAE;QAClB,4BAA4B;AAC7B,KAAA;AACD,IAAA,0BAA0B,EAAE;QAC1B,qBAAqB;AACtB,KAAA;AACD,IAAA,+BAA+B,EAAE;QAC/B,oBAAoB;AACrB,KAAA;AACD,IAAA,yBAAyB,EAAE;QACzB,uBAAuB;AACxB,KAAA;AACD,IAAA,oBAAoB,EAAE;QACpB,uBAAuB;AACxB,KAAA;AACF,CAAA;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@empathyco/x-components",
-  "version": "6.0.0-alpha.26",
+  "version": "6.0.0-alpha.28",
   "description": "Empathy X Components",
   "author": "Empathy Systems Corporation S.L.",
   "license": "Apache-2.0",
@@ -138,5 +138,5 @@
     "access": "public",
     "directory": "dist"
   },
-  "gitHead": "a4087d2e2ebed52afcd1f3d96b00a0f7c36f054e"
+  "gitHead": "66f60255a67fe290db89301b390ef6b4d65d0baf"
 }

package/related-prompts/index.js

@@ -1,5 +1,6 @@
 export { default as RelatedPrompt } from '../js/x-modules/related-prompts/components/related-prompt.vue.js';
 export { default as RelatedPromptsList } from '../js/x-modules/related-prompts/components/related-prompts-list.vue.js';
+export { default as RelatedPromptsTagList } from '../js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js';
 export { cancelFetchAndSaveRelatedPrompts, fetchAndSaveRelatedPrompts } from '../js/x-modules/related-prompts/store/actions/fetch-and-save-related-prompts.action.js';
 export { fetchRelatedPrompts } from '../js/x-modules/related-prompts/store/actions/fetch-related-prompts.action.js';
 export { request as relatedPromptRequest } from '../js/x-modules/related-prompts/store/getters/request.getter.js';