@empathyco/x-components 6.0.0-alpha.23 → 6.0.0-alpha.25

package/js/x-modules/semantic-queries/components/semantic-queries.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"semantic-queries.vue.js","sources":["../../../../../src/x-modules/semantic-queries/components/semantic-queries.vue"],"sourcesContent":["<template>\n  <BaseSuggestions\n    v-if=\"suggestions.length\"\n    class=\"x-semantic-queries\"\n    :suggestions=\"suggestions\"\n    #default=\"baseSuggestionsScope\"\n  >\n    <!--\n      @slot Semantic Query content\n      @binding {{suggestion: object - Suggestion data, index: number - Suggestion index}} v-bind\n        BaseSuggestion bindings\n    -->\n    <slot name=\"suggestion\" v-bind=\"baseSuggestionsScope\">\n      <SemanticQuery :suggestion=\"baseSuggestionsScope.suggestion\" #default=\"baseSuggestionScope\">\n        <!--\n          @slot Semantic Query content\n          @binding {{suggestion: object - Suggestion data, query: string - The query that the\n            suggestion belongs to}} v-bind SemanticQuery bindings\n        -->\n        <slot name=\"suggestion-content\" v-bind=\"baseSuggestionScope\" />\n      </SemanticQuery>\n    </slot>\n  </BaseSuggestions>\n</template>\n\n<script lang=\"ts\">\n  import { computed, ComputedRef, defineComponent } from 'vue';\n  import { Suggestion } from '@empathyco/x-types';\n  import { semanticQueriesXModule } from '../x-module';\n  import BaseSuggestions from '../../../components/suggestions/base-suggestions.vue';\n  import { useState } from '../../../composables';\n  import SemanticQuery from './semantic-query.vue';\n\n  /**\n   * Retrieves a list of semantic queries from the state and exposes them in the slots.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'SemanticQueries',\n    xModule: semanticQueriesXModule.name,\n    components: { BaseSuggestions, SemanticQuery },\n    setup(_, { slots }) {\n      /** The semantic queries from the state. */\n      const suggestions: ComputedRef<Suggestion[]> = useState('semanticQueries', [\n        'semanticQueries'\n      ]).semanticQueries;\n\n      /**\n       * Maps the list of semantic queries to a list of queries, to make it compatible with\n       * other components.\n       */\n      const queries = computed(() => suggestions.value.map(suggestion => suggestion.query));\n\n      /**\n       * Finds a {@link @empathyco/x-types#Suggestion} given a query.\n       *\n       * @param query - The query to search.\n       * @returns The {@link @empathyco/x-types#Suggestion} or undefined if not found.\n       */\n      function findSemanticQuery(query: string) {\n        return suggestions.value.find(suggestion => suggestion.query === query);\n      }\n\n      /**\n       * Render function to execute the `default` slot, binding `slotsProps` and getting only the\n       * first `vNode` to avoid Fragments and Text root nodes.\n       * If there are no suggestions, nothing is rendered.\n       *\n       * @remarks `slotProps` must be values without Vue reactivity and located inside the\n       * render-function to update the binding data properly.\n       *\n       * @returns The root `vNode` of the `default` slot or empty string if there are\n       * no suggestions.\n       */\n      function renderDefaultSlot() {\n        const slotProps = {\n          suggestions: suggestions.value,\n          queries: queries.value,\n          findSemanticQuery\n        };\n        return suggestions.value.length ? slots.default?.(slotProps)[0] : '';\n      }\n\n      /* Hack to render through a render-function, the `default` slot or, in its absence,\n       the component itself. It is the alternative for the NoElement antipattern. */\n      const componentProps = { suggestions };\n      return (slots.default ? renderDefaultSlot : componentProps) as typeof componentProps;\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nThis component doesn't emit events.\n\n## See it in action\n\nBy default, the `SemanticQueries` component will render a list of semantic queries.\n\n```vue\n<template>\n  <SemanticQueries />\n</template>\n\n<script>\n  import { SemanticQueries } from '@empathyco/x-components/semantic-queries';\n\n  export default {\n    name: 'SemanticQueriesDemo',\n    components: {\n      SemanticQueries\n    }\n  };\n</script>\n```\n\n### Play with props\n\nThe component has the following props:\n\n- maxItemsToRender to limit the number of semantic queries to render.\n- animation to specify the animation to be used to animate the semantic queries.\n\n```vue live\n<template>\n  <SemanticQueries :animation=\"animation\" :maxItemsToRender=\"3\" />\n</template>\n\n<script>\n  import { FadeAndSlide } from '@empathyco/x-components';\n\n  export default {\n    name: 'SemanticQueriesPropsDemo',\n    data() {\n      return {\n        animation: FadeAndSlide\n      };\n    }\n  };\n</script>\n```\n\n### Play with the default slot\n\nThe default slot is used to overwrite the whole content of the component.\n\n```vue live\n<template>\n  <SemanticQueries #default=\"{ suggestions }\">\n    <section>\n      <SlidingPanel>\n        <div v-for=\"suggestion in suggestions\">\n          {{ suggestion.query }}\n          {{ suggestion.distance }}\n        </div>\n      </SlidingPanel>\n    </section>\n  </SemanticQueries>\n</template>\n\n<script>\n  import { SemanticQueries } from '@empathyco/x-components/semantic-queries';\n  import { SlidingPanel } from '@empathyco/x-components';\n\n  export default {\n    name: 'SemanticQueriesDefaultSlotDemo',\n    components: {\n      SemanticQueries,\n      SlidingPanel\n    }\n  };\n</script>\n```\n\nThe default slot also exposes an array of semantic queries mapped to strings, and a method to find a\nsemantic query given a string query.\n\nThis is useful if you need an array of string queries, but also need to retrieve the original\nsemantic query to use it in another element.\n\n```vue live\n<template>\n  <SemanticQueries #default=\"{ queries, findSemanticQuery }\">\n    <section>\n      <QueryPreviewList :queries=\"queries\" #slot=\"{ query, results }\">\n        <div>\n          <SemanticQuery :semanticQuery=\"findSemanticQuery(query)\" #default=\"{ query }\">\n            {{ query.query }} ({{ query.distance }})\n          </SemanticQuery>\n          <ul>\n            <li v-for=\"result in results\" :key=\"result.id\">\n              {{ result.name }}\n            </li>\n          </ul>\n        </div>\n      </QueryPreviewList>\n    </section>\n  </SemanticQueries>\n</template>\n\n<script>\n  import { SemanticQueries, SemanticQuery } from '@empathyco/x-components/semantic-queries';\n  import { QueryPreviewList } from '@empathyco/x-components/queries-preview';\n\n  export default {\n    name: 'SemanticQueriesDefaultSlotDemo2',\n    components: {\n      SemanticQueries,\n      SemanticQuery,\n      QueryPreviewList\n    }\n  };\n</script>\n```\n\n### Play with the suggestion slot\n\nThe suggestion slot can be used to override each semantic query item.\n\nIn this example, the query will be rendered along with the distance.\n\n```vue live\n<template>\n  <SemanticQueries #suggestion=\"{ suggestion: { query, distance } }\">\n    <span>\n      ({{ distance }})\n      {{ query }}\n    </span>\n  </SemanticQueries>\n</template>\n\n<script>\n  import { SemanticQueries } from '@empathyco/x-components/semantic-queries';\n  export default {\n    name: 'SemanticQueriesItemSlotDemo',\n    components: {\n      SemanticQueries\n    }\n  };\n</script>\n```\n\n### Play with the suggestion content slot\n\nThe suggsetion content slot can be used to override only the content, but keep using the\nSemanticQuery component internally.\n\n```vue live\n<template>\n  <SemanticQueries #suggestion-content=\"{ suggestion: { query, distance } }\">\n    <span>\n      ({{ distance }})\n      {{ query }}\n    </span>\n  </SemanticQueries>\n</template>\n\n<script>\n  import { SemanticQueries } from '@empathyco/x-components/semantic-queries';\n  export default {\n    name: 'SemanticQueriesItemSlotDemo',\n    components: {\n      SemanticQueries\n    }\n  };\n</script>\n```\n</docs>\n"],"names":["_resolveComponent","_openBlock","_createBlock","_withCtx","_createCommentVNode","_renderSlot","_normalizeProps","_guardReactiveProps","_createVNode"],"mappings":";;;;;;AAE4B,EAAA,MAAA,0BAAA,GAAAA,gBAAA,CAAA,iBAAA,CAAA,CAAA;AAF5B,EAAA,OAAA,IAAA,CAAA,WAAA,CAAA,MAAA,IAAAC,SAAA,EAG8B,EAAAC,WAAA,CAAA,0BAAA,EAAA;AAAA,IACzB,GAAA,EAAA,CAAA;AAAA,IAAA,KAAA,EAAA,oBAAA;AACA,IAAA,WAAA,EAAO,IAER,CAAA,WAAA;AAAA,GAAA,EAAA;AAKA,IAAA,OAAA,EAAAC,OAAA,CASO,CArBX,oBAAA,KAAA;AAAA,MAoBsBC,kBAAA,CAAA,+KAAA,CAAA;AAAA,MAPAC,UAAA,CAAA,IAAA,CAAY,sBAAqBC,cAAU,CAAAC,kBAAA,CAAA,oBAAA,CAAA,CAAA,EAAA,MAAA;AAAA,QAAAC,WAAA,CAAA,wBAAA,EAAA;AAAG,UAAA,UAAA,EAAO,oBAAE,CAAA,UAAA;AAAA,SAAA,EAAA;mBAMrEL,OAA+D,CAAA,CAAA,mBAAA,KAAA;AAAA,YAAAC,kBAAA,CAAA,sNAAA,CAAA;AAnBvE,YAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,oBAAA,EAAAC,cAAA,CAAAC,kBAAA,CAAA,mBAAA,CAAA,CAAA,CAAA;AAAA,WAAA,CAAA;;;;AAAA,OAAA,CAAA;AAAA,KAAA,CAAA;AAAA,IAAA,CAAA,EAAA,CAAA;AAAA;AAAA,GAAA,EAAA,CAAA,EAAA,CAAA,aAAA,CAAA,CAAA,IAAAH,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}
+{"version":3,"file":"semantic-queries.vue.js","sources":["../../../../../src/x-modules/semantic-queries/components/semantic-queries.vue"],"sourcesContent":["<template>\n  <BaseSuggestions\n    v-if=\"suggestions.length\"\n    class=\"x-semantic-queries\"\n    :suggestions=\"suggestions\"\n    #default=\"baseSuggestionsScope\"\n  >\n    <!--\n      @slot Semantic Query content\n      @binding {{suggestion: object - Suggestion data, index: number - Suggestion index}} v-bind\n        BaseSuggestion bindings\n    -->\n    <slot name=\"suggestion\" v-bind=\"baseSuggestionsScope\">\n      <SemanticQuery :suggestion=\"baseSuggestionsScope.suggestion\" #default=\"baseSuggestionScope\">\n        <!--\n          @slot Semantic Query content\n          @binding {{suggestion: object - Suggestion data, query: string - The query that the\n            suggestion belongs to}} v-bind SemanticQuery bindings\n        -->\n        <slot name=\"suggestion-content\" v-bind=\"baseSuggestionScope\" />\n      </SemanticQuery>\n    </slot>\n  </BaseSuggestions>\n</template>\n\n<script lang=\"ts\">\n  import { computed, ComputedRef, defineComponent } from 'vue';\n  import { Suggestion } from '@empathyco/x-types';\n  import { semanticQueriesXModule } from '../x-module';\n  import BaseSuggestions from '../../../components/suggestions/base-suggestions.vue';\n  import { useState } from '../../../composables';\n  import SemanticQuery from './semantic-query.vue';\n\n  /**\n   * Retrieves a list of semantic queries from the state and exposes them in the slots.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'SemanticQueries',\n    xModule: semanticQueriesXModule.name,\n    components: { BaseSuggestions, SemanticQuery },\n    setup(_, { slots }) {\n      /** The semantic queries from the state. */\n      const suggestions: ComputedRef<Suggestion[]> = useState('semanticQueries', [\n        'semanticQueries'\n      ]).semanticQueries;\n\n      /**\n       * Maps the list of semantic queries to a list of queries, to make it compatible with\n       * other components.\n       */\n      const queries = computed(() => suggestions.value.map(suggestion => suggestion.query));\n\n      /**\n       * Finds a {@link @empathyco/x-types#Suggestion} given a query.\n       *\n       * @param query - The query to search.\n       * @returns The {@link @empathyco/x-types#Suggestion} or undefined if not found.\n       */\n      function findSemanticQuery(query: string) {\n        return suggestions.value.find(suggestion => suggestion.query === query);\n      }\n\n      /**\n       * Render function to execute the `default` slot, binding `slotsProps` and getting only the\n       * first `vNode` to avoid Fragments and Text root nodes.\n       * If there are no suggestions, nothing is rendered.\n       *\n       * @remarks `slotProps` must be values without Vue reactivity and located inside the\n       * render-function to update the binding data properly.\n       *\n       * @returns The root `vNode` of the `default` slot or empty string if there are\n       * no suggestions.\n       */\n      function renderDefaultSlot() {\n        const slotProps = {\n          suggestions: suggestions.value,\n          queries: queries.value,\n          findSemanticQuery\n        };\n        return suggestions.value.length ? slots.default?.(slotProps)[0] : '';\n      }\n\n      /* Hack to render through a render-function, the `default` slot or, in its absence,\n       the component itself. It is the alternative for the NoElement antipattern. */\n      const componentProps = { suggestions };\n      return (slots.default ? renderDefaultSlot : componentProps) as typeof componentProps;\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nThis component doesn't emit events.\n\n## See it in action\n\nBy default, the `SemanticQueries` component will render a list of semantic queries.\n\n```vue\n<template>\n  <SemanticQueries />\n</template>\n\n<script>\n  import { SemanticQueries } from '@empathyco/x-components/semantic-queries';\n\n  export default {\n    name: 'SemanticQueriesDemo',\n    components: {\n      SemanticQueries\n    }\n  };\n</script>\n```\n\n### Play with props\n\nThe component has the following props:\n\n- maxItemsToRender to limit the number of semantic queries to render.\n- animation to specify the animation to be used to animate the semantic queries.\n\n```vue live\n<template>\n  <SemanticQueries :animation=\"animation\" :maxItemsToRender=\"3\" />\n</template>\n\n<script>\n  import { FadeAndSlide } from '@empathyco/x-components';\n\n  export default {\n    name: 'SemanticQueriesPropsDemo',\n    data() {\n      return {\n        animation: FadeAndSlide\n      };\n    }\n  };\n</script>\n```\n\n### Play with the default slot\n\nThe default slot is used to overwrite the whole content of the component.\n\n```vue live\n<template>\n  <SemanticQueries #default=\"{ suggestions }\">\n    <section>\n      <SlidingPanel>\n        <div v-for=\"suggestion in suggestions\">\n          {{ suggestion.query }}\n          {{ suggestion.distance }}\n        </div>\n      </SlidingPanel>\n    </section>\n  </SemanticQueries>\n</template>\n\n<script>\n  import { SemanticQueries } from '@empathyco/x-components/semantic-queries';\n  import { SlidingPanel } from '@empathyco/x-components';\n\n  export default {\n    name: 'SemanticQueriesDefaultSlotDemo',\n    components: {\n      SemanticQueries,\n      SlidingPanel\n    }\n  };\n</script>\n```\n\nThe default slot also exposes an array of semantic queries mapped to strings, and a method to find a\nsemantic query given a string query.\n\nThis is useful if you need an array of string queries, but also need to retrieve the original\nsemantic query to use it in another element.\n\n```vue live\n<template>\n  <SemanticQueries #default=\"{ queries, findSemanticQuery }\">\n    <section>\n      <QueryPreviewList :queries=\"queries\" #slot=\"{ query, results }\">\n        <div>\n          <SemanticQuery :semanticQuery=\"findSemanticQuery(query)\" #default=\"{ query }\">\n            {{ query.query }} ({{ query.distance }})\n          </SemanticQuery>\n          <ul>\n            <li v-for=\"result in results\" :key=\"result.id\">\n              {{ result.name }}\n            </li>\n          </ul>\n        </div>\n      </QueryPreviewList>\n    </section>\n  </SemanticQueries>\n</template>\n\n<script>\n  import { SemanticQueries, SemanticQuery } from '@empathyco/x-components/semantic-queries';\n  import { QueryPreviewList } from '@empathyco/x-components/queries-preview';\n\n  export default {\n    name: 'SemanticQueriesDefaultSlotDemo2',\n    components: {\n      SemanticQueries,\n      SemanticQuery,\n      QueryPreviewList\n    }\n  };\n</script>\n```\n\n### Play with the suggestion slot\n\nThe suggestion slot can be used to override each semantic query item.\n\nIn this example, the query will be rendered along with the distance.\n\n```vue live\n<template>\n  <SemanticQueries #suggestion=\"{ suggestion: { query, distance } }\">\n    <span>\n      ({{ distance }})\n      {{ query }}\n    </span>\n  </SemanticQueries>\n</template>\n\n<script>\n  import { SemanticQueries } from '@empathyco/x-components/semantic-queries';\n  export default {\n    name: 'SemanticQueriesItemSlotDemo',\n    components: {\n      SemanticQueries\n    }\n  };\n</script>\n```\n\n### Play with the suggestion content slot\n\nThe suggsetion content slot can be used to override only the content, but keep using the\nSemanticQuery component internally.\n\n```vue live\n<template>\n  <SemanticQueries #suggestion-content=\"{ suggestion: { query, distance } }\">\n    <span>\n      ({{ distance }})\n      {{ query }}\n    </span>\n  </SemanticQueries>\n</template>\n\n<script>\n  import { SemanticQueries } from '@empathyco/x-components/semantic-queries';\n  export default {\n    name: 'SemanticQueriesItemSlotDemo',\n    components: {\n      SemanticQueries\n    }\n  };\n</script>\n```\n</docs>\n"],"names":["_resolveComponent","_openBlock","_createBlock","_withCtx","_renderSlot","_normalizeProps","_guardReactiveProps","_createVNode","_createCommentVNode"],"mappings":";;;;;;AAE4B,EAAA,MAAA,0BAAA,GAAAA,gBAAA,CAAA,iBAAA,CAAA,CAAA;AAF5B,EAAA,OAAA,IAAA,CAAA,WAAA,CAAA,MAAA,IAAAC,SAAA,EAG8B,EAAAC,WAAA,CAAA,0BAAA,EAAA;AAAA,IACzB,GAAA,EAAA,CAAA;AAAA,IAAA,KAAA,EAAA,oBAAA;AACA,IAAA,WAAA,EAAO,IAOR,CAAA,WAAA;AAAA,GAAA,EAAA;aACEC,OAOgB,CAAA,CAAA,oBAAA,KAAA;AAAA,MAPAC,UAAA,CAAA,IAAA,CAAY,sBAAqBC,cAAU,CAAAC,kBAAA,CAAA,oBAAA,CAAA,CAAA,EAAA,MAAA;AAAA,QAAAC,WAAA,CAAA,wBAAA,EAAA;AAAG,UAAA,UAAA,EAAO,oBAAE,CAAA,UAAA;AAAA,SAAA,EAAA;;AAb7E,YAAAH,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,oBAAA,EAAAC,cAAA,CAAAC,kBAAA,CAAA,mBAAA,CAAA,CAAA,CAAA;AAAA,WAAA,CAAA;;;;AAAA,OAAA,CAAA;AAAA,KAAA,CAAA;AAAA,IAAA,CAAA,EAAA,CAAA;AAAA;AAAA,GAAA,EAAA,CAAA,EAAA,CAAA,aAAA,CAAA,CAAA,IAAAE,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}

package/js/x-modules/semantic-queries/components/semantic-query.vue.js

@@ -1,5 +1,5 @@
 import _sfc_main from './semantic-query.vue2.js';
-import { resolveComponent, openBlock, createBlock, withCtx, createCommentVNode, renderSlot, normalizeProps, guardReactiveProps } from 'vue';
+import { resolveComponent, openBlock, createBlock, withCtx, renderSlot, normalizeProps, guardReactiveProps } from 'vue';
 import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.js';
 
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
@@ -12,9 +12,6 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     "data-test": "semantic-query"
   }, {
     default: withCtx((baseScope) => [
-      createCommentVNode(" eslint-disable max-len "),
-      createCommentVNode("\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    "),
-      createCommentVNode(" eslint-enable max-len "),
       renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({ ...baseScope })))
     ]),
     _: 3

package/js/x-modules/semantic-queries/components/semantic-query.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"semantic-query.vue.js","sources":["../../../../../src/x-modules/semantic-queries/components/semantic-query.vue"],"sourcesContent":["<template>\n  <BaseSuggestion\n    :query=\"query\"\n    :suggestion=\"suggestion\"\n    :suggestionSelectedEvents=\"suggestionSelectedEvents\"\n    feature=\"semantics\"\n    data-test=\"semantic-query\"\n    #default=\"baseScope\"\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\">\n  import { defineComponent, PropType } from 'vue';\n  import { SemanticQuery } from '@empathyco/x-types';\n  import { semanticQueriesXModule } from '../x-module';\n  import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue';\n  import { useGetter } from '../../../composables/use-getter';\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   */\n  export 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']).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>\n  import { SemanticQuery } from '@empathyco/x-components/semantic-queries';\n\n  export 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>\n  import { SemanticQuery } from '@empathyco/x-components/semantic-queries';\n\n  export 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","_withCtx","_createCommentVNode","_renderSlot","_normalizeProps","_guardReactiveProps"],"mappings":";;;;;oCACEA,gBAeiB,CAAA,gBAAA,CAAA,CAAA;AAbd,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,0BAAU,IAAgB,CAAA,wBAAA;AAAA,IAAA,OAAA,EAAA,WAAA;IACzB,WAAO,EAAA,gBAAA;AAAA,GAAA,EAAA;AAGR,IAAA,OAAA,EAAAC,OAAA,CAAA,CAAA,SAAA,KAAA;AAAA,MAIAC,kBAA8B,CAAA,0BAAA,CAAA;AAAA,MAC9BA,mBAAkC,kMAAN,CAAA;AAAA,MAAAA,kBAAA,CAAA,yBAAA,CAAA;AAfhC,MAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAAAC,cAAA,CAAAC,kBAAA,CAAA,EAAA,GAAA,SAAA,EAAA,CAAA,CAAA,CAAA;AAAA,KAAA,CAAA;;;;;;;;;"}
+{"version":3,"file":"semantic-query.vue.js","sources":["../../../../../src/x-modules/semantic-queries/components/semantic-query.vue"],"sourcesContent":["<template>\n  <BaseSuggestion\n    :query=\"query\"\n    :suggestion=\"suggestion\"\n    :suggestionSelectedEvents=\"suggestionSelectedEvents\"\n    feature=\"semantics\"\n    data-test=\"semantic-query\"\n    #default=\"baseScope\"\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\">\n  import { defineComponent, PropType } from 'vue';\n  import { SemanticQuery } from '@empathyco/x-types';\n  import { semanticQueriesXModule } from '../x-module';\n  import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue';\n  import { useGetter } from '../../../composables/use-getter';\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   */\n  export 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']).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>\n  import { SemanticQuery } from '@empathyco/x-components/semantic-queries';\n\n  export 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>\n  import { SemanticQuery } from '@empathyco/x-components/semantic-queries';\n\n  export 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;AAbd,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,0BAAU,IAAgB,CAAA,wBAAA;AAAA,IAAA,OAAA,EAAA,WAAA;IACzB,WAAO,EAAA,gBAAA;AAAA,GAAA,EAAA;;AAPZ,MAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAAAC,cAAA,CAAAC,kBAAA,CAAA,EAAA,GAAA,SAAA,EAAA,CAAA,CAAA,CAAA;AAAA,KAAA,CAAA;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@empathyco/x-components",
-  "version": "6.0.0-alpha.23",
+  "version": "6.0.0-alpha.25",
   "description": "Empathy X Components",
   "author": "Empathy Systems Corporation S.L.",
   "license": "Apache-2.0",
@@ -138,5 +138,5 @@
     "access": "public",
     "directory": "dist"
   },
-  "gitHead": "48cedcd9087dc546f2f716aa41802743eb34989a"
+  "gitHead": "68a9cd09f37965b33ca0c35380e7a3335f845a5f"
 }

package/report/x-components.api.json

@@ -36059,7 +36059,16 @@
                 },
                 {
                   "kind": "Content",
-                  "text": "void"
+                  "text": "void | "
+                },
+                {
+                  "kind": "Reference",
+                  "text": "Promise",
+                  "canonicalReference": "!Promise:interface"
+                },
+                {
+                  "kind": "Content",
+                  "text": "<void>"
                 },
                 {
                   "kind": "Content",
@@ -36069,7 +36078,7 @@
               "isOptional": true,
               "returnTypeTokenRange": {
                 "startIndex": 3,
-                "endIndex": 4
+                "endIndex": 6
               },
               "releaseTag": "Public",
               "overloadIndex": 1,

package/report/x-components.api.md

@@ -4038,7 +4038,7 @@ export interface InstallXOptions<API extends XAPI = XAPI> extends XPluginOptions
     api?: API | false;
     bus?: XBus<XEventsTypes, WireMetadata>;
     domElement?: Element | ShadowRoot | string | ((snippetConfig: NormalisedSnippetConfig) => Element | ShadowRoot | string);
-    installExtraPlugins?(options: ExtraPluginsOptions): void;
+    installExtraPlugins?(options: ExtraPluginsOptions): void | Promise<void>;
     onCreateApp?: (app: App_2) => void;
     plugin?: Plugin_2<XPluginOptions>;
     rootComponent?: Component;

package/types/x-installer/x-installer/types.d.ts

@@ -48,7 +48,7 @@ export interface InstallXOptions<API extends XAPI = XAPI> extends XPluginOptions
      * @param options - An object that contains utilities that might be helpful for installing Vue
      * plugins.
      */
-    installExtraPlugins?(options: ExtraPluginsOptions): void;
+    installExtraPlugins?(options: ExtraPluginsOptions): void | Promise<void>;
 }
 /**
  * Options to install more Vue plugins with.

package/types/x-installer/x-installer/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/x-installer/x-installer/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAE,uBAAuB,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEhE;;;;;GAKG;AACH,MAAM,WAAW,eAAe,CAAC,GAAG,SAAS,IAAI,GAAG,IAAI,CAAE,SAAQ,cAAc;IAC9E;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;;OAGG;IACH,GAAG,CAAC,EAAE,GAAG,GAAG,KAAK,CAAC;IAClB;;;OAGG;IACH,GAAG,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;IACvC;;;OAGG;IACH,UAAU,CAAC,EACP,OAAO,GACP,UAAU,GACV,MAAM,GACN,CAAC,CAAC,aAAa,EAAE,uBAAuB,KAAK,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC,CAAC;IAChF;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IAChC;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IACjC;;;;;;OAMG;IACH,mBAAmB,CAAC,CAAC,OAAO,EAAE,mBAAmB,GAAG,IAAI,CAAC;CAC1D;AAED;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,uDAAuD;IACvD,GAAG,EAAE,GAAG,CAAC;IACT,sFAAsF;IACtF,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;IACtC;;;OAGG;IACH,OAAO,EAAE,uBAAuB,CAAC;CAClC;AAED;;;;GAIG;AACH,MAAM,WAAW,WAAW;IAC1B,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,2CAA2C;IAC3C,GAAG,CAAC,EAAE,IAAI,CAAC;IACX,qEAAqE;IACrE,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;IACtC,8CAA8C;IAC9C,MAAM,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;CAChC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/x-installer/x-installer/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAE,uBAAuB,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEhE;;;;;GAKG;AACH,MAAM,WAAW,eAAe,CAAC,GAAG,SAAS,IAAI,GAAG,IAAI,CAAE,SAAQ,cAAc;IAC9E;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;;OAGG;IACH,GAAG,CAAC,EAAE,GAAG,GAAG,KAAK,CAAC;IAClB;;;OAGG;IACH,GAAG,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;IACvC;;;OAGG;IACH,UAAU,CAAC,EACP,OAAO,GACP,UAAU,GACV,MAAM,GACN,CAAC,CAAC,aAAa,EAAE,uBAAuB,KAAK,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC,CAAC;IAChF;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IAChC;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IACjC;;;;;;OAMG;IACH,mBAAmB,CAAC,CAAC,OAAO,EAAE,mBAAmB,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC1E;AAED;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,uDAAuD;IACvD,GAAG,EAAE,GAAG,CAAC;IACT,sFAAsF;IACtF,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;IACtC;;;OAGG;IACH,OAAO,EAAE,uBAAuB,CAAC;CAClC;AAED;;;;GAIG;AACH,MAAM,WAAW,WAAW;IAC1B,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,2CAA2C;IAC3C,GAAG,CAAC,EAAE,IAAI,CAAC;IACX,qEAAqE;IACrE,GAAG,EAAE,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;IACtC,8CAA8C;IAC9C,MAAM,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;CAChC"}