@empathyco/x-components 6.0.0-alpha.75 → 6.0.0-alpha.77
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +18 -0
- package/design-system/deprecated-full-theme.css +1624 -1624
- package/docs/API-reference/api/x-components.allfilter.md +3 -3
- package/docs/API-reference/api/x-components.baseeventsmodalclose.md +3 -3
- package/docs/API-reference/api/x-components.baseeventsmodalopen.md +3 -3
- package/docs/API-reference/api/x-components.facets.md +3 -3
- package/docs/API-reference/api/x-components.globalxbus.md +4 -0
- package/docs/API-reference/api/x-components.hierarchicalfilter.md +2 -0
- package/docs/API-reference/api/x-components.historyqueries.md +1 -1
- package/docs/API-reference/api/x-components.historyquery.md +1 -1
- package/docs/API-reference/api/x-components.identifierresult.md +2 -2
- package/docs/API-reference/api/x-components.md +5 -3
- package/docs/API-reference/api/x-components.nextqueries.md +1 -1
- package/docs/API-reference/api/x-components.popularsearches.md +1 -1
- package/docs/API-reference/api/x-components.querysuggestion.md +1 -1
- package/docs/API-reference/api/x-components.querysuggestions.md +1 -1
- package/docs/API-reference/api/x-components.relatedpromptsxevents.md +2 -0
- package/docs/API-reference/api/x-components.relatedpromptsxevents.relatedpromptsresponsechanged.md +13 -0
- package/docs/API-reference/api/x-components.relatedpromptsxevents.relatedpromptsunmounted.md +13 -0
- package/docs/API-reference/api/x-components.semanticquery.md +1 -1
- package/docs/API-reference/api/x-components.simplefilter.md +2 -0
- package/docs/API-reference/api/x-components.snippetcallbacks.md +2 -0
- package/docs/API-reference/api/x-components.tracknoresultsquerywithfallbackwire.md +13 -0
- package/docs/API-reference/api/x-components.tracknoresultsquerywithfallbackwiredebounced.md +13 -0
- package/docs/API-reference/api/x-components.tracknoresultsquerywithsemanticswire.md +6 -1
- package/docs/API-reference/api/x-components.tracknoresultsquerywithsemanticswiredebounced.md +6 -1
- package/docs/API-reference/api/x-components.usegetter.md +3 -17
- package/js/composables/use-getter.js +11 -11
- package/js/composables/use-getter.js.map +1 -1
- package/js/index.js +1 -1
- package/js/x-modules/facets/components/facets/facets.vue.js.map +1 -1
- package/js/x-modules/facets/components/facets/facets.vue2.js +1 -1
- package/js/x-modules/facets/components/facets/facets.vue2.js.map +1 -1
- package/js/x-modules/facets/components/filters/all-filter.vue.js.map +1 -1
- package/js/x-modules/facets/components/filters/all-filter.vue2.js +1 -1
- package/js/x-modules/facets/components/filters/all-filter.vue2.js.map +1 -1
- package/js/x-modules/facets/composables/use-facets.js +1 -4
- package/js/x-modules/facets/composables/use-facets.js.map +1 -1
- package/js/x-modules/history-queries/components/history-queries.vue.js.map +1 -1
- package/js/x-modules/history-queries/components/history-queries.vue2.js +1 -1
- package/js/x-modules/history-queries/components/history-queries.vue2.js.map +1 -1
- package/js/x-modules/history-queries/components/history-query.vue.js.map +1 -1
- package/js/x-modules/history-queries/components/history-query.vue2.js +1 -1
- package/js/x-modules/history-queries/components/history-query.vue2.js.map +1 -1
- package/js/x-modules/identifier-results/components/identifier-result.vue.js.map +1 -1
- package/js/x-modules/identifier-results/components/identifier-result.vue2.js +1 -3
- package/js/x-modules/identifier-results/components/identifier-result.vue2.js.map +1 -1
- package/js/x-modules/next-queries/components/next-queries-list.vue.js +1 -3
- package/js/x-modules/next-queries/components/next-queries-list.vue.js.map +1 -1
- package/js/x-modules/next-queries/components/next-queries.vue.js.map +1 -1
- package/js/x-modules/next-queries/components/next-queries.vue2.js +1 -1
- package/js/x-modules/next-queries/components/next-queries.vue2.js.map +1 -1
- package/js/x-modules/popular-searches/components/popular-searches.vue.js.map +1 -1
- package/js/x-modules/popular-searches/components/popular-searches.vue2.js +1 -1
- package/js/x-modules/popular-searches/components/popular-searches.vue2.js.map +1 -1
- package/js/x-modules/query-suggestions/components/query-suggestion.vue.js.map +1 -1
- package/js/x-modules/query-suggestions/components/query-suggestion.vue2.js +1 -1
- package/js/x-modules/query-suggestions/components/query-suggestion.vue2.js.map +1 -1
- package/js/x-modules/query-suggestions/components/query-suggestions.vue.js.map +1 -1
- package/js/x-modules/query-suggestions/components/query-suggestions.vue2.js +1 -1
- package/js/x-modules/query-suggestions/components/query-suggestions.vue2.js.map +1 -1
- package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue.js.map +1 -1
- package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js +4 -1
- package/js/x-modules/related-prompts/components/related-prompts-tag-list.vue2.js.map +1 -1
- package/js/x-modules/related-prompts/store/emitters.js +1 -0
- package/js/x-modules/related-prompts/store/emitters.js.map +1 -1
- package/js/x-modules/related-tags/components/related-tags.vue.js.map +1 -1
- package/js/x-modules/related-tags/components/related-tags.vue2.js +1 -3
- package/js/x-modules/related-tags/components/related-tags.vue2.js.map +1 -1
- package/js/x-modules/semantic-queries/components/semantic-query.vue.js.map +1 -1
- package/js/x-modules/semantic-queries/components/semantic-query.vue2.js +2 -2
- package/js/x-modules/semantic-queries/components/semantic-query.vue2.js.map +1 -1
- package/js/x-modules/tagging/wiring.js +27 -8
- package/js/x-modules/tagging/wiring.js.map +1 -1
- package/package.json +2 -2
- package/report/x-components.api.json +293 -144
- package/report/x-components.api.md +42 -18
- package/tagging/index.js +1 -1
- package/types/components/global-x-bus.vue.d.ts +4 -0
- package/types/components/global-x-bus.vue.d.ts.map +1 -1
- package/types/components/modals/base-events-modal-close.vue.d.ts +3 -3
- package/types/components/modals/base-events-modal-open.vue.d.ts +3 -3
- package/types/components/snippet-callbacks.vue.d.ts +2 -0
- package/types/components/snippet-callbacks.vue.d.ts.map +1 -1
- package/types/composables/use-getter.d.ts +13 -3
- package/types/composables/use-getter.d.ts.map +1 -1
- package/types/x-modules/facets/components/facets/facets.vue.d.ts +4 -4
- package/types/x-modules/facets/components/facets/facets.vue.d.ts.map +1 -1
- package/types/x-modules/facets/components/filters/all-filter.vue.d.ts +4 -4
- package/types/x-modules/facets/components/filters/all-filter.vue.d.ts.map +1 -1
- package/types/x-modules/facets/components/filters/hierarchical-filter.vue.d.ts +2 -0
- package/types/x-modules/facets/components/filters/hierarchical-filter.vue.d.ts.map +1 -1
- package/types/x-modules/facets/components/filters/simple-filter.vue.d.ts +2 -0
- package/types/x-modules/facets/components/filters/simple-filter.vue.d.ts.map +1 -1
- package/types/x-modules/history-queries/components/history-queries.vue.d.ts +1 -1
- package/types/x-modules/history-queries/components/history-query.vue.d.ts +1 -1
- package/types/x-modules/identifier-results/components/identifier-result.vue.d.ts +3 -3
- package/types/x-modules/identifier-results/components/identifier-result.vue.d.ts.map +1 -1
- package/types/x-modules/next-queries/components/next-queries-list.vue.d.ts.map +1 -1
- package/types/x-modules/next-queries/components/next-queries.vue.d.ts +1 -1
- package/types/x-modules/popular-searches/components/popular-searches.vue.d.ts +1 -1
- package/types/x-modules/query-suggestions/components/query-suggestion.vue.d.ts +1 -1
- package/types/x-modules/query-suggestions/components/query-suggestions.vue.d.ts +1 -1
- package/types/x-modules/related-prompts/components/related-prompts-tag-list.vue.d.ts.map +1 -1
- package/types/x-modules/related-prompts/events.types.d.ts +10 -1
- package/types/x-modules/related-prompts/events.types.d.ts.map +1 -1
- package/types/x-modules/related-prompts/store/emitters.d.ts +1 -0
- package/types/x-modules/related-prompts/store/emitters.d.ts.map +1 -1
- package/types/x-modules/related-tags/components/related-tags.vue.d.ts.map +1 -1
- package/types/x-modules/semantic-queries/components/semantic-query.vue.d.ts +1 -1
- package/types/x-modules/tagging/wiring.d.ts +23 -4
- package/types/x-modules/tagging/wiring.d.ts.map +1 -1
|
@@ -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 :show-buttons=\"showButtons && selectedPromptIndex === -1\"\n :scroll-container-class=\"[\n 'x-related-prompts-tag-list-scroll-container',\n scrollContainerClass || '',\n ]\"\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 class=\"x-related-prompts-tag-list\"\n :css=\"false\"\n tag=\"ul\"\n appear\n @before-enter=\"onBeforeEnter\"\n @enter=\"onEnter\"\n @leave=\"onLeave\"\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=\"{\n ...(selectedPromptIndex === index && { width: '100%' }),\n ...(isAnimating && { pointerEvents: 'none' }),\n }\"\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 :related-prompt=\"relatedPrompt\"\n :on-select=\"() => onSelect(index)\"\n :is-selected=\"selectedPromptIndex === index\"\n >\n <DisplayEmitter\n :payload=\"relatedPrompt.tagging?.toolingDisplayTagging\"\n :event-metadata=\"{\n feature: 'related-prompts',\n displayOriginalQuery: x.query.searchBox,\n replaceable: false,\n }\"\n >\n <RelatedPrompt\n :related-prompt=\"relatedPrompt\"\n :selected=\"selectedPromptIndex === index\"\n @click=\"onSelect(index)\"\n >\n <template #related-prompt-extra-content>\n <slot name=\"related-prompt-extra-content\" :related-prompt=\"relatedPrompt\" />\n </template>\n </RelatedPrompt>\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\">\nimport type { PropType } from 'vue'\nimport { computed, defineComponent, ref } from 'vue'\nimport DisplayEmitter from '../../../components/display-emitter.vue'\nimport SlidingPanel from '../../../components/sliding-panel.vue'\nimport { use$x, useState } from '../../../composables'\nimport { relatedPromptsXModule } from '../x-module'\nimport 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 */\nexport 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 boolean prop to handle the visiblity of sliding pannel buttons.\n *\n * @public\n */\n showButtons: { type: Boolean, default: true },\n /**\n * The CSS class for the wrapper of all the related prompt wrapper elements.\n *\n * @public\n */\n scrollContainerClass: 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\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.map((relatedPrompt, index) => ({ ...relatedPrompt, index })),\n )\n\n const visibleRelatedPrompts = computed(() =>\n selectedPromptIndex.value !== -1\n ? [indexRelatedPrompts.value[selectedPromptIndex.value]]\n : indexRelatedPrompts.value,\n )\n\n let timeOutId: number\n const resetTransitionStyle = (excludedProperties: Array<string> = ['width']) => {\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 (!excludedProperties.includes(property)) {\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 relatedPrompt: relatedPrompts.value[selectedIndex],\n selectedPrompt: selectedPromptIndex.value,\n })\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 // Changing the request will trigger the appear animation, so we need to reset the\n // style after it finishes\n x.on('SearchRequestChanged', false).subscribe(() => {\n resetTransitionStyle([])\n })\n\n return {\n onSelect,\n onBeforeEnter,\n onEnter,\n onLeave,\n selectedPromptIndex,\n visibleRelatedPrompts,\n listItems,\n isAnimating,\n x,\n }\n },\n})\n</script>\n\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 width: 100%;\n}\n.x-related-prompts-tag-list-item {\n height: 100%;\n flex-shrink: 0;\n}\n</style>\n"],"names":["DisplayEmitter"],"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 :show-buttons=\"showButtons && selectedPromptIndex === -1\"\n :scroll-container-class=\"[\n 'x-related-prompts-tag-list-scroll-container',\n scrollContainerClass || '',\n ]\"\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 class=\"x-related-prompts-tag-list\"\n :css=\"false\"\n tag=\"ul\"\n appear\n @before-enter=\"onBeforeEnter\"\n @enter=\"onEnter\"\n @leave=\"onLeave\"\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=\"{\n ...(selectedPromptIndex === index && { width: '100%' }),\n ...(isAnimating && { pointerEvents: 'none' }),\n }\"\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 :related-prompt=\"relatedPrompt\"\n :on-select=\"() => onSelect(index)\"\n :is-selected=\"selectedPromptIndex === index\"\n >\n <DisplayEmitter\n :payload=\"relatedPrompt.tagging?.toolingDisplayTagging\"\n :event-metadata=\"{\n feature: 'related-prompts',\n displayOriginalQuery: x.query.searchBox,\n replaceable: false,\n }\"\n >\n <RelatedPrompt\n :related-prompt=\"relatedPrompt\"\n :selected=\"selectedPromptIndex === index\"\n @click=\"onSelect(index)\"\n >\n <template #related-prompt-extra-content>\n <slot name=\"related-prompt-extra-content\" :related-prompt=\"relatedPrompt\" />\n </template>\n </RelatedPrompt>\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\">\nimport type { PropType } from 'vue'\nimport { computed, defineComponent, onBeforeUnmount, ref } from 'vue'\nimport DisplayEmitter from '../../../components/display-emitter.vue'\nimport SlidingPanel from '../../../components/sliding-panel.vue'\nimport { use$x, useState } from '../../../composables'\nimport { relatedPromptsXModule } from '../x-module'\nimport 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 */\nexport 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 boolean prop to handle the visiblity of sliding pannel buttons.\n *\n * @public\n */\n showButtons: { type: Boolean, default: true },\n /**\n * The CSS class for the wrapper of all the related prompt wrapper elements.\n *\n * @public\n */\n scrollContainerClass: 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\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.map((relatedPrompt, index) => ({ ...relatedPrompt, index })),\n )\n\n const visibleRelatedPrompts = computed(() =>\n selectedPromptIndex.value !== -1\n ? [indexRelatedPrompts.value[selectedPromptIndex.value]]\n : indexRelatedPrompts.value,\n )\n\n let timeOutId: number\n const resetTransitionStyle = (excludedProperties: Array<string> = ['width']) => {\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 (!excludedProperties.includes(property)) {\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 relatedPrompt: relatedPrompts.value[selectedIndex],\n selectedPrompt: selectedPromptIndex.value,\n })\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 // Changing the request will trigger the appear animation, so we need to reset the\n // style after it finishes\n x.on('SearchRequestChanged', false).subscribe(() => {\n resetTransitionStyle([])\n })\n\n onBeforeUnmount(() => {\n x.emit('RelatedPromptsUnmounted')\n })\n\n return {\n onSelect,\n onBeforeEnter,\n onEnter,\n onLeave,\n selectedPromptIndex,\n visibleRelatedPrompts,\n listItems,\n isAnimating,\n x,\n }\n },\n})\n</script>\n\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 width: 100%;\n}\n.x-related-prompts-tag-list-item {\n height: 100%;\n flex-shrink: 0;\n}\n</style>\n"],"names":["DisplayEmitter"],"mappings":"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"}
|
|
@@ -10,6 +10,7 @@ import { relatedPromptsXStoreModule } from './module.js';
|
|
|
10
10
|
const relatedPromptsStoreEmitters = createStoreEmitters(relatedPromptsXStoreModule, {
|
|
11
11
|
RelatedPromptsRequestUpdated: (_, getters) => getters.request,
|
|
12
12
|
SelectedRelatedPromptChanged: state => state.selectedPrompt,
|
|
13
|
+
RelatedPromptsResponseChanged: state => state.relatedPrompts,
|
|
13
14
|
});
|
|
14
15
|
|
|
15
16
|
export { relatedPromptsStoreEmitters };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"emitters.js","sources":["../../../../../src/x-modules/related-prompts/store/emitters.ts"],"sourcesContent":["import { createStoreEmitters } from '../../../store'\nimport { relatedPromptsXStoreModule } from './module'\n\n/**\n * {@link StoreEmitters} For the related-prompts module.\n *\n * @internal\n */\nexport const relatedPromptsStoreEmitters = createStoreEmitters(relatedPromptsXStoreModule, {\n RelatedPromptsRequestUpdated: (_, getters) => getters.request,\n SelectedRelatedPromptChanged: state => state.selectedPrompt,\n})\n"],"names":[],"mappings":";;;;AAGA;;;;AAIG;AACU,MAAA,2BAA2B,GAAG,mBAAmB,CAAC,0BAA0B,EAAE;IACzF,4BAA4B,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,OAAO;AAC7D,IAAA,4BAA4B,EAAE,KAAK,IAAI,KAAK,CAAC,cAAc;
|
|
1
|
+
{"version":3,"file":"emitters.js","sources":["../../../../../src/x-modules/related-prompts/store/emitters.ts"],"sourcesContent":["import { createStoreEmitters } from '../../../store'\nimport { relatedPromptsXStoreModule } from './module'\n\n/**\n * {@link StoreEmitters} For the related-prompts module.\n *\n * @internal\n */\nexport const relatedPromptsStoreEmitters = createStoreEmitters(relatedPromptsXStoreModule, {\n RelatedPromptsRequestUpdated: (_, getters) => getters.request,\n SelectedRelatedPromptChanged: state => state.selectedPrompt,\n RelatedPromptsResponseChanged: state => state.relatedPrompts,\n})\n"],"names":[],"mappings":";;;;AAGA;;;;AAIG;AACU,MAAA,2BAA2B,GAAG,mBAAmB,CAAC,0BAA0B,EAAE;IACzF,4BAA4B,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,OAAO;AAC7D,IAAA,4BAA4B,EAAE,KAAK,IAAI,KAAK,CAAC,cAAc;AAC3D,IAAA,6BAA6B,EAAE,KAAK,IAAI,KAAK,CAAC,cAAc;AAC7D,CAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"related-tags.vue.js","sources":["../../../../../src/x-modules/related-tags/components/related-tags.vue"],"sourcesContent":["<template>\n <component\n :is=\"animation\"\n v-if=\"relatedTags.length\"\n tag=\"ul\"\n class=\"x-related-tags\"\n data-test=\"related-tags\"\n >\n <li\n v-for=\"relatedTag in relatedTags\"\n :key=\"relatedTag.query\"\n class=\"x-related-tags__item\"\n data-test=\"related-tag-item\"\n >\n <!--\n @slot Custom content that replaces the RelatedTag component.\n @binding {RelatedTag} relatedTag - Related tag data.\n @binding {boolean} highlightCurated - True if the curated RTs should be displayed.\n -->\n <slot name=\"related-tag\" v-bind=\"{ relatedTag, highlightCurated }\">\n <RelatedTag\n :highlight-curated=\"highlightCurated\"\n :related-tag=\"relatedTag\"\n :class=\"itemClass\"\n >\n <template\n #default=\"{ relatedTag: relatedTagBinding, isSelected, shouldHighlightCurated }\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot Custom content that replaces the RelatedTag default content.\n @binding {RelatedTag} relatedTag - Related tag data.\n @binding {boolean} isSelected - Related tag status.\n @binding {boolean} shouldHighlightCurated - True if the curated RTs should be displayed.\n -->\n <slot\n name=\"related-tag-content\"\n v-bind=\"{ relatedTag: relatedTagBinding, isSelected, shouldHighlightCurated }\"\n />\n </template>\n </RelatedTag>\n </slot>\n </li>\n </component>\n</template>\n\n<script lang=\"ts\">\nimport type { RelatedTag as RelatedTagModel } from '@empathyco/x-types'\nimport type { ComputedRef } from 'vue'\nimport { computed, defineComponent } from 'vue'\nimport { useGetter } from '../../../composables/use-getter'\nimport { AnimationProp } from '../../../types/index'\nimport { relatedTagsXModule } from '../x-module'\nimport RelatedTag from './related-tag.vue'\n\n/**\n * This component renders a set of [`RelatedTag`](./x-components.related-tag) components by\n * default to select from after a query is performed to fine-tune search.\n * For example, if you are searching for *lego*, different related tags could be *city*,\n * friends*, or *harry potter*, refining the search with *lego city*, *lego friends*,\n * or *lego harry potter*.\n *\n * @public\n */\nexport default defineComponent({\n name: 'RelatedTags',\n xModule: relatedTagsXModule.name,\n components: {\n RelatedTag,\n },\n props: {\n /**\n * Animation component that will be used to animate the suggestion.\n *\n * @public\n */\n animation: {\n type: AnimationProp,\n default: 'ul',\n },\n\n /**\n * Number of related tags to be rendered.\n *\n * @public\n */\n maxItemsToRender: Number,\n\n /**\n * Flag to indicate if the curated tags should be displayed different.\n *\n * @public\n */\n highlightCurated: {\n type: Boolean,\n default: false,\n },\n\n /** Class inherited by content element. */\n itemClass: String,\n },\n setup(props) {\n const storedRelatedTags: ComputedRef<RelatedTagModel[]> = useGetter('relatedTags', [\n 'relatedTags',\n ]).relatedTags\n\n const relatedTags = computed((): RelatedTagModel[] =>\n storedRelatedTags.value.slice(0, props.maxItemsToRender),\n )\n\n return {\n relatedTags,\n }\n },\n})\n</script>\n\n<style lang=\"css\" scoped>\n.x-related-tags {\n display: flex;\n flex-flow: row nowrap;\n list-style: none;\n}\n</style>\n\n<docs lang=\"mdx\">\n## See it in action\n\n<!-- prettier-ignore-start -->\n:::warning Backend microservice required\nTo use this component, the QuerySignals microservice must be implemented.\n:::\n<!-- prettier-ignore-end -->\n\nThis example shows how related tags can be rendered without any additional effects.\n\n_Search for a fashion term like \"sandal\" or \"lipstick\"._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags />\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n### Play with props\n\nIn this example, the number of related tags rendered has been limited to 3. A fade and slide effect\nhas been added so that the related tags appear with a delay, then slide upwards and fade.\n\n_Search for a fashion term and see the related tags with the animation effect._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags :animation=\"'StaggeredFadeAndSlide'\" :maxItemsToRender=\"3\" />\n </div>\n</template>\n\n<script>\nimport Vue from 'vue'\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\nimport { StaggeredFadeAndSlide } from '@empathyco/x-components'\n\n// Registering the animation as a global component\nVue.component('StaggeredFadeAndSlide', StaggeredFadeAndSlide)\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n### Play with related-tag slot\n\nIn this example, the [`RelatedTag`](./x-components.related-tag.md) component is passed in the\n`related-tag` slot (although any other component could potentially be passed).\n\n_Search for a fashion term and see how the related tags can be rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag=\"{ relatedTag }\">\n <RelatedTag :relatedTag=\"relatedTag\" />\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags, RelatedTag } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n RelatedTag,\n },\n}\n</script>\n```\n\n### Play with related-tag-content slot\n\nTo continue the previous example, the [`RelatedTag`](./x-components.related-tag.md) component is\npassed in the `related-tag-content` slot, but in addition, an HTML span tag for the text are also\npassed.\n\n_Search for a fashion term and see how the related tags are rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag-content=\"{ relatedTag }\">\n <span>{{ relatedTag.tag }}</span>\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n## Extending the component\n\nComponents can be combined and communicate with each other. The `RelatedTags` component can\ncommunicate with the [`SearchInput`](../search-box/x-components.search-input.md) as follows:\n\n_Search for a fashion term and see how the related tags can be rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags />\n <ResultsList #result=\"{ item }\">\n <span class=\"result\">\n {{ item.name }}\n </span>\n </ResultsList>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\nimport { ResultsList } from '@empathyco/x-components/search'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n ResultsList,\n },\n}\n</script>\n```\n\n## Customizing the related tags with classes\n\nThe `itemClass` prop can be used to add classes to the related tags.\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag-content=\"{ relatedTag }\" itemClass=\"x-tag-outlined x-tag-auxiliary\">\n <span>{{ relatedTag.tag }}</span>\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n</docs>\n"],"names":["_resolveComponent","_openBlock","_createBlock","_resolveDynamicComponent","_createElementBlock","_Fragment","_renderList","_renderSlot","highlightCurated","_mergeProps","_createVNode","itemClass","_normalizeClass","_createCommentVNode"],"mappings":";;;;;;gCAGsBA,gBAAM,CAAA,YAAA,CAAA,CAAA;SAH5B,IAIY,CAAA,WAAA,CAAA,MAAA,IAAAC,SAAA,EAAA,EAAAC,WAAA,CAAAC,uBAAA,CAAA,IAAA,CAAA,SAAA,CAAA,EAAA;AAAA,IACR,GAAK,EAAA,CAAA;AAAA,IACL,GAAA,EAAA,IAAA;AAAA,IAAA,KAAA,EAAA,gBAAA;AANJ,IAAA,WAAA,EAAA,cAAA;AAAA,GAAA,EAAA;;iBAUY,IAAU,CAAA,EAAAC,kBAAA;AAAA,QAAMC,QAAA;AAAA,QAAA,IAAA;AAAA,QAAAC,UAAA,CAAA,IAAA,CAAA,WAAA,EAAA,CAAA,UAAA,KAAA;AACjB,UAAA,OAAAL,SAAA,EAAuB,EAAAG,kBAAA,CAAA,IAAA,EAAA;AAAA,YAC5B,GAAU,EAAA,UAAA,CAAA,KAAA;AAAA,YAAA,KAAA,EAAA,sBAAA;YAOV,WAsBO,EAAA,kBAAA;AAAA,WAAA,EAAA;AApBF,YAAAG,UAAA,CAAA,IAAA,CAAA,MAAA,EAAmBC,aAAgB,EAAAC,UAAA,CAAA,EAAA,OAAA,EAAA,IAAA,EAAA,EAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,IAAA,CAAA,gBAAA,EAAA,CAAA,EAAA,MAAA;AAAA,cAAAC,WAAA,CACnC,qBAAuB,EAAA;AAAA,gBACvB,qBAvBX,IAuBkBC,CAAAA,gBAAAA;AAAAA,gBAAAA,aAAAA,EAAAA,UAAAA;AAGL,gBAAA,KAAA,EAAOC,eAYN,IAZsB,CAAA,SAAA,CAAA;AAAA,eAAA,EAAA;;AA1BpC,kBAAAL,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,qBAAA,EAAAE,UAAA,CAAA,EAAA,OAAA,EAAA,IAAA,EAAA,EAAA,EAAA,UAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,sBAAA,EAAA,CAAA,EAAA,KAAA,CAAA,EAAA,IAAA,CAAA;AAAA,iBAAA,CAAA;;;;;;AAAA,SAAA,CAAA;AAAA,QAAA,GAAA;AAAA;AAAA,OAAA;AAAA,KAAA,CAAA;AAAA,IAAA,CAAA,EAAA,CAAA;AAAA;AAAA,GAAA,CAAA,IAAAI,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}
|
|
1
|
+
{"version":3,"file":"related-tags.vue.js","sources":["../../../../../src/x-modules/related-tags/components/related-tags.vue"],"sourcesContent":["<template>\n <component\n :is=\"animation\"\n v-if=\"relatedTags.length\"\n tag=\"ul\"\n class=\"x-related-tags\"\n data-test=\"related-tags\"\n >\n <li\n v-for=\"relatedTag in relatedTags\"\n :key=\"relatedTag.query\"\n class=\"x-related-tags__item\"\n data-test=\"related-tag-item\"\n >\n <!--\n @slot Custom content that replaces the RelatedTag component.\n @binding {RelatedTag} relatedTag - Related tag data.\n @binding {boolean} highlightCurated - True if the curated RTs should be displayed.\n -->\n <slot name=\"related-tag\" v-bind=\"{ relatedTag, highlightCurated }\">\n <RelatedTag\n :highlight-curated=\"highlightCurated\"\n :related-tag=\"relatedTag\"\n :class=\"itemClass\"\n >\n <template\n #default=\"{ relatedTag: relatedTagBinding, isSelected, shouldHighlightCurated }\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot Custom content that replaces the RelatedTag default content.\n @binding {RelatedTag} relatedTag - Related tag data.\n @binding {boolean} isSelected - Related tag status.\n @binding {boolean} shouldHighlightCurated - True if the curated RTs should be displayed.\n -->\n <slot\n name=\"related-tag-content\"\n v-bind=\"{ relatedTag: relatedTagBinding, isSelected, shouldHighlightCurated }\"\n />\n </template>\n </RelatedTag>\n </slot>\n </li>\n </component>\n</template>\n\n<script lang=\"ts\">\nimport type { RelatedTag as RelatedTagModel } from '@empathyco/x-types'\nimport type { ComputedRef } from 'vue'\nimport { computed, defineComponent } from 'vue'\nimport { useGetter } from '../../../composables/use-getter'\nimport { AnimationProp } from '../../../types/index'\nimport { relatedTagsXModule } from '../x-module'\nimport RelatedTag from './related-tag.vue'\n\n/**\n * This component renders a set of [`RelatedTag`](./x-components.related-tag) components by\n * default to select from after a query is performed to fine-tune search.\n * For example, if you are searching for *lego*, different related tags could be *city*,\n * friends*, or *harry potter*, refining the search with *lego city*, *lego friends*,\n * or *lego harry potter*.\n *\n * @public\n */\nexport default defineComponent({\n name: 'RelatedTags',\n xModule: relatedTagsXModule.name,\n components: {\n RelatedTag,\n },\n props: {\n /**\n * Animation component that will be used to animate the suggestion.\n *\n * @public\n */\n animation: {\n type: AnimationProp,\n default: 'ul',\n },\n\n /**\n * Number of related tags to be rendered.\n *\n * @public\n */\n maxItemsToRender: Number,\n\n /**\n * Flag to indicate if the curated tags should be displayed different.\n *\n * @public\n */\n highlightCurated: {\n type: Boolean,\n default: false,\n },\n\n /** Class inherited by content element. */\n itemClass: String,\n },\n setup(props) {\n const storedRelatedTags: ComputedRef<RelatedTagModel[]> = useGetter('relatedTags').relatedTags\n\n const relatedTags = computed((): RelatedTagModel[] =>\n storedRelatedTags.value.slice(0, props.maxItemsToRender),\n )\n\n return {\n relatedTags,\n }\n },\n})\n</script>\n\n<style lang=\"css\" scoped>\n.x-related-tags {\n display: flex;\n flex-flow: row nowrap;\n list-style: none;\n}\n</style>\n\n<docs lang=\"mdx\">\n## See it in action\n\n<!-- prettier-ignore-start -->\n:::warning Backend microservice required\nTo use this component, the QuerySignals microservice must be implemented.\n:::\n<!-- prettier-ignore-end -->\n\nThis example shows how related tags can be rendered without any additional effects.\n\n_Search for a fashion term like \"sandal\" or \"lipstick\"._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags />\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n### Play with props\n\nIn this example, the number of related tags rendered has been limited to 3. A fade and slide effect\nhas been added so that the related tags appear with a delay, then slide upwards and fade.\n\n_Search for a fashion term and see the related tags with the animation effect._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags :animation=\"'StaggeredFadeAndSlide'\" :maxItemsToRender=\"3\" />\n </div>\n</template>\n\n<script>\nimport Vue from 'vue'\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\nimport { StaggeredFadeAndSlide } from '@empathyco/x-components'\n\n// Registering the animation as a global component\nVue.component('StaggeredFadeAndSlide', StaggeredFadeAndSlide)\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n### Play with related-tag slot\n\nIn this example, the [`RelatedTag`](./x-components.related-tag.md) component is passed in the\n`related-tag` slot (although any other component could potentially be passed).\n\n_Search for a fashion term and see how the related tags can be rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag=\"{ relatedTag }\">\n <RelatedTag :relatedTag=\"relatedTag\" />\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags, RelatedTag } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n RelatedTag,\n },\n}\n</script>\n```\n\n### Play with related-tag-content slot\n\nTo continue the previous example, the [`RelatedTag`](./x-components.related-tag.md) component is\npassed in the `related-tag-content` slot, but in addition, an HTML span tag for the text are also\npassed.\n\n_Search for a fashion term and see how the related tags are rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag-content=\"{ relatedTag }\">\n <span>{{ relatedTag.tag }}</span>\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n## Extending the component\n\nComponents can be combined and communicate with each other. The `RelatedTags` component can\ncommunicate with the [`SearchInput`](../search-box/x-components.search-input.md) as follows:\n\n_Search for a fashion term and see how the related tags can be rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags />\n <ResultsList #result=\"{ item }\">\n <span class=\"result\">\n {{ item.name }}\n </span>\n </ResultsList>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\nimport { ResultsList } from '@empathyco/x-components/search'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n ResultsList,\n },\n}\n</script>\n```\n\n## Customizing the related tags with classes\n\nThe `itemClass` prop can be used to add classes to the related tags.\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag-content=\"{ relatedTag }\" itemClass=\"x-tag-outlined x-tag-auxiliary\">\n <span>{{ relatedTag.tag }}</span>\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n</docs>\n"],"names":["_resolveComponent","_openBlock","_createBlock","_resolveDynamicComponent","_createElementBlock","_Fragment","_renderList","_renderSlot","highlightCurated","_mergeProps","_createVNode","itemClass","_normalizeClass","_createCommentVNode"],"mappings":";;;;;;gCAGsBA,gBAAM,CAAA,YAAA,CAAA,CAAA;SAH5B,IAIY,CAAA,WAAA,CAAA,MAAA,IAAAC,SAAA,EAAA,EAAAC,WAAA,CAAAC,uBAAA,CAAA,IAAA,CAAA,SAAA,CAAA,EAAA;AAAA,IACR,GAAK,EAAA,CAAA;AAAA,IACL,GAAA,EAAA,IAAA;AAAA,IAAA,KAAA,EAAA,gBAAA;AANJ,IAAA,WAAA,EAAA,cAAA;AAAA,GAAA,EAAA;;iBAUY,IAAU,CAAA,EAAAC,kBAAA;AAAA,QAAMC,QAAA;AAAA,QAAA,IAAA;AAAA,QAAAC,UAAA,CAAA,IAAA,CAAA,WAAA,EAAA,CAAA,UAAA,KAAA;AACjB,UAAA,OAAAL,SAAA,EAAuB,EAAAG,kBAAA,CAAA,IAAA,EAAA;AAAA,YAC5B,GAAU,EAAA,UAAA,CAAA,KAAA;AAAA,YAAA,KAAA,EAAA,sBAAA;YAOV,WAsBO,EAAA,kBAAA;AAAA,WAAA,EAAA;AApBF,YAAAG,UAAA,CAAA,IAAA,CAAA,MAAA,EAAmBC,aAAgB,EAAAC,UAAA,CAAA,EAAA,OAAA,EAAA,IAAA,EAAA,EAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,IAAA,CAAA,gBAAA,EAAA,CAAA,EAAA,MAAA;AAAA,cAAAC,WAAA,CACnC,qBAAuB,EAAA;AAAA,gBACvB,qBAvBX,IAuBkBC,CAAAA,gBAAAA;AAAAA,gBAAAA,aAAAA,EAAAA,UAAAA;AAGL,gBAAA,KAAA,EAAOC,eAYN,IAZsB,CAAA,SAAA,CAAA;AAAA,eAAA,EAAA;;AA1BpC,kBAAAL,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,qBAAA,EAAAE,UAAA,CAAA,EAAA,OAAA,EAAA,IAAA,EAAA,EAAA,EAAA,UAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,sBAAA,EAAA,CAAA,EAAA,KAAA,CAAA,EAAA,IAAA,CAAA;AAAA,iBAAA,CAAA;;;;;;AAAA,SAAA,CAAA;AAAA,QAAA,GAAA;AAAA;AAAA,OAAA;AAAA,KAAA,CAAA;AAAA,IAAA,CAAA,EAAA,CAAA;AAAA;AAAA,GAAA,CAAA,IAAAI,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}
|
|
@@ -48,9 +48,7 @@ var _sfc_main = defineComponent({
|
|
|
48
48
|
itemClass: String,
|
|
49
49
|
},
|
|
50
50
|
setup(props) {
|
|
51
|
-
const storedRelatedTags = useGetter('relatedTags'
|
|
52
|
-
'relatedTags',
|
|
53
|
-
]).relatedTags;
|
|
51
|
+
const storedRelatedTags = useGetter('relatedTags').relatedTags;
|
|
54
52
|
const relatedTags = computed(() => storedRelatedTags.value.slice(0, props.maxItemsToRender));
|
|
55
53
|
return {
|
|
56
54
|
relatedTags,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"related-tags.vue2.js","sources":["../../../../../src/x-modules/related-tags/components/related-tags.vue"],"sourcesContent":["<template>\n <component\n :is=\"animation\"\n v-if=\"relatedTags.length\"\n tag=\"ul\"\n class=\"x-related-tags\"\n data-test=\"related-tags\"\n >\n <li\n v-for=\"relatedTag in relatedTags\"\n :key=\"relatedTag.query\"\n class=\"x-related-tags__item\"\n data-test=\"related-tag-item\"\n >\n <!--\n @slot Custom content that replaces the RelatedTag component.\n @binding {RelatedTag} relatedTag - Related tag data.\n @binding {boolean} highlightCurated - True if the curated RTs should be displayed.\n -->\n <slot name=\"related-tag\" v-bind=\"{ relatedTag, highlightCurated }\">\n <RelatedTag\n :highlight-curated=\"highlightCurated\"\n :related-tag=\"relatedTag\"\n :class=\"itemClass\"\n >\n <template\n #default=\"{ relatedTag: relatedTagBinding, isSelected, shouldHighlightCurated }\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot Custom content that replaces the RelatedTag default content.\n @binding {RelatedTag} relatedTag - Related tag data.\n @binding {boolean} isSelected - Related tag status.\n @binding {boolean} shouldHighlightCurated - True if the curated RTs should be displayed.\n -->\n <slot\n name=\"related-tag-content\"\n v-bind=\"{ relatedTag: relatedTagBinding, isSelected, shouldHighlightCurated }\"\n />\n </template>\n </RelatedTag>\n </slot>\n </li>\n </component>\n</template>\n\n<script lang=\"ts\">\nimport type { RelatedTag as RelatedTagModel } from '@empathyco/x-types'\nimport type { ComputedRef } from 'vue'\nimport { computed, defineComponent } from 'vue'\nimport { useGetter } from '../../../composables/use-getter'\nimport { AnimationProp } from '../../../types/index'\nimport { relatedTagsXModule } from '../x-module'\nimport RelatedTag from './related-tag.vue'\n\n/**\n * This component renders a set of [`RelatedTag`](./x-components.related-tag) components by\n * default to select from after a query is performed to fine-tune search.\n * For example, if you are searching for *lego*, different related tags could be *city*,\n * friends*, or *harry potter*, refining the search with *lego city*, *lego friends*,\n * or *lego harry potter*.\n *\n * @public\n */\nexport default defineComponent({\n name: 'RelatedTags',\n xModule: relatedTagsXModule.name,\n components: {\n RelatedTag,\n },\n props: {\n /**\n * Animation component that will be used to animate the suggestion.\n *\n * @public\n */\n animation: {\n type: AnimationProp,\n default: 'ul',\n },\n\n /**\n * Number of related tags to be rendered.\n *\n * @public\n */\n maxItemsToRender: Number,\n\n /**\n * Flag to indicate if the curated tags should be displayed different.\n *\n * @public\n */\n highlightCurated: {\n type: Boolean,\n default: false,\n },\n\n /** Class inherited by content element. */\n itemClass: String,\n },\n setup(props) {\n const storedRelatedTags: ComputedRef<RelatedTagModel[]> = useGetter('relatedTags'
|
|
1
|
+
{"version":3,"file":"related-tags.vue2.js","sources":["../../../../../src/x-modules/related-tags/components/related-tags.vue"],"sourcesContent":["<template>\n <component\n :is=\"animation\"\n v-if=\"relatedTags.length\"\n tag=\"ul\"\n class=\"x-related-tags\"\n data-test=\"related-tags\"\n >\n <li\n v-for=\"relatedTag in relatedTags\"\n :key=\"relatedTag.query\"\n class=\"x-related-tags__item\"\n data-test=\"related-tag-item\"\n >\n <!--\n @slot Custom content that replaces the RelatedTag component.\n @binding {RelatedTag} relatedTag - Related tag data.\n @binding {boolean} highlightCurated - True if the curated RTs should be displayed.\n -->\n <slot name=\"related-tag\" v-bind=\"{ relatedTag, highlightCurated }\">\n <RelatedTag\n :highlight-curated=\"highlightCurated\"\n :related-tag=\"relatedTag\"\n :class=\"itemClass\"\n >\n <template\n #default=\"{ relatedTag: relatedTagBinding, isSelected, shouldHighlightCurated }\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot Custom content that replaces the RelatedTag default content.\n @binding {RelatedTag} relatedTag - Related tag data.\n @binding {boolean} isSelected - Related tag status.\n @binding {boolean} shouldHighlightCurated - True if the curated RTs should be displayed.\n -->\n <slot\n name=\"related-tag-content\"\n v-bind=\"{ relatedTag: relatedTagBinding, isSelected, shouldHighlightCurated }\"\n />\n </template>\n </RelatedTag>\n </slot>\n </li>\n </component>\n</template>\n\n<script lang=\"ts\">\nimport type { RelatedTag as RelatedTagModel } from '@empathyco/x-types'\nimport type { ComputedRef } from 'vue'\nimport { computed, defineComponent } from 'vue'\nimport { useGetter } from '../../../composables/use-getter'\nimport { AnimationProp } from '../../../types/index'\nimport { relatedTagsXModule } from '../x-module'\nimport RelatedTag from './related-tag.vue'\n\n/**\n * This component renders a set of [`RelatedTag`](./x-components.related-tag) components by\n * default to select from after a query is performed to fine-tune search.\n * For example, if you are searching for *lego*, different related tags could be *city*,\n * friends*, or *harry potter*, refining the search with *lego city*, *lego friends*,\n * or *lego harry potter*.\n *\n * @public\n */\nexport default defineComponent({\n name: 'RelatedTags',\n xModule: relatedTagsXModule.name,\n components: {\n RelatedTag,\n },\n props: {\n /**\n * Animation component that will be used to animate the suggestion.\n *\n * @public\n */\n animation: {\n type: AnimationProp,\n default: 'ul',\n },\n\n /**\n * Number of related tags to be rendered.\n *\n * @public\n */\n maxItemsToRender: Number,\n\n /**\n * Flag to indicate if the curated tags should be displayed different.\n *\n * @public\n */\n highlightCurated: {\n type: Boolean,\n default: false,\n },\n\n /** Class inherited by content element. */\n itemClass: String,\n },\n setup(props) {\n const storedRelatedTags: ComputedRef<RelatedTagModel[]> = useGetter('relatedTags').relatedTags\n\n const relatedTags = computed((): RelatedTagModel[] =>\n storedRelatedTags.value.slice(0, props.maxItemsToRender),\n )\n\n return {\n relatedTags,\n }\n },\n})\n</script>\n\n<style lang=\"css\" scoped>\n.x-related-tags {\n display: flex;\n flex-flow: row nowrap;\n list-style: none;\n}\n</style>\n\n<docs lang=\"mdx\">\n## See it in action\n\n<!-- prettier-ignore-start -->\n:::warning Backend microservice required\nTo use this component, the QuerySignals microservice must be implemented.\n:::\n<!-- prettier-ignore-end -->\n\nThis example shows how related tags can be rendered without any additional effects.\n\n_Search for a fashion term like \"sandal\" or \"lipstick\"._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags />\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n### Play with props\n\nIn this example, the number of related tags rendered has been limited to 3. A fade and slide effect\nhas been added so that the related tags appear with a delay, then slide upwards and fade.\n\n_Search for a fashion term and see the related tags with the animation effect._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags :animation=\"'StaggeredFadeAndSlide'\" :maxItemsToRender=\"3\" />\n </div>\n</template>\n\n<script>\nimport Vue from 'vue'\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\nimport { StaggeredFadeAndSlide } from '@empathyco/x-components'\n\n// Registering the animation as a global component\nVue.component('StaggeredFadeAndSlide', StaggeredFadeAndSlide)\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n### Play with related-tag slot\n\nIn this example, the [`RelatedTag`](./x-components.related-tag.md) component is passed in the\n`related-tag` slot (although any other component could potentially be passed).\n\n_Search for a fashion term and see how the related tags can be rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag=\"{ relatedTag }\">\n <RelatedTag :relatedTag=\"relatedTag\" />\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags, RelatedTag } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n RelatedTag,\n },\n}\n</script>\n```\n\n### Play with related-tag-content slot\n\nTo continue the previous example, the [`RelatedTag`](./x-components.related-tag.md) component is\npassed in the `related-tag-content` slot, but in addition, an HTML span tag for the text are also\npassed.\n\n_Search for a fashion term and see how the related tags are rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag-content=\"{ relatedTag }\">\n <span>{{ relatedTag.tag }}</span>\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n\n## Extending the component\n\nComponents can be combined and communicate with each other. The `RelatedTags` component can\ncommunicate with the [`SearchInput`](../search-box/x-components.search-input.md) as follows:\n\n_Search for a fashion term and see how the related tags can be rendered._\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags />\n <ResultsList #result=\"{ item }\">\n <span class=\"result\">\n {{ item.name }}\n </span>\n </ResultsList>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\nimport { ResultsList } from '@empathyco/x-components/search'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n ResultsList,\n },\n}\n</script>\n```\n\n## Customizing the related tags with classes\n\nThe `itemClass` prop can be used to add classes to the related tags.\n\n```vue live\n<template>\n <div>\n <SearchInput />\n <RelatedTags #related-tag-content=\"{ relatedTag }\" itemClass=\"x-tag-outlined x-tag-auxiliary\">\n <span>{{ relatedTag.tag }}</span>\n </RelatedTags>\n </div>\n</template>\n\n<script>\nimport { SearchInput } from '@empathyco/x-components/search-box'\nimport { RelatedTags } from '@empathyco/x-components/related-tags'\n\nexport default {\n name: 'RelatedTagsDemo',\n components: {\n SearchInput,\n RelatedTags,\n },\n}\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;;;AAuDA;;;;;;;;AAQE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,aAAa;IACnB,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,UAAU,EAAE;QACV,UAAU;AACX,KAAA;AACD,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,SAAS,EAAE;AACT,YAAA,IAAI,EAAE,aAAa;AACnB,YAAA,OAAO,EAAE,IAAI;AACd,SAAA;AAED;;;;AAIE;AACF,QAAA,gBAAgB,EAAE,MAAM;AAExB;;;;AAIE;AACF,QAAA,gBAAgB,EAAE;AAChB,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,OAAO,EAAE,KAAK;AACf,SAAA;;AAGD,QAAA,SAAS,EAAE,MAAM;AAClB,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;QACT,MAAM,iBAAiB,GAAmC,SAAS,CAAC,aAAa,CAAC,CAAC,WAAU,CAAA;QAE7F,MAAM,WAAY,GAAE,QAAQ,CAAC,MAC3B,iBAAiB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAC1D,CAAA;QAEA,OAAO;YACL,WAAW;SACb,CAAA;KACD;AACF,CAAA,CAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"semantic-query.vue.js","sources":["../../../../../src/x-modules/semantic-queries/components/semantic-query.vue"],"sourcesContent":["<template>\n <BaseSuggestion\n v-slot=\"baseScope\"\n :query=\"query\"\n :suggestion=\"suggestion\"\n :suggestion-selected-events=\"suggestionSelectedEvents\"\n feature=\"semantics\"\n data-test=\"semantic-query\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot Semantic Query content\n @binding {{suggestion: object - Suggestion data, query: string - The query that the suggestion belongs to}} v-bind BaseSuggestion bindings\n -->\n <!-- eslint-enable max-len -->\n <slot v-bind=\"{ ...baseScope }\" />\n </BaseSuggestion>\n</template>\n\n<script lang=\"ts\">\nimport type { SemanticQuery } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { defineComponent } from 'vue'\nimport BaseSuggestion from '../../../components/suggestions/base-suggestion.vue'\nimport { useGetter } from '../../../composables/use-getter'\nimport { semanticQueriesXModule } from '../x-module'\n\n/**\n * This component renders a semantic query. A semantic query is a recommended query\n * that is similar in its meaning to another one.\n * It contains the query and the distance, which indicates how similar the query is\n * compared to the searched query.\n *\n * @public\n */\nexport default defineComponent({\n name: 'SemanticQuery',\n xModule: semanticQueriesXModule.name,\n components: { BaseSuggestion },\n props: {\n /** The {@link @empathyco/x-types#SemanticQuery} to render. */\n suggestion: {\n type: Object as PropType<SemanticQuery>,\n required: true,\n },\n },\n setup(props) {\n /** The normalized query of the semantic queries module. */\n const query = useGetter('semanticQueries'
|
|
1
|
+
{"version":3,"file":"semantic-query.vue.js","sources":["../../../../../src/x-modules/semantic-queries/components/semantic-query.vue"],"sourcesContent":["<template>\n <BaseSuggestion\n v-slot=\"baseScope\"\n :query=\"query\"\n :suggestion=\"suggestion\"\n :suggestion-selected-events=\"suggestionSelectedEvents\"\n feature=\"semantics\"\n data-test=\"semantic-query\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot Semantic Query content\n @binding {{suggestion: object - Suggestion data, query: string - The query that the suggestion belongs to}} v-bind BaseSuggestion bindings\n -->\n <!-- eslint-enable max-len -->\n <slot v-bind=\"{ ...baseScope }\" />\n </BaseSuggestion>\n</template>\n\n<script lang=\"ts\">\nimport type { SemanticQuery } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { defineComponent } from 'vue'\nimport BaseSuggestion from '../../../components/suggestions/base-suggestion.vue'\nimport { useGetter } from '../../../composables/use-getter'\nimport { semanticQueriesXModule } from '../x-module'\n\n/**\n * This component renders a semantic query. A semantic query is a recommended query\n * that is similar in its meaning to another one.\n * It contains the query and the distance, which indicates how similar the query is\n * compared to the searched query.\n *\n * @public\n */\nexport default defineComponent({\n name: 'SemanticQuery',\n xModule: semanticQueriesXModule.name,\n components: { BaseSuggestion },\n props: {\n /** The {@link @empathyco/x-types#SemanticQuery} to render. */\n suggestion: {\n type: Object as PropType<SemanticQuery>,\n required: true,\n },\n },\n setup(props) {\n /** The normalized query of the semantic queries' module. */\n const query = useGetter('semanticQueries').normalizedQuery\n\n /** The list of events that are going to be emitted when the button is pressed. */\n const suggestionSelectedEvents = {\n UserSelectedASemanticQuery: props.suggestion,\n }\n\n return {\n query,\n suggestionSelectedEvents,\n }\n },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserSelectedASemanticQuery`](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 semantic query button. The event payload is the\n semantic query data.\n\n## See it in action\n\nHere you can see that the semantic query query is rendered.\n\n```vue live\n<template>\n <SemanticQuery :suggestion=\"semanticQuery\" />\n</template>\n\n<script>\nimport { SemanticQuery } from '@empathyco/x-components/semantic-queries'\n\nexport default {\n name: 'SemanticQueryDemo',\n components: {\n SemanticQuery,\n },\n data() {\n return {\n semanticQuery: {\n modelName: 'SemanticQuery',\n query: 'jacket',\n distance: 2,\n },\n }\n },\n}\n</script>\n```\n\n### Play with the default slot\n\nIn this example, we add the distance of the semantic query next to the query.\n\n```vue live\n<template>\n <SemanticQuery :suggestion=\"semanticQuery\" #default=\"{ suggestion, query }\">\n <div>Original query: {{ query }}</div>\n <div>Suggested semantic query: {{ suggestion.query }} - {{ suggestion.distance }}</div>\n </SemanticQuery>\n</template>\n\n<script>\nimport { SemanticQuery } from '@empathyco/x-components/semantic-queries'\n\nexport default {\n name: 'SemanticQueryDemoDefaultSlot',\n components: {\n SemanticQuery,\n },\n data() {\n return {\n semanticQuery: {\n modelName: 'SemanticQuery',\n query: 'jacket',\n distance: 2,\n },\n }\n },\n}\n</script>\n```\n</docs>\n"],"names":["_resolveComponent","_openBlock","_createBlock","_renderSlot","_normalizeProps","_guardReactiveProps"],"mappings":";;;;;oCACEA,gBAeiB,CAAA,gBAAA,CAAA,CAAA;AAZd,EAAA,OAAAC,SAAA,EAAsB,EAAAC,WAAA,CAAA,yBAAA,EAAA;AAAA,IACtB,KAAA,EAAA,IAAA,CAAA,KAAA;AAAA,IACD,UAAQ,EAAA,IAAA,CAAA,UAAA;AAAA,IACR,4BAA0B,EAAA,IAAA,CAAA,wBAAA;AAAA,IAAA,OAAA,EAAA,WAAA;AAP9B,IAAA,WAAA,EAAA,gBAAA;AAAA,GAAA,EAAA;;AAAA,MAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAAAC,cAAA,CAAAC,kBAAA,CAAA,EAAA,GAAA,SAAA,EAAA,CAAA,CAAA,CAAA;AAAA,KAAA,CAAA;;;;;;;;;"}
|
|
@@ -23,8 +23,8 @@ var _sfc_main = defineComponent({
|
|
|
23
23
|
},
|
|
24
24
|
},
|
|
25
25
|
setup(props) {
|
|
26
|
-
/** The normalized query of the semantic queries module. */
|
|
27
|
-
const query = useGetter('semanticQueries'
|
|
26
|
+
/** The normalized query of the semantic queries' module. */
|
|
27
|
+
const query = useGetter('semanticQueries').normalizedQuery;
|
|
28
28
|
/** The list of events that are going to be emitted when the button is pressed. */
|
|
29
29
|
const suggestionSelectedEvents = {
|
|
30
30
|
UserSelectedASemanticQuery: props.suggestion,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"semantic-query.vue2.js","sources":["../../../../../src/x-modules/semantic-queries/components/semantic-query.vue"],"sourcesContent":["<template>\n <BaseSuggestion\n v-slot=\"baseScope\"\n :query=\"query\"\n :suggestion=\"suggestion\"\n :suggestion-selected-events=\"suggestionSelectedEvents\"\n feature=\"semantics\"\n data-test=\"semantic-query\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot Semantic Query content\n @binding {{suggestion: object - Suggestion data, query: string - The query that the suggestion belongs to}} v-bind BaseSuggestion bindings\n -->\n <!-- eslint-enable max-len -->\n <slot v-bind=\"{ ...baseScope }\" />\n </BaseSuggestion>\n</template>\n\n<script lang=\"ts\">\nimport type { SemanticQuery } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { defineComponent } from 'vue'\nimport BaseSuggestion from '../../../components/suggestions/base-suggestion.vue'\nimport { useGetter } from '../../../composables/use-getter'\nimport { semanticQueriesXModule } from '../x-module'\n\n/**\n * This component renders a semantic query. A semantic query is a recommended query\n * that is similar in its meaning to another one.\n * It contains the query and the distance, which indicates how similar the query is\n * compared to the searched query.\n *\n * @public\n */\nexport default defineComponent({\n name: 'SemanticQuery',\n xModule: semanticQueriesXModule.name,\n components: { BaseSuggestion },\n props: {\n /** The {@link @empathyco/x-types#SemanticQuery} to render. */\n suggestion: {\n type: Object as PropType<SemanticQuery>,\n required: true,\n },\n },\n setup(props) {\n /** The normalized query of the semantic queries module. */\n const query = useGetter('semanticQueries'
|
|
1
|
+
{"version":3,"file":"semantic-query.vue2.js","sources":["../../../../../src/x-modules/semantic-queries/components/semantic-query.vue"],"sourcesContent":["<template>\n <BaseSuggestion\n v-slot=\"baseScope\"\n :query=\"query\"\n :suggestion=\"suggestion\"\n :suggestion-selected-events=\"suggestionSelectedEvents\"\n feature=\"semantics\"\n data-test=\"semantic-query\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot Semantic Query content\n @binding {{suggestion: object - Suggestion data, query: string - The query that the suggestion belongs to}} v-bind BaseSuggestion bindings\n -->\n <!-- eslint-enable max-len -->\n <slot v-bind=\"{ ...baseScope }\" />\n </BaseSuggestion>\n</template>\n\n<script lang=\"ts\">\nimport type { SemanticQuery } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { defineComponent } from 'vue'\nimport BaseSuggestion from '../../../components/suggestions/base-suggestion.vue'\nimport { useGetter } from '../../../composables/use-getter'\nimport { semanticQueriesXModule } from '../x-module'\n\n/**\n * This component renders a semantic query. A semantic query is a recommended query\n * that is similar in its meaning to another one.\n * It contains the query and the distance, which indicates how similar the query is\n * compared to the searched query.\n *\n * @public\n */\nexport default defineComponent({\n name: 'SemanticQuery',\n xModule: semanticQueriesXModule.name,\n components: { BaseSuggestion },\n props: {\n /** The {@link @empathyco/x-types#SemanticQuery} to render. */\n suggestion: {\n type: Object as PropType<SemanticQuery>,\n required: true,\n },\n },\n setup(props) {\n /** The normalized query of the semantic queries' module. */\n const query = useGetter('semanticQueries').normalizedQuery\n\n /** The list of events that are going to be emitted when the button is pressed. */\n const suggestionSelectedEvents = {\n UserSelectedASemanticQuery: props.suggestion,\n }\n\n return {\n query,\n suggestionSelectedEvents,\n }\n },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserSelectedASemanticQuery`](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 semantic query button. The event payload is the\n semantic query data.\n\n## See it in action\n\nHere you can see that the semantic query query is rendered.\n\n```vue live\n<template>\n <SemanticQuery :suggestion=\"semanticQuery\" />\n</template>\n\n<script>\nimport { SemanticQuery } from '@empathyco/x-components/semantic-queries'\n\nexport default {\n name: 'SemanticQueryDemo',\n components: {\n SemanticQuery,\n },\n data() {\n return {\n semanticQuery: {\n modelName: 'SemanticQuery',\n query: 'jacket',\n distance: 2,\n },\n }\n },\n}\n</script>\n```\n\n### Play with the default slot\n\nIn this example, we add the distance of the semantic query next to the query.\n\n```vue live\n<template>\n <SemanticQuery :suggestion=\"semanticQuery\" #default=\"{ suggestion, query }\">\n <div>Original query: {{ query }}</div>\n <div>Suggested semantic query: {{ suggestion.query }} - {{ suggestion.distance }}</div>\n </SemanticQuery>\n</template>\n\n<script>\nimport { SemanticQuery } from '@empathyco/x-components/semantic-queries'\n\nexport default {\n name: 'SemanticQueryDemoDefaultSlot',\n components: {\n SemanticQuery,\n },\n data() {\n return {\n semanticQuery: {\n modelName: 'SemanticQuery',\n query: 'jacket',\n distance: 2,\n },\n }\n },\n}\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;;AA2BA;;;;;;;AAOE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,eAAe;IACrB,OAAO,EAAE,sBAAsB,CAAC,IAAI;IACpC,UAAU,EAAE,EAAE,cAAa,EAAG;AAC9B,IAAA,KAAK,EAAE;;AAEL,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,MAAiC;AACvC,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;;QAET,MAAM,KAAM,GAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC,eAAc,CAAA;;AAGzD,QAAA,MAAM,wBAAuB,GAAI;YAC/B,0BAA0B,EAAE,KAAK,CAAC,UAAU;SAC9C,CAAA;QAEA,OAAO;YACL,KAAK;YACL,wBAAwB;SAC1B,CAAA;KACD;AACF,CAAA,CAAA;;;;"}
|
|
@@ -183,13 +183,13 @@ function createTrackWire(property) {
|
|
|
183
183
|
!!tagging?.[property] && !ignoreInModules?.includes(moduleName));
|
|
184
184
|
}
|
|
185
185
|
/**
|
|
186
|
-
* Performs a track of a query with no results that used
|
|
187
|
-
* The totalHits will be changed to -1 if semantic queries are found in order to differentiate
|
|
188
|
-
* it from scenarios where the user encounters a no-results page without any semantic queries.
|
|
186
|
+
* Performs a track of a query with no results that used related prompts or semantic queries as fallback.
|
|
187
|
+
* The totalHits will be changed to -1 if related prompts or semantic queries are found in order to differentiate
|
|
188
|
+
* it from scenarios where the user encounters a no-results page without any related prompts or semantic queries.
|
|
189
189
|
*
|
|
190
190
|
* @public
|
|
191
191
|
*/
|
|
192
|
-
const
|
|
192
|
+
const trackNoResultsQueryWithFallbackWire = filter(wireDispatch('track', ({ eventPayload, state }) => {
|
|
193
193
|
const { queryTaggingInfo } = state;
|
|
194
194
|
const totalHits = eventPayload.length > 0 ? -1 : 0;
|
|
195
195
|
return {
|
|
@@ -198,11 +198,27 @@ const trackNoResultsQueryWithSemanticsWire = filter(wireDispatch('track', ({ eve
|
|
|
198
198
|
};
|
|
199
199
|
}), ({ store }) => Number(store.state.x.tagging.queryTaggingInfo?.params.totalHits) === 0);
|
|
200
200
|
/**.
|
|
201
|
-
* Debounced version of {@link
|
|
201
|
+
* Debounced version of {@link trackNoResultsQueryWithFallbackWire}
|
|
202
202
|
*
|
|
203
203
|
* @public
|
|
204
204
|
*/
|
|
205
|
-
const
|
|
205
|
+
const trackNoResultsQueryWithFallbackWireDebounced = moduleDebounce(trackNoResultsQueryWithFallbackWire, ({ state }) => state.config.queryTaggingDebounceMs, { cancelOn: ['QueryPreviewUnmounted', 'RelatedPromptsUnmounted'] });
|
|
206
|
+
/**
|
|
207
|
+
* Performs a track of a query with no results that used semantic queries as fallback.
|
|
208
|
+
* The totalHits will be changed to -1 if semantic queries are found in order to differentiate
|
|
209
|
+
* it from scenarios where the user encounters a no-results page without any semantic queries.
|
|
210
|
+
*
|
|
211
|
+
* @public
|
|
212
|
+
* @deprecated - Use {@link trackNoResultsQueryWithFallbackWire} instead.
|
|
213
|
+
*/
|
|
214
|
+
const trackNoResultsQueryWithSemanticsWire = trackNoResultsQueryWithFallbackWire;
|
|
215
|
+
/**
|
|
216
|
+
* Debounced version of {@link trackNoResultsQueryWithFallbackWire}
|
|
217
|
+
*
|
|
218
|
+
* @public
|
|
219
|
+
* @deprecated - Use {@link trackNoResultsQueryWithFallbackWireDebounced} instead.
|
|
220
|
+
*/
|
|
221
|
+
const trackNoResultsQueryWithSemanticsWireDebounced = trackNoResultsQueryWithFallbackWireDebounced;
|
|
206
222
|
/**
|
|
207
223
|
* Factory helper to create a wire for the track of the display click.
|
|
208
224
|
*
|
|
@@ -353,7 +369,10 @@ const taggingWiring = createWiring({
|
|
|
353
369
|
setQueryTaggingFromQueryPreview,
|
|
354
370
|
},
|
|
355
371
|
SemanticQueriesResponseChanged: {
|
|
356
|
-
|
|
372
|
+
trackNoResultsQueryWithFallbackWireDebounced,
|
|
373
|
+
},
|
|
374
|
+
RelatedPromptsResponseChanged: {
|
|
375
|
+
trackNoResultsQueryWithFallbackWireDebounced,
|
|
357
376
|
},
|
|
358
377
|
ModuleRegistered: {
|
|
359
378
|
setNoResultsTaggingEnabledWire,
|
|
@@ -369,5 +388,5 @@ const taggingWiring = createWiring({
|
|
|
369
388
|
},
|
|
370
389
|
});
|
|
371
390
|
|
|
372
|
-
export { createSetQueryTaggingFromQueryPreview, createTrackDisplayWire, createTrackRelatedPromptToolingDisplayClickWire, createTrackToolingAdd2CartWire, createTrackToolingDisplayWire, createTrackWire, setConsent, setNoResultsTaggingEnabledWire, setQueryTaggingFromQueryPreview, setQueryTaggingInfo, setTaggingConfig, taggingWiring, trackAddToCartWire, trackBannerClickedWire, trackDisplayClickedWire, trackElementDisplayedWire, trackNoResultsQueryWithSemanticsWire, trackNoResultsQueryWithSemanticsWireDebounced, trackQueryWire, trackRelatedPromptToolingDisplayClickWire, trackResultClickedWire, trackToolingAdd2CartWire, trackToolingDisplayClickedWire };
|
|
391
|
+
export { createSetQueryTaggingFromQueryPreview, createTrackDisplayWire, createTrackRelatedPromptToolingDisplayClickWire, createTrackToolingAdd2CartWire, createTrackToolingDisplayWire, createTrackWire, setConsent, setNoResultsTaggingEnabledWire, setQueryTaggingFromQueryPreview, setQueryTaggingInfo, setTaggingConfig, taggingWiring, trackAddToCartWire, trackBannerClickedWire, trackDisplayClickedWire, trackElementDisplayedWire, trackNoResultsQueryWithFallbackWire, trackNoResultsQueryWithFallbackWireDebounced, trackNoResultsQueryWithSemanticsWire, trackNoResultsQueryWithSemanticsWireDebounced, trackQueryWire, trackRelatedPromptToolingDisplayClickWire, trackResultClickedWire, trackToolingAdd2CartWire, trackToolingDisplayClickedWire };
|
|
373
392
|
//# sourceMappingURL=wiring.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/tagging/wiring.ts"],"sourcesContent":["import type {\n RelatedPrompt,\n Result,\n SemanticQuery,\n Taggable,\n Tagging,\n TaggingRequest,\n} from '@empathyco/x-types'\nimport type { FeatureLocation } from '../../types/index'\nimport type { DisplayWireMetadata, Wire } from '../../wiring/wiring.types'\nimport { DefaultSessionService } from '@empathyco/x-utils'\nimport { createOrigin } from '../../utils/index'\nimport { namespacedWireCommit, namespacedWireDispatch } 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 { createWiring } from '../../wiring/wiring.utils'\nimport { DefaultExternalTaggingService } from './service/external-tagging.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 DefaultExternalTaggingService}.\n */\nconst wireExternalTaggingService = wireService(DefaultExternalTaggingService.instance)\n\n/**\n * Stores the given result on the local storage.\n *\n * @public\n */\nconst storeClickedResultWire = wireExternalTaggingService('storeResultClicked')\n\n/**\n * Stores the result added to cart on the local storage.\n *\n * @public\n */\nconst storeAddToCartWire = wireExternalTaggingService('storeAddToCart')\n\n/**\n * Moves the result information from the local storage to session storage.\n *\n * @public\n */\nconst moveClickedResultToSessionWire = mapWire(\n wireExternalTaggingService('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 = wireExternalTaggingService('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 as number) > 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 clicked related prompt.\n *\n * @public\n */\nexport const trackRelatedPromptToolingDisplayClickWire =\n createTrackRelatedPromptToolingDisplayClickWire()\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 // eslint-disable-next-line ts/no-unsafe-member-access\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 // eslint-disable-next-line ts/no-unsafe-member-access\n ({ eventPayload: { tagging } }) => !!tagging?.[property]?.url,\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 add to cart.\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 for the track of the tooling display click in a related prompt.\n *\n * @returns A new wire for the tooling display click of the taggable element.\n *\n * @public\n */\nexport function createTrackRelatedPromptToolingDisplayClickWire() {\n return filter(\n wireDispatch('track', ({ metadata }) => {\n const relatedPrompt = metadata.relatedPrompt as RelatedPrompt\n const taggingInfo = relatedPrompt.tagging!.toolingDisplayClickTagging as TaggingRequest\n\n taggingInfo.params.productId = 'EXPAND'\n taggingInfo.params.title = relatedPrompt.suggestionText\n taggingInfo.params.url = 'none'\n\n return taggingInfo\n }),\n ({ metadata }) => {\n const relatedPrompt = metadata.relatedPrompt as RelatedPrompt | undefined\n const isUnselected = metadata?.selectedPrompt === -1\n const taggingInfo = relatedPrompt?.tagging?.toolingDisplayClickTagging\n return isUnselected && !!taggingInfo\n },\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 storeAddToCartWire,\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 UserSelectedARelatedPrompt: {\n trackRelatedPromptToolingDisplayClickWire,\n },\n})\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/tagging/wiring.ts"],"sourcesContent":["import type {\n RelatedPrompt,\n Result,\n SemanticQuery,\n Taggable,\n Tagging,\n TaggingRequest,\n} from '@empathyco/x-types'\nimport type { FeatureLocation } from '../../types/index'\nimport type { DisplayWireMetadata, Wire } from '../../wiring/wiring.types'\nimport { DefaultSessionService } from '@empathyco/x-utils'\nimport { createOrigin } from '../../utils/index'\nimport { namespacedWireCommit, namespacedWireDispatch } 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 { createWiring } from '../../wiring/wiring.utils'\nimport { DefaultExternalTaggingService } from './service/external-tagging.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 DefaultExternalTaggingService}.\n */\nconst wireExternalTaggingService = wireService(DefaultExternalTaggingService.instance)\n\n/**\n * Stores the given result on the local storage.\n *\n * @public\n */\nconst storeClickedResultWire = wireExternalTaggingService('storeResultClicked')\n\n/**\n * Stores the result added to cart on the local storage.\n *\n * @public\n */\nconst storeAddToCartWire = wireExternalTaggingService('storeAddToCart')\n\n/**\n * Moves the result information from the local storage to session storage.\n *\n * @public\n */\nconst moveClickedResultToSessionWire = mapWire(\n wireExternalTaggingService('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 = wireExternalTaggingService('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 as number) > 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 clicked related prompt.\n *\n * @public\n */\nexport const trackRelatedPromptToolingDisplayClickWire =\n createTrackRelatedPromptToolingDisplayClickWire()\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 // eslint-disable-next-line ts/no-unsafe-member-access\n !!tagging?.[property] && !ignoreInModules?.includes(moduleName),\n )\n}\n\n/**\n * Performs a track of a query with no results that used related prompts or semantic queries as fallback.\n * The totalHits will be changed to -1 if related prompts or semantic queries are found in order to differentiate\n * it from scenarios where the user encounters a no-results page without any related prompts or semantic queries.\n *\n * @public\n */\nexport const trackNoResultsQueryWithFallbackWire = filter(\n wireDispatch('track', ({ eventPayload, state }) => {\n const { queryTaggingInfo } = state\n const totalHits = (eventPayload as RelatedPrompt[] | 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 trackNoResultsQueryWithFallbackWire}\n *\n * @public\n */\nexport const trackNoResultsQueryWithFallbackWireDebounced = moduleDebounce(\n trackNoResultsQueryWithFallbackWire,\n ({ state }) => state.config.queryTaggingDebounceMs,\n { cancelOn: ['QueryPreviewUnmounted', 'RelatedPromptsUnmounted'] },\n)\n\n/**\n * Performs a track of a query with no results that used semantic queries 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 * @deprecated - Use {@link trackNoResultsQueryWithFallbackWire} instead.\n */\nexport const trackNoResultsQueryWithSemanticsWire = trackNoResultsQueryWithFallbackWire\n\n/**\n * Debounced version of {@link trackNoResultsQueryWithFallbackWire}\n *\n * @public\n * @deprecated - Use {@link trackNoResultsQueryWithFallbackWireDebounced} instead.\n */\nexport const trackNoResultsQueryWithSemanticsWireDebounced =\n trackNoResultsQueryWithFallbackWireDebounced\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 // eslint-disable-next-line ts/no-unsafe-member-access\n ({ eventPayload: { tagging } }) => !!tagging?.[property]?.url,\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 add to cart.\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 for the track of the tooling display click in a related prompt.\n *\n * @returns A new wire for the tooling display click of the taggable element.\n *\n * @public\n */\nexport function createTrackRelatedPromptToolingDisplayClickWire() {\n return filter(\n wireDispatch('track', ({ metadata }) => {\n const relatedPrompt = metadata.relatedPrompt as RelatedPrompt\n const taggingInfo = relatedPrompt.tagging!.toolingDisplayClickTagging as TaggingRequest\n\n taggingInfo.params.productId = 'EXPAND'\n taggingInfo.params.title = relatedPrompt.suggestionText\n taggingInfo.params.url = 'none'\n\n return taggingInfo\n }),\n ({ metadata }) => {\n const relatedPrompt = metadata.relatedPrompt as RelatedPrompt | undefined\n const isUnselected = metadata?.selectedPrompt === -1\n const taggingInfo = relatedPrompt?.tagging?.toolingDisplayClickTagging\n return isUnselected && !!taggingInfo\n },\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 storeAddToCartWire,\n },\n UserClickedPDPAddToCart: {\n trackAddToCartFromSessionStorage,\n },\n UserClickedABanner: {\n trackBannerClickedWire,\n },\n UserClickedADisplayResult: {\n trackDisplayClickedWire,\n setQueryTaggingFromQueryPreview,\n },\n SemanticQueriesResponseChanged: {\n trackNoResultsQueryWithFallbackWireDebounced,\n },\n RelatedPromptsResponseChanged: {\n trackNoResultsQueryWithFallbackWireDebounced,\n },\n ModuleRegistered: {\n setNoResultsTaggingEnabledWire,\n },\n UserClickedARelatedPromptResult: {\n trackToolingDisplayClickedWire,\n },\n UserClickedARelatedPromptAdd2Cart: {\n trackToolingAdd2CartWire,\n },\n UserSelectedARelatedPrompt: {\n trackRelatedPromptToolingDisplayClickWire,\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.
|
|
3
|
+
"version": "6.0.0-alpha.77",
|
|
4
4
|
"description": "Empathy X Components",
|
|
5
5
|
"author": "Empathy Systems Corporation S.L.",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -142,5 +142,5 @@
|
|
|
142
142
|
"access": "public",
|
|
143
143
|
"directory": "dist"
|
|
144
144
|
},
|
|
145
|
-
"gitHead": "
|
|
145
|
+
"gitHead": "4719d1d3193e7092ae5fe0ab43b82b08eb21fe67"
|
|
146
146
|
}
|