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

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

@@ -1 +1 @@
-{"version":3,"file":"next-query-preview.vue.js","sources":["../../../../../src/x-modules/next-queries/components/next-query-preview.vue"],"sourcesContent":["<template>\n  <ul v-if=\"suggestionResults\" data-test=\"next-query-preview\" class=\"x-next-query-preview\">\n    <!--\n      @slot Next Query Preview default slot.\n          @binding {NextQuery} suggestion - Next Query suggestion data\n          @binding {Result[]} results - The results preview of the next query\n          @binding {number} totalResults - The total results of the search request\n    -->\n    <slot\n      :suggestion=\"suggestion\"\n      :results=\"suggestionResults.items\"\n      :totalResults=\"suggestionResults.totalResults\"\n    >\n      <li\n        v-for=\"result in suggestionResults.items\"\n        :key=\"result.id\"\n        class=\"x-next-query-preview__item\"\n        data-test=\"next-query-preview-item\"\n      >\n        <!--\n          @slot Next Query Preview result slot.\n              @binding {Result} result - A Next Query Preview result\n        -->\n        <slot name=\"result\" :result=\"result\">\n          <span data-test=\"result-name\">{{ result.name }}</span>\n        </slot>\n      </li>\n    </slot>\n  </ul>\n</template>\n\n<script lang=\"ts\">\n  import { computed, defineComponent, onMounted, PropType } from 'vue';\n  import { NextQuery, PreviewResults } from '@empathyco/x-types';\n  import { nextQueriesXModule } from '../x-module';\n  import { use$x } from '../../../composables/use-$x';\n  import { useState } from '../../../composables/use-state';\n\n  /**\n   * Retrieves a preview of the results of a next query and exposes them in the default slot,\n   * along with the next query and the totalResults of the search request.\n   * By default, it renders the names of the results.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'NextQueryPreview',\n    xModule: nextQueriesXModule.name,\n    props: {\n      /**\n       * The next query to retrieve the results preview.\n       *\n       * @public\n       */\n      suggestion: {\n        type: Object as PropType<NextQuery>,\n        required: true\n      },\n      /**\n       * Number of suggestion results to be rendered.\n       *\n       * @public\n       */\n      maxItemsToRender: Number\n    },\n    setup(props) {\n      const $x = use$x();\n      /**\n       * The results preview of the next queries mounted.\n       * It is a dictionary, indexed by the next query query.\n       */\n      const { resultsPreview } = useState('nextQueries', ['resultsPreview']);\n\n      /**\n       * The component emits the NextQueryPreviewMountedHook event to retrieve the results preview\n       * of the next query.\n       */\n      onMounted(() => $x.emit('NextQueryPreviewMountedHook', props.suggestion.query));\n\n      /**\n       * Gets from the state the results preview of the next query.\n       *\n       * @returns The results preview of the actual next query.\n       */\n      const suggestionResults = computed((): PreviewResults | undefined => {\n        const previewResults = resultsPreview.value[props.suggestion.query] as PreviewResults;\n\n        return previewResults\n          ? {\n              ...previewResults,\n              items: previewResults.items.slice(0, props.maxItemsToRender)\n            }\n          : undefined;\n      });\n\n      return { suggestionResults };\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nThis component emits the\n[`NextQueryPreviewMountedHook`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts)\nwhen it is mounted.\n\n## See it in action\n\nHere you have a basic example of how the NextQueryPreview is rendered. Keep in mind that this\ncomponent is intended to be used overriding its default slot. By default it will only render the\nnames of the results.\n\n```vue live\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" />\n</template>\n\n<script>\n  import { NextQueryPreview } from '@empathyco/x-components/next-queries';\n\n  export default {\n    name: 'NextQueryPreviewDemo',\n    components: {\n      NextQueryPreview\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with the default slot\n\nIn this example, the results will be rendered inside a sliding panel.\n\n```vue live\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" #default=\"{ totalResults, results }\">\n    <p>Total results: {{ totalResults }}</p>\n    <SlidingPanel :resetOnContentChange=\"false\">\n      <article\n        v-for=\"result in results\"\n        :key=\"result.id\"\n        class=\"x-result\"\n        style=\"max-width: 300px; overflow: hidden\"\n      >\n        <BaseResultLink :result=\"result\">\n          <BaseResultImage :result=\"result\" class=\"x-result__picture\" />\n        </BaseResultLink>\n        <div class=\"x-result__description\">\n          <BaseResultLink :result=\"result\">\n            <h1 class=\"x-title3\">{{ result.name }}</h1>\n          </BaseResultLink>\n        </div>\n      </article>\n    </SlidingPanel>\n  </NextQueryPreview>\n</template>\n\n<script>\n  import { NextQueryPreview } from '@empathyco/x-components/next-queries';\n  import { SlidingPanel, BaseResultLink, BaseResultImage } from '@empathyco/x-components';\n\n  export default {\n    name: 'NextQueryPreviewDemoOverridingSlot',\n    components: {\n      NextQueryPreview,\n      SlidingPanel,\n      BaseResultLink,\n      BaseResultImage\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with the result slot\n\nThe component exposes a slot to override the result content, without modifying the list.\n\nIn this example, the ID of the results will be rendered along with the name.\n\n```vue\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" #result=\"{ result }\">\n    <span>{{ result.id }}</span>\n    <span>{{ result.name }}</span>\n  </NextQueryPreview>\n</template>\n\n<script>\n  import { NextQueryPreview } from '@empathyco/x-components/next-queries';\n\n  export default {\n    name: 'NextQueryPreviewDemoOverridingResultSlot',\n    components: {\n      NextQueryPreview\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with props\n\nIn this example, the suggestions has been limited to render a maximum of 4 items.\n\n```vue\n<template>\n  <NextQueryPreview\n    :maxItemsToRender=\"maxItemsToRender\"\n    :suggestion=\"suggestion\"\n    #default=\"{ results }\"\n  >\n    <BaseGrid #default=\"{ item }\" :items=\"results\">\n      <BaseResultLink :result=\"item\">\n        <BaseResultImage :result=\"item\" />\n      </BaseResultLink>\n    </BaseGrid>\n  </NextQueryPreview>\n</template>\n\n<script>\n  import { BaseGrid, BaseResultImage, BaseResultLink } from '@empathyco/x-components';\n  import { NextQueryPreview } from '@empathyco/x-components/next-queries';\n\n  export default {\n    name: 'NextQueryPreviewDemo',\n    components: {\n      BaseGrid,\n      BaseResultImage,\n      BaseResultLink,\n      NextQueryPreview\n    },\n    data() {\n      return {\n        maxItemsToRender: 4,\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n</docs>\n"],"names":["_openBlock","_createElementBlock","_createCommentVNode","suggestion","_renderSlot","suggestionResults","_Fragment","_renderList"],"mappings":";;;;MAC+B,UAAU,GAAA;AAAA,EAAqB,GAAK,EAAA,CAAA;AAAA,EAAA,WAAA,EAAA,oBAAA;;;;AAAjE,SAAA,WAAA,CAAA,IAAA,EAAA,MAAA,EAAA,MAAA,EA2BK,QA3BL,KA2BK,EAAA,QAAA,EAAA;AA1BH,EAAA,OAAA,IAAA,CAAA,iBAAA,IAAAA,SAAA,EAyBO,EAAAC,kBAAA,CAAA,IAAA,EAAA,UAAA,EAAA;AAAA,IAAAC,kBAAA,CAlBQC,iSAAU,CAAA;AAAA,IAAAC,UAAA,CACbC,IAAkB,CAAA,MAAA,EAAA,SAAA,EAAA;AAAA,MAC3B,YAAY,IAAEA,CAAAA,UAAAA;AAAAA,MAgBV,OAAA,EAAA,IAAA,CAAA,iBAAA,CAAA,KAAA;AAAA,MAdL,YAAA,EAAA,IAAA,CAAA,iBAAA,CAAA,YAAA;AAAA,KAAA,EAAA,MAAA;AAEQ,OAAAL,SAAA,CAAA,IAAO,CAAE,EAAAC,kBAAA;AAAA,QAAAK,QAAA;AAAA,QAAA,IAAA;AAAA,QAAAC,UAAA,CAAA,IAAA,CAAA,iBAAA,CAAA,KAAA,EAAA,CAAA,MAAA,KAAA;AACV,UAAA,OAAAP,SAAA,EAA6B,EAAAC,kBAAA,CAAA,IAAA,EAAA;AAAA,YAClC,GAAS,EAAA,MAAA,CAAA,EAAA;AAAA,YAAA,KAAA,EAAA,4BAAA;AAET,YAAA,WAAA,EAAA,yBAAA;AAAA,WAIA,EAAA;AAAA,YAAAC,kBAAA,CACE,mIAA4C,CAAA;AAAA,YAAAE,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,QAAA,EAAA,EAAA,MAAA,EAAA,EAAA,MAAA;;;;;;;;;;;;;;AAxBtD,KAAA,CAAA;AAAA,GAAA,CAAA,IAAAF,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}
+{"version":3,"file":"next-query-preview.vue.js","sources":["../../../../../src/x-modules/next-queries/components/next-query-preview.vue"],"sourcesContent":["<template>\n  <ul v-if=\"suggestionResults\" data-test=\"next-query-preview\" class=\"x-next-query-preview\">\n    <!--\n      @slot Next Query Preview default slot.\n          @binding {NextQuery} suggestion - Next Query suggestion data\n          @binding {Result[]} results - The results preview of the next query\n          @binding {number} totalResults - The total results of the search request\n    -->\n    <slot\n      :suggestion=\"suggestion\"\n      :results=\"suggestionResults.items\"\n      :total-results=\"suggestionResults.totalResults\"\n    >\n      <li\n        v-for=\"result in suggestionResults.items\"\n        :key=\"result.id\"\n        class=\"x-next-query-preview__item\"\n        data-test=\"next-query-preview-item\"\n      >\n        <!--\n          @slot Next Query Preview result slot.\n              @binding {Result} result - A Next Query Preview result\n        -->\n        <slot name=\"result\" :result=\"result\">\n          <span data-test=\"result-name\">{{ result.name }}</span>\n        </slot>\n      </li>\n    </slot>\n  </ul>\n</template>\n\n<script lang=\"ts\">\nimport type { NextQuery, PreviewResults } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { computed, defineComponent, onMounted } from 'vue'\nimport { use$x } from '../../../composables/use-$x'\nimport { useState } from '../../../composables/use-state'\nimport { nextQueriesXModule } from '../x-module'\n\n/**\n * Retrieves a preview of the results of a next query and exposes them in the default slot,\n * along with the next query and the totalResults of the search request.\n * By default, it renders the names of the results.\n *\n * @public\n */\nexport default defineComponent({\n  name: 'NextQueryPreview',\n  xModule: nextQueriesXModule.name,\n  props: {\n    /**\n     * The next query to retrieve the results preview.\n     *\n     * @public\n     */\n    suggestion: {\n      type: Object as PropType<NextQuery>,\n      required: true,\n    },\n    /**\n     * Number of suggestion results to be rendered.\n     *\n     * @public\n     */\n    maxItemsToRender: Number,\n  },\n  setup(props) {\n    const $x = use$x()\n    /**\n     * The results preview of the next queries mounted.\n     * It is a dictionary, indexed by the next query query.\n     */\n    const { resultsPreview } = useState('nextQueries')\n\n    /**\n     * The component emits the NextQueryPreviewMountedHook event to retrieve the results preview\n     * of the next query.\n     */\n    onMounted(() => $x.emit('NextQueryPreviewMountedHook', props.suggestion.query))\n\n    /**\n     * Gets from the state the results preview of the next query.\n     *\n     * @returns The results preview of the actual next query.\n     */\n    const suggestionResults = computed((): PreviewResults | undefined => {\n      const previewResults = resultsPreview.value[props.suggestion.query] as PreviewResults\n\n      return previewResults\n        ? {\n            ...previewResults,\n            items: previewResults.items.slice(0, props.maxItemsToRender),\n          }\n        : undefined\n    })\n\n    return { suggestionResults }\n  },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nThis component emits the\n[`NextQueryPreviewMountedHook`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts)\nwhen it is mounted.\n\n## See it in action\n\nHere you have a basic example of how the NextQueryPreview is rendered. Keep in mind that this\ncomponent is intended to be used overriding its default slot. By default it will only render the\nnames of the results.\n\n```vue live\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" />\n</template>\n\n<script>\nimport { NextQueryPreview } from '@empathyco/x-components/next-queries'\n\nexport default {\n  name: 'NextQueryPreviewDemo',\n  components: {\n    NextQueryPreview,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n\n### Play with the default slot\n\nIn this example, the results will be rendered inside a sliding panel.\n\n```vue live\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" #default=\"{ totalResults, results }\">\n    <p>Total results: {{ totalResults }}</p>\n    <SlidingPanel :resetOnContentChange=\"false\">\n      <article\n        v-for=\"result in results\"\n        :key=\"result.id\"\n        class=\"x-result\"\n        style=\"max-width: 300px; overflow: hidden\"\n      >\n        <BaseResultLink :result=\"result\">\n          <BaseResultImage :result=\"result\" class=\"x-result__picture\" />\n        </BaseResultLink>\n        <div class=\"x-result__description\">\n          <BaseResultLink :result=\"result\">\n            <h1 class=\"x-title3\">{{ result.name }}</h1>\n          </BaseResultLink>\n        </div>\n      </article>\n    </SlidingPanel>\n  </NextQueryPreview>\n</template>\n\n<script>\nimport { NextQueryPreview } from '@empathyco/x-components/next-queries'\nimport { SlidingPanel, BaseResultLink, BaseResultImage } from '@empathyco/x-components'\n\nexport default {\n  name: 'NextQueryPreviewDemoOverridingSlot',\n  components: {\n    NextQueryPreview,\n    SlidingPanel,\n    BaseResultLink,\n    BaseResultImage,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n\n### Play with the result slot\n\nThe component exposes a slot to override the result content, without modifying the list.\n\nIn this example, the ID of the results will be rendered along with the name.\n\n```vue\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" #result=\"{ result }\">\n    <span>{{ result.id }}</span>\n    <span>{{ result.name }}</span>\n  </NextQueryPreview>\n</template>\n\n<script>\nimport { NextQueryPreview } from '@empathyco/x-components/next-queries'\n\nexport default {\n  name: 'NextQueryPreviewDemoOverridingResultSlot',\n  components: {\n    NextQueryPreview,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n\n### Play with props\n\nIn this example, the suggestions has been limited to render a maximum of 4 items.\n\n```vue\n<template>\n  <NextQueryPreview\n    :maxItemsToRender=\"maxItemsToRender\"\n    :suggestion=\"suggestion\"\n    #default=\"{ results }\"\n  >\n    <BaseGrid #default=\"{ item }\" :items=\"results\">\n      <BaseResultLink :result=\"item\">\n        <BaseResultImage :result=\"item\" />\n      </BaseResultLink>\n    </BaseGrid>\n  </NextQueryPreview>\n</template>\n\n<script>\nimport { BaseGrid, BaseResultImage, BaseResultLink } from '@empathyco/x-components'\nimport { NextQueryPreview } from '@empathyco/x-components/next-queries'\n\nexport default {\n  name: 'NextQueryPreviewDemo',\n  components: {\n    BaseGrid,\n    BaseResultImage,\n    BaseResultLink,\n    NextQueryPreview,\n  },\n  data() {\n    return {\n      maxItemsToRender: 4,\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n</docs>\n"],"names":["_openBlock","_createElementBlock","_renderSlot","_Fragment","_renderList","_createElementVNode","_toDisplayString","_createCommentVNode"],"mappings":";;;;;AAAA,EAAA,GAAA,EAAA,CAAA;AAAA,EAC+B,WAAU,EAAA,oBAAA;AAAA,EAAqB,KAAM,EAAA,sBAAA;;AAuBpD,MAAA,UAAA,GAAA,EAAA,WAAA,EAAU,aAAa,EAAA,CAAA;;SAvB3B,IAAV,CAAA,iBAAA,IAAAA,SAAA,EAAA,EAAAC,kBAAA,CA2BK,MA3BL,UA2BK,EAAA;AAAA,IApBHC,UAmBO,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAAA;AAAA,MAlBJ,UAAY,EAAA,IAAA,CAAA,UAAA;AAAA,MACZ,SAAS,IAAkB,CAAA,iBAAA,CAAA,KAAA;AAAA,MAC3B,cAAe,IAAkB,CAAA,iBAAA,CAAA,YAAA;AAAA,KAAA,EAHpC,MAmBO;AAAA,OAdLF,SAAA,CAAA,IAAA,CAAA,EAAAC,kBAAA;AAAA,QAaKE,QAAA;AAAA,QAAA,IAAA;AAAA,QA1BXC,UAcyB,CAAA,IAAA,CAAA,iBAAA,CAAkB,KAd3C,EAAA,CAce,MAAM,KAAA;8BADfH,kBAaK,CAAA,IAAA,EAAA;AAAA,YAXF,KAAK,MAAO,CAAA,EAAA;AAAA,YACb,KAAM,EAAA,4BAAA;AAAA,YACN,WAAU,EAAA,yBAAA;AAAA,WAAA,EAAA;YAMVC,UAEO,CAAA,IAAA,CAAA,MAAA,EAAA,QAAA,EAAA,EAFc,MAAc,EAAA,EAAnC,MAEO;AAAA,cADLG,kBAAA;AAAA,gBAAsD,MAAA;AAAA,gBAAtD,UAAA;AAAA,gBAAsDC,eAAA,CAArB,OAAO,IAAI,CAAA;AAAA,gBAAA,CAAA;AAAA;AAAA,eAAA;AAAA,aAAA,CAAA;;;;;;;AAxBtD,GAAA,CAAA,IAAAC,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}

package/js/x-modules/next-queries/components/next-query-preview.vue2.js

@@ -1,63 +1,63 @@
 import { defineComponent, onMounted, computed } from 'vue';
-import { nextQueriesXModule } from '../x-module.js';
 import { use$x } from '../../../composables/use-_x.js';
 import { useState } from '../../../composables/use-state.js';
+import { nextQueriesXModule } from '../x-module.js';
 
-/**
- * Retrieves a preview of the results of a next query and exposes them in the default slot,
- * along with the next query and the totalResults of the search request.
- * By default, it renders the names of the results.
- *
- * @public
- */
-var _sfc_main = defineComponent({
-    name: 'NextQueryPreview',
-    xModule: nextQueriesXModule.name,
-    props: {
-        /**
-         * The next query to retrieve the results preview.
-         *
-         * @public
-         */
-        suggestion: {
-            type: Object,
-            required: true
-        },
-        /**
-         * Number of suggestion results to be rendered.
-         *
-         * @public
-         */
-        maxItemsToRender: Number
-    },
-    setup(props) {
-        const $x = use$x();
-        /**
-         * The results preview of the next queries mounted.
-         * It is a dictionary, indexed by the next query query.
-         */
-        const { resultsPreview } = useState('nextQueries', ['resultsPreview']);
-        /**
-         * The component emits the NextQueryPreviewMountedHook event to retrieve the results preview
-         * of the next query.
-         */
-        onMounted(() => $x.emit('NextQueryPreviewMountedHook', props.suggestion.query));
-        /**
-         * Gets from the state the results preview of the next query.
-         *
-         * @returns The results preview of the actual next query.
-         */
-        const suggestionResults = computed(() => {
-            const previewResults = resultsPreview.value[props.suggestion.query];
-            return previewResults
-                ? {
-                    ...previewResults,
-                    items: previewResults.items.slice(0, props.maxItemsToRender)
-                }
-                : undefined;
-        });
-        return { suggestionResults };
-    }
+/**
+ * Retrieves a preview of the results of a next query and exposes them in the default slot,
+ * along with the next query and the totalResults of the search request.
+ * By default, it renders the names of the results.
+ *
+ * @public
+ */
+var _sfc_main = defineComponent({
+    name: 'NextQueryPreview',
+    xModule: nextQueriesXModule.name,
+    props: {
+        /**
+         * The next query to retrieve the results preview.
+         *
+         * @public
+         */
+        suggestion: {
+            type: Object,
+            required: true,
+        },
+        /**
+         * Number of suggestion results to be rendered.
+         *
+         * @public
+         */
+        maxItemsToRender: Number,
+    },
+    setup(props) {
+        const $x = use$x();
+        /**
+         * The results preview of the next queries mounted.
+         * It is a dictionary, indexed by the next query query.
+         */
+        const { resultsPreview } = useState('nextQueries');
+        /**
+         * The component emits the NextQueryPreviewMountedHook event to retrieve the results preview
+         * of the next query.
+         */
+        onMounted(() => $x.emit('NextQueryPreviewMountedHook', props.suggestion.query));
+        /**
+         * Gets from the state the results preview of the next query.
+         *
+         * @returns The results preview of the actual next query.
+         */
+        const suggestionResults = computed(() => {
+            const previewResults = resultsPreview.value[props.suggestion.query];
+            return previewResults
+                ? {
+                    ...previewResults,
+                    items: previewResults.items.slice(0, props.maxItemsToRender),
+                }
+                : undefined;
+        });
+        return { suggestionResults };
+    },
 });
 
 export { _sfc_main as default };

package/js/x-modules/next-queries/components/next-query-preview.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"next-query-preview.vue2.js","sources":["../../../../../src/x-modules/next-queries/components/next-query-preview.vue"],"sourcesContent":["<template>\n  <ul v-if=\"suggestionResults\" data-test=\"next-query-preview\" class=\"x-next-query-preview\">\n    <!--\n      @slot Next Query Preview default slot.\n          @binding {NextQuery} suggestion - Next Query suggestion data\n          @binding {Result[]} results - The results preview of the next query\n          @binding {number} totalResults - The total results of the search request\n    -->\n    <slot\n      :suggestion=\"suggestion\"\n      :results=\"suggestionResults.items\"\n      :totalResults=\"suggestionResults.totalResults\"\n    >\n      <li\n        v-for=\"result in suggestionResults.items\"\n        :key=\"result.id\"\n        class=\"x-next-query-preview__item\"\n        data-test=\"next-query-preview-item\"\n      >\n        <!--\n          @slot Next Query Preview result slot.\n              @binding {Result} result - A Next Query Preview result\n        -->\n        <slot name=\"result\" :result=\"result\">\n          <span data-test=\"result-name\">{{ result.name }}</span>\n        </slot>\n      </li>\n    </slot>\n  </ul>\n</template>\n\n<script lang=\"ts\">\n  import { computed, defineComponent, onMounted, PropType } from 'vue';\n  import { NextQuery, PreviewResults } from '@empathyco/x-types';\n  import { nextQueriesXModule } from '../x-module';\n  import { use$x } from '../../../composables/use-$x';\n  import { useState } from '../../../composables/use-state';\n\n  /**\n   * Retrieves a preview of the results of a next query and exposes them in the default slot,\n   * along with the next query and the totalResults of the search request.\n   * By default, it renders the names of the results.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'NextQueryPreview',\n    xModule: nextQueriesXModule.name,\n    props: {\n      /**\n       * The next query to retrieve the results preview.\n       *\n       * @public\n       */\n      suggestion: {\n        type: Object as PropType<NextQuery>,\n        required: true\n      },\n      /**\n       * Number of suggestion results to be rendered.\n       *\n       * @public\n       */\n      maxItemsToRender: Number\n    },\n    setup(props) {\n      const $x = use$x();\n      /**\n       * The results preview of the next queries mounted.\n       * It is a dictionary, indexed by the next query query.\n       */\n      const { resultsPreview } = useState('nextQueries', ['resultsPreview']);\n\n      /**\n       * The component emits the NextQueryPreviewMountedHook event to retrieve the results preview\n       * of the next query.\n       */\n      onMounted(() => $x.emit('NextQueryPreviewMountedHook', props.suggestion.query));\n\n      /**\n       * Gets from the state the results preview of the next query.\n       *\n       * @returns The results preview of the actual next query.\n       */\n      const suggestionResults = computed((): PreviewResults | undefined => {\n        const previewResults = resultsPreview.value[props.suggestion.query] as PreviewResults;\n\n        return previewResults\n          ? {\n              ...previewResults,\n              items: previewResults.items.slice(0, props.maxItemsToRender)\n            }\n          : undefined;\n      });\n\n      return { suggestionResults };\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nThis component emits the\n[`NextQueryPreviewMountedHook`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts)\nwhen it is mounted.\n\n## See it in action\n\nHere you have a basic example of how the NextQueryPreview is rendered. Keep in mind that this\ncomponent is intended to be used overriding its default slot. By default it will only render the\nnames of the results.\n\n```vue live\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" />\n</template>\n\n<script>\n  import { NextQueryPreview } from '@empathyco/x-components/next-queries';\n\n  export default {\n    name: 'NextQueryPreviewDemo',\n    components: {\n      NextQueryPreview\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with the default slot\n\nIn this example, the results will be rendered inside a sliding panel.\n\n```vue live\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" #default=\"{ totalResults, results }\">\n    <p>Total results: {{ totalResults }}</p>\n    <SlidingPanel :resetOnContentChange=\"false\">\n      <article\n        v-for=\"result in results\"\n        :key=\"result.id\"\n        class=\"x-result\"\n        style=\"max-width: 300px; overflow: hidden\"\n      >\n        <BaseResultLink :result=\"result\">\n          <BaseResultImage :result=\"result\" class=\"x-result__picture\" />\n        </BaseResultLink>\n        <div class=\"x-result__description\">\n          <BaseResultLink :result=\"result\">\n            <h1 class=\"x-title3\">{{ result.name }}</h1>\n          </BaseResultLink>\n        </div>\n      </article>\n    </SlidingPanel>\n  </NextQueryPreview>\n</template>\n\n<script>\n  import { NextQueryPreview } from '@empathyco/x-components/next-queries';\n  import { SlidingPanel, BaseResultLink, BaseResultImage } from '@empathyco/x-components';\n\n  export default {\n    name: 'NextQueryPreviewDemoOverridingSlot',\n    components: {\n      NextQueryPreview,\n      SlidingPanel,\n      BaseResultLink,\n      BaseResultImage\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with the result slot\n\nThe component exposes a slot to override the result content, without modifying the list.\n\nIn this example, the ID of the results will be rendered along with the name.\n\n```vue\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" #result=\"{ result }\">\n    <span>{{ result.id }}</span>\n    <span>{{ result.name }}</span>\n  </NextQueryPreview>\n</template>\n\n<script>\n  import { NextQueryPreview } from '@empathyco/x-components/next-queries';\n\n  export default {\n    name: 'NextQueryPreviewDemoOverridingResultSlot',\n    components: {\n      NextQueryPreview\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with props\n\nIn this example, the suggestions has been limited to render a maximum of 4 items.\n\n```vue\n<template>\n  <NextQueryPreview\n    :maxItemsToRender=\"maxItemsToRender\"\n    :suggestion=\"suggestion\"\n    #default=\"{ results }\"\n  >\n    <BaseGrid #default=\"{ item }\" :items=\"results\">\n      <BaseResultLink :result=\"item\">\n        <BaseResultImage :result=\"item\" />\n      </BaseResultLink>\n    </BaseGrid>\n  </NextQueryPreview>\n</template>\n\n<script>\n  import { BaseGrid, BaseResultImage, BaseResultLink } from '@empathyco/x-components';\n  import { NextQueryPreview } from '@empathyco/x-components/next-queries';\n\n  export default {\n    name: 'NextQueryPreviewDemo',\n    components: {\n      BaseGrid,\n      BaseResultImage,\n      BaseResultLink,\n      NextQueryPreview\n    },\n    data() {\n      return {\n        maxItemsToRender: 4,\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;;AAsCE;;;;;;AAME;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,kBAAkB;IACxB,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,MAA6B;AACnC,YAAA,QAAQ,EAAE,IAAG;AACd,SAAA;AACD;;;;AAIE;AACF,QAAA,gBAAgB,EAAE,MAAK;AACxB,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,EAAC,GAAI,KAAK,EAAE,CAAA;AAClB;;;AAGE;AACF,QAAA,MAAM,EAAE,cAAe,EAAA,GAAI,QAAQ,CAAC,aAAa,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAA;AAEtE;;;AAGE;AACF,QAAA,SAAS,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,6BAA6B,EAAE,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAA;AAE/E;;;;AAIE;AACF,QAAA,MAAM,iBAAgB,GAAI,QAAQ,CAAC,MAAkC;AACnE,YAAA,MAAM,cAAa,GAAI,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAmB,CAAA;AAErF,YAAA,OAAO,cAAa;AAClB,kBAAE;AACE,oBAAA,GAAG,cAAc;AACjB,oBAAA,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAA;AAC7D,iBAAA;kBACA,SAAS,CAAA;AACf,SAAC,CAAC,CAAA;QAEF,OAAO,EAAE,iBAAgB,EAAG,CAAA;KAC9B;AACD,CAAA,CAAC;;;;"}
+{"version":3,"file":"next-query-preview.vue2.js","sources":["../../../../../src/x-modules/next-queries/components/next-query-preview.vue"],"sourcesContent":["<template>\n  <ul v-if=\"suggestionResults\" data-test=\"next-query-preview\" class=\"x-next-query-preview\">\n    <!--\n      @slot Next Query Preview default slot.\n          @binding {NextQuery} suggestion - Next Query suggestion data\n          @binding {Result[]} results - The results preview of the next query\n          @binding {number} totalResults - The total results of the search request\n    -->\n    <slot\n      :suggestion=\"suggestion\"\n      :results=\"suggestionResults.items\"\n      :total-results=\"suggestionResults.totalResults\"\n    >\n      <li\n        v-for=\"result in suggestionResults.items\"\n        :key=\"result.id\"\n        class=\"x-next-query-preview__item\"\n        data-test=\"next-query-preview-item\"\n      >\n        <!--\n          @slot Next Query Preview result slot.\n              @binding {Result} result - A Next Query Preview result\n        -->\n        <slot name=\"result\" :result=\"result\">\n          <span data-test=\"result-name\">{{ result.name }}</span>\n        </slot>\n      </li>\n    </slot>\n  </ul>\n</template>\n\n<script lang=\"ts\">\nimport type { NextQuery, PreviewResults } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { computed, defineComponent, onMounted } from 'vue'\nimport { use$x } from '../../../composables/use-$x'\nimport { useState } from '../../../composables/use-state'\nimport { nextQueriesXModule } from '../x-module'\n\n/**\n * Retrieves a preview of the results of a next query and exposes them in the default slot,\n * along with the next query and the totalResults of the search request.\n * By default, it renders the names of the results.\n *\n * @public\n */\nexport default defineComponent({\n  name: 'NextQueryPreview',\n  xModule: nextQueriesXModule.name,\n  props: {\n    /**\n     * The next query to retrieve the results preview.\n     *\n     * @public\n     */\n    suggestion: {\n      type: Object as PropType<NextQuery>,\n      required: true,\n    },\n    /**\n     * Number of suggestion results to be rendered.\n     *\n     * @public\n     */\n    maxItemsToRender: Number,\n  },\n  setup(props) {\n    const $x = use$x()\n    /**\n     * The results preview of the next queries mounted.\n     * It is a dictionary, indexed by the next query query.\n     */\n    const { resultsPreview } = useState('nextQueries')\n\n    /**\n     * The component emits the NextQueryPreviewMountedHook event to retrieve the results preview\n     * of the next query.\n     */\n    onMounted(() => $x.emit('NextQueryPreviewMountedHook', props.suggestion.query))\n\n    /**\n     * Gets from the state the results preview of the next query.\n     *\n     * @returns The results preview of the actual next query.\n     */\n    const suggestionResults = computed((): PreviewResults | undefined => {\n      const previewResults = resultsPreview.value[props.suggestion.query] as PreviewResults\n\n      return previewResults\n        ? {\n            ...previewResults,\n            items: previewResults.items.slice(0, props.maxItemsToRender),\n          }\n        : undefined\n    })\n\n    return { suggestionResults }\n  },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nThis component emits the\n[`NextQueryPreviewMountedHook`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts)\nwhen it is mounted.\n\n## See it in action\n\nHere you have a basic example of how the NextQueryPreview is rendered. Keep in mind that this\ncomponent is intended to be used overriding its default slot. By default it will only render the\nnames of the results.\n\n```vue live\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" />\n</template>\n\n<script>\nimport { NextQueryPreview } from '@empathyco/x-components/next-queries'\n\nexport default {\n  name: 'NextQueryPreviewDemo',\n  components: {\n    NextQueryPreview,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n\n### Play with the default slot\n\nIn this example, the results will be rendered inside a sliding panel.\n\n```vue live\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" #default=\"{ totalResults, results }\">\n    <p>Total results: {{ totalResults }}</p>\n    <SlidingPanel :resetOnContentChange=\"false\">\n      <article\n        v-for=\"result in results\"\n        :key=\"result.id\"\n        class=\"x-result\"\n        style=\"max-width: 300px; overflow: hidden\"\n      >\n        <BaseResultLink :result=\"result\">\n          <BaseResultImage :result=\"result\" class=\"x-result__picture\" />\n        </BaseResultLink>\n        <div class=\"x-result__description\">\n          <BaseResultLink :result=\"result\">\n            <h1 class=\"x-title3\">{{ result.name }}</h1>\n          </BaseResultLink>\n        </div>\n      </article>\n    </SlidingPanel>\n  </NextQueryPreview>\n</template>\n\n<script>\nimport { NextQueryPreview } from '@empathyco/x-components/next-queries'\nimport { SlidingPanel, BaseResultLink, BaseResultImage } from '@empathyco/x-components'\n\nexport default {\n  name: 'NextQueryPreviewDemoOverridingSlot',\n  components: {\n    NextQueryPreview,\n    SlidingPanel,\n    BaseResultLink,\n    BaseResultImage,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n\n### Play with the result slot\n\nThe component exposes a slot to override the result content, without modifying the list.\n\nIn this example, the ID of the results will be rendered along with the name.\n\n```vue\n<template>\n  <NextQueryPreview :suggestion=\"suggestion\" #result=\"{ result }\">\n    <span>{{ result.id }}</span>\n    <span>{{ result.name }}</span>\n  </NextQueryPreview>\n</template>\n\n<script>\nimport { NextQueryPreview } from '@empathyco/x-components/next-queries'\n\nexport default {\n  name: 'NextQueryPreviewDemoOverridingResultSlot',\n  components: {\n    NextQueryPreview,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n\n### Play with props\n\nIn this example, the suggestions has been limited to render a maximum of 4 items.\n\n```vue\n<template>\n  <NextQueryPreview\n    :maxItemsToRender=\"maxItemsToRender\"\n    :suggestion=\"suggestion\"\n    #default=\"{ results }\"\n  >\n    <BaseGrid #default=\"{ item }\" :items=\"results\">\n      <BaseResultLink :result=\"item\">\n        <BaseResultImage :result=\"item\" />\n      </BaseResultLink>\n    </BaseGrid>\n  </NextQueryPreview>\n</template>\n\n<script>\nimport { BaseGrid, BaseResultImage, BaseResultLink } from '@empathyco/x-components'\nimport { NextQueryPreview } from '@empathyco/x-components/next-queries'\n\nexport default {\n  name: 'NextQueryPreviewDemo',\n  components: {\n    BaseGrid,\n    BaseResultImage,\n    BaseResultLink,\n    NextQueryPreview,\n  },\n  data() {\n    return {\n      maxItemsToRender: 4,\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;;AAuCA;;;;;;AAME;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,kBAAkB;IACxB,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,MAA6B;AACnC,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA;AACD;;;;AAIE;AACF,QAAA,gBAAgB,EAAE,MAAM;AACzB,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,EAAC,GAAI,KAAK,EAAC,CAAA;AACjB;;;AAGE;QACF,MAAM,EAAE,gBAAiB,GAAE,QAAQ,CAAC,aAAa,CAAA,CAAA;AAEjD;;;AAGE;AACF,QAAA,SAAS,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,6BAA6B,EAAE,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAA,CAAA;AAE9E;;;;AAIE;AACF,QAAA,MAAM,iBAAgB,GAAI,QAAQ,CAAC,MAAkC;AACnE,YAAA,MAAM,cAAa,GAAI,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAkB,CAAA;AAEpF,YAAA,OAAO,cAAa;AAClB,kBAAE;AACE,oBAAA,GAAG,cAAc;AACjB,oBAAA,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC;AAC9D,iBAAA;kBACA,SAAQ,CAAA;AACd,SAAC,CAAA,CAAA;QAED,OAAO,EAAE,iBAAkB,EAAA,CAAA;KAC5B;AACF,CAAA,CAAA;;;;"}

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

@@ -1,5 +1,5 @@
 import _sfc_main from './next-query.vue2.js';
-import { resolveComponent, openBlock, createBlock, normalizeClass, withCtx, createCommentVNode, renderSlot, normalizeProps, guardReactiveProps } from 'vue';
+import { resolveComponent, openBlock, createBlock, normalizeClass, 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) {
@@ -7,19 +7,16 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createBlock(_component_BaseSuggestion, {
     class: normalizeClass(["x-next-query", { "x-next-query--is-curated": _ctx.shouldHighlightCurated }]),
     suggestion: _ctx.suggestion,
-    suggestionSelectedEvents: _ctx.events,
+    "suggestion-selected-events": _ctx.events,
     "data-test": "next-query",
     feature: "next_query"
   }, {
     default: withCtx((baseScope) => [
-      createCommentVNode(" eslint-disable max-len "),
-      createCommentVNode("\n        @slot Next Query content\n            @binding {Object} v-bind - `BaseSuggestion` default slot scope: **suggestion** <code>Suggestion</code> - Suggestion data<br /> **query** <code>string</code> - The query that the suggestion belongs to<br /> **filter** <code>Filter \\| undefined</code> - Suggestion's filter\n            @binding {boolean} shouldHighlightCurated - True if the curated NQ should be highlighted\n    "),
-      createCommentVNode(" eslint-enable max-len "),
       renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({ ...baseScope, shouldHighlightCurated: _ctx.shouldHighlightCurated })))
     ]),
     _: 3
     /* FORWARDED */
-  }, 8, ["suggestion", "suggestionSelectedEvents", "class"]);
+  }, 8, ["suggestion", "suggestion-selected-events", "class"]);
 }
 var NextQuery = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 

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

@@ -1 +1 @@
-{"version":3,"file":"next-query.vue.js","sources":["../../../../../src/x-modules/next-queries/components/next-query.vue"],"sourcesContent":["<template>\n  <BaseSuggestion\n    class=\"x-next-query\"\n    :suggestion=\"suggestion\"\n    :suggestionSelectedEvents=\"events\"\n    data-test=\"next-query\"\n    feature=\"next_query\"\n    :class=\"{ 'x-next-query--is-curated': shouldHighlightCurated }\"\n    #default=\"baseScope\"\n  >\n    <!-- eslint-disable max-len -->\n    <!--\n        @slot Next Query content\n            @binding {Object} v-bind - `BaseSuggestion` default slot scope: **suggestion** <code>Suggestion</code> - Suggestion data<br /> **query** <code>string</code> - The query that the suggestion belongs to<br /> **filter** <code>Filter \\| undefined</code> - Suggestion's filter\n            @binding {boolean} shouldHighlightCurated - True if the curated NQ should be highlighted\n    -->\n    <!-- eslint-enable max-len -->\n    <slot v-bind=\"{ ...baseScope, shouldHighlightCurated }\" />\n  </BaseSuggestion>\n</template>\n\n<script lang=\"ts\">\n  import { NextQuery as NextQueryModel } from '@empathyco/x-types';\n  import { computed, defineComponent, PropType } from 'vue';\n  import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue';\n  import { XEventsTypes } from '../../../wiring/events.types';\n  import { nextQueriesXModule } from '../x-module';\n\n  /**\n   * Renders a next query item which receives the suggestion that will be rendered as a prop. It\n   * exposes a default slot to change the next query content. If the slot is not overridden,\n   * it will render the suggestion query by default.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'NextQuery',\n    xModule: nextQueriesXModule.name,\n    components: { BaseSuggestion },\n    props: {\n      /**\n       * The suggestion to render and use in the default slot.\n       *\n       * @public\n       */\n      suggestion: {\n        type: Object as PropType<NextQueryModel>,\n        required: true\n      },\n      /**\n       * Indicates if the curated next query should be highlighted.\n       *\n       * @public\n       */\n      highlightCurated: {\n        type: Boolean,\n        default: false\n      }\n    },\n    setup(props) {\n      /**\n       * Events list which are going to be emitted when a next query is selected.\n       *\n       * @returns The {@link XEvent} to emit.\n       * @public\n       */\n      const events = computed(\n        (): Partial<XEventsTypes> => ({ UserSelectedANextQuery: props.suggestion })\n      );\n\n      /**\n       * Checks if the next query is curated and if it should be highlighted.\n       *\n       * @returns True if the next query is curated and should be highlighted.\n       *\n       * @internal\n       */\n      const shouldHighlightCurated = computed(\n        () => props.highlightCurated && (props.suggestion.isCurated ?? false)\n      );\n\n      return {\n        events,\n        shouldHighlightCurated\n      };\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Dynamic Classes\n\n`NextQuery` uses the following dynamic CSS classes so you can style it when is:\n\n- Curated: `x-next-query--is-curated`.\n\n## Events\n\nA list of events that the component will emit:\n\n- [`UserSelectedANextQuery`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button. The event payload is the next query data.\n\n## Examples\n\nThis components expects just a suggestion as a prop to be rendered. It has a slot to override the\ncontent. By default, it renders the suggestion query of the next query. It also has an optional\nprop, `highlightCurated`, to indicate if the curated Next Queries should be differentiated with a\nCSS class.\n\n### Basic Usage\n\nUsing default slot:\n\n```vue live\n<template>\n  <NextQuery :suggestion=\"suggestion\" />\n</template>\n\n<script>\n  import { NextQuery } from '@empathyco/x-components/next-queries';\n\n  export default {\n    name: 'NextQueryDemo',\n    components: {\n      NextQuery\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Overriding default slot.\n\nThe default slot allows you to replace the content of the suggestion button.\n\n```vue live\n<template>\n  <NextQuery :suggestion=\"suggestion\">\n    <template #default=\"{ suggestion }\">\n      <TrendingIcon />\n      <span class=\"x-next-query__query\" :aria-label=\"suggestion.query\">{{ suggestion.query }}</span>\n    </template>\n  </NextQuery>\n</template>\n\n<script>\n  import { NextQuery } from '@empathyco/x-components/next-queries';\n  import { TrendingIcon } from '@empathyco/x-components';\n\n  export default {\n    name: 'NextQueryDemo',\n    components: {\n      NextQuery,\n      TrendingIcon\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n</docs>\n"],"names":["_resolveComponent","_openBlock","_createBlock","_withCtx","_createCommentVNode","_renderSlot","_normalizeProps","_guardReactiveProps"],"mappings":";;;;;oCACEA,gBAiBiB,CAAA,gBAAA,CAAA,CAAA;AAfd,EAAA,OAAAC,SAAA,EAAsB,EAAAC,WAAA,CAAA,yBAAA,EAAA;AAAA,IACtB,uBAAwB,cAAQ,EAAA,EAAA,0BAAA,EAAA,IAAA,CAAA,sBAAA,EAAA,CAAA,CAAA;AAAA,IACjC,YAAS,IAAC,CAAA,UAAA;AAAA,IACV,wBAAoB,EAAA,IAAA,CAAA,MAAA;AAAA,IAAA,WAAA,EAAA,YAAA;IAEnB,OAAO,EAAA,YAAA;AAAA,GAAA,EAAA;AAGR,IAAA,OAAA,EAAAC,OAAA,CAAA,CAAA,SAAA,KAAA;AAAA,MAKAC,kBAA8B,CAAA,0BAAA,CAAA;AAAA,MAC9BA,mBAA0D,8aAAN,CAAA;AAAA,MAAAA,kBAAA,CAAA,yBAAA,CAAA;AAjBxD,MAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAAAC,cAAA,CAAAC,kBAAA,CAAA,EAAA,GAAA,SAAA,EAAA,sBAAA,EAAA,IAAA,CAAA,sBAAA,EAAA,CAAA,CAAA,CAAA;AAAA,KAAA,CAAA;;;;;;;;;"}
+{"version":3,"file":"next-query.vue.js","sources":["../../../../../src/x-modules/next-queries/components/next-query.vue"],"sourcesContent":["<template>\n  <BaseSuggestion\n    v-slot=\"baseScope\"\n    class=\"x-next-query\"\n    :suggestion=\"suggestion\"\n    :suggestion-selected-events=\"events\"\n    data-test=\"next-query\"\n    feature=\"next_query\"\n    :class=\"{ 'x-next-query--is-curated': shouldHighlightCurated }\"\n  >\n    <!-- eslint-disable max-len -->\n    <!--\n        @slot Next Query content\n            @binding {Object} v-bind - `BaseSuggestion` default slot scope: **suggestion** <code>Suggestion</code> - Suggestion data<br /> **query** <code>string</code> - The query that the suggestion belongs to<br /> **filter** <code>Filter \\| undefined</code> - Suggestion's filter\n            @binding {boolean} shouldHighlightCurated - True if the curated NQ should be highlighted\n    -->\n    <!-- eslint-enable max-len -->\n    <slot v-bind=\"{ ...baseScope, shouldHighlightCurated }\" />\n  </BaseSuggestion>\n</template>\n\n<script lang=\"ts\">\nimport type { NextQuery as NextQueryModel } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport type { XEventsTypes } from '../../../wiring/events.types'\nimport { computed, defineComponent } from 'vue'\nimport BaseSuggestion from '../../../components/suggestions/base-suggestion.vue'\nimport { nextQueriesXModule } from '../x-module'\n\n/**\n * Renders a next query item which receives the suggestion that will be rendered as a prop. It\n * exposes a default slot to change the next query content. If the slot is not overridden,\n * it will render the suggestion query by default.\n *\n * @public\n */\nexport default defineComponent({\n  name: 'NextQuery',\n  xModule: nextQueriesXModule.name,\n  components: { BaseSuggestion },\n  props: {\n    /**\n     * The suggestion to render and use in the default slot.\n     *\n     * @public\n     */\n    suggestion: {\n      type: Object as PropType<NextQueryModel>,\n      required: true,\n    },\n    /**\n     * Indicates if the curated next query should be highlighted.\n     *\n     * @public\n     */\n    highlightCurated: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  setup(props) {\n    /**\n     * Events list which are going to be emitted when a next query is selected.\n     *\n     * @returns The {@link XEvent} to emit.\n     * @public\n     */\n    const events = computed(\n      (): Partial<XEventsTypes> => ({ UserSelectedANextQuery: props.suggestion }),\n    )\n\n    /**\n     * Checks if the next query is curated and if it should be highlighted.\n     *\n     * @returns True if the next query is curated and should be highlighted.\n     *\n     * @internal\n     */\n    const shouldHighlightCurated = computed(\n      () => props.highlightCurated && (props.suggestion.isCurated ?? false),\n    )\n\n    return {\n      events,\n      shouldHighlightCurated,\n    }\n  },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Dynamic Classes\n\n`NextQuery` uses the following dynamic CSS classes so you can style it when is:\n\n- Curated: `x-next-query--is-curated`.\n\n## Events\n\nA list of events that the component will emit:\n\n- [`UserSelectedANextQuery`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button. The event payload is the next query data.\n\n## Examples\n\nThis components expects just a suggestion as a prop to be rendered. It has a slot to override the\ncontent. By default, it renders the suggestion query of the next query. It also has an optional\nprop, `highlightCurated`, to indicate if the curated Next Queries should be differentiated with a\nCSS class.\n\n### Basic Usage\n\nUsing default slot:\n\n```vue live\n<template>\n  <NextQuery :suggestion=\"suggestion\" />\n</template>\n\n<script>\nimport { NextQuery } from '@empathyco/x-components/next-queries'\n\nexport default {\n  name: 'NextQueryDemo',\n  components: {\n    NextQuery,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n\n### Overriding default slot.\n\nThe default slot allows you to replace the content of the suggestion button.\n\n```vue live\n<template>\n  <NextQuery :suggestion=\"suggestion\">\n    <template #default=\"{ suggestion }\">\n      <TrendingIcon />\n      <span class=\"x-next-query__query\" :aria-label=\"suggestion.query\">{{ suggestion.query }}</span>\n    </template>\n  </NextQuery>\n</template>\n\n<script>\nimport { NextQuery } from '@empathyco/x-components/next-queries'\nimport { TrendingIcon } from '@empathyco/x-components'\n\nexport default {\n  name: 'NextQueryDemo',\n  components: {\n    NextQuery,\n    TrendingIcon,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n</docs>\n"],"names":["_createBlock","_normalizeClass","_withCtx","_renderSlot","_normalizeProps","_guardReactiveProps"],"mappings":";;;;;;sBACEA,WAiBiB,CAAA,yBAAA,EAAA;AAAA,IAff,KAHJ,EAAAC,cAAA,CAAA,CAGU,cAAc,EAAA,EAAA,0BAAA,EAKkB,IAAsB,CAAA,sBAAA,EAAA,CAAA,CAAA;AAAA,IAJ3D,UAAY,EAAA,IAAA,CAAA,UAAA;AAAA,IACZ,4BAA4B,EAAA,IAAA,CAAA,MAAA;AAAA,IAC7B,WAAU,EAAA,YAAA;AAAA,IACV,OAAQ,EAAA,YAAA;AAAA,GAAA,EAAA;AAPZ,IAAA,OAAA,EAAAC,OAAA,CAiBI,CAA0D,SAfzC,KAAA;AAAA,MAejBC,UAA0D,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAjB9DC,cAiBuB,CAAAC,kBAAA,CAAA,EAAA,GAAA,SAAA,EAAS,wBAAE,IAAsB,CAAA,sBAAA,EAAA,CAAA,CAAA,CAAA;AAAA,KAAA,CAAA;AAjBxD,IAAA,CAAA,EAAA,CAAA;AAAA;AAAA,GAAA,EAAA,CAAA,EAAA,CAAA,YAAA,EAAA,4BAAA,EAAA,OAAA,CAAA,CAAA,CAAA;;;;;;"}

package/js/x-modules/next-queries/components/next-query.vue2.js

@@ -2,58 +2,58 @@ import { defineComponent, computed } from 'vue';
 import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue.js';
 import { nextQueriesXModule } from '../x-module.js';
 
-/**
- * Renders a next query item which receives the suggestion that will be rendered as a prop. It
- * exposes a default slot to change the next query content. If the slot is not overridden,
- * it will render the suggestion query by default.
- *
- * @public
- */
-var _sfc_main = defineComponent({
-    name: 'NextQuery',
-    xModule: nextQueriesXModule.name,
-    components: { BaseSuggestion },
-    props: {
-        /**
-         * The suggestion to render and use in the default slot.
-         *
-         * @public
-         */
-        suggestion: {
-            type: Object,
-            required: true
-        },
-        /**
-         * Indicates if the curated next query should be highlighted.
-         *
-         * @public
-         */
-        highlightCurated: {
-            type: Boolean,
-            default: false
-        }
-    },
-    setup(props) {
-        /**
-         * Events list which are going to be emitted when a next query is selected.
-         *
-         * @returns The {@link XEvent} to emit.
-         * @public
-         */
-        const events = computed(() => ({ UserSelectedANextQuery: props.suggestion }));
-        /**
-         * Checks if the next query is curated and if it should be highlighted.
-         *
-         * @returns True if the next query is curated and should be highlighted.
-         *
-         * @internal
-         */
-        const shouldHighlightCurated = computed(() => props.highlightCurated && (props.suggestion.isCurated ?? false));
-        return {
-            events,
-            shouldHighlightCurated
-        };
-    }
+/**
+ * Renders a next query item which receives the suggestion that will be rendered as a prop. It
+ * exposes a default slot to change the next query content. If the slot is not overridden,
+ * it will render the suggestion query by default.
+ *
+ * @public
+ */
+var _sfc_main = defineComponent({
+    name: 'NextQuery',
+    xModule: nextQueriesXModule.name,
+    components: { BaseSuggestion },
+    props: {
+        /**
+         * The suggestion to render and use in the default slot.
+         *
+         * @public
+         */
+        suggestion: {
+            type: Object,
+            required: true,
+        },
+        /**
+         * Indicates if the curated next query should be highlighted.
+         *
+         * @public
+         */
+        highlightCurated: {
+            type: Boolean,
+            default: false,
+        },
+    },
+    setup(props) {
+        /**
+         * Events list which are going to be emitted when a next query is selected.
+         *
+         * @returns The {@link XEvent} to emit.
+         * @public
+         */
+        const events = computed(() => ({ UserSelectedANextQuery: props.suggestion }));
+        /**
+         * Checks if the next query is curated and if it should be highlighted.
+         *
+         * @returns True if the next query is curated and should be highlighted.
+         *
+         * @internal
+         */
+        const shouldHighlightCurated = computed(() => props.highlightCurated && (props.suggestion.isCurated ?? false));
+        return {
+            events,
+            shouldHighlightCurated,
+        };
+    },
 });
 
 export { _sfc_main as default };

package/js/x-modules/next-queries/components/next-query.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"next-query.vue2.js","sources":["../../../../../src/x-modules/next-queries/components/next-query.vue"],"sourcesContent":["<template>\n  <BaseSuggestion\n    class=\"x-next-query\"\n    :suggestion=\"suggestion\"\n    :suggestionSelectedEvents=\"events\"\n    data-test=\"next-query\"\n    feature=\"next_query\"\n    :class=\"{ 'x-next-query--is-curated': shouldHighlightCurated }\"\n    #default=\"baseScope\"\n  >\n    <!-- eslint-disable max-len -->\n    <!--\n        @slot Next Query content\n            @binding {Object} v-bind - `BaseSuggestion` default slot scope: **suggestion** <code>Suggestion</code> - Suggestion data<br /> **query** <code>string</code> - The query that the suggestion belongs to<br /> **filter** <code>Filter \\| undefined</code> - Suggestion's filter\n            @binding {boolean} shouldHighlightCurated - True if the curated NQ should be highlighted\n    -->\n    <!-- eslint-enable max-len -->\n    <slot v-bind=\"{ ...baseScope, shouldHighlightCurated }\" />\n  </BaseSuggestion>\n</template>\n\n<script lang=\"ts\">\n  import { NextQuery as NextQueryModel } from '@empathyco/x-types';\n  import { computed, defineComponent, PropType } from 'vue';\n  import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue';\n  import { XEventsTypes } from '../../../wiring/events.types';\n  import { nextQueriesXModule } from '../x-module';\n\n  /**\n   * Renders a next query item which receives the suggestion that will be rendered as a prop. It\n   * exposes a default slot to change the next query content. If the slot is not overridden,\n   * it will render the suggestion query by default.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'NextQuery',\n    xModule: nextQueriesXModule.name,\n    components: { BaseSuggestion },\n    props: {\n      /**\n       * The suggestion to render and use in the default slot.\n       *\n       * @public\n       */\n      suggestion: {\n        type: Object as PropType<NextQueryModel>,\n        required: true\n      },\n      /**\n       * Indicates if the curated next query should be highlighted.\n       *\n       * @public\n       */\n      highlightCurated: {\n        type: Boolean,\n        default: false\n      }\n    },\n    setup(props) {\n      /**\n       * Events list which are going to be emitted when a next query is selected.\n       *\n       * @returns The {@link XEvent} to emit.\n       * @public\n       */\n      const events = computed(\n        (): Partial<XEventsTypes> => ({ UserSelectedANextQuery: props.suggestion })\n      );\n\n      /**\n       * Checks if the next query is curated and if it should be highlighted.\n       *\n       * @returns True if the next query is curated and should be highlighted.\n       *\n       * @internal\n       */\n      const shouldHighlightCurated = computed(\n        () => props.highlightCurated && (props.suggestion.isCurated ?? false)\n      );\n\n      return {\n        events,\n        shouldHighlightCurated\n      };\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Dynamic Classes\n\n`NextQuery` uses the following dynamic CSS classes so you can style it when is:\n\n- Curated: `x-next-query--is-curated`.\n\n## Events\n\nA list of events that the component will emit:\n\n- [`UserSelectedANextQuery`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button. The event payload is the next query data.\n\n## Examples\n\nThis components expects just a suggestion as a prop to be rendered. It has a slot to override the\ncontent. By default, it renders the suggestion query of the next query. It also has an optional\nprop, `highlightCurated`, to indicate if the curated Next Queries should be differentiated with a\nCSS class.\n\n### Basic Usage\n\nUsing default slot:\n\n```vue live\n<template>\n  <NextQuery :suggestion=\"suggestion\" />\n</template>\n\n<script>\n  import { NextQuery } from '@empathyco/x-components/next-queries';\n\n  export default {\n    name: 'NextQueryDemo',\n    components: {\n      NextQuery\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Overriding default slot.\n\nThe default slot allows you to replace the content of the suggestion button.\n\n```vue live\n<template>\n  <NextQuery :suggestion=\"suggestion\">\n    <template #default=\"{ suggestion }\">\n      <TrendingIcon />\n      <span class=\"x-next-query__query\" :aria-label=\"suggestion.query\">{{ suggestion.query }}</span>\n    </template>\n  </NextQuery>\n</template>\n\n<script>\n  import { NextQuery } from '@empathyco/x-components/next-queries';\n  import { TrendingIcon } from '@empathyco/x-components';\n\n  export default {\n    name: 'NextQueryDemo',\n    components: {\n      NextQuery,\n      TrendingIcon\n    },\n    data() {\n      return {\n        suggestion: {\n          modelName: 'NextQuery',\n          query: 'tshirt',\n          facets: []\n        }\n      };\n    }\n  };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;AA4BE;;;;;;AAME;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,WAAW;IACjB,OAAO,EAAE,kBAAkB,CAAC,IAAI;IAChC,UAAU,EAAE,EAAE,cAAa,EAAG;AAC9B,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,MAAkC;AACxC,YAAA,QAAQ,EAAE,IAAG;AACd,SAAA;AACD;;;;AAIE;AACF,QAAA,gBAAgB,EAAE;AAChB,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,OAAO,EAAE,KAAI;AACf,SAAA;AACD,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT;;;;;AAKE;AACF,QAAA,MAAM,MAAO,GAAE,QAAQ,CACrB,OAA8B,EAAE,sBAAsB,EAAE,KAAK,CAAC,YAAY,CAAA,CAC3E,CAAA;AAED;;;;;;AAME;QACF,MAAM,sBAAqB,GAAI,QAAQ,CACrC,MAAM,KAAK,CAAC,gBAAiB,KAAI,KAAK,CAAC,UAAU,CAAC,SAAQ,IAAK,KAAK,CAAA,CACrE,CAAA;QAED,OAAO;YACL,MAAM;YACN,sBAAqB;SACtB,CAAA;KACH;AACD,CAAA,CAAC;;;;"}
+{"version":3,"file":"next-query.vue2.js","sources":["../../../../../src/x-modules/next-queries/components/next-query.vue"],"sourcesContent":["<template>\n  <BaseSuggestion\n    v-slot=\"baseScope\"\n    class=\"x-next-query\"\n    :suggestion=\"suggestion\"\n    :suggestion-selected-events=\"events\"\n    data-test=\"next-query\"\n    feature=\"next_query\"\n    :class=\"{ 'x-next-query--is-curated': shouldHighlightCurated }\"\n  >\n    <!-- eslint-disable max-len -->\n    <!--\n        @slot Next Query content\n            @binding {Object} v-bind - `BaseSuggestion` default slot scope: **suggestion** <code>Suggestion</code> - Suggestion data<br /> **query** <code>string</code> - The query that the suggestion belongs to<br /> **filter** <code>Filter \\| undefined</code> - Suggestion's filter\n            @binding {boolean} shouldHighlightCurated - True if the curated NQ should be highlighted\n    -->\n    <!-- eslint-enable max-len -->\n    <slot v-bind=\"{ ...baseScope, shouldHighlightCurated }\" />\n  </BaseSuggestion>\n</template>\n\n<script lang=\"ts\">\nimport type { NextQuery as NextQueryModel } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport type { XEventsTypes } from '../../../wiring/events.types'\nimport { computed, defineComponent } from 'vue'\nimport BaseSuggestion from '../../../components/suggestions/base-suggestion.vue'\nimport { nextQueriesXModule } from '../x-module'\n\n/**\n * Renders a next query item which receives the suggestion that will be rendered as a prop. It\n * exposes a default slot to change the next query content. If the slot is not overridden,\n * it will render the suggestion query by default.\n *\n * @public\n */\nexport default defineComponent({\n  name: 'NextQuery',\n  xModule: nextQueriesXModule.name,\n  components: { BaseSuggestion },\n  props: {\n    /**\n     * The suggestion to render and use in the default slot.\n     *\n     * @public\n     */\n    suggestion: {\n      type: Object as PropType<NextQueryModel>,\n      required: true,\n    },\n    /**\n     * Indicates if the curated next query should be highlighted.\n     *\n     * @public\n     */\n    highlightCurated: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  setup(props) {\n    /**\n     * Events list which are going to be emitted when a next query is selected.\n     *\n     * @returns The {@link XEvent} to emit.\n     * @public\n     */\n    const events = computed(\n      (): Partial<XEventsTypes> => ({ UserSelectedANextQuery: props.suggestion }),\n    )\n\n    /**\n     * Checks if the next query is curated and if it should be highlighted.\n     *\n     * @returns True if the next query is curated and should be highlighted.\n     *\n     * @internal\n     */\n    const shouldHighlightCurated = computed(\n      () => props.highlightCurated && (props.suggestion.isCurated ?? false),\n    )\n\n    return {\n      events,\n      shouldHighlightCurated,\n    }\n  },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Dynamic Classes\n\n`NextQuery` uses the following dynamic CSS classes so you can style it when is:\n\n- Curated: `x-next-query--is-curated`.\n\n## Events\n\nA list of events that the component will emit:\n\n- [`UserSelectedANextQuery`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button. The event payload is the next query data.\n\n## Examples\n\nThis components expects just a suggestion as a prop to be rendered. It has a slot to override the\ncontent. By default, it renders the suggestion query of the next query. It also has an optional\nprop, `highlightCurated`, to indicate if the curated Next Queries should be differentiated with a\nCSS class.\n\n### Basic Usage\n\nUsing default slot:\n\n```vue live\n<template>\n  <NextQuery :suggestion=\"suggestion\" />\n</template>\n\n<script>\nimport { NextQuery } from '@empathyco/x-components/next-queries'\n\nexport default {\n  name: 'NextQueryDemo',\n  components: {\n    NextQuery,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n\n### Overriding default slot.\n\nThe default slot allows you to replace the content of the suggestion button.\n\n```vue live\n<template>\n  <NextQuery :suggestion=\"suggestion\">\n    <template #default=\"{ suggestion }\">\n      <TrendingIcon />\n      <span class=\"x-next-query__query\" :aria-label=\"suggestion.query\">{{ suggestion.query }}</span>\n    </template>\n  </NextQuery>\n</template>\n\n<script>\nimport { NextQuery } from '@empathyco/x-components/next-queries'\nimport { TrendingIcon } from '@empathyco/x-components'\n\nexport default {\n  name: 'NextQueryDemo',\n  components: {\n    NextQuery,\n    TrendingIcon,\n  },\n  data() {\n    return {\n      suggestion: {\n        modelName: 'NextQuery',\n        query: 'tshirt',\n        facets: [],\n      },\n    }\n  },\n}\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;AA6BA;;;;;;AAME;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,WAAW;IACjB,OAAO,EAAE,kBAAkB,CAAC,IAAI;IAChC,UAAU,EAAE,EAAE,cAAa,EAAG;AAC9B,IAAA,KAAK,EAAE;AACL;;;;AAIE;AACF,QAAA,UAAU,EAAE;AACV,YAAA,IAAI,EAAE,MAAkC;AACxC,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA;AACD;;;;AAIE;AACF,QAAA,gBAAgB,EAAE;AAChB,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,OAAO,EAAE,KAAK;AACf,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT;;;;;AAKE;AACF,QAAA,MAAM,MAAO,GAAE,QAAQ,CACrB,OAA8B,EAAE,sBAAsB,EAAE,KAAK,CAAC,UAAS,EAAG,CAAC,CAC7E,CAAA;AAEA;;;;;;AAME;QACF,MAAM,sBAAqB,GAAI,QAAQ,CACrC,MAAM,KAAK,CAAC,gBAAiB,KAAI,KAAK,CAAC,UAAU,CAAC,SAAQ,IAAK,KAAK,CAAC,CACvE,CAAA;QAEA,OAAO;YACL,MAAM;YACN,sBAAsB;SACxB,CAAA;KACD;AACF,CAAA,CAAA;;;;"}

package/js/x-modules/next-queries/store/actions/fetch-and-save-next-queries.action.js

@@ -1,27 +1,26 @@
 import { createFetchAndSaveActions } from '../../../../store/utils/fetch-and-save-action.utils.js';
 
-// eslint-disable-next-line max-len
-const { fetchAndSave, cancelPrevious } = createFetchAndSaveActions({
-    fetch({ dispatch }, request) {
-        return dispatch('fetchNextQueries', request);
-    },
-    onSuccess({ commit }, nextQueries) {
-        if (nextQueries) {
-            commit('setNextQueries', nextQueries);
-        }
-    }
-});
-/**
- * Default implementation for {@link NextQueriesActions.fetchAndSaveNextQueries} action.
- *
- * @public
- */
-const fetchAndSaveNextQueries = fetchAndSave;
-/**
- * Default implementation for {@link NextQueriesActions.cancelFetchAndSaveNextQueries} action.
- *
- * @public
- */
+const { fetchAndSave, cancelPrevious } = createFetchAndSaveActions({
+    async fetch({ dispatch }, request) {
+        return dispatch('fetchNextQueries', request);
+    },
+    onSuccess({ commit }, nextQueries) {
+        if (nextQueries) {
+            commit('setNextQueries', nextQueries);
+        }
+    },
+});
+/**
+ * Default implementation for {@link NextQueriesActions.fetchAndSaveNextQueries} action.
+ *
+ * @public
+ */
+const fetchAndSaveNextQueries = fetchAndSave;
+/**
+ * Default implementation for {@link NextQueriesActions.cancelFetchAndSaveNextQueries} action.
+ *
+ * @public
+ */
 const cancelFetchAndSaveNextQueries = cancelPrevious;
 
 export { cancelFetchAndSaveNextQueries, fetchAndSaveNextQueries };

package/js/x-modules/next-queries/store/actions/fetch-and-save-next-queries.action.js.map

@@ -1 +1 @@
-{"version":3,"file":"fetch-and-save-next-queries.action.js","sources":["../../../../../../src/x-modules/next-queries/store/actions/fetch-and-save-next-queries.action.ts"],"sourcesContent":["import { NextQuery, NextQueriesRequest } from '@empathyco/x-types';\n// eslint-disable-next-line max-len\nimport { createFetchAndSaveActions } from '../../../../store/utils/fetch-and-save-action.utils';\nimport { NextQueriesActionContext } from '../types';\n\nconst { fetchAndSave, cancelPrevious } = createFetchAndSaveActions<\n  NextQueriesActionContext,\n  NextQueriesRequest | null,\n  NextQuery[] | null\n>({\n  fetch({ dispatch }, request) {\n    return dispatch('fetchNextQueries', request);\n  },\n  onSuccess({ commit }, nextQueries) {\n    if (nextQueries) {\n      commit('setNextQueries', nextQueries);\n    }\n  }\n});\n\n/**\n * Default implementation for {@link NextQueriesActions.fetchAndSaveNextQueries} action.\n *\n * @public\n */\nexport const fetchAndSaveNextQueries = fetchAndSave;\n\n/**\n * Default implementation for {@link NextQueriesActions.cancelFetchAndSaveNextQueries} action.\n *\n * @public\n */\nexport const cancelFetchAndSaveNextQueries = cancelPrevious;\n"],"names":[],"mappings":";;AACA;AAIA,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,yBAAyB,CAIhE;AACA,IAAA,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAA;AACzB,QAAA,OAAO,QAAQ,CAAC,kBAAkB,EAAE,OAAO,CAAC,CAAC;KAC9C;AACD,IAAA,SAAS,CAAC,EAAE,MAAM,EAAE,EAAE,WAAW,EAAA;AAC/B,QAAA,IAAI,WAAW,EAAE;AACf,YAAA,MAAM,CAAC,gBAAgB,EAAE,WAAW,CAAC,CAAC;AACvC,SAAA;KACF;AACF,CAAA,CAAC,CAAC;AAEH;;;;AAIG;AACI,MAAM,uBAAuB,GAAG,aAAa;AAEpD;;;;AAIG;AACI,MAAM,6BAA6B,GAAG;;;;"}
+{"version":3,"file":"fetch-and-save-next-queries.action.js","sources":["../../../../../../src/x-modules/next-queries/store/actions/fetch-and-save-next-queries.action.ts"],"sourcesContent":["import type { NextQueriesRequest, NextQuery } from '@empathyco/x-types'\n\nimport type { NextQueriesActionContext } from '../types'\nimport { createFetchAndSaveActions } from '../../../../store/utils/fetch-and-save-action.utils'\n\nconst { fetchAndSave, cancelPrevious } = createFetchAndSaveActions<\n  NextQueriesActionContext,\n  NextQueriesRequest | null,\n  NextQuery[] | null\n>({\n  async fetch({ dispatch }, request) {\n    return dispatch('fetchNextQueries', request)\n  },\n  onSuccess({ commit }, nextQueries) {\n    if (nextQueries) {\n      commit('setNextQueries', nextQueries)\n    }\n  },\n})\n\n/**\n * Default implementation for {@link NextQueriesActions.fetchAndSaveNextQueries} action.\n *\n * @public\n */\nexport const fetchAndSaveNextQueries = fetchAndSave\n\n/**\n * Default implementation for {@link NextQueriesActions.cancelFetchAndSaveNextQueries} action.\n *\n * @public\n */\nexport const cancelFetchAndSaveNextQueries = cancelPrevious\n"],"names":[],"mappings":";;AAKA,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,yBAAyB,CAIhE;AACA,IAAA,MAAM,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAA;AAC/B,QAAA,OAAO,QAAQ,CAAC,kBAAkB,EAAE,OAAO,CAAC,CAAA;KAC7C;AACD,IAAA,SAAS,CAAC,EAAE,MAAM,EAAE,EAAE,WAAW,EAAA;QAC/B,IAAI,WAAW,EAAE;AACf,YAAA,MAAM,CAAC,gBAAgB,EAAE,WAAW,CAAC,CAAA;SACtC;KACF;AACF,CAAA,CAAC,CAAA;AAEF;;;;AAIG;AACI,MAAM,uBAAuB,GAAG,aAAY;AAEnD;;;;AAIG;AACI,MAAM,6BAA6B,GAAG;;;;"}

package/js/x-modules/next-queries/store/actions/fetch-and-save-next-query-preview.action.js

@@ -1,21 +1,19 @@
-// eslint-disable-next-line max-len
-const fetchAndSaveNextQueryPreview = ({ dispatch, commit }, { query, location }) => {
-    return dispatch('fetchNextQueryPreview', { query, location })
-        .then(response => {
-        if (response) {
-            commit('setResultsPreview', {
-                [query]: {
-                    query,
-                    totalResults: response.totalResults,
-                    items: response.results
-                }
-            });
-        }
-    })
-        .catch(error => {
-        // eslint-disable-next-line no-console
-        console.error(error);
-    });
+const fetchAndSaveNextQueryPreview = async ({ dispatch, commit }, { query, location }) => {
+    return dispatch('fetchNextQueryPreview', { query, location })
+        .then(response => {
+        if (response) {
+            commit('setResultsPreview', {
+                [query]: {
+                    query,
+                    totalResults: response.totalResults,
+                    items: response.results,
+                },
+            });
+        }
+    })
+        .catch(error => {
+        console.error(error);
+    });
 };
 
 export { fetchAndSaveNextQueryPreview };

package/js/x-modules/next-queries/store/actions/fetch-and-save-next-query-preview.action.js.map

@@ -1 +1 @@
-{"version":3,"file":"fetch-and-save-next-query-preview.action.js","sources":["../../../../../../src/x-modules/next-queries/store/actions/fetch-and-save-next-query-preview.action.ts"],"sourcesContent":["import { NextQueriesXStoreModule } from '../types';\n\n// eslint-disable-next-line max-len\nexport const fetchAndSaveNextQueryPreview: NextQueriesXStoreModule['actions']['fetchAndSaveNextQueryPreview'] =\n  ({ dispatch, commit }, { query, location }) => {\n    return dispatch('fetchNextQueryPreview', { query, location })\n      .then(response => {\n        if (response) {\n          commit('setResultsPreview', {\n            [query]: {\n              query,\n              totalResults: response.totalResults,\n              items: response.results\n            }\n          });\n        }\n      })\n      .catch(error => {\n        // eslint-disable-next-line no-console\n        console.error(error);\n      });\n  };\n"],"names":[],"mappings":"AAEA;AACa,MAAA,4BAA4B,GACvC,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAI;IAC5C,OAAO,QAAQ,CAAC,uBAAuB,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;SAC1D,IAAI,CAAC,QAAQ,IAAG;AACf,QAAA,IAAI,QAAQ,EAAE;YACZ,MAAM,CAAC,mBAAmB,EAAE;gBAC1B,CAAC,KAAK,GAAG;oBACP,KAAK;oBACL,YAAY,EAAE,QAAQ,CAAC,YAAY;oBACnC,KAAK,EAAE,QAAQ,CAAC,OAAO;AACxB,iBAAA;AACF,aAAA,CAAC,CAAC;AACJ,SAAA;AACH,KAAC,CAAC;SACD,KAAK,CAAC,KAAK,IAAG;;AAEb,QAAA,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;AACvB,KAAC,CAAC,CAAC;AACP;;;;"}
+{"version":3,"file":"fetch-and-save-next-query-preview.action.js","sources":["../../../../../../src/x-modules/next-queries/store/actions/fetch-and-save-next-query-preview.action.ts"],"sourcesContent":["import type { NextQueriesXStoreModule } from '../types'\n\nexport const fetchAndSaveNextQueryPreview: NextQueriesXStoreModule['actions']['fetchAndSaveNextQueryPreview'] =\n  async ({ dispatch, commit }, { query, location }) => {\n    return dispatch('fetchNextQueryPreview', { query, location })\n      .then(response => {\n        if (response) {\n          commit('setResultsPreview', {\n            [query]: {\n              query,\n              totalResults: response.totalResults,\n              items: response.results,\n            },\n          })\n        }\n      })\n      .catch(error => {\n        console.error(error)\n      })\n  }\n"],"names":[],"mappings":"AAEa,MAAA,4BAA4B,GACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAI;IAClD,OAAO,QAAQ,CAAC,uBAAuB,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;SAC1D,IAAI,CAAC,QAAQ,IAAG;QACf,IAAI,QAAQ,EAAE;YACZ,MAAM,CAAC,mBAAmB,EAAE;gBAC1B,CAAC,KAAK,GAAG;oBACP,KAAK;oBACL,YAAY,EAAE,QAAQ,CAAC,YAAY;oBACnC,KAAK,EAAE,QAAQ,CAAC,OAAO;AACxB,iBAAA;AACF,aAAA,CAAC,CAAA;SACH;AACH,KAAC,CAAC;SACD,KAAK,CAAC,KAAK,IAAG;AACb,QAAA,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;AACtB,KAAC,CAAC,CAAA;AACN;;;;"}

package/js/x-modules/next-queries/store/actions/fetch-next-queries.action.js

@@ -1,20 +1,20 @@
 import { XPlugin } from '../../../../plugins/x-plugin.js';
 
-/**
- * Default implementation for the {@link NextQueriesActions.fetchNextQueries}.
- *
- * @param _context - The {@link https://vuex.vuejs.org/guide/actions.html | context} of the actions,
- * provided by Vuex.
- * @param request - The next queries request to make.
- * @returns A Promise of NextQuery[] that resolves when it fetches next queries or `null`
- * if the request was not made.
- *
- * @public
- */
-const fetchNextQueries = (_context, request) => {
-    return request
-        ? XPlugin.adapter.nextQueries(request).then(({ nextQueries }) => nextQueries)
-        : null;
+/**
+ * Default implementation for the {@link NextQueriesActions.fetchNextQueries}.
+ *
+ * @param _context - The {@link https://vuex.vuejs.org/guide/actions.html | context} of the actions,
+ * provided by Vuex.
+ * @param request - The next queries request to make.
+ * @returns A Promise of NextQuery[] that resolves when it fetches next queries or `null`
+ * if the request was not made.
+ *
+ * @public
+ */
+const fetchNextQueries = async (_context, request) => {
+    return request
+        ? XPlugin.adapter.nextQueries(request).then(({ nextQueries }) => nextQueries)
+        : null;
 };
 
 export { fetchNextQueries };