@empathyco/x-components 6.0.0-alpha.37 → 6.0.0-alpha.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (78) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/design-system/deprecated-full-theme.css +354 -354
  3. package/docs/API-reference/api/x-adapter-platform.md +3 -0
  4. package/docs/API-reference/api/x-adapter-platform.nextqueriesrelatedpromptsschema.md +11 -0
  5. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompt.md +1 -0
  6. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompt.tagging.md +11 -0
  7. package/docs/API-reference/api/x-adapter-platform.platformrelatedpromptnextqueriestagging.md +22 -0
  8. package/docs/API-reference/api/x-adapter-platform.platformrelatedpromptnextqueriestagging.toolingdisplay.md +11 -0
  9. package/docs/API-reference/api/x-adapter-platform.platformrelatedpromptnextqueriestagging.toolingdisplayadd2cart.md +11 -0
  10. package/docs/API-reference/api/x-adapter-platform.platformrelatedpromptnextqueriestagging.toolingdisplayclick.md +11 -0
  11. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompttagging.md +21 -0
  12. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompttagging.nextqueries.md +11 -0
  13. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompttagging.toolingdisplay.md +11 -0
  14. package/docs/API-reference/api/x-components.baseaddtocart.md +1 -0
  15. package/docs/API-reference/api/x-components.createtracktoolingadd2cartwire.md +19 -0
  16. package/docs/API-reference/api/x-components.createtracktoolingdisplaywire.md +19 -0
  17. package/docs/API-reference/api/x-components.featurelocation.md +1 -1
  18. package/docs/API-reference/api/x-components.globalxbus.md +4 -0
  19. package/docs/API-reference/api/x-components.hierarchicalfilter.md +2 -0
  20. package/docs/API-reference/api/x-components.md +4 -0
  21. package/docs/API-reference/api/x-components.queryfeature.md +1 -1
  22. package/docs/API-reference/api/x-components.relatedpromptstaglist.md +2 -1
  23. package/docs/API-reference/api/x-components.relatedpromptsxevents.md +2 -0
  24. package/docs/API-reference/api/x-components.relatedpromptsxevents.userclickedarelatedpromptadd2cart.md +13 -0
  25. package/docs/API-reference/api/x-components.relatedpromptsxevents.userclickedarelatedpromptresult.md +13 -0
  26. package/docs/API-reference/api/x-components.simplefilter.md +2 -0
  27. package/docs/API-reference/api/x-components.snippetcallbacks.md +2 -0
  28. package/docs/API-reference/api/x-components.tracktoolingadd2cartwire.md +13 -0
  29. package/docs/API-reference/api/x-components.tracktoolingdisplayclickedwire.md +13 -0
  30. package/docs/API-reference/api/x-types.md +1 -0
  31. package/docs/API-reference/api/x-types.relatedprompt.md +2 -1
  32. package/docs/API-reference/api/x-types.relatedprompt.relatedpromptnextqueries.md +13 -0
  33. package/docs/API-reference/api/x-types.relatedprompt.toolingdisplaytagging.md +13 -0
  34. package/docs/API-reference/api/x-types.relatedpromptnextquery.md +23 -0
  35. package/docs/API-reference/api/x-types.relatedpromptnextquery.query.md +13 -0
  36. package/docs/API-reference/api/x-types.relatedpromptnextquery.toolingdisplayadd2carttagging.md +13 -0
  37. package/docs/API-reference/api/x-types.relatedpromptnextquery.toolingdisplayclicktagging.md +13 -0
  38. package/docs/API-reference/api/x-types.relatedpromptnextquery.toolingdisplaytagging.md +13 -0
  39. package/js/components/result/base-result-add-to-cart.vue.js +2 -1
  40. package/js/components/result/base-result-add-to-cart.vue.js.map +1 -1
  41. package/js/components/result/base-result-add-to-cart.vue2.js +19 -5
  42. package/js/components/result/base-result-add-to-cart.vue2.js.map +1 -1
  43. package/js/index.js +1 -1
  44. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js +19 -5
  45. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js.map +1 -1
  46. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js +2 -1
  47. package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js.map +1 -1
  48. package/js/x-modules/tagging/store/module.js +5 -1
  49. package/js/x-modules/tagging/store/module.js.map +1 -1
  50. package/js/x-modules/tagging/wiring.js +64 -1
  51. package/js/x-modules/tagging/wiring.js.map +1 -1
  52. package/package.json +4 -4
  53. package/report/x-adapter-platform.api.json +254 -0
  54. package/report/x-components.api.json +406 -12
  55. package/report/x-components.api.md +37 -4
  56. package/report/x-types.api.json +167 -5
  57. package/tagging/index.js +1 -1
  58. package/types/components/global-x-bus.vue.d.ts +4 -0
  59. package/types/components/global-x-bus.vue.d.ts.map +1 -1
  60. package/types/components/result/base-result-add-to-cart.vue.d.ts +2 -0
  61. package/types/components/result/base-result-add-to-cart.vue.d.ts.map +1 -1
  62. package/types/components/snippet-callbacks.vue.d.ts +2 -0
  63. package/types/components/snippet-callbacks.vue.d.ts.map +1 -1
  64. package/types/types/origin.d.ts +2 -2
  65. package/types/types/origin.d.ts.map +1 -1
  66. package/types/views/adapter.d.ts.map +1 -1
  67. package/types/x-modules/facets/components/filters/hierarchical-filter.vue.d.ts +2 -0
  68. package/types/x-modules/facets/components/filters/hierarchical-filter.vue.d.ts.map +1 -1
  69. package/types/x-modules/facets/components/filters/simple-filter.vue.d.ts +2 -0
  70. package/types/x-modules/facets/components/filters/simple-filter.vue.d.ts.map +1 -1
  71. package/types/x-modules/related-prompts/components/related-prompts-tag-list.vue.d.ts +2 -1
  72. package/types/x-modules/related-prompts/components/related-prompts-tag-list.vue.d.ts.map +1 -1
  73. package/types/x-modules/related-prompts/events.types.d.ts +11 -1
  74. package/types/x-modules/related-prompts/events.types.d.ts.map +1 -1
  75. package/types/x-modules/tagging/store/module.d.ts.map +1 -1
  76. package/types/x-modules/tagging/wiring.d.ts +36 -2
  77. package/types/x-modules/tagging/wiring.d.ts.map +1 -1
  78. package/docs/API-reference/api/x-types.relatedprompt.nextqueries.md +0 -13
@@ -1 +1 @@
1
- {"version":3,"file":"base-result-add-to-cart.vue2.js","sources":["../../../../src/components/result/base-result-add-to-cart.vue"],"sourcesContent":["<template>\n <BaseEventButton\n :events=\"events\"\n class=\"x-result-add-to-cart x-button\"\n data-test=\"result-add-to-cart\"\n >\n <!-- @slot (Required) Button content with a text, an icon or both -->\n <slot />\n </BaseEventButton>\n</template>\n\n<script lang=\"ts\">\n import { Result } from '@empathyco/x-types';\n import { computed, defineComponent, PropType } from 'vue';\n import { XEventsTypes } from '../../wiring/events.types';\n import BaseEventButton from '../base-event-button.vue';\n\n /**\n * Renders a button with a default slot. It receives the result with the data and emits\n * {@link XEventsTypes.UserClickedResultAddToCart} to the bus on click mouse event.\n *\n * @public\n */\n export default defineComponent({\n components: { BaseEventButton },\n props: {\n /**\n * (Required) The {@link @empathyco/x-types#Result} information.\n *\n * @public\n */\n result: {\n type: Object as PropType<Result>,\n required: true\n }\n },\n setup(props) {\n /**\n * The events to be emitted by the button.\n *\n * @returns Events {@link XEventsTypes} to emit.\n *\n * @public\n */\n const events = computed<Partial<XEventsTypes>>(() => ({\n UserClickedResultAddToCart: props.result\n }));\n\n return {\n events\n };\n }\n });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserClickedResultAddToCart`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n the event is emitted after the user clicks the button. The event payload is the result data.\n\n## Examples\n\nRenders a button with a default slot. It receives the result with the data and emits an event\n`UserClickedResultAddToCart` to the bus on click mouse event.\n\n### Basic example\n\nThis component is a button to emit `UserClickedResultAddToCart` whe clicked by the user\n\n```vue\n<BaseResultAddToCart :result=\"result\">\n <img src=\"./add-to-cart.svg\" />\n <span>Add to cart</span>\n</BaseResultAddToCart>\n```\n</docs>\n"],"names":[],"mappings":";;;AAiBE;;;;;AAKE;AACF,gBAAe,eAAe,CAAC;IAC7B,UAAU,EAAE,EAAE,eAAc,EAAG;AAC/B,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,QAAQ,EAAE,IAAG;AACf,SAAA;AACD,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT;;;;;;AAME;AACF,QAAA,MAAM,MAAK,GAAI,QAAQ,CAAwB,OAAO;YACpD,0BAA0B,EAAE,KAAK,CAAC,MAAK;AACxC,SAAA,CAAC,CAAC,CAAA;QAEH,OAAO;YACL,MAAK;SACN,CAAA;KACH;AACD,CAAA,CAAC;;;;"}
1
+ {"version":3,"file":"base-result-add-to-cart.vue2.js","sources":["../../../../src/components/result/base-result-add-to-cart.vue"],"sourcesContent":["<template>\n <BaseEventButton\n :events=\"events\"\n :metadata=\"metadata\"\n class=\"x-result-add-to-cart x-button\"\n data-test=\"result-add-to-cart\"\n >\n <!-- @slot (Required) Button content with a text, an icon or both -->\n <slot />\n </BaseEventButton>\n</template>\n\n<script lang=\"ts\">\n import { Result } from '@empathyco/x-types';\n import { computed, defineComponent, PropType, inject } from 'vue';\n import { XEventsTypes } from '../../wiring/events.types';\n import BaseEventButton from '../base-event-button.vue';\n import { PropsWithType } from '../../utils/index';\n import { WireMetadata } from '../../wiring/index';\n\n /**\n * Renders a button with a default slot. It receives the result with the data and emits\n * {@link XEventsTypes.UserClickedResultAddToCart} to the bus on click mouse event.\n *\n * @public\n */\n export default defineComponent({\n components: { BaseEventButton },\n props: {\n /**\n * (Required) The {@link @empathyco/x-types#Result} information.\n *\n * @public\n */\n result: {\n type: Object as PropType<Result>,\n required: true\n }\n },\n setup(props) {\n /**\n * The list of additional events to be emitted by the component when user clicks the add2cart button.\n *\n * @internal\n */\n const resultAddToCartExtraEvents = inject<PropsWithType<XEventsTypes, Result>[]>(\n 'resultAddToCartExtraEvents',\n []\n );\n\n /**\n * The metadata to be injected in the events emitted by the component.\n */\n const metadata = inject<Omit<WireMetadata, 'moduleName' | 'origin' | 'location'>>(\n 'resultAddToCartExtraEventsMetadata',\n {}\n );\n\n /**\n * The events to be emitted by the button.\n *\n * @returns Events {@link XEventsTypes} to emit.\n *\n * @public\n */\n const events = computed(() => {\n return resultAddToCartExtraEvents.reduce(\n (acc, event) => {\n acc[event] = props.result;\n return acc;\n },\n { UserClickedResultAddToCart: props.result } as Partial<XEventsTypes>\n );\n });\n\n return {\n events,\n metadata\n };\n }\n });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserClickedResultAddToCart`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n the event is emitted after the user clicks the button. The event payload is the result data.\n\n## Examples\n\nRenders a button with a default slot. It receives the result with the data and emits an event\n`UserClickedResultAddToCart` to the bus on click mouse event.\n\n### Basic example\n\nThis component is a button to emit `UserClickedResultAddToCart` whe clicked by the user\n\n```vue\n<BaseResultAddToCart :result=\"result\">\n <img src=\"./add-to-cart.svg\" />\n <span>Add to cart</span>\n</BaseResultAddToCart>\n```\n</docs>\n"],"names":[],"mappings":";;;AAoBE;;;;;AAKE;AACF,gBAAe,eAAe,CAAC;IAC7B,UAAU,EAAE,EAAE,eAAc,EAAG;AAC/B,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,MAA0B;AAChC,YAAA,QAAQ,EAAE,IAAG;AACf,SAAA;AACD,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT;;;;AAIE;QACF,MAAM,6BAA6B,MAAM,CACvC,4BAA4B,EAC5B,EAAC,CACF,CAAA;AAED;;AAEE;QACF,MAAM,QAAS,GAAE,MAAM,CACrB,oCAAoC,EACpC,EAAC,CACF,CAAA;AAED;;;;;;AAME;AACF,QAAA,MAAM,MAAO,GAAE,QAAQ,CAAC,MAAM;YAC5B,OAAO,0BAA0B,CAAC,MAAM,CACtC,CAAC,GAAG,EAAE,KAAK,KAAK;AACd,gBAAA,GAAG,CAAC,KAAK,CAAE,GAAE,KAAK,CAAC,MAAM,CAAA;AACzB,gBAAA,OAAO,GAAG,CAAA;aACX,EACD,EAAE,0BAA0B,EAAE,KAAK,CAAC,MAAO,EAAyB,CACrE,CAAA;AACH,SAAC,CAAC,CAAA;QAEF,OAAO;YACL,MAAM;YACN,QAAO;SACR,CAAA;KACH;AACD,CAAA,CAAC;;;;"}
package/js/index.js CHANGED
@@ -409,7 +409,7 @@ export { DefaultPDPAddToCartService } from './x-modules/tagging/service/pdp-add-
409
409
  export { track } from './x-modules/tagging/store/actions/track.action.js';
410
410
  export { taggingEmitters } from './x-modules/tagging/store/emitters.js';
411
411
  export { taggingXStoreModule } from './x-modules/tagging/store/module.js';
412
- export { createSetQueryTaggingFromQueryPreview, createTrackDisplayWire, createTrackWire, setConsent, setNoResultsTaggingEnabledWire, setQueryTaggingFromQueryPreview, setQueryTaggingInfo, setTaggingConfig, taggingWiring, trackAddToCartWire, trackBannerClickedWire, trackDisplayClickedWire, trackElementDisplayedWire, trackNoResultsQueryWithSemanticsWire, trackNoResultsQueryWithSemanticsWireDebounced, trackQueryWire, trackResultClickedWire } from './x-modules/tagging/wiring.js';
412
+ export { createSetQueryTaggingFromQueryPreview, createTrackDisplayWire, createTrackToolingAdd2CartWire, createTrackToolingDisplayWire, createTrackWire, setConsent, setNoResultsTaggingEnabledWire, setQueryTaggingFromQueryPreview, setQueryTaggingInfo, setTaggingConfig, taggingWiring, trackAddToCartWire, trackBannerClickedWire, trackDisplayClickedWire, trackElementDisplayedWire, trackNoResultsQueryWithSemanticsWire, trackNoResultsQueryWithSemanticsWireDebounced, trackQueryWire, trackResultClickedWire, trackToolingAdd2CartWire, trackToolingDisplayClickedWire } from './x-modules/tagging/wiring.js';
413
413
  export { taggingXModule } from './x-modules/tagging/x-module.js';
414
414
  export { default as UrlHandler } from './x-modules/url/components/url-handler.vue.js';
415
415
  export { replaceableParams, urlEmitters } from './x-modules/url/store/emitters.js';
@@ -6,6 +6,7 @@ import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.js';
6
6
  const _hoisted_1 = ["data-index"];
7
7
  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
8
8
  const _component_RelatedPrompt = resolveComponent("RelatedPrompt");
9
+ const _component_DisplayEmitter = resolveComponent("DisplayEmitter");
9
10
  const _component_SlidingPanel = resolveComponent("SlidingPanel");
10
11
  return openBlock(), createBlock(_component_SlidingPanel, {
11
12
  key: _ctx.x.query.search,
@@ -48,11 +49,24 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
48
49
  onSelect: () => _ctx.onSelect(index),
49
50
  isSelected: _ctx.isSelected(index)
50
51
  }, () => [
51
- createVNode(_component_RelatedPrompt, {
52
- onClick: ($event) => _ctx.onSelect(index),
53
- "related-prompt": relatedPrompt,
54
- selected: _ctx.isSelected(index)
55
- }, null, 8, ["onClick", "related-prompt", "selected"])
52
+ createVNode(_component_DisplayEmitter, {
53
+ payload: relatedPrompt.toolingDisplayTagging,
54
+ eventMetadata: {
55
+ feature: "related-prompts",
56
+ displayOriginalQuery: _ctx.x.query.searchBox,
57
+ replaceable: false
58
+ }
59
+ }, {
60
+ default: withCtx(() => [
61
+ createVNode(_component_RelatedPrompt, {
62
+ onClick: ($event) => _ctx.onSelect(index),
63
+ "related-prompt": relatedPrompt,
64
+ selected: _ctx.isSelected(index)
65
+ }, null, 8, ["onClick", "related-prompt", "selected"])
66
+ ]),
67
+ _: 2
68
+ /* DYNAMIC */
69
+ }, 1032, ["payload", "eventMetadata"])
56
70
  ])
57
71
  ], 14, _hoisted_1);
58
72
  }),
@@ -1 +1 @@
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 <SlidingPanel\n :key=\"x.query.search\"\n :reset-on-content-change=\"false\"\n :button-class=\"buttonClass\"\n scroll-container-class=\"x-related-prompts-tag-list-scroll-container\"\n >\n <template #sliding-panel-left-button>\n <!-- \n @slot sliding-panel-left-button - The button to be displayed on the left side of the sliding panel. \n -->\n <slot name=\"sliding-panel-left-button\" />\n </template>\n <transition-group\n @before-enter=\"onBeforeEnter\"\n @enter=\"onEnter\"\n @leave=\"onLeave\"\n class=\"x-related-prompts-tag-list\"\n :css=\"false\"\n tag=\"ul\"\n appear\n >\n <li\n v-for=\"{ index, ...relatedPrompt } in visibleRelatedPrompts\"\n ref=\"listItems\"\n :key=\"relatedPrompt.suggestionText\"\n class=\"x-related-prompts-tag-list-item\"\n :class=\"[tagClass, tagColors && tagColors[index % tagColors.length]]\"\n :data-index=\"index\"\n :style=\"isAnimating && { pointerEvents: 'none' }\"\n data-test=\"related-prompts-tag-list-item\"\n >\n <!--\n @slot - The slot to render related prompt information.\n @prop {Object} relatedPrompt - The related prompt object.\n @prop {Function} onSelect - The function to select the related prompt.\n @prop {Boolean} isSelected - Indicates if the related prompt is currently selected.\n -->\n <slot\n :relatedPrompt=\"relatedPrompt\"\n :onSelect=\"() => onSelect(index)\"\n :isSelected=\"isSelected(index)\"\n >\n <RelatedPrompt\n @click=\"onSelect(index)\"\n :related-prompt=\"relatedPrompt\"\n :selected=\"isSelected(index)\"\n />\n </slot>\n </li>\n </transition-group>\n <template #sliding-panel-right-button>\n <!-- \n @slot sliding-panel-right-button - The button to be displayed on the right side of the sliding panel. \n -->\n <slot name=\"sliding-panel-right-button\" />\n </template>\n </SlidingPanel>\n</template>\n\n<script lang=\"ts\">\n import { RelatedPrompt as RelatedPromptModel } from '@empathyco/x-types';\n import { computed, defineComponent, PropType, ref, watch } from 'vue';\n import SlidingPanel from '../../../components/sliding-panel.vue';\n import { relatedPromptsXModule } from '../x-module';\n import { use$x, useState } from '../../../composables';\n import RelatedPrompt from './related-prompt.vue';\n\n /**\n * This component shows the list of `RelatedPrompts` components.\n *\n * If the default slot is reimplemented in the consumer, `onSelect` function will be\n * necessary to handle the selection of the related prompt and to trigger the stagger-fade-slide animation.\n *\n * @public\n */\n export default defineComponent({\n name: 'RelatedPromptsTagList',\n xModule: relatedPromptsXModule.name,\n components: { RelatedPrompt, SlidingPanel },\n props: {\n /**\n * The CSS class for the left and right button of the sliding panel.\n *\n * @public\n */\n buttonClass: String,\n /**\n * The CSS class for all the related prompt wrapper elements.\n *\n * @public\n */\n tagClass: String,\n /**\n * Array of colors to apply to the related prompts. It will be applied to tag\n * elements cyclically according to their index in the nex way: `tagColors[index % tagColors.length]`.\n *\n * @public\n */\n tagColors: Array as PropType<string[]>,\n /**\n * The duration of the total animation in milliseconds.\n *\n * @public\n */\n animationDurationInMs: {\n type: Number,\n default: 700\n }\n },\n setup(props) {\n const x = use$x();\n const { relatedPrompts, selectedPrompt: selectedPromptIndex } = useState('relatedPrompts', [\n 'relatedPrompts',\n 'selectedPrompt'\n ]);\n\n const clickedListItemIndex = ref<number | null>(null);\n const initialOffsetLefts: Record<number, number> = {};\n const isAnimating = ref(false);\n const listItems = ref<HTMLElement[]>([]);\n\n const sortedListItems = computed<HTMLElement[]>(() =>\n [...listItems.value].sort(\n (a: HTMLElement, b: HTMLElement) =>\n Number.parseInt(b.getAttribute('data-index')!) -\n Number.parseInt(a.getAttribute('data-index')!)\n )\n );\n\n // The duration of a single animation (enter or leave) in milliseconds\n // if a related prompt is clicked (clickedListItemIndex.value !== null), the duration is divided by the number of related\n // prompts -1 (the clicked one is synchronized with the last one to leave or the first one to enter)\n const singleAnimationDurationInMs = computed(\n () =>\n props.animationDurationInMs /\n (clickedListItemIndex.value !== null\n ? relatedPrompts.value.length - 1\n : relatedPrompts.value.length)\n );\n\n const indexRelatedPrompts = computed(() =>\n (relatedPrompts.value as RelatedPromptModel[]).map(\n (relatedPrompt: RelatedPromptModel, index: number) => ({\n ...relatedPrompt,\n index\n })\n )\n );\n\n const visibleRelatedPrompts = computed(() => {\n return selectedPromptIndex.value !== -1\n ? [indexRelatedPrompts.value[selectedPromptIndex.value]]\n : indexRelatedPrompts.value;\n });\n\n let timeOutId: number;\n const resetTransitionStyle = () => {\n if (timeOutId) {\n clearTimeout(timeOutId);\n }\n\n isAnimating.value = true;\n timeOutId = +setTimeout(() => {\n isAnimating.value = false;\n clickedListItemIndex.value = null;\n\n sortedListItems.value.forEach(element => {\n element.style.cssText\n .split(';')\n .map(rule => rule.split(':')[0]?.trim())\n .forEach(property => {\n if (property !== 'width') {\n element.style.removeProperty(property);\n }\n });\n });\n }, props.animationDurationInMs);\n };\n\n const onSelect = (selectedIndex: number): void => {\n resetTransitionStyle();\n\n clickedListItemIndex.value = selectedIndex;\n const selected: HTMLElement = sortedListItems.value.find(\n element => Number.parseInt(element.getAttribute('data-index')!) === selectedIndex\n )!;\n\n // selectedPromptIndex.value === -1 ? 'SELECTING' : 'DESELECTING'\n if (selectedPromptIndex.value === -1) {\n // Prepare all the elements for the leave animation (~ 'beforeLeave' hook). Remember the elements are\n // sorted in descending order by index.\n sortedListItems.value.forEach(element => {\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n initialOffsetLefts[index] = element.offsetLeft;\n element.style.left = `${element.offsetLeft}px`;\n element.style.position = 'absolute';\n element.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n\n if (index !== selectedIndex) {\n element.style.opacity = '1';\n element.style.transitionDelay = `${\n (index < selectedIndex ? index : index - 1) * singleAnimationDurationInMs.value\n }ms`;\n }\n });\n\n // Synchronize the transition delay of the selected element with the last\n // element to leave\n selected.style.transitionDelay = `${\n (relatedPrompts.value.length > 1 ? relatedPrompts.value.length - 2 : 0) *\n singleAnimationDurationInMs.value\n }ms`;\n\n // Trigger the animation (selecting) for the selected element\n requestAnimationFrame(() => {\n const maxWidth = getComputedStyle(selected).maxWidth;\n\n selected.style.left = '0px';\n selected.style.setProperty(\n 'width',\n `${maxWidth !== 'none' ? maxWidth : '100%'}`,\n 'important'\n );\n });\n } else {\n // Prepare the selected element for the deselecting animation\n selected.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n selected.style.left = '0px';\n selected.style.position = 'absolute';\n\n // Trigger the animation (deselecting) for the selected element\n selected.style.removeProperty('width');\n requestAnimationFrame(() => {\n selected.style.left = `${initialOffsetLefts[selectedIndex]}px`;\n });\n }\n\n x.emit('UserSelectedARelatedPrompt', selectedIndex);\n };\n\n const onBeforeEnter = (el: Element) => {\n const element = el as HTMLElement;\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n // Prepare the element for the enter animation\n element.style.opacity = '0';\n element.style.transform = 'translateY(5px)';\n element.style.transitionDelay = `${\n (clickedListItemIndex.value !== null && index > clickedListItemIndex.value\n ? index - 1\n : index) * singleAnimationDurationInMs.value\n }ms`;\n element.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n };\n\n const onEnter = (el: Element, done: () => void) => {\n const element = el as HTMLElement;\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n // Also part of the preparation for the enter animation, but it needs to be done\n // once the element is inserted in DOM (if not the offsetLeft will be always 0)\n element.style.left = `${initialOffsetLefts[index] ?? element.offsetLeft}px`;\n\n // trigger enter animation\n requestAnimationFrame(() => {\n element.style.opacity = '1';\n element.style.position = 'absolute';\n element.style.transform = 'translateY(0)';\n });\n\n done();\n };\n\n const onLeave = (el: Element, done: () => void) => {\n const element = el as HTMLElement;\n\n // trigger leave animation\n requestAnimationFrame(() => {\n element.style.opacity = '0';\n element.style.transform = 'translateY(5px)';\n });\n\n // Wait for the animation to finish (done() exectution extracts the element from the DOM)\n setTimeout(done, props.animationDurationInMs);\n };\n\n const isSelected = (index: number): boolean => selectedPromptIndex.value === index;\n\n // Changing the query will trigger the appear animation, so we need to reset the\n // style after it finishes\n watch(() => x.query.search, resetTransitionStyle, { immediate: true });\n\n return {\n isSelected,\n onSelect,\n onBeforeEnter,\n onEnter,\n onLeave,\n selectedPromptIndex,\n visibleRelatedPrompts,\n listItems,\n isAnimating,\n x\n };\n }\n });\n</script>\n<style lang=\"css\">\n .x-related-prompts-tag-list-scroll-container {\n height: 100%;\n position: relative;\n }\n .x-related-prompts-tag-list {\n display: flex;\n gap: 16px;\n min-width: 100%;\n }\n .x-related-prompts-tag-list-item {\n height: 100%;\n }\n</style>\n"],"names":["_resolveComponent","_openBlock","_createBlock","buttonClass","_renderSlot","_withCtx","onBeforeEnter","onEnter","onLeave","_createElementBlock","_Fragment","_renderList","_normalizeClass","isAnimating","_normalizeStyle","onSelect","_createVNode","isSelected"],"mappings":";;;;;;;;kCACEA,gBAwDe,CAAA,cAAA,CAAA,CAAA;SAtDZC,SAA8B,EAAA,EAAAC,WAAA,CAAA,uBAAA,EAAA;AAAA,IAC9B,GAAcC,EAAAA,IAAAA,CAAAA,CAAAA,CAAAA,KAAAA,CAAAA,MAAAA;AAAAA,IACf,yBAAuB,EAAA,KAAA;AAAA,IAAA,cAAA,EAAA,IAAA,CAAA,WAAA;AAEZ,IAAA,wBAAA,EAAA,6CAAA;AAAA,GAAA,EAAA;;MA4CAC,UAIiC,CAAA,IAAA,CAAA,MAAA,EAAA,2BAAA,CAAA;AAAA,KAAA,CAAA;;MAvDhDA,UAkDuB,CAAA,IAAA,CAAA,MAAA,EAAA,4BAAA,CAAA;AAAA,KAAA,CAAA;AApChB,IAAA,OAAA,EAAAC,OAAA,CAAY,MAAEC;AAAAA,MAAAA,WAAAA,CACPC,eAAO,EAAA;AAAA,QACd,aAAOC,EAAAA,IAAAA,CAAAA,aAAAA;AAAAA,QACR,OAAM,EAAA,IAAA,CAAA,OAAA;AAAA,QACL,SAAK,IAAK,CAAA,OAAA;AAAA,QACX,KAAI,EAAA,4BAAA;AAAA,QACJ,GAAA,EAAA,KAAA;AAAA,QAAA,GAAA,EAAA,IAAA;AApBN,QAAA,MAAA,EAAA,EAAA;AAAA,OAAA,EAAA;;AAAA,WAAAP,SAAA,CAAA,IAAA,CAAA,EAAAQ,kBAAA;AAAA,YAAAC,QAAA;AAAA,YAAA,IAAA;AAAA,YAAAC,UAAA,CAAA,IAAA,CAAA,qBAAA,EAAA,CAAA,EAAA,KAAA,EAAA,GAAA,aAAA,EAAA,KAAA;qBAwBYV,SAAW,EAAA,EAAAQ,kBAAA,CAAA,IAAA,EAAA;AAAA,gBACd,OAAK,EAAA,IAAA;AAAA,gBACN,GAAK,EAAA,WAAA;AAAA,gBAEJ,GAAiB,EAAA,aAAA,CAAA,cAAA;AAAA,gBACjB,KAAA,EA7BTG,eA6BgBC,CAAW,iCAAA,EAAA,CAAA,IAAA,CAAA,QAAA,EAAA,IAAA,CAAA,SAAA,IAAA,IAAA,CAAA,SAAA,CAAA,KAAA,GAAA,IAAA,CAAA,SAAA,CAAA,MAAA,CAAA,CAAA,CAAA,CAAA;AAAA,gBACnB,YAAU,EAAA,KAAA;AAAA,gBAAA,KAAA,EAAAC,cAAA,CAAA,IAAA,CAAA,WAAA,IAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA;gBAQV,WAUO,EAAA,+BAAA;AAAA,eAAA,EAAA;AARI,gBAAAV,UAAA,CAAA,IAAA,CAAA,MAAA,EAAQW,SAAS,EAAA;AAAA,kBACzB,aAAA;AAAA,kBAOI,QAAA,EAAA,MAAA,IAAA,CAAA,QAAA,CAAA,KAAA,CAAA;AAAA,kBALL,UAIE,EAAA,IAAA,CAAA,UAAA,CAAA,KAAA,CAAA;AAAA,iBAHC,EAAA,MAAA;AAAA,kBAAAC,WAAA,CACA,wBAA6B,EAAA;AAAA,oBAC7B,OAAA,EAAQ,CAAEC,MAAAA,KAAAA,IAAAA,CAAU,QAAM,CAAA,KAAA,CAAA;AAAA,oBAAA,gBAAA,EAAA,aAAA;;AA9CvC,mBAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,UAAA,CAAA,CAAA;AAAA,iBAAA,CAAA;;AAAA,aAAA,CAAA;AAAA,YAAA,GAAA;AAAA;AAAA,WAAA;AAAA,SAAA,CAAA;;;AAAA,OAAA,EAAA,CAAA,EAAA,CAAA,eAAA,EAAA,SAAA,EAAA,SAAA,CAAA,CAAA;AAAA,KAAA,CAAA;;;;;;;;;"}
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 <SlidingPanel\n :key=\"x.query.search\"\n :reset-on-content-change=\"false\"\n :button-class=\"buttonClass\"\n scroll-container-class=\"x-related-prompts-tag-list-scroll-container\"\n >\n <template #sliding-panel-left-button>\n <!--\n @slot sliding-panel-left-button - The button to be displayed on the left side of the sliding panel.\n -->\n <slot name=\"sliding-panel-left-button\" />\n </template>\n <transition-group\n @before-enter=\"onBeforeEnter\"\n @enter=\"onEnter\"\n @leave=\"onLeave\"\n class=\"x-related-prompts-tag-list\"\n :css=\"false\"\n tag=\"ul\"\n appear\n >\n <li\n v-for=\"{ index, ...relatedPrompt } in visibleRelatedPrompts\"\n ref=\"listItems\"\n :key=\"relatedPrompt.suggestionText\"\n class=\"x-related-prompts-tag-list-item\"\n :class=\"[tagClass, tagColors && tagColors[index % tagColors.length]]\"\n :data-index=\"index\"\n :style=\"isAnimating && { pointerEvents: 'none' }\"\n data-test=\"related-prompts-tag-list-item\"\n >\n <!--\n @slot - The slot to render related prompt information.\n @prop {Object} relatedPrompt - The related prompt object.\n @prop {Function} onSelect - The function to select the related prompt.\n @prop {Boolean} isSelected - Indicates if the related prompt is currently selected.\n -->\n <slot\n :relatedPrompt=\"relatedPrompt\"\n :onSelect=\"() => onSelect(index)\"\n :isSelected=\"isSelected(index)\"\n >\n <DisplayEmitter\n :payload=\"relatedPrompt.toolingDisplayTagging\"\n :eventMetadata=\"{\n feature: 'related-prompts',\n displayOriginalQuery: x.query.searchBox,\n replaceable: false\n }\"\n >\n <RelatedPrompt\n @click=\"onSelect(index)\"\n :related-prompt=\"relatedPrompt\"\n :selected=\"isSelected(index)\"\n />\n </DisplayEmitter>\n </slot>\n </li>\n </transition-group>\n <template #sliding-panel-right-button>\n <!--\n @slot sliding-panel-right-button - The button to be displayed on the right side of the sliding panel.\n -->\n <slot name=\"sliding-panel-right-button\" />\n </template>\n </SlidingPanel>\n</template>\n\n<script lang=\"ts\">\n import { RelatedPrompt as RelatedPromptModel } from '@empathyco/x-types';\n import { computed, defineComponent, PropType, ref, watch } from 'vue';\n import SlidingPanel from '../../../components/sliding-panel.vue';\n import { relatedPromptsXModule } from '../x-module';\n import { use$x, useState } from '../../../composables';\n import DisplayEmitter from '../../../components/display-emitter.vue';\n import RelatedPrompt from './related-prompt.vue';\n\n /**\n * This component shows the list of `RelatedPrompts` components.\n *\n * If the default slot is reimplemented in the consumer, `onSelect` function will be\n * necessary to handle the selection of the related prompt and to trigger the stagger-fade-slide animation.\n *\n * @public\n */\n export default defineComponent({\n name: 'RelatedPromptsTagList',\n xModule: relatedPromptsXModule.name,\n components: { DisplayEmitter, RelatedPrompt, SlidingPanel },\n props: {\n /**\n * The CSS class for the left and right button of the sliding panel.\n *\n * @public\n */\n buttonClass: String,\n /**\n * The CSS class for all the related prompt wrapper elements.\n *\n * @public\n */\n tagClass: String,\n /**\n * Array of colors to apply to the related prompts. It will be applied to tag\n * elements cyclically according to their index in the nex way: `tagColors[index % tagColors.length]`.\n *\n * @public\n */\n tagColors: Array as PropType<string[]>,\n /**\n * The duration of the total animation in milliseconds.\n *\n * @public\n */\n animationDurationInMs: {\n type: Number,\n default: 700\n }\n },\n setup(props) {\n const x = use$x();\n const { relatedPrompts, selectedPrompt: selectedPromptIndex } = useState('relatedPrompts', [\n 'relatedPrompts',\n 'selectedPrompt'\n ]);\n\n const clickedListItemIndex = ref<number | null>(null);\n const initialOffsetLefts: Record<number, number> = {};\n const isAnimating = ref(false);\n const listItems = ref<HTMLElement[]>([]);\n\n const sortedListItems = computed<HTMLElement[]>(() =>\n [...listItems.value].sort(\n (a: HTMLElement, b: HTMLElement) =>\n Number.parseInt(b.getAttribute('data-index')!) -\n Number.parseInt(a.getAttribute('data-index')!)\n )\n );\n\n // The duration of a single animation (enter or leave) in milliseconds\n // if a related prompt is clicked (clickedListItemIndex.value !== null), the duration is divided by the number of related\n // prompts -1 (the clicked one is synchronized with the last one to leave or the first one to enter)\n const singleAnimationDurationInMs = computed(\n () =>\n props.animationDurationInMs /\n (clickedListItemIndex.value !== null\n ? relatedPrompts.value.length - 1\n : relatedPrompts.value.length)\n );\n\n const indexRelatedPrompts = computed(() =>\n (relatedPrompts.value as RelatedPromptModel[]).map(\n (relatedPrompt: RelatedPromptModel, index: number) => ({\n ...relatedPrompt,\n index\n })\n )\n );\n\n const visibleRelatedPrompts = computed(() => {\n return selectedPromptIndex.value !== -1\n ? [indexRelatedPrompts.value[selectedPromptIndex.value]]\n : indexRelatedPrompts.value;\n });\n\n let timeOutId: number;\n const resetTransitionStyle = () => {\n if (timeOutId) {\n clearTimeout(timeOutId);\n }\n\n isAnimating.value = true;\n timeOutId = +setTimeout(() => {\n isAnimating.value = false;\n clickedListItemIndex.value = null;\n\n sortedListItems.value.forEach(element => {\n element.style.cssText\n .split(';')\n .map(rule => rule.split(':')[0]?.trim())\n .forEach(property => {\n if (property !== 'width') {\n element.style.removeProperty(property);\n }\n });\n });\n }, props.animationDurationInMs);\n };\n\n const onSelect = (selectedIndex: number): void => {\n resetTransitionStyle();\n\n clickedListItemIndex.value = selectedIndex;\n const selected: HTMLElement = sortedListItems.value.find(\n element => Number.parseInt(element.getAttribute('data-index')!) === selectedIndex\n )!;\n\n // selectedPromptIndex.value === -1 ? 'SELECTING' : 'DESELECTING'\n if (selectedPromptIndex.value === -1) {\n // Prepare all the elements for the leave animation (~ 'beforeLeave' hook). Remember the elements are\n // sorted in descending order by index.\n sortedListItems.value.forEach(element => {\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n initialOffsetLefts[index] = element.offsetLeft;\n element.style.left = `${element.offsetLeft}px`;\n element.style.position = 'absolute';\n element.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n\n if (index !== selectedIndex) {\n element.style.opacity = '1';\n element.style.transitionDelay = `${\n (index < selectedIndex ? index : index - 1) * singleAnimationDurationInMs.value\n }ms`;\n }\n });\n\n // Synchronize the transition delay of the selected element with the last\n // element to leave\n selected.style.transitionDelay = `${\n (relatedPrompts.value.length > 1 ? relatedPrompts.value.length - 2 : 0) *\n singleAnimationDurationInMs.value\n }ms`;\n\n // Trigger the animation (selecting) for the selected element\n requestAnimationFrame(() => {\n const maxWidth = getComputedStyle(selected).maxWidth;\n\n selected.style.left = '0px';\n selected.style.setProperty(\n 'width',\n `${maxWidth !== 'none' ? maxWidth : '100%'}`,\n 'important'\n );\n });\n } else {\n // Prepare the selected element for the deselecting animation\n selected.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n selected.style.left = '0px';\n selected.style.position = 'absolute';\n\n // Trigger the animation (deselecting) for the selected element\n selected.style.removeProperty('width');\n requestAnimationFrame(() => {\n selected.style.left = `${initialOffsetLefts[selectedIndex]}px`;\n });\n }\n\n x.emit('UserSelectedARelatedPrompt', selectedIndex);\n };\n\n const onBeforeEnter = (el: Element) => {\n const element = el as HTMLElement;\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n // Prepare the element for the enter animation\n element.style.opacity = '0';\n element.style.transform = 'translateY(5px)';\n element.style.transitionDelay = `${\n (clickedListItemIndex.value !== null && index > clickedListItemIndex.value\n ? index - 1\n : index) * singleAnimationDurationInMs.value\n }ms`;\n element.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n };\n\n const onEnter = (el: Element, done: () => void) => {\n const element = el as HTMLElement;\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n // Also part of the preparation for the enter animation, but it needs to be done\n // once the element is inserted in DOM (if not the offsetLeft will be always 0)\n element.style.left = `${initialOffsetLefts[index] ?? element.offsetLeft}px`;\n\n // trigger enter animation\n requestAnimationFrame(() => {\n element.style.opacity = '1';\n element.style.position = 'absolute';\n element.style.transform = 'translateY(0)';\n });\n\n done();\n };\n\n const onLeave = (el: Element, done: () => void) => {\n const element = el as HTMLElement;\n\n // trigger leave animation\n requestAnimationFrame(() => {\n element.style.opacity = '0';\n element.style.transform = 'translateY(5px)';\n });\n\n // Wait for the animation to finish (done() exectution extracts the element from the DOM)\n setTimeout(done, props.animationDurationInMs);\n };\n\n const isSelected = (index: number): boolean => selectedPromptIndex.value === index;\n\n // Changing the query will trigger the appear animation, so we need to reset the\n // style after it finishes\n watch(() => x.query.search, resetTransitionStyle, { immediate: true });\n\n return {\n isSelected,\n onSelect,\n onBeforeEnter,\n onEnter,\n onLeave,\n selectedPromptIndex,\n visibleRelatedPrompts,\n listItems,\n isAnimating,\n x\n };\n }\n });\n</script>\n<style lang=\"css\">\n .x-related-prompts-tag-list-scroll-container {\n height: 100%;\n position: relative;\n }\n .x-related-prompts-tag-list {\n display: flex;\n gap: 16px;\n min-width: 100%;\n }\n .x-related-prompts-tag-list-item {\n height: 100%;\n }\n</style>\n"],"names":["_resolveComponent","_openBlock","_createBlock","buttonClass","_renderSlot","_withCtx","onBeforeEnter","onEnter","onLeave","_createElementBlock","_Fragment","_renderList","_normalizeClass","isAnimating","_normalizeStyle","onSelect","_createVNode","isSelected"],"mappings":"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"}
@@ -14,6 +14,7 @@ import '../../../plugins/x-plugin.js';
14
14
  import 'vuex';
15
15
  import '@vueuse/core';
16
16
  import { useState } from '../../../composables/use-state.js';
17
+ import _sfc_main$1 from '../../../components/display-emitter.vue.js';
17
18
  import RelatedPrompt from './related-prompt.vue.js';
18
19
 
19
20
  /**
@@ -27,7 +28,7 @@ import RelatedPrompt from './related-prompt.vue.js';
27
28
  var _sfc_main = defineComponent({
28
29
  name: 'RelatedPromptsTagList',
29
30
  xModule: relatedPromptsXModule.name,
30
- components: { RelatedPrompt, SlidingPanel },
31
+ components: { DisplayEmitter: _sfc_main$1, RelatedPrompt, SlidingPanel },
31
32
  props: {
32
33
  /**
33
34
  * The CSS class for the left and right button of the sliding panel.
@@ -1 +1 @@
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 <SlidingPanel\n :key=\"x.query.search\"\n :reset-on-content-change=\"false\"\n :button-class=\"buttonClass\"\n scroll-container-class=\"x-related-prompts-tag-list-scroll-container\"\n >\n <template #sliding-panel-left-button>\n <!-- \n @slot sliding-panel-left-button - The button to be displayed on the left side of the sliding panel. \n -->\n <slot name=\"sliding-panel-left-button\" />\n </template>\n <transition-group\n @before-enter=\"onBeforeEnter\"\n @enter=\"onEnter\"\n @leave=\"onLeave\"\n class=\"x-related-prompts-tag-list\"\n :css=\"false\"\n tag=\"ul\"\n appear\n >\n <li\n v-for=\"{ index, ...relatedPrompt } in visibleRelatedPrompts\"\n ref=\"listItems\"\n :key=\"relatedPrompt.suggestionText\"\n class=\"x-related-prompts-tag-list-item\"\n :class=\"[tagClass, tagColors && tagColors[index % tagColors.length]]\"\n :data-index=\"index\"\n :style=\"isAnimating && { pointerEvents: 'none' }\"\n data-test=\"related-prompts-tag-list-item\"\n >\n <!--\n @slot - The slot to render related prompt information.\n @prop {Object} relatedPrompt - The related prompt object.\n @prop {Function} onSelect - The function to select the related prompt.\n @prop {Boolean} isSelected - Indicates if the related prompt is currently selected.\n -->\n <slot\n :relatedPrompt=\"relatedPrompt\"\n :onSelect=\"() => onSelect(index)\"\n :isSelected=\"isSelected(index)\"\n >\n <RelatedPrompt\n @click=\"onSelect(index)\"\n :related-prompt=\"relatedPrompt\"\n :selected=\"isSelected(index)\"\n />\n </slot>\n </li>\n </transition-group>\n <template #sliding-panel-right-button>\n <!-- \n @slot sliding-panel-right-button - The button to be displayed on the right side of the sliding panel. \n -->\n <slot name=\"sliding-panel-right-button\" />\n </template>\n </SlidingPanel>\n</template>\n\n<script lang=\"ts\">\n import { RelatedPrompt as RelatedPromptModel } from '@empathyco/x-types';\n import { computed, defineComponent, PropType, ref, watch } from 'vue';\n import SlidingPanel from '../../../components/sliding-panel.vue';\n import { relatedPromptsXModule } from '../x-module';\n import { use$x, useState } from '../../../composables';\n import RelatedPrompt from './related-prompt.vue';\n\n /**\n * This component shows the list of `RelatedPrompts` components.\n *\n * If the default slot is reimplemented in the consumer, `onSelect` function will be\n * necessary to handle the selection of the related prompt and to trigger the stagger-fade-slide animation.\n *\n * @public\n */\n export default defineComponent({\n name: 'RelatedPromptsTagList',\n xModule: relatedPromptsXModule.name,\n components: { RelatedPrompt, SlidingPanel },\n props: {\n /**\n * The CSS class for the left and right button of the sliding panel.\n *\n * @public\n */\n buttonClass: String,\n /**\n * The CSS class for all the related prompt wrapper elements.\n *\n * @public\n */\n tagClass: String,\n /**\n * Array of colors to apply to the related prompts. It will be applied to tag\n * elements cyclically according to their index in the nex way: `tagColors[index % tagColors.length]`.\n *\n * @public\n */\n tagColors: Array as PropType<string[]>,\n /**\n * The duration of the total animation in milliseconds.\n *\n * @public\n */\n animationDurationInMs: {\n type: Number,\n default: 700\n }\n },\n setup(props) {\n const x = use$x();\n const { relatedPrompts, selectedPrompt: selectedPromptIndex } = useState('relatedPrompts', [\n 'relatedPrompts',\n 'selectedPrompt'\n ]);\n\n const clickedListItemIndex = ref<number | null>(null);\n const initialOffsetLefts: Record<number, number> = {};\n const isAnimating = ref(false);\n const listItems = ref<HTMLElement[]>([]);\n\n const sortedListItems = computed<HTMLElement[]>(() =>\n [...listItems.value].sort(\n (a: HTMLElement, b: HTMLElement) =>\n Number.parseInt(b.getAttribute('data-index')!) -\n Number.parseInt(a.getAttribute('data-index')!)\n )\n );\n\n // The duration of a single animation (enter or leave) in milliseconds\n // if a related prompt is clicked (clickedListItemIndex.value !== null), the duration is divided by the number of related\n // prompts -1 (the clicked one is synchronized with the last one to leave or the first one to enter)\n const singleAnimationDurationInMs = computed(\n () =>\n props.animationDurationInMs /\n (clickedListItemIndex.value !== null\n ? relatedPrompts.value.length - 1\n : relatedPrompts.value.length)\n );\n\n const indexRelatedPrompts = computed(() =>\n (relatedPrompts.value as RelatedPromptModel[]).map(\n (relatedPrompt: RelatedPromptModel, index: number) => ({\n ...relatedPrompt,\n index\n })\n )\n );\n\n const visibleRelatedPrompts = computed(() => {\n return selectedPromptIndex.value !== -1\n ? [indexRelatedPrompts.value[selectedPromptIndex.value]]\n : indexRelatedPrompts.value;\n });\n\n let timeOutId: number;\n const resetTransitionStyle = () => {\n if (timeOutId) {\n clearTimeout(timeOutId);\n }\n\n isAnimating.value = true;\n timeOutId = +setTimeout(() => {\n isAnimating.value = false;\n clickedListItemIndex.value = null;\n\n sortedListItems.value.forEach(element => {\n element.style.cssText\n .split(';')\n .map(rule => rule.split(':')[0]?.trim())\n .forEach(property => {\n if (property !== 'width') {\n element.style.removeProperty(property);\n }\n });\n });\n }, props.animationDurationInMs);\n };\n\n const onSelect = (selectedIndex: number): void => {\n resetTransitionStyle();\n\n clickedListItemIndex.value = selectedIndex;\n const selected: HTMLElement = sortedListItems.value.find(\n element => Number.parseInt(element.getAttribute('data-index')!) === selectedIndex\n )!;\n\n // selectedPromptIndex.value === -1 ? 'SELECTING' : 'DESELECTING'\n if (selectedPromptIndex.value === -1) {\n // Prepare all the elements for the leave animation (~ 'beforeLeave' hook). Remember the elements are\n // sorted in descending order by index.\n sortedListItems.value.forEach(element => {\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n initialOffsetLefts[index] = element.offsetLeft;\n element.style.left = `${element.offsetLeft}px`;\n element.style.position = 'absolute';\n element.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n\n if (index !== selectedIndex) {\n element.style.opacity = '1';\n element.style.transitionDelay = `${\n (index < selectedIndex ? index : index - 1) * singleAnimationDurationInMs.value\n }ms`;\n }\n });\n\n // Synchronize the transition delay of the selected element with the last\n // element to leave\n selected.style.transitionDelay = `${\n (relatedPrompts.value.length > 1 ? relatedPrompts.value.length - 2 : 0) *\n singleAnimationDurationInMs.value\n }ms`;\n\n // Trigger the animation (selecting) for the selected element\n requestAnimationFrame(() => {\n const maxWidth = getComputedStyle(selected).maxWidth;\n\n selected.style.left = '0px';\n selected.style.setProperty(\n 'width',\n `${maxWidth !== 'none' ? maxWidth : '100%'}`,\n 'important'\n );\n });\n } else {\n // Prepare the selected element for the deselecting animation\n selected.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n selected.style.left = '0px';\n selected.style.position = 'absolute';\n\n // Trigger the animation (deselecting) for the selected element\n selected.style.removeProperty('width');\n requestAnimationFrame(() => {\n selected.style.left = `${initialOffsetLefts[selectedIndex]}px`;\n });\n }\n\n x.emit('UserSelectedARelatedPrompt', selectedIndex);\n };\n\n const onBeforeEnter = (el: Element) => {\n const element = el as HTMLElement;\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n // Prepare the element for the enter animation\n element.style.opacity = '0';\n element.style.transform = 'translateY(5px)';\n element.style.transitionDelay = `${\n (clickedListItemIndex.value !== null && index > clickedListItemIndex.value\n ? index - 1\n : index) * singleAnimationDurationInMs.value\n }ms`;\n element.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n };\n\n const onEnter = (el: Element, done: () => void) => {\n const element = el as HTMLElement;\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n // Also part of the preparation for the enter animation, but it needs to be done\n // once the element is inserted in DOM (if not the offsetLeft will be always 0)\n element.style.left = `${initialOffsetLefts[index] ?? element.offsetLeft}px`;\n\n // trigger enter animation\n requestAnimationFrame(() => {\n element.style.opacity = '1';\n element.style.position = 'absolute';\n element.style.transform = 'translateY(0)';\n });\n\n done();\n };\n\n const onLeave = (el: Element, done: () => void) => {\n const element = el as HTMLElement;\n\n // trigger leave animation\n requestAnimationFrame(() => {\n element.style.opacity = '0';\n element.style.transform = 'translateY(5px)';\n });\n\n // Wait for the animation to finish (done() exectution extracts the element from the DOM)\n setTimeout(done, props.animationDurationInMs);\n };\n\n const isSelected = (index: number): boolean => selectedPromptIndex.value === index;\n\n // Changing the query will trigger the appear animation, so we need to reset the\n // style after it finishes\n watch(() => x.query.search, resetTransitionStyle, { immediate: true });\n\n return {\n isSelected,\n onSelect,\n onBeforeEnter,\n onEnter,\n onLeave,\n selectedPromptIndex,\n visibleRelatedPrompts,\n listItems,\n isAnimating,\n x\n };\n }\n });\n</script>\n<style lang=\"css\">\n .x-related-prompts-tag-list-scroll-container {\n height: 100%;\n position: relative;\n }\n .x-related-prompts-tag-list {\n display: flex;\n gap: 16px;\n min-width: 100%;\n }\n .x-related-prompts-tag-list-item {\n height: 100%;\n }\n</style>\n"],"names":[],"mappings":"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"}
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 <SlidingPanel\n :key=\"x.query.search\"\n :reset-on-content-change=\"false\"\n :button-class=\"buttonClass\"\n scroll-container-class=\"x-related-prompts-tag-list-scroll-container\"\n >\n <template #sliding-panel-left-button>\n <!--\n @slot sliding-panel-left-button - The button to be displayed on the left side of the sliding panel.\n -->\n <slot name=\"sliding-panel-left-button\" />\n </template>\n <transition-group\n @before-enter=\"onBeforeEnter\"\n @enter=\"onEnter\"\n @leave=\"onLeave\"\n class=\"x-related-prompts-tag-list\"\n :css=\"false\"\n tag=\"ul\"\n appear\n >\n <li\n v-for=\"{ index, ...relatedPrompt } in visibleRelatedPrompts\"\n ref=\"listItems\"\n :key=\"relatedPrompt.suggestionText\"\n class=\"x-related-prompts-tag-list-item\"\n :class=\"[tagClass, tagColors && tagColors[index % tagColors.length]]\"\n :data-index=\"index\"\n :style=\"isAnimating && { pointerEvents: 'none' }\"\n data-test=\"related-prompts-tag-list-item\"\n >\n <!--\n @slot - The slot to render related prompt information.\n @prop {Object} relatedPrompt - The related prompt object.\n @prop {Function} onSelect - The function to select the related prompt.\n @prop {Boolean} isSelected - Indicates if the related prompt is currently selected.\n -->\n <slot\n :relatedPrompt=\"relatedPrompt\"\n :onSelect=\"() => onSelect(index)\"\n :isSelected=\"isSelected(index)\"\n >\n <DisplayEmitter\n :payload=\"relatedPrompt.toolingDisplayTagging\"\n :eventMetadata=\"{\n feature: 'related-prompts',\n displayOriginalQuery: x.query.searchBox,\n replaceable: false\n }\"\n >\n <RelatedPrompt\n @click=\"onSelect(index)\"\n :related-prompt=\"relatedPrompt\"\n :selected=\"isSelected(index)\"\n />\n </DisplayEmitter>\n </slot>\n </li>\n </transition-group>\n <template #sliding-panel-right-button>\n <!--\n @slot sliding-panel-right-button - The button to be displayed on the right side of the sliding panel.\n -->\n <slot name=\"sliding-panel-right-button\" />\n </template>\n </SlidingPanel>\n</template>\n\n<script lang=\"ts\">\n import { RelatedPrompt as RelatedPromptModel } from '@empathyco/x-types';\n import { computed, defineComponent, PropType, ref, watch } from 'vue';\n import SlidingPanel from '../../../components/sliding-panel.vue';\n import { relatedPromptsXModule } from '../x-module';\n import { use$x, useState } from '../../../composables';\n import DisplayEmitter from '../../../components/display-emitter.vue';\n import RelatedPrompt from './related-prompt.vue';\n\n /**\n * This component shows the list of `RelatedPrompts` components.\n *\n * If the default slot is reimplemented in the consumer, `onSelect` function will be\n * necessary to handle the selection of the related prompt and to trigger the stagger-fade-slide animation.\n *\n * @public\n */\n export default defineComponent({\n name: 'RelatedPromptsTagList',\n xModule: relatedPromptsXModule.name,\n components: { DisplayEmitter, RelatedPrompt, SlidingPanel },\n props: {\n /**\n * The CSS class for the left and right button of the sliding panel.\n *\n * @public\n */\n buttonClass: String,\n /**\n * The CSS class for all the related prompt wrapper elements.\n *\n * @public\n */\n tagClass: String,\n /**\n * Array of colors to apply to the related prompts. It will be applied to tag\n * elements cyclically according to their index in the nex way: `tagColors[index % tagColors.length]`.\n *\n * @public\n */\n tagColors: Array as PropType<string[]>,\n /**\n * The duration of the total animation in milliseconds.\n *\n * @public\n */\n animationDurationInMs: {\n type: Number,\n default: 700\n }\n },\n setup(props) {\n const x = use$x();\n const { relatedPrompts, selectedPrompt: selectedPromptIndex } = useState('relatedPrompts', [\n 'relatedPrompts',\n 'selectedPrompt'\n ]);\n\n const clickedListItemIndex = ref<number | null>(null);\n const initialOffsetLefts: Record<number, number> = {};\n const isAnimating = ref(false);\n const listItems = ref<HTMLElement[]>([]);\n\n const sortedListItems = computed<HTMLElement[]>(() =>\n [...listItems.value].sort(\n (a: HTMLElement, b: HTMLElement) =>\n Number.parseInt(b.getAttribute('data-index')!) -\n Number.parseInt(a.getAttribute('data-index')!)\n )\n );\n\n // The duration of a single animation (enter or leave) in milliseconds\n // if a related prompt is clicked (clickedListItemIndex.value !== null), the duration is divided by the number of related\n // prompts -1 (the clicked one is synchronized with the last one to leave or the first one to enter)\n const singleAnimationDurationInMs = computed(\n () =>\n props.animationDurationInMs /\n (clickedListItemIndex.value !== null\n ? relatedPrompts.value.length - 1\n : relatedPrompts.value.length)\n );\n\n const indexRelatedPrompts = computed(() =>\n (relatedPrompts.value as RelatedPromptModel[]).map(\n (relatedPrompt: RelatedPromptModel, index: number) => ({\n ...relatedPrompt,\n index\n })\n )\n );\n\n const visibleRelatedPrompts = computed(() => {\n return selectedPromptIndex.value !== -1\n ? [indexRelatedPrompts.value[selectedPromptIndex.value]]\n : indexRelatedPrompts.value;\n });\n\n let timeOutId: number;\n const resetTransitionStyle = () => {\n if (timeOutId) {\n clearTimeout(timeOutId);\n }\n\n isAnimating.value = true;\n timeOutId = +setTimeout(() => {\n isAnimating.value = false;\n clickedListItemIndex.value = null;\n\n sortedListItems.value.forEach(element => {\n element.style.cssText\n .split(';')\n .map(rule => rule.split(':')[0]?.trim())\n .forEach(property => {\n if (property !== 'width') {\n element.style.removeProperty(property);\n }\n });\n });\n }, props.animationDurationInMs);\n };\n\n const onSelect = (selectedIndex: number): void => {\n resetTransitionStyle();\n\n clickedListItemIndex.value = selectedIndex;\n const selected: HTMLElement = sortedListItems.value.find(\n element => Number.parseInt(element.getAttribute('data-index')!) === selectedIndex\n )!;\n\n // selectedPromptIndex.value === -1 ? 'SELECTING' : 'DESELECTING'\n if (selectedPromptIndex.value === -1) {\n // Prepare all the elements for the leave animation (~ 'beforeLeave' hook). Remember the elements are\n // sorted in descending order by index.\n sortedListItems.value.forEach(element => {\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n initialOffsetLefts[index] = element.offsetLeft;\n element.style.left = `${element.offsetLeft}px`;\n element.style.position = 'absolute';\n element.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n\n if (index !== selectedIndex) {\n element.style.opacity = '1';\n element.style.transitionDelay = `${\n (index < selectedIndex ? index : index - 1) * singleAnimationDurationInMs.value\n }ms`;\n }\n });\n\n // Synchronize the transition delay of the selected element with the last\n // element to leave\n selected.style.transitionDelay = `${\n (relatedPrompts.value.length > 1 ? relatedPrompts.value.length - 2 : 0) *\n singleAnimationDurationInMs.value\n }ms`;\n\n // Trigger the animation (selecting) for the selected element\n requestAnimationFrame(() => {\n const maxWidth = getComputedStyle(selected).maxWidth;\n\n selected.style.left = '0px';\n selected.style.setProperty(\n 'width',\n `${maxWidth !== 'none' ? maxWidth : '100%'}`,\n 'important'\n );\n });\n } else {\n // Prepare the selected element for the deselecting animation\n selected.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n selected.style.left = '0px';\n selected.style.position = 'absolute';\n\n // Trigger the animation (deselecting) for the selected element\n selected.style.removeProperty('width');\n requestAnimationFrame(() => {\n selected.style.left = `${initialOffsetLefts[selectedIndex]}px`;\n });\n }\n\n x.emit('UserSelectedARelatedPrompt', selectedIndex);\n };\n\n const onBeforeEnter = (el: Element) => {\n const element = el as HTMLElement;\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n // Prepare the element for the enter animation\n element.style.opacity = '0';\n element.style.transform = 'translateY(5px)';\n element.style.transitionDelay = `${\n (clickedListItemIndex.value !== null && index > clickedListItemIndex.value\n ? index - 1\n : index) * singleAnimationDurationInMs.value\n }ms`;\n element.style.transitionDuration = `${singleAnimationDurationInMs.value}ms`;\n };\n\n const onEnter = (el: Element, done: () => void) => {\n const element = el as HTMLElement;\n const index = Number.parseInt(element.getAttribute('data-index')!);\n\n // Also part of the preparation for the enter animation, but it needs to be done\n // once the element is inserted in DOM (if not the offsetLeft will be always 0)\n element.style.left = `${initialOffsetLefts[index] ?? element.offsetLeft}px`;\n\n // trigger enter animation\n requestAnimationFrame(() => {\n element.style.opacity = '1';\n element.style.position = 'absolute';\n element.style.transform = 'translateY(0)';\n });\n\n done();\n };\n\n const onLeave = (el: Element, done: () => void) => {\n const element = el as HTMLElement;\n\n // trigger leave animation\n requestAnimationFrame(() => {\n element.style.opacity = '0';\n element.style.transform = 'translateY(5px)';\n });\n\n // Wait for the animation to finish (done() exectution extracts the element from the DOM)\n setTimeout(done, props.animationDurationInMs);\n };\n\n const isSelected = (index: number): boolean => selectedPromptIndex.value === index;\n\n // Changing the query will trigger the appear animation, so we need to reset the\n // style after it finishes\n watch(() => x.query.search, resetTransitionStyle, { immediate: true });\n\n return {\n isSelected,\n onSelect,\n onBeforeEnter,\n onEnter,\n onLeave,\n selectedPromptIndex,\n visibleRelatedPrompts,\n listItems,\n isAnimating,\n x\n };\n }\n });\n</script>\n<style lang=\"css\">\n .x-related-prompts-tag-list-scroll-container {\n height: 100%;\n position: relative;\n }\n .x-related-prompts-tag-list {\n display: flex;\n gap: 16px;\n min-width: 100%;\n }\n .x-related-prompts-tag-list-item {\n height: 100%;\n }\n</style>\n"],"names":["DisplayEmitter"],"mappings":"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"}
@@ -16,7 +16,11 @@ const taggingXStoreModule = {
16
16
  },
17
17
  consent: null,
18
18
  noResultsTaggingEnabled: false,
19
- queryTaggingInfo: null
19
+ queryTaggingInfo: null,
20
+ toolingTaggingInfo: {
21
+ toolingDisplayClick: null,
22
+ toolingDisplayAdd2Cart: null
23
+ }
20
24
  }),
21
25
  getters: {},
22
26
  mutations: {
@@ -1 +1 @@
1
- {"version":3,"file":"module.js","sources":["../../../../../src/x-modules/tagging/store/module.ts"],"sourcesContent":["import { TaggingRequest } from '@empathyco/x-types';\nimport { mergeConfig, setConfig } from '../../../store/utils/config-store.utils';\nimport { track } from './actions/track.action';\nimport { TaggingXStoreModule } from './types';\n\n/**\n * {@link XStoreModule} For the tagging module.\n *\n * @internal\n */\nexport const taggingXStoreModule: TaggingXStoreModule = {\n state: () => ({\n config: {\n sessionTTLMs: 30 * 60 * 1000,\n queryTaggingDebounceMs: 2000,\n clickedResultStorageKey: null,\n clickedResultStorageTTLMs: null\n },\n consent: null,\n noResultsTaggingEnabled: false,\n queryTaggingInfo: null\n }),\n getters: {},\n mutations: {\n setConsent(state, consent) {\n state.consent = consent;\n },\n setQueryTaggingInfo(state, queryTaggingInfo: TaggingRequest) {\n state.queryTaggingInfo = queryTaggingInfo;\n },\n setNoResultsTaggingEnabled(state, module) {\n if (module === 'semanticQueries') {\n state.noResultsTaggingEnabled = true;\n }\n },\n setConfig,\n mergeConfig\n },\n actions: {\n track\n }\n};\n"],"names":[],"mappings":";;;AAKA;;;;AAIG;AACU,MAAA,mBAAmB,GAAwB;AACtD,IAAA,KAAK,EAAE,OAAO;AACZ,QAAA,MAAM,EAAE;AACN,YAAA,YAAY,EAAE,EAAE,GAAG,EAAE,GAAG,IAAI;AAC5B,YAAA,sBAAsB,EAAE,IAAI;AAC5B,YAAA,uBAAuB,EAAE,IAAI;AAC7B,YAAA,yBAAyB,EAAE,IAAI;AAChC,SAAA;AACD,QAAA,OAAO,EAAE,IAAI;AACb,QAAA,uBAAuB,EAAE,KAAK;AAC9B,QAAA,gBAAgB,EAAE,IAAI;KACvB,CAAC;AACF,IAAA,OAAO,EAAE,EAAE;AACX,IAAA,SAAS,EAAE;QACT,UAAU,CAAC,KAAK,EAAE,OAAO,EAAA;AACvB,YAAA,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;SACzB;QACD,mBAAmB,CAAC,KAAK,EAAE,gBAAgC,EAAA;AACzD,YAAA,KAAK,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;SAC3C;QACD,0BAA0B,CAAC,KAAK,EAAE,MAAM,EAAA;YACtC,IAAI,MAAM,KAAK,iBAAiB,EAAE;AAChC,gBAAA,KAAK,CAAC,uBAAuB,GAAG,IAAI,CAAC;AACtC,aAAA;SACF;QACD,SAAS;QACT,WAAW;AACZ,KAAA;AACD,IAAA,OAAO,EAAE;QACP,KAAK;AACN,KAAA;;;;;"}
1
+ {"version":3,"file":"module.js","sources":["../../../../../src/x-modules/tagging/store/module.ts"],"sourcesContent":["import { TaggingRequest } from '@empathyco/x-types';\nimport { mergeConfig, setConfig } from '../../../store/utils/config-store.utils';\nimport { track } from './actions/track.action';\nimport { TaggingXStoreModule } from './types';\n\n/**\n * {@link XStoreModule} For the tagging module.\n *\n * @internal\n */\nexport const taggingXStoreModule: TaggingXStoreModule = {\n state: () => ({\n config: {\n sessionTTLMs: 30 * 60 * 1000,\n queryTaggingDebounceMs: 2000,\n clickedResultStorageKey: null,\n clickedResultStorageTTLMs: null\n },\n consent: null,\n noResultsTaggingEnabled: false,\n queryTaggingInfo: null,\n toolingTaggingInfo: {\n toolingDisplayClick: null,\n toolingDisplayAdd2Cart: null\n }\n }),\n getters: {},\n mutations: {\n setConsent(state, consent) {\n state.consent = consent;\n },\n setQueryTaggingInfo(state, queryTaggingInfo: TaggingRequest) {\n state.queryTaggingInfo = queryTaggingInfo;\n },\n setNoResultsTaggingEnabled(state, module) {\n if (module === 'semanticQueries') {\n state.noResultsTaggingEnabled = true;\n }\n },\n setConfig,\n mergeConfig\n },\n actions: {\n track\n }\n};\n"],"names":[],"mappings":";;;AAKA;;;;AAIG;AACU,MAAA,mBAAmB,GAAwB;AACtD,IAAA,KAAK,EAAE,OAAO;AACZ,QAAA,MAAM,EAAE;AACN,YAAA,YAAY,EAAE,EAAE,GAAG,EAAE,GAAG,IAAI;AAC5B,YAAA,sBAAsB,EAAE,IAAI;AAC5B,YAAA,uBAAuB,EAAE,IAAI;AAC7B,YAAA,yBAAyB,EAAE,IAAI;AAChC,SAAA;AACD,QAAA,OAAO,EAAE,IAAI;AACb,QAAA,uBAAuB,EAAE,KAAK;AAC9B,QAAA,gBAAgB,EAAE,IAAI;AACtB,QAAA,kBAAkB,EAAE;AAClB,YAAA,mBAAmB,EAAE,IAAI;AACzB,YAAA,sBAAsB,EAAE,IAAI;AAC7B,SAAA;KACF,CAAC;AACF,IAAA,OAAO,EAAE,EAAE;AACX,IAAA,SAAS,EAAE;QACT,UAAU,CAAC,KAAK,EAAE,OAAO,EAAA;AACvB,YAAA,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;SACzB;QACD,mBAAmB,CAAC,KAAK,EAAE,gBAAgC,EAAA;AACzD,YAAA,KAAK,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;SAC3C;QACD,0BAA0B,CAAC,KAAK,EAAE,MAAM,EAAA;YACtC,IAAI,MAAM,KAAK,iBAAiB,EAAE;AAChC,gBAAA,KAAK,CAAC,uBAAuB,GAAG,IAAI,CAAC;AACtC,aAAA;SACF;QACD,SAAS;QACT,WAAW;AACZ,KAAA;AACD,IAAA,OAAO,EAAE;QACP,KAAK;AACN,KAAA;;;;;"}
@@ -135,6 +135,18 @@ const trackAddToCartWire = createTrackWire('add2cart');
135
135
  * @public
136
136
  */
137
137
  const trackDisplayClickedWire = createTrackDisplayWire('displayClick');
138
+ /**
139
+ * Performs a track of a display result being clicked.
140
+ *
141
+ * @public
142
+ */
143
+ const trackToolingDisplayClickedWire = createTrackToolingDisplayWire();
144
+ /**
145
+ * Performs a track of a display result being clicked.
146
+ *
147
+ * @public
148
+ */
149
+ const trackToolingAdd2CartWire = createTrackToolingAdd2CartWire();
138
150
  /**
139
151
  * Performs a track of a display element appearing.
140
152
  *
@@ -198,6 +210,51 @@ function createTrackDisplayWire(property) {
198
210
  return taggingInfo;
199
211
  }), ({ eventPayload: { tagging } }) => !!tagging?.[property]);
200
212
  }
213
+ /**
214
+ * Update the tooling tagging params with the result information.
215
+ *
216
+ * @param taggingRequest - The tooling tagging request to be updated.
217
+ * @param result - The clicked result.
218
+ * @returns The tagging request updated.
219
+ *
220
+ * @internal
221
+ */
222
+ function updateToolingTaggingWithResult(taggingRequest, result) {
223
+ taggingRequest.params.productId = result.id;
224
+ taggingRequest.params.title = result.name;
225
+ taggingRequest.params.url = result.url;
226
+ return taggingRequest;
227
+ }
228
+ /**
229
+ * Factory helper to create a wire for the track of the tooling display click.
230
+ *
231
+ * @returns A new wire for the tooling display click of the taggable element.
232
+ *
233
+ * @public
234
+ */
235
+ function createTrackToolingDisplayWire() {
236
+ return filter(wireDispatch('track', ({ eventPayload, metadata }) => {
237
+ const taggingInfo = metadata.toolingTagging;
238
+ const resultInfo = eventPayload;
239
+ updateToolingTaggingWithResult(taggingInfo, resultInfo);
240
+ return taggingInfo;
241
+ }), ({ metadata }) => !!metadata?.toolingTagging);
242
+ }
243
+ /**
244
+ * Factory helper to create a wire for the track of the tooling display click.
245
+ *
246
+ * @returns A new wire for the tooling display add to cart of the taggable element.
247
+ *
248
+ * @public
249
+ */
250
+ function createTrackToolingAdd2CartWire() {
251
+ return filter(wireDispatch('track', ({ eventPayload, metadata }) => {
252
+ const taggingInfo = metadata.toolingAdd2CartTagging;
253
+ const resultInfo = eventPayload;
254
+ updateToolingTaggingWithResult(taggingInfo, resultInfo);
255
+ return taggingInfo;
256
+ }), ({ metadata }) => !!metadata?.toolingAdd2CartTagging);
257
+ }
201
258
  /**
202
259
  * Factory helper to create a wire to set the queryTagging.
203
260
  *
@@ -261,8 +318,14 @@ const taggingWiring = createWiring({
261
318
  },
262
319
  ModuleRegistered: {
263
320
  setNoResultsTaggingEnabledWire
321
+ },
322
+ UserClickedARelatedPromptResult: {
323
+ trackToolingDisplayClickedWire
324
+ },
325
+ UserClickedARelatedPromptAdd2Cart: {
326
+ trackToolingAdd2CartWire
264
327
  }
265
328
  });
266
329
 
267
- export { createSetQueryTaggingFromQueryPreview, createTrackDisplayWire, createTrackWire, setConsent, setNoResultsTaggingEnabledWire, setQueryTaggingFromQueryPreview, setQueryTaggingInfo, setTaggingConfig, taggingWiring, trackAddToCartWire, trackBannerClickedWire, trackDisplayClickedWire, trackElementDisplayedWire, trackNoResultsQueryWithSemanticsWire, trackNoResultsQueryWithSemanticsWireDebounced, trackQueryWire, trackResultClickedWire };
330
+ export { createSetQueryTaggingFromQueryPreview, createTrackDisplayWire, createTrackToolingAdd2CartWire, createTrackToolingDisplayWire, createTrackWire, setConsent, setNoResultsTaggingEnabledWire, setQueryTaggingFromQueryPreview, setQueryTaggingInfo, setTaggingConfig, taggingWiring, trackAddToCartWire, trackBannerClickedWire, trackDisplayClickedWire, trackElementDisplayedWire, trackNoResultsQueryWithSemanticsWire, trackNoResultsQueryWithSemanticsWireDebounced, trackQueryWire, trackResultClickedWire, trackToolingAdd2CartWire, trackToolingDisplayClickedWire };
268
331
  //# sourceMappingURL=wiring.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/tagging/wiring.ts"],"sourcesContent":["import { SemanticQuery, Taggable, Tagging, TaggingRequest } from '@empathyco/x-types';\nimport { DefaultSessionService } from '@empathyco/x-utils';\nimport {\n namespacedWireCommit,\n namespacedWireDispatch\n} from '../../wiring/namespaced-wires.factory';\nimport { namespacedDebounce } from '../../wiring/namespaced-wires.operators';\nimport { wireService, wireServiceWithoutPayload } from '../../wiring/wires.factory';\nimport { filter, mapWire } from '../../wiring/wires.operators';\nimport { DisplayWireMetadata, Wire } from '../../wiring/wiring.types';\nimport { createWiring } from '../../wiring/wiring.utils';\nimport { createOrigin } from '../../utils/index';\nimport { FeatureLocation } from '../../types/index';\nimport { DefaultPDPAddToCartService } from './service/pdp-add-to-cart.service';\n\n/**\n * `tagging` {@link XModuleName | XModule name}.\n *\n * @internal\n */\nconst moduleName = 'tagging';\n\n/**\n * Debounce function for the module.\n */\nconst moduleDebounce = namespacedDebounce(moduleName);\n\n/**\n * WireCommit for {@link TaggingXModule}.\n *\n * @internal\n */\nconst wireCommit = namespacedWireCommit(moduleName);\n\n/**\n * WireDispatch for {@link TaggingXModule}.\n *\n * @internal\n */\nconst wireDispatch = namespacedWireDispatch(moduleName);\n\n/**\n * Wires without payload factory for {@link DefaultSessionService}.\n */\nconst wireSessionServiceWithoutPayload = wireServiceWithoutPayload(DefaultSessionService.instance);\n\n/**\n * Wires factory for {@link DefaultPDPAddToCartService}.\n */\nconst wirePDPAddToCartService = wireService(DefaultPDPAddToCartService.instance);\n\n/**\n * Stores the given result on the local storage.\n *\n * @public\n */\nconst storeClickedResultWire = wirePDPAddToCartService('storeResultClicked');\n\n/**\n * Moves the result information from the local storage to session storage.\n *\n * @public\n */\nconst moveClickedResultToSessionWire = mapWire(\n wirePDPAddToCartService('moveToSessionStorage'),\n (payload: string) => {\n return payload === 'url' ? undefined : payload;\n }\n);\n\n/**\n * Triggers the add to cart tracking.\n *\n * @public\n */\nconst trackAddToCartFromSessionStorage = wirePDPAddToCartService('trackAddToCart');\n\n/**\n * Clears the session id.\n *\n * @public\n */\nconst clearSessionWire = filter(\n wireSessionServiceWithoutPayload('clearSessionId'),\n ({ eventPayload: consent }) => !consent\n);\n\n/**\n * Sets the tagging state `consent`.\n *\n * @public\n */\nexport const setConsent = wireCommit('setConsent');\n\n/**\n * Sets the tagging state `noResultsTaggingEnabled`.\n *\n * @public\n */\nexport const setNoResultsTaggingEnabledWire = wireCommit('setNoResultsTaggingEnabled');\n\n/**\n * Sets the tagging config state.\n *\n * @public\n */\nexport const setTaggingConfig = wireCommit('mergeConfig');\n\n/**\n * Tracks the tagging of the query.\n *\n * @public\n */\nexport const trackQueryWire = filter(\n wireDispatch('track'),\n ({ eventPayload, store }) =>\n (eventPayload as TaggingRequest).params.totalHits > 0 ||\n !store.state.x.tagging.noResultsTaggingEnabled\n);\n\n/**\n * Sets the tagging state of the query tagging info using a debounce which ends if the user\n * accepts a query.\n *\n * @public\n */\nexport const setQueryTaggingInfo = moduleDebounce(\n wireCommit('setQueryTaggingInfo'),\n ({ state }) => state.config.queryTaggingDebounceMs,\n {\n cancelOn: 'UserClearedQuery',\n forceOn: [\n 'UserClickedAResult',\n 'UserClickedAPromoted',\n 'UserClickedABanner',\n 'UserClickedARedirection',\n 'UserReachedResultsListEnd'\n ]\n }\n);\n\n/**\n * Sets the tagging state of the query tagging info using.\n *\n * @public\n */\nexport const setQueryTaggingFromQueryPreview = createSetQueryTaggingFromQueryPreview();\n\n/**\n * Tracks the tagging of the result.\n *\n * @public\n */\nexport const trackResultClickedWire = createTrackWire('click');\n\n/**\n * Tracks the tagging of the banner.\n *\n * @public\n */\nexport const trackBannerClickedWire = createTrackWire('click');\n\n/**\n * Performs a track of a result added to the cart.\n *\n * @public\n */\nexport const trackAddToCartWire = createTrackWire('add2cart');\n\n/**\n * Performs a track of a display result being clicked.\n *\n * @public\n */\nexport const trackDisplayClickedWire = createTrackDisplayWire('displayClick');\n\n/**\n * Performs a track of a display element appearing.\n *\n * @public\n */\nexport const trackElementDisplayedWire = createTrackDisplayWire('display');\n\n/**\n * Factory helper to create a wire for the track of a taggable element.\n *\n * @param property - Key of the tagging object to track.\n * @returns A new wire for the given property of the taggable element.\n *\n * @public\n */\nexport function createTrackWire(property: keyof Tagging): Wire<Taggable> {\n return filter(\n wireDispatch('track', ({ eventPayload: { tagging }, metadata: { location } }) => {\n const taggingInfo: TaggingRequest = tagging[property];\n taggingInfo.params.location = location as string;\n return taggingInfo;\n }),\n ({ eventPayload: { tagging }, metadata: { ignoreInModules } }) =>\n !!tagging?.[property] && !ignoreInModules?.includes(moduleName)\n );\n}\n\n/**\n * Performs a track of a query with no results that used semantics as fallback.\n * The totalHits will be changed to -1 if semantic queries are found in order to differentiate\n * it from scenarios where the user encounters a no-results page without any semantic queries.\n *\n * @public\n */\nexport const trackNoResultsQueryWithSemanticsWire = filter(\n wireDispatch('track', ({ eventPayload, state }) => {\n const { queryTaggingInfo } = state;\n const totalHits = (eventPayload as SemanticQuery[]).length > 0 ? -1 : 0;\n return {\n params: { ...queryTaggingInfo?.params, totalHits },\n url: queryTaggingInfo?.url ?? ''\n };\n }),\n ({ store }) => Number(store.state.x.tagging.queryTaggingInfo?.params.totalHits)! === 0\n);\n\n/**.\n * Debounced version of {@link trackNoResultsQueryWithSemanticsWire}\n *\n * @public\n */\nexport const trackNoResultsQueryWithSemanticsWireDebounced = moduleDebounce(\n trackNoResultsQueryWithSemanticsWire,\n ({ state }) => state.config.queryTaggingDebounceMs,\n { cancelOn: 'QueryPreviewUnmounted' }\n);\n\n/**\n * Factory helper to create a wire for the track of the display click.\n *\n * @param property - Key of the tagging object to track.\n * @returns A new wire for the display click of the taggable element.\n *\n * @public\n */\nexport function createTrackDisplayWire(property: keyof Tagging): Wire<Taggable> {\n return filter(\n wireDispatch('track', ({ eventPayload: { tagging }, metadata }) => {\n const taggingInfo: TaggingRequest = tagging[property];\n const location = metadata.location as FeatureLocation;\n\n taggingInfo.params.location = location;\n taggingInfo.params.displayFamily = createOrigin({\n feature: metadata.feature,\n location\n })!;\n taggingInfo.params.q = (metadata as DisplayWireMetadata).displayOriginalQuery;\n\n return taggingInfo;\n }),\n ({ eventPayload: { tagging } }) => !!tagging?.[property]\n );\n}\n\n/**\n * Factory helper to create a wire to set the queryTagging.\n *\n * @returns A new wire for the query of a result of a queryPreview.\n *\n * @public\n */\nexport function createSetQueryTaggingFromQueryPreview(): Wire<Taggable> {\n return filter(\n wireCommit(\n 'setQueryTaggingInfo',\n ({ metadata: { queryTagging } }) => queryTagging as TaggingRequest\n ),\n ({ metadata: { queryTagging } }) => !!queryTagging\n );\n}\n\n/**\n * Wiring configuration for the {@link TaggingXModule | tagging module}.\n *\n * @internal\n */\nexport const taggingWiring = createWiring({\n ConsentProvided: {\n setConsent\n },\n ConsentChanged: {\n clearSessionWire\n },\n PDPIsLoaded: {\n moveClickedResultToSessionWire\n },\n ResultURLTrackingEnabled: {\n moveClickedResultToSessionWire\n },\n SearchTaggingChanged: {\n setQueryTaggingInfo\n },\n SearchTaggingReceived: {\n trackQueryWire\n },\n TrackableElementDisplayed: {\n trackElementDisplayedWire\n },\n TaggingConfigProvided: {\n setTaggingConfig\n },\n UserClickedAResult: {\n trackResultClickedWire,\n storeClickedResultWire\n },\n UserClickedResultAddToCart: {\n trackAddToCartWire,\n trackResultClickedWire\n },\n UserClickedPDPAddToCart: {\n trackAddToCartFromSessionStorage\n },\n UserClickedABanner: {\n trackBannerClickedWire\n },\n UserClickedADisplayResult: {\n trackDisplayClickedWire,\n setQueryTaggingFromQueryPreview\n },\n SemanticQueriesResponseChanged: {\n trackNoResultsQueryWithSemanticsWireDebounced\n },\n ModuleRegistered: {\n setNoResultsTaggingEnabledWire\n }\n});\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/tagging/wiring.ts"],"sourcesContent":["import { Result, SemanticQuery, Taggable, Tagging, TaggingRequest } from '@empathyco/x-types';\nimport { DefaultSessionService } from '@empathyco/x-utils';\nimport {\n namespacedWireCommit,\n namespacedWireDispatch\n} from '../../wiring/namespaced-wires.factory';\nimport { namespacedDebounce } from '../../wiring/namespaced-wires.operators';\nimport { wireService, wireServiceWithoutPayload } from '../../wiring/wires.factory';\nimport { filter, mapWire } from '../../wiring/wires.operators';\nimport { DisplayWireMetadata, Wire } from '../../wiring/wiring.types';\nimport { createWiring } from '../../wiring/wiring.utils';\nimport { createOrigin } from '../../utils/index';\nimport { FeatureLocation } from '../../types/index';\nimport { DefaultPDPAddToCartService } from './service/pdp-add-to-cart.service';\n\n/**\n * `tagging` {@link XModuleName | XModule name}.\n *\n * @internal\n */\nconst moduleName = 'tagging';\n\n/**\n * Debounce function for the module.\n */\nconst moduleDebounce = namespacedDebounce(moduleName);\n\n/**\n * WireCommit for {@link TaggingXModule}.\n *\n * @internal\n */\nconst wireCommit = namespacedWireCommit(moduleName);\n\n/**\n * WireDispatch for {@link TaggingXModule}.\n *\n * @internal\n */\nconst wireDispatch = namespacedWireDispatch(moduleName);\n\n/**\n * Wires without payload factory for {@link DefaultSessionService}.\n */\nconst wireSessionServiceWithoutPayload = wireServiceWithoutPayload(DefaultSessionService.instance);\n\n/**\n * Wires factory for {@link DefaultPDPAddToCartService}.\n */\nconst wirePDPAddToCartService = wireService(DefaultPDPAddToCartService.instance);\n\n/**\n * Stores the given result on the local storage.\n *\n * @public\n */\nconst storeClickedResultWire = wirePDPAddToCartService('storeResultClicked');\n\n/**\n * Moves the result information from the local storage to session storage.\n *\n * @public\n */\nconst moveClickedResultToSessionWire = mapWire(\n wirePDPAddToCartService('moveToSessionStorage'),\n (payload: string) => {\n return payload === 'url' ? undefined : payload;\n }\n);\n\n/**\n * Triggers the add to cart tracking.\n *\n * @public\n */\nconst trackAddToCartFromSessionStorage = wirePDPAddToCartService('trackAddToCart');\n\n/**\n * Clears the session id.\n *\n * @public\n */\nconst clearSessionWire = filter(\n wireSessionServiceWithoutPayload('clearSessionId'),\n ({ eventPayload: consent }) => !consent\n);\n\n/**\n * Sets the tagging state `consent`.\n *\n * @public\n */\nexport const setConsent = wireCommit('setConsent');\n\n/**\n * Sets the tagging state `noResultsTaggingEnabled`.\n *\n * @public\n */\nexport const setNoResultsTaggingEnabledWire = wireCommit('setNoResultsTaggingEnabled');\n\n/**\n * Sets the tagging config state.\n *\n * @public\n */\nexport const setTaggingConfig = wireCommit('mergeConfig');\n\n/**\n * Tracks the tagging of the query.\n *\n * @public\n */\nexport const trackQueryWire = filter(\n wireDispatch('track'),\n ({ eventPayload, store }) =>\n (eventPayload as TaggingRequest).params.totalHits > 0 ||\n !store.state.x.tagging.noResultsTaggingEnabled\n);\n\n/**\n * Sets the tagging state of the query tagging info using a debounce which ends if the user\n * accepts a query.\n *\n * @public\n */\nexport const setQueryTaggingInfo = moduleDebounce(\n wireCommit('setQueryTaggingInfo'),\n ({ state }) => state.config.queryTaggingDebounceMs,\n {\n cancelOn: 'UserClearedQuery',\n forceOn: [\n 'UserClickedAResult',\n 'UserClickedAPromoted',\n 'UserClickedABanner',\n 'UserClickedARedirection',\n 'UserReachedResultsListEnd'\n ]\n }\n);\n\n/**\n * Sets the tagging state of the query tagging info using.\n *\n * @public\n */\nexport const setQueryTaggingFromQueryPreview = createSetQueryTaggingFromQueryPreview();\n\n/**\n * Tracks the tagging of the result.\n *\n * @public\n */\nexport const trackResultClickedWire = createTrackWire('click');\n\n/**\n * Tracks the tagging of the banner.\n *\n * @public\n */\nexport const trackBannerClickedWire = createTrackWire('click');\n\n/**\n * Performs a track of a result added to the cart.\n *\n * @public\n */\nexport const trackAddToCartWire = createTrackWire('add2cart');\n\n/**\n * Performs a track of a display result being clicked.\n *\n * @public\n */\nexport const trackDisplayClickedWire = createTrackDisplayWire('displayClick');\n\n/**\n * Performs a track of a display result being clicked.\n *\n * @public\n */\nexport const trackToolingDisplayClickedWire = createTrackToolingDisplayWire();\n\n/**\n * Performs a track of a display result being clicked.\n *\n * @public\n */\nexport const trackToolingAdd2CartWire = createTrackToolingAdd2CartWire();\n\n/**\n * Performs a track of a display element appearing.\n *\n * @public\n */\nexport const trackElementDisplayedWire = createTrackDisplayWire('display');\n\n/**\n * Factory helper to create a wire for the track of a taggable element.\n *\n * @param property - Key of the tagging object to track.\n * @returns A new wire for the given property of the taggable element.\n *\n * @public\n */\nexport function createTrackWire(property: keyof Tagging): Wire<Taggable> {\n return filter(\n wireDispatch('track', ({ eventPayload: { tagging }, metadata: { location } }) => {\n const taggingInfo: TaggingRequest = tagging[property];\n taggingInfo.params.location = location as string;\n return taggingInfo;\n }),\n ({ eventPayload: { tagging }, metadata: { ignoreInModules } }) =>\n !!tagging?.[property] && !ignoreInModules?.includes(moduleName)\n );\n}\n\n/**\n * Performs a track of a query with no results that used semantics as fallback.\n * The totalHits will be changed to -1 if semantic queries are found in order to differentiate\n * it from scenarios where the user encounters a no-results page without any semantic queries.\n *\n * @public\n */\nexport const trackNoResultsQueryWithSemanticsWire = filter(\n wireDispatch('track', ({ eventPayload, state }) => {\n const { queryTaggingInfo } = state;\n const totalHits = (eventPayload as SemanticQuery[]).length > 0 ? -1 : 0;\n return {\n params: { ...queryTaggingInfo?.params, totalHits },\n url: queryTaggingInfo?.url ?? ''\n };\n }),\n ({ store }) => Number(store.state.x.tagging.queryTaggingInfo?.params.totalHits)! === 0\n);\n\n/**.\n * Debounced version of {@link trackNoResultsQueryWithSemanticsWire}\n *\n * @public\n */\nexport const trackNoResultsQueryWithSemanticsWireDebounced = moduleDebounce(\n trackNoResultsQueryWithSemanticsWire,\n ({ state }) => state.config.queryTaggingDebounceMs,\n { cancelOn: 'QueryPreviewUnmounted' }\n);\n\n/**\n * Factory helper to create a wire for the track of the display click.\n *\n * @param property - Key of the tagging object to track.\n * @returns A new wire for the display click of the taggable element.\n *\n * @public\n */\nexport function createTrackDisplayWire(property: keyof Tagging): Wire<Taggable> {\n return filter(\n wireDispatch('track', ({ eventPayload: { tagging }, metadata }) => {\n const taggingInfo: TaggingRequest = tagging[property];\n const location = metadata.location as FeatureLocation;\n\n taggingInfo.params.location = location;\n taggingInfo.params.displayFamily = createOrigin({\n feature: metadata.feature,\n location\n })!;\n taggingInfo.params.q = (metadata as DisplayWireMetadata).displayOriginalQuery;\n\n return taggingInfo;\n }),\n ({ eventPayload: { tagging } }) => !!tagging?.[property]\n );\n}\n\n/**\n * Update the tooling tagging params with the result information.\n *\n * @param taggingRequest - The tooling tagging request to be updated.\n * @param result - The clicked result.\n * @returns The tagging request updated.\n *\n * @internal\n */\nfunction updateToolingTaggingWithResult(\n taggingRequest: TaggingRequest,\n result: Result\n): TaggingRequest {\n taggingRequest.params.productId = result.id;\n taggingRequest.params.title = result.name!;\n taggingRequest.params.url = result.url!;\n\n return taggingRequest;\n}\n\n/**\n * Factory helper to create a wire for the track of the tooling display click.\n *\n * @returns A new wire for the tooling display click of the taggable element.\n *\n * @public\n */\nexport function createTrackToolingDisplayWire(): Wire<Taggable> {\n return filter(\n wireDispatch('track', ({ eventPayload, metadata }) => {\n const taggingInfo: TaggingRequest = metadata.toolingTagging as TaggingRequest;\n const resultInfo = eventPayload as Result;\n\n updateToolingTaggingWithResult(taggingInfo, resultInfo);\n\n return taggingInfo;\n }),\n ({ metadata }) => !!metadata?.toolingTagging\n );\n}\n\n/**\n * Factory helper to create a wire for the track of the tooling display click.\n *\n * @returns A new wire for the tooling display add to cart of the taggable element.\n *\n * @public\n */\nexport function createTrackToolingAdd2CartWire(): Wire<Taggable> {\n return filter(\n wireDispatch('track', ({ eventPayload, metadata }) => {\n const taggingInfo: TaggingRequest = metadata.toolingAdd2CartTagging as TaggingRequest;\n const resultInfo = eventPayload as Result;\n\n updateToolingTaggingWithResult(taggingInfo, resultInfo);\n\n return taggingInfo;\n }),\n ({ metadata }) => !!metadata?.toolingAdd2CartTagging\n );\n}\n\n/**\n * Factory helper to create a wire to set the queryTagging.\n *\n * @returns A new wire for the query of a result of a queryPreview.\n *\n * @public\n */\nexport function createSetQueryTaggingFromQueryPreview(): Wire<Taggable> {\n return filter(\n wireCommit(\n 'setQueryTaggingInfo',\n ({ metadata: { queryTagging } }) => queryTagging as TaggingRequest\n ),\n ({ metadata: { queryTagging } }) => !!queryTagging\n );\n}\n\n/**\n * Wiring configuration for the {@link TaggingXModule | tagging module}.\n *\n * @internal\n */\nexport const taggingWiring = createWiring({\n ConsentProvided: {\n setConsent\n },\n ConsentChanged: {\n clearSessionWire\n },\n PDPIsLoaded: {\n moveClickedResultToSessionWire\n },\n ResultURLTrackingEnabled: {\n moveClickedResultToSessionWire\n },\n SearchTaggingChanged: {\n setQueryTaggingInfo\n },\n SearchTaggingReceived: {\n trackQueryWire\n },\n TrackableElementDisplayed: {\n trackElementDisplayedWire\n },\n TaggingConfigProvided: {\n setTaggingConfig\n },\n UserClickedAResult: {\n trackResultClickedWire,\n storeClickedResultWire\n },\n UserClickedResultAddToCart: {\n trackAddToCartWire,\n trackResultClickedWire\n },\n UserClickedPDPAddToCart: {\n trackAddToCartFromSessionStorage\n },\n UserClickedABanner: {\n trackBannerClickedWire\n },\n UserClickedADisplayResult: {\n trackDisplayClickedWire,\n setQueryTaggingFromQueryPreview\n },\n SemanticQueriesResponseChanged: {\n trackNoResultsQueryWithSemanticsWireDebounced\n },\n ModuleRegistered: {\n setNoResultsTaggingEnabledWire\n },\n UserClickedARelatedPromptResult: {\n trackToolingDisplayClickedWire\n },\n UserClickedARelatedPromptAdd2Cart: {\n trackToolingAdd2CartWire\n }\n});\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@empathyco/x-components",
3
- "version": "6.0.0-alpha.37",
3
+ "version": "6.0.0-alpha.38",
4
4
  "description": "Empathy X Components",
5
5
  "author": "Empathy Systems Corporation S.L.",
6
6
  "license": "Apache-2.0",
@@ -70,12 +70,12 @@
70
70
  },
71
71
  "dependencies": {
72
72
  "@empathyco/x-adapter": "^8.1.0-alpha.1",
73
- "@empathyco/x-adapter-platform": "^1.1.0-alpha.10",
73
+ "@empathyco/x-adapter-platform": "^1.1.0-alpha.11",
74
74
  "@empathyco/x-bus": "^1.0.3-alpha.2",
75
75
  "@empathyco/x-deep-merge": "^2.0.3-alpha.2",
76
76
  "@empathyco/x-logger": "^1.2.0-alpha.11",
77
77
  "@empathyco/x-storage-service": "^2.0.3-alpha.1",
78
- "@empathyco/x-types": "^10.1.0-alpha.7",
78
+ "@empathyco/x-types": "^10.1.0-alpha.8",
79
79
  "@empathyco/x-utils": "^1.0.3-alpha.2",
80
80
  "@vue/devtools-api": "~6.5.0",
81
81
  "@vueuse/core": "~10.7.1",
@@ -138,5 +138,5 @@
138
138
  "access": "public",
139
139
  "directory": "dist"
140
140
  },
141
- "gitHead": "f1734e8e3cf41334b6c100a98bce16b0d4140148"
141
+ "gitHead": "924c8c5f088e2a70ba33c0e52488269b020363a1"
142
142
  }