@empathyco/x-components 3.0.0-alpha.159 → 3.0.0-alpha.161

package/js/components/result/result-variant-selector.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"result-variant-selector.vue.js","sources":["../../../../src/components/result/result-variant-selector.vue"],"sourcesContent":["<template>\n  <NoElement v-if=\"result && variants\">\n    <!--\n      @slot Variants list\n        @binding {ResultVariant[]} variants - Array containing the available variants\n        @binding {ResultVariant | undefined} selectedVariant - The selected variant\n        @binding {(variant: ResultVariant) => void} selectVariant - Callback to select a variant\n    -->\n    <slot :variants=\"variants\" :selectedVariant=\"selectedVariant\" :selectVariant=\"selectVariant\">\n      <ul class=\"x-list x-result-variant-selector__list\" data-test=\"variants-list\">\n        <li\n          v-for=\"(variant, index) in variants\"\n          :key=\"index\"\n          class=\"x-result-variant-selector__item\"\n          :class=\"{ 'x-result-variant-selector__item--is-selected': variantIsSelected(variant) }\"\n          data-test=\"variant-item\"\n        >\n          <!--\n            @slot Variant item\n              @binding {ResultVariant} variant - The variant item\n              @binding {boolean} isSelected - Indicates if the variant is selected\n              @binding {() => void} selectVariant - Callback to select the variant\n          -->\n          <slot\n            name=\"variant\"\n            :variant=\"variant\"\n            :isSelected=\"variantIsSelected(variant)\"\n            :selectVariant=\"() => selectVariant(variant)\"\n          >\n            <button @click=\"selectVariant(variant)\" data-test=\"variant-button\" class=\"x-button\">\n              <!--\n                @slot Variant content\n                  @binding {ResultVariant} variant - The variant item\n                  @binding {boolean} isSelected - Indicates if the variant is selected\n              -->\n              <slot\n                name=\"variant-content\"\n                :variant=\"variant\"\n                :isSelected=\"variantIsSelected(variant)\"\n              >\n                {{ variant }}\n              </slot>\n            </button>\n          </slot>\n        </li>\n      </ul>\n    </slot>\n  </NoElement>\n</template>\n\n<script lang=\"ts\">\n  import Vue from 'vue';\n  import { Component, Prop } from 'vue-property-decorator';\n  import { Result, ResultVariant } from '@empathyco/x-types';\n  import { NoElement } from '../no-element';\n  import { XInject } from '../decorators/injection.decorators';\n  import {\n    RESULT_WITH_VARIANTS_KEY,\n    SELECTED_VARIANTS_KEY,\n    SELECT_RESULT_VARIANT_KEY\n  } from '../decorators/injection.consts';\n\n  /**\n   * Component to show and select the available variants of a product for a given nest level.\n   * TODO: Add logger warning on mount when result is not injected.\n   *\n   * @public\n   */\n  @Component({\n    components: {\n      NoElement\n    }\n  })\n  export default class ResultVariantSelector extends Vue {\n    /**\n     * Callback to be called when a variant is selected.\n     *\n     * @public\n     */\n    @XInject(SELECT_RESULT_VARIANT_KEY)\n    public selectResultVariant!: (variant: ResultVariant, level?: number) => void;\n\n    /**\n     * The original result, used to retrieve the available variants for the level.\n     *\n     * @public\n     */\n    @XInject(RESULT_WITH_VARIANTS_KEY)\n    public result!: Result;\n\n    /**\n     * Array containing the selected variants.\n     *\n     * @public\n     */\n    @XInject(SELECTED_VARIANTS_KEY)\n    public selectedVariants!: ResultVariant[];\n\n    /**\n     * The nest level of the variants to be rendered.\n     *\n     * @public\n     */\n    @Prop({\n      default: 0\n    })\n    public level!: number;\n\n    /**\n     * It retrieves the available variants from the result.\n     *\n     * @returns - The variants of the result for the current level.\n     * @internal\n     */\n    protected get variants(): ResultVariant[] | undefined {\n      if (this.level === 0) {\n        return this.result.variants;\n      }\n      return this.selectedVariants[this.level - 1]?.variants;\n    }\n\n    /**\n     * Gets the selected variant of the current level.\n     *\n     * @returns - The selected variant.\n     * @internal\n     */\n    protected get selectedVariant(): ResultVariant | undefined {\n      return this.variants?.find(variant => variant === this.selectedVariants[this.level]);\n    }\n\n    /**\n     * Calls the provided method to select a variant.\n     *\n     * @param variant - Variant to select.\n     * @internal\n     */\n    protected selectVariant(variant: ResultVariant): void {\n      this.selectResultVariant(variant, this.level);\n    }\n\n    /**\n     * Checks if a variant is selected.\n     *\n     * @param variant - Variant to check.\n     * @returns True if the variant is selected, false if not.\n     * @internal\n     */\n    protected variantIsSelected(variant: ResultVariant): boolean {\n      return this.selectedVariant === variant;\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\nHere you have a basic example of how the `ResultVariantSelector` component is rendered.\n\nTake into account that this component **must** be a child of a `ResultVariantsProvider` component.\n\nAlso, the component is intended to be used overwriting the content with the slots.\n\nBy default it will render a list of buttons containing the available variants.\n\nThis component only has a required `level` prop, that indicates the level of the variants to be\nrendered.\n\n```vue\n<template>\n  <ResultVariantsProvider :result=\"result\" #default=\"{ result }\">\n    <p>Result name: {{ result.name }}</p>\n\n    <h1>Select color</h1>\n    <ResultVariantSelector :level=\"0\" #variant=\"{ variant, selectVariant }\" />\n\n    <h1>Select size</h1>\n    <ResultVariantSelector :level=\"1\" #variant=\"{ variant, selectVariant }\" />\n  </ResultVariantsProvider>\n</template>\n\n<script>\n  import { ResultVariantsProvider, ResultVariantSelector } from '@empathyco/x-components';\n\n  export default {\n    name: 'ResultVariantSelectorDemo',\n    components: {\n      ResultVariantsProvider,\n      ResultVariantSelector\n    },\n    data() {\n      return {\n        result: {\n          id: 'jacket',\n          modelName: 'Result',\n          type: 'Product',\n          isWishlisted: false,\n          identifier: { value: 'jacket' },\n          images: [],\n          name: 'jacket',\n          price: { hasDiscount: false, originalValue: 10, value: 10 },\n          url: '/products/jacket',\n          variants: [\n            {\n              name: 'red',\n              variants: [\n                {\n                  name: 'red XL'\n                },\n                {\n                  name: 'red L'\n                }\n              ]\n            },\n            {\n              name: 'blue',\n              variants: [\n                {\n                  name: 'blue S'\n                },\n                {\n                  name: 'blue M'\n                },\n                {\n                  name: 'blue L'\n                }\n              ]\n            }\n          ]\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with the default slot\n\nIn this example the default slot is used to customize the list.\n\n```vue\n<template>\n  <ResultVariantsProvider :result=\"result\" #default=\"{ result }\">\n    <p>Result name: {{ result.name }}</p>\n\n    <ResultVariantSelector :level=\"0\" #default=\"{ variants, selectedVariant, selectVariant }\">\n      <div>\n        <p v-if=\"selectedVariant\">Selected variant: {{ selectedVariant.name }}</p>\n        <ul class=\"x-list x-list--horizontal\">\n          <li v-for=\"(variant, index) in variants\" :key=\"index\">\n            <button @click=\"selectVariant(variant)\">{{ variant.name }}</button>\n          </li>\n        </ul>\n      </div>\n    </ResultVariantSelector>\n  </ResultVariantsProvider>\n</template>\n\n<script>\n  import { ResultVariantsProvider, ResultVariantSelector } from '@empathyco/x-components';\n\n  export default {\n    name: 'ResultVariantSelectorDemo',\n    components: {\n      ResultVariantsProvider,\n      ResultVariantSelector\n    },\n    data() {\n      return {\n        result: {\n          id: 'jacket',\n          modelName: 'Result',\n          type: 'Product',\n          isWishlisted: false,\n          identifier: { value: 'jacket' },\n          images: [],\n          name: 'jacket',\n          price: { hasDiscount: false, originalValue: 10, value: 10 },\n          url: '/products/jacket',\n          variants: [\n            {\n              name: 'red'\n            },\n            {\n              name: 'blue'\n            }\n          ]\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with variant-slot\n\nIn this example the variant-slot is used to customize the variant item.\n\nThe variant will be rendered inside a list.\n\n```vue\n<template>\n  <ResultVariantsProvider :result=\"result\" #default=\"{ result }\">\n    <p>Result name: {{ result.name }}</p>\n\n    <ResultVariantSelector :level=\"0\" #variant=\"{ variant, isSelected, selectVariant }\">\n      <div>\n        <button @click=\"selectVariant\">\n          {{ variant.name }}\n          <span v-if=\"isSelected\">SELECTED!</span>\n        </button>\n      </div>\n    </ResultVariantSelector>\n  </ResultVariantsProvider>\n</template>\n\n<script>\n  import { ResultVariantsProvider, ResultVariantSelector } from '@empathyco/x-components';\n\n  export default {\n    name: 'ResultVariantSelectorDemo',\n    components: {\n      ResultVariantsProvider,\n      ResultVariantSelector\n    },\n    data() {\n      return {\n        result: {\n          id: 'jacket',\n          modelName: 'Result',\n          type: 'Product',\n          isWishlisted: false,\n          identifier: { value: 'jacket' },\n          images: [],\n          name: 'jacket',\n          price: { hasDiscount: false, originalValue: 10, value: 10 },\n          url: '/products/jacket',\n          variants: [\n            {\n              name: 'red'\n            },\n            {\n              name: 'blue'\n            }\n          ]\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with variant-content slot\n\nIn this example the variant-content slot is used to customize the content of the default variant\nbutton.\n\n```vue\n<template>\n  <ResultVariantsProvider :result=\"result\" #default=\"{ result }\">\n    <p>Result name: {{ result.name }}</p>\n\n    <ResultVariantSelector #variant-content=\"{ variant, isSelected }\">\n      <div>\n        {{ variant.name }}\n        <span v-if=\"isSelected\">SELECTED!</span>\n      </div>\n    </ResultVariantSelector>\n  </ResultVariantsProvider>\n</template>\n\n<script>\n  import { ResultVariantsProvider, ResultVariantSelector } from '@empathyco/x-components';\n\n  export default {\n    name: 'ResultVariantSelectorDemo',\n    components: {\n      ResultVariantsProvider,\n      ResultVariantSelector\n    },\n    data() {\n      return {\n        result: {\n          id: 'jacket',\n          modelName: 'Result',\n          type: 'Product',\n          isWishlisted: false,\n          identifier: { value: 'jacket' },\n          images: [],\n          name: 'jacket',\n          price: { hasDiscount: false, originalValue: 10, value: 10 },\n          url: '/products/jacket',\n          variants: [\n            {\n              name: 'red'\n            },\n            {\n              name: 'blue'\n            }\n          ]\n        }\n      };\n    }\n  };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/js/components/result/result-variant-selector.vue_rollup-plugin-vue_script.vue.js

@@ -0,0 +1,80 @@
+import { __decorate } from 'tslib';
+import Vue from 'vue';
+import { Prop, Component } from 'vue-property-decorator';
+import { NoElement } from '../no-element.js';
+import { XInject } from '../decorators/injection.decorators.js';
+import { SELECT_RESULT_VARIANT_KEY, RESULT_WITH_VARIANTS_KEY, SELECTED_VARIANTS_KEY } from '../decorators/injection.consts.js';
+
+/**
+ * Component to show and select the available variants of a product for a given nest level.
+ * TODO: Add logger warning on mount when result is not injected.
+ *
+ * @public
+ */
+let ResultVariantSelector = class ResultVariantSelector extends Vue {
+    /**
+     * It retrieves the available variants from the result.
+     *
+     * @returns - The variants of the result for the current level.
+     * @internal
+     */
+    get variants() {
+        if (this.level === 0) {
+            return this.result.variants;
+        }
+        return this.selectedVariants[this.level - 1]?.variants;
+    }
+    /**
+     * Gets the selected variant of the current level.
+     *
+     * @returns - The selected variant.
+     * @internal
+     */
+    get selectedVariant() {
+        return this.variants?.find(variant => variant === this.selectedVariants[this.level]);
+    }
+    /**
+     * Calls the provided method to select a variant.
+     *
+     * @param variant - Variant to select.
+     * @internal
+     */
+    selectVariant(variant) {
+        this.selectResultVariant(variant, this.level);
+    }
+    /**
+     * Checks if a variant is selected.
+     *
+     * @param variant - Variant to check.
+     * @returns True if the variant is selected, false if not.
+     * @internal
+     */
+    variantIsSelected(variant) {
+        return this.selectedVariant === variant;
+    }
+};
+__decorate([
+    XInject(SELECT_RESULT_VARIANT_KEY)
+], ResultVariantSelector.prototype, "selectResultVariant", void 0);
+__decorate([
+    XInject(RESULT_WITH_VARIANTS_KEY)
+], ResultVariantSelector.prototype, "result", void 0);
+__decorate([
+    XInject(SELECTED_VARIANTS_KEY)
+], ResultVariantSelector.prototype, "selectedVariants", void 0);
+__decorate([
+    Prop({
+        default: 0
+    })
+], ResultVariantSelector.prototype, "level", void 0);
+ResultVariantSelector = __decorate([
+    Component({
+        components: {
+            NoElement
+        }
+    })
+], ResultVariantSelector);
+var script = ResultVariantSelector;
+
+export { script as default };
+//# sourceMappingURL=result-variant-selector.vue_rollup-plugin-vue_script.vue.js.map

package/js/components/result/result-variant-selector.vue_rollup-plugin-vue_script.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"result-variant-selector.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../src/components/result/result-variant-selector.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { Result, ResultVariant } from '@empathyco/x-types';\nimport { NoElement } from '../no-element';\nimport { XInject } from '../decorators/injection.decorators';\nimport {\n  RESULT_WITH_VARIANTS_KEY,\n  SELECTED_VARIANTS_KEY,\n  SELECT_RESULT_VARIANT_KEY\n} from '../decorators/injection.consts';\n\n/**\n * Component to show and select the available variants of a product for a given nest level.\n * TODO: Add logger warning on mount when result is not injected.\n *\n * @public\n */\n@Component({\n  components: {\n    NoElement\n  }\n})\nexport default class ResultVariantSelector extends Vue {\n  /**\n   * Callback to be called when a variant is selected.\n   *\n   * @public\n   */\n  @XInject(SELECT_RESULT_VARIANT_KEY)\n  public selectResultVariant!: (variant: ResultVariant, level?: number) => void;\n\n  /**\n   * The original result, used to retrieve the available variants for the level.\n   *\n   * @public\n   */\n  @XInject(RESULT_WITH_VARIANTS_KEY)\n  public result!: Result;\n\n  /**\n   * Array containing the selected variants.\n   *\n   * @public\n   */\n  @XInject(SELECTED_VARIANTS_KEY)\n  public selectedVariants!: ResultVariant[];\n\n  /**\n   * The nest level of the variants to be rendered.\n   *\n   * @public\n   */\n  @Prop({\n    default: 0\n  })\n  public level!: number;\n\n  /**\n   * It retrieves the available variants from the result.\n   *\n   * @returns - The variants of the result for the current level.\n   * @internal\n   */\n  protected get variants(): ResultVariant[] | undefined {\n    if (this.level === 0) {\n      return this.result.variants;\n    }\n    return this.selectedVariants[this.level - 1]?.variants;\n  }\n\n  /**\n   * Gets the selected variant of the current level.\n   *\n   * @returns - The selected variant.\n   * @internal\n   */\n  protected get selectedVariant(): ResultVariant | undefined {\n    return this.variants?.find(variant => variant === this.selectedVariants[this.level]);\n  }\n\n  /**\n   * Calls the provided method to select a variant.\n   *\n   * @param variant - Variant to select.\n   * @internal\n   */\n  protected selectVariant(variant: ResultVariant): void {\n    this.selectResultVariant(variant, this.level);\n  }\n\n  /**\n   * Checks if a variant is selected.\n   *\n   * @param variant - Variant to check.\n   * @returns True if the variant is selected, false if not.\n   * @internal\n   */\n  protected variantIsSelected(variant: ResultVariant): boolean {\n    return this.selectedVariant === variant;\n  }\n}\n"],"names":[],"mappings":";;;;;;;AA8DA;;;;;;AAWA,IAAqB,qBAAqB,GAA1C,MAAqB,qBAAsB,SAAQ,GAAG;;;;;;;IAyCpD,IAAc,QAAQ;QACpB,IAAI,IAAI,CAAC,KAAK,KAAK,CAAC,EAAE;YACpB,OAAO,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC;SAC7B;QACD,OAAO,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC;KACxD;;;;;;;IAQD,IAAc,eAAe;QAC3B,OAAO,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,IAAI,OAAO,KAAK,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;KACtF;;;;;;;IAQS,aAAa,CAAC,OAAsB;QAC5C,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;KAC/C;;;;;;;;IASS,iBAAiB,CAAC,OAAsB;QAChD,OAAO,IAAI,CAAC,eAAe,KAAK,OAAO,CAAC;KACzC;CACF,CAAA;AAvEC;IADC,OAAO,CAAC,yBAAyB,CAAC;kEAC2C;AAQ9E;IADC,OAAO,CAAC,wBAAwB,CAAC;qDACX;AAQvB;IADC,OAAO,CAAC,qBAAqB,CAAC;+DACW;AAU1C;IAHC,IAAI,CAAC;QACJ,OAAO,EAAE,CAAC;KACX,CAAC;oDACoB;AAjCH,qBAAqB;IALzC,SAAS,CAAC;QACT,UAAU,EAAE;YACV,SAAS;SACV;KACF,CAAC;GACmB,qBAAqB,CA8EzC;aA9EoB,qBAAqB;;;;"}

package/js/components/result/result-variants-provider.vue.js

@@ -0,0 +1,39 @@
+import script from './result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.mjs';
+
+/* script */
+const __vue_script__ = script;
+
+/* template */
+
+  /* style */
+  const __vue_inject_styles__ = undefined;
+  /* scoped */
+  const __vue_scope_id__ = undefined;
+  /* module identifier */
+  const __vue_module_identifier__ = undefined;
+  /* functional template */
+  const __vue_is_functional_template__ = undefined;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
+
+  
+  const __vue_component__ = /*#__PURE__*/__vue_normalize__(
+    {},
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );
+
+export { __vue_component__ as default };
+//# sourceMappingURL=result-variants-provider.vue.js.map

package/js/components/result/result-variants-provider.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"result-variants-provider.vue.js","sources":["../../../../src/components/result/result-variants-provider.vue"],"sourcesContent":["<script lang=\"ts\">\n  import Vue, { VNode, CreateElement } from 'vue';\n  import { Component, Prop, Watch } from 'vue-property-decorator';\n  import { Result, ResultVariant } from '@empathyco/x-types';\n  import { XProvide } from '../decorators/injection.decorators';\n  import {\n    RESULT_WITH_VARIANTS_KEY,\n    SELECTED_VARIANTS_KEY,\n    SELECT_RESULT_VARIANT_KEY\n  } from '../decorators/injection.consts';\n\n  /**\n   * Component that exposes the result merged with its selected variant in the default slot.\n   *\n   * It receives the original result and keeps track of the selected variant.\n   *\n   * It provides the original result, the array containing the selected variants and a callback to\n   * set the selected variant to be used from a child.\n   *\n   * @public\n   */\n  @Component\n  export default class ResultVariantsProvider extends Vue {\n    /**\n     * The original result containing the variants.\n     *\n     * @public\n     */\n    @Prop({\n      required: true\n    })\n    @XProvide(RESULT_WITH_VARIANTS_KEY)\n    public result!: Result;\n\n    /**\n     * The provider by default will auto select the first variants of all levels.\n     * This prop allows to limit the number of variants auto selected when the provider is created.\n     * Take into account that the depth will be the variants level + 1, so, setting autoSelectDepth\n     * to 0 will not select any variant, setting it to 1 will select only the first variant of the\n     * first level, and so on.\n     */\n    @Prop({\n      default: Number.POSITIVE_INFINITY\n    })\n    public autoSelectDepth!: number;\n\n    /**\n     * Array to keep track of the selected variants of the result.\n     * Each position of the array is a nest level in the variants' hierarchy, so,\n     * the second position will contain a variant that is present inside the variant of the first\n     * position, and so on.\n     *\n     * @public\n     */\n    @XProvide(SELECTED_VARIANTS_KEY)\n    public selectedVariants: ResultVariant[] = [];\n\n    /**\n     * Selects a variant of the result.\n     * When called, it slices the array of selected variants to remove the selected child variants.\n     * Emits the {@link XEventsTypes.UserSelectedAResultVariant} when called.\n     *\n     * @param variant - The variant to set.\n     * @param level - The nest level where the variant is placed inside the result.\n     * @public\n     */\n    @XProvide(SELECT_RESULT_VARIANT_KEY)\n    selectResultVariant(variant: ResultVariant, level = 0): void {\n      if (this.selectedVariants[level] === variant) {\n        return;\n      }\n      this.selectedVariants.splice(level, Number.POSITIVE_INFINITY, variant);\n      this.$x.emit('UserSelectedAResultVariant', {\n        variant,\n        level,\n        result: this.result\n      });\n    }\n\n    /**\n     * Render function of the provider.\n     * It exposes the result with the selected variant merged.\n     *\n     * @param createElement - Vue createElement method.\n     * @returns - The VNode of the first element passed in the slot.\n     * @public\n     */\n    render(createElement: CreateElement): VNode {\n      return (\n        this.$scopedSlots.default?.({\n          result: this.resultToProvide\n        })?.[0] ?? createElement()\n      );\n    }\n\n    /**\n     * Resets the selected variants when the result changes.\n     * That includes doing the auto selection of the variants when the component is created\n     * and when the result is changed.\n     */\n    @Watch('result', { immediate: true })\n    resetSelectedVariants(): void {\n      this.selectedVariants = [];\n      this.selectFirstVariants(this.result?.variants?.[0]);\n    }\n\n    /**\n     * Merges the original result with the selected variant.\n     * The merge is done with all the selected variants of the array.\n     *\n     * @returns - The result with the selected variant merged.\n     * @public\n     */\n    public get resultToProvide(): Result {\n      if (!this.selectedVariants.length) {\n        return this.result;\n      }\n      const mergedResult = this.selectedVariants.reduce<Result>((result, variant) => {\n        return {\n          ...result,\n          ...variant\n        };\n      }, this.result);\n      mergedResult.variants = this.result.variants;\n      return mergedResult;\n    }\n\n    /**\n     * Adds to the selectedVariants array the variants up to the autoSelectDepth level.\n     *\n     * @param variant - Variant to add to the array.\n     */\n    selectFirstVariants(variant?: ResultVariant): void {\n      if (!!variant && this.selectedVariants.length <= this.autoSelectDepth - 1) {\n        this.selectedVariants.push(variant);\n        this.selectFirstVariants(variant.variants?.[0]);\n      }\n    }\n  }\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n[`UserSelectedAResultVariant`](./../../api/x-components.userselectedaresultvariant.md).\n\n## See it in action\n\nThis component is intended to be used in conjunction with the `ResultVariantSelector` component.\n\nThe result exposed in the default slot will contain the data of the selected variant.\n\nBy default, the first variants of all the levels will be selected when the component is rendered.\n\n```vue\n<template>\n  <ResultVariantsProvider :result=\"result\" #default=\"{ result }\">\n    <p>Result name: {{ result.name }}</p>\n\n    <h1>Select color</h1>\n    <ResultVariantSelector :level=\"0\" #variant=\"{ variant, selectVariant }\">\n      <button @click=\"selectVariant\">{{ variant.name }}</button>\n    </ResultVariantSelector>\n\n    <h1>Select size</h1>\n    <ResultVariantSelector :level=\"1\" #variant=\"{ variant, selectVariant }\">\n      <button @click=\"selectVariant\">{{ variant.name }}</button>\n    </ResultVariantSelector>\n  </ResultVariantsProvider>\n</template>\n\n<script>\n  import { ResultVariantsProvider, ResultVariantSelector } from '@empathyco/x-components';\n\n  export default {\n    name: 'ResultVariantsProviderDemo',\n    components: {\n      ResultVariantsProvider,\n      ResultVariantSelector\n    },\n    data() {\n      return {\n        result: {\n          id: 'jacket',\n          modelName: 'Result',\n          type: 'Product',\n          isWishlisted: false,\n          identifier: { value: 'jacket' },\n          images: [],\n          name: 'jacket',\n          price: { hasDiscount: false, originalValue: 10, value: 10 },\n          url: '/products/jacket',\n          variants: [\n            {\n              name: 'red',\n              variants: [\n                {\n                  name: 'red XL'\n                },\n                {\n                  name: 'red L'\n                }\n              ]\n            },\n            {\n              name: 'blue',\n              variants: [\n                {\n                  name: 'blue S'\n                },\n                {\n                  name: 'blue M'\n                },\n                {\n                  name: 'blue L'\n                }\n              ]\n            }\n          ]\n        }\n      };\n    }\n  };\n</script>\n```\n\n### Play with props\n\nIn this example, the provider has been configured to not auto select any variant. Changing the\n`autoSelectDepth` prop sets the number of variant levels to auto select, being 0 no variants, 1 the\nfirst variant of the first level, and so on.\n\n```vue\n<template>\n  <ResultVariantsProvider :result=\"result\" :autoSelectDepth=\"0\" #default=\"{ result }\">\n    <p>Result name: {{ result.name }}</p>\n\n    <h1>Select color</h1>\n    <ResultVariantSelector :level=\"0\" #variant=\"{ variant, selectVariant }\">\n      <button @click=\"selectVariant\">{{ variant.name }}</button>\n    </ResultVariantSelector>\n\n    <h1>Select size</h1>\n    <ResultVariantSelector :level=\"1\" #variant=\"{ variant, selectVariant }\">\n      <button @click=\"selectVariant\">{{ variant.name }}</button>\n    </ResultVariantSelector>\n  </ResultVariantsProvider>\n</template>\n\n<script>\n  import { ResultVariantsProvider, ResultVariantSelector } from '@empathyco/x-components';\n\n  export default {\n    name: 'ResultVariantsProviderDemo',\n    components: {\n      ResultVariantsProvider,\n      ResultVariantSelector\n    },\n    data() {\n      return {\n        result: {\n          id: 'jacket',\n          modelName: 'Result',\n          type: 'Product',\n          isWishlisted: false,\n          identifier: { value: 'jacket' },\n          images: [],\n          name: 'jacket',\n          price: { hasDiscount: false, originalValue: 10, value: 10 },\n          url: '/products/jacket',\n          variants: [\n            {\n              name: 'red',\n              variants: [\n                {\n                  name: 'red XL'\n                },\n                {\n                  name: 'red L'\n                }\n              ]\n            },\n            {\n              name: 'blue',\n              variants: [\n                {\n                  name: 'blue S'\n                },\n                {\n                  name: 'blue M'\n                },\n                {\n                  name: 'blue L'\n                }\n              ]\n            }\n          ]\n        }\n      };\n    }\n  };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/js/components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js

@@ -0,0 +1,130 @@
+import { __decorate } from 'tslib';
+import Vue from 'vue';
+import { Prop, Watch, Component } from 'vue-property-decorator';
+import { XProvide } from '../decorators/injection.decorators.js';
+import { RESULT_WITH_VARIANTS_KEY, SELECTED_VARIANTS_KEY, SELECT_RESULT_VARIANT_KEY } from '../decorators/injection.consts.js';
+
+/**
+ * Component that exposes the result merged with its selected variant in the default slot.
+ *
+ * It receives the original result and keeps track of the selected variant.
+ *
+ * It provides the original result, the array containing the selected variants and a callback to
+ * set the selected variant to be used from a child.
+ *
+ * @public
+ */
+let ResultVariantsProvider = class ResultVariantsProvider extends Vue {
+    constructor() {
+        super(...arguments);
+        /**
+         * Array to keep track of the selected variants of the result.
+         * Each position of the array is a nest level in the variants' hierarchy, so,
+         * the second position will contain a variant that is present inside the variant of the first
+         * position, and so on.
+         *
+         * @public
+         */
+        this.selectedVariants = [];
+    }
+    /**
+     * Selects a variant of the result.
+     * When called, it slices the array of selected variants to remove the selected child variants.
+     * Emits the {@link XEventsTypes.UserSelectedAResultVariant} when called.
+     *
+     * @param variant - The variant to set.
+     * @param level - The nest level where the variant is placed inside the result.
+     * @public
+     */
+    selectResultVariant(variant, level = 0) {
+        if (this.selectedVariants[level] === variant) {
+            return;
+        }
+        this.selectedVariants.splice(level, Number.POSITIVE_INFINITY, variant);
+        this.$x.emit('UserSelectedAResultVariant', {
+            variant,
+            level,
+            result: this.result
+        });
+    }
+    /**
+     * Render function of the provider.
+     * It exposes the result with the selected variant merged.
+     *
+     * @param createElement - Vue createElement method.
+     * @returns - The VNode of the first element passed in the slot.
+     * @public
+     */
+    render(createElement) {
+        return (this.$scopedSlots.default?.({
+            result: this.resultToProvide
+        })?.[0] ?? createElement());
+    }
+    /**
+     * Resets the selected variants when the result changes.
+     * That includes doing the auto selection of the variants when the component is created
+     * and when the result is changed.
+     */
+    resetSelectedVariants() {
+        this.selectedVariants = [];
+        this.selectFirstVariants(this.result?.variants?.[0]);
+    }
+    /**
+     * Merges the original result with the selected variant.
+     * The merge is done with all the selected variants of the array.
+     *
+     * @returns - The result with the selected variant merged.
+     * @public
+     */
+    get resultToProvide() {
+        if (!this.selectedVariants.length) {
+            return this.result;
+        }
+        const mergedResult = this.selectedVariants.reduce((result, variant) => {
+            return {
+                ...result,
+                ...variant
+            };
+        }, this.result);
+        mergedResult.variants = this.result.variants;
+        return mergedResult;
+    }
+    /**
+     * Adds to the selectedVariants array the variants up to the autoSelectDepth level.
+     *
+     * @param variant - Variant to add to the array.
+     */
+    selectFirstVariants(variant) {
+        if (!!variant && this.selectedVariants.length <= this.autoSelectDepth - 1) {
+            this.selectedVariants.push(variant);
+            this.selectFirstVariants(variant.variants?.[0]);
+        }
+    }
+};
+__decorate([
+    Prop({
+        required: true
+    }),
+    XProvide(RESULT_WITH_VARIANTS_KEY)
+], ResultVariantsProvider.prototype, "result", void 0);
+__decorate([
+    Prop({
+        default: Number.POSITIVE_INFINITY
+    })
+], ResultVariantsProvider.prototype, "autoSelectDepth", void 0);
+__decorate([
+    XProvide(SELECTED_VARIANTS_KEY)
+], ResultVariantsProvider.prototype, "selectedVariants", void 0);
+__decorate([
+    XProvide(SELECT_RESULT_VARIANT_KEY)
+], ResultVariantsProvider.prototype, "selectResultVariant", null);
+__decorate([
+    Watch('result', { immediate: true })
+], ResultVariantsProvider.prototype, "resetSelectedVariants", null);
+ResultVariantsProvider = __decorate([
+    Component
+], ResultVariantsProvider);
+var script = ResultVariantsProvider;
+
+export { script as default };
+//# sourceMappingURL=result-variants-provider.vue_rollup-plugin-vue_script.vue.js.map

package/js/components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"result-variants-provider.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../src/components/result/result-variants-provider.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport Vue, { VNode, CreateElement } from 'vue';\nimport { Component, Prop, Watch } from 'vue-property-decorator';\nimport { Result, ResultVariant } from '@empathyco/x-types';\nimport { XProvide } from '../decorators/injection.decorators';\nimport {\n  RESULT_WITH_VARIANTS_KEY,\n  SELECTED_VARIANTS_KEY,\n  SELECT_RESULT_VARIANT_KEY\n} from '../decorators/injection.consts';\n\n/**\n * Component that exposes the result merged with its selected variant in the default slot.\n *\n * It receives the original result and keeps track of the selected variant.\n *\n * It provides the original result, the array containing the selected variants and a callback to\n * set the selected variant to be used from a child.\n *\n * @public\n */\n@Component\nexport default class ResultVariantsProvider extends Vue {\n  /**\n   * The original result containing the variants.\n   *\n   * @public\n   */\n  @Prop({\n    required: true\n  })\n  @XProvide(RESULT_WITH_VARIANTS_KEY)\n  public result!: Result;\n\n  /**\n   * The provider by default will auto select the first variants of all levels.\n   * This prop allows to limit the number of variants auto selected when the provider is created.\n   * Take into account that the depth will be the variants level + 1, so, setting autoSelectDepth\n   * to 0 will not select any variant, setting it to 1 will select only the first variant of the\n   * first level, and so on.\n   */\n  @Prop({\n    default: Number.POSITIVE_INFINITY\n  })\n  public autoSelectDepth!: number;\n\n  /**\n   * Array to keep track of the selected variants of the result.\n   * Each position of the array is a nest level in the variants' hierarchy, so,\n   * the second position will contain a variant that is present inside the variant of the first\n   * position, and so on.\n   *\n   * @public\n   */\n  @XProvide(SELECTED_VARIANTS_KEY)\n  public selectedVariants: ResultVariant[] = [];\n\n  /**\n   * Selects a variant of the result.\n   * When called, it slices the array of selected variants to remove the selected child variants.\n   * Emits the {@link XEventsTypes.UserSelectedAResultVariant} when called.\n   *\n   * @param variant - The variant to set.\n   * @param level - The nest level where the variant is placed inside the result.\n   * @public\n   */\n  @XProvide(SELECT_RESULT_VARIANT_KEY)\n  selectResultVariant(variant: ResultVariant, level = 0): void {\n    if (this.selectedVariants[level] === variant) {\n      return;\n    }\n    this.selectedVariants.splice(level, Number.POSITIVE_INFINITY, variant);\n    this.$x.emit('UserSelectedAResultVariant', {\n      variant,\n      level,\n      result: this.result\n    });\n  }\n\n  /**\n   * Render function of the provider.\n   * It exposes the result with the selected variant merged.\n   *\n   * @param createElement - Vue createElement method.\n   * @returns - The VNode of the first element passed in the slot.\n   * @public\n   */\n  render(createElement: CreateElement): VNode {\n    return (\n      this.$scopedSlots.default?.({\n        result: this.resultToProvide\n      })?.[0] ?? createElement()\n    );\n  }\n\n  /**\n   * Resets the selected variants when the result changes.\n   * That includes doing the auto selection of the variants when the component is created\n   * and when the result is changed.\n   */\n  @Watch('result', { immediate: true })\n  resetSelectedVariants(): void {\n    this.selectedVariants = [];\n    this.selectFirstVariants(this.result?.variants?.[0]);\n  }\n\n  /**\n   * Merges the original result with the selected variant.\n   * The merge is done with all the selected variants of the array.\n   *\n   * @returns - The result with the selected variant merged.\n   * @public\n   */\n  public get resultToProvide(): Result {\n    if (!this.selectedVariants.length) {\n      return this.result;\n    }\n    const mergedResult = this.selectedVariants.reduce<Result>((result, variant) => {\n      return {\n        ...result,\n        ...variant\n      };\n    }, this.result);\n    mergedResult.variants = this.result.variants;\n    return mergedResult;\n  }\n\n  /**\n   * Adds to the selectedVariants array the variants up to the autoSelectDepth level.\n   *\n   * @param variant - Variant to add to the array.\n   */\n  selectFirstVariants(variant?: ResultVariant): void {\n    if (!!variant && this.selectedVariants.length <= this.autoSelectDepth - 1) {\n      this.selectedVariants.push(variant);\n      this.selectFirstVariants(variant.variants?.[0]);\n    }\n  }\n}\n"],"names":[],"mappings":";;;;;;AAWA;;;;;;;;;;AAWA,IAAqB,sBAAsB,GAA3C,MAAqB,sBAAuB,SAAQ,GAAG;IAAvD;;;;;;;;;;QAiCS,qBAAgB,GAAoB,EAAE,CAAC;KAmF/C;;;;;;;;;;IAvEC,mBAAmB,CAAC,OAAsB,EAAE,KAAK,GAAG,CAAC;QACnD,IAAI,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,KAAK,OAAO,EAAE;YAC5C,OAAO;SACR;QACD,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC;QACvE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE;YACzC,OAAO;YACP,KAAK;YACL,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC,CAAC;KACJ;;;;;;;;;IAUD,MAAM,CAAC,aAA4B;QACjC,QACE,IAAI,CAAC,YAAY,CAAC,OAAO,GAAG;YAC1B,MAAM,EAAE,IAAI,CAAC,eAAe;SAC7B,CAAC,GAAG,CAAC,CAAC,IAAI,aAAa,EAAE,EAC1B;KACH;;;;;;IAQD,qBAAqB;QACnB,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC3B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,MAAM,EAAE,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC;KACtD;;;;;;;;IASD,IAAW,eAAe;QACxB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE;YACjC,OAAO,IAAI,CAAC,MAAM,CAAC;SACpB;QACD,MAAM,YAAY,GAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAS,CAAC,MAAM,EAAE,OAAO;YACxE,OAAO;gBACL,GAAG,MAAM;gBACT,GAAG,OAAO;aACX,CAAC;SACH,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QAChB,YAAY,CAAC,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC;QAC7C,OAAO,YAAY,CAAC;KACrB;;;;;;IAOD,mBAAmB,CAAC,OAAuB;QACzC,IAAI,CAAC,CAAC,OAAO,IAAI,IAAI,CAAC,gBAAgB,CAAC,MAAM,IAAI,IAAI,CAAC,eAAe,GAAG,CAAC,EAAE;YACzE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACpC,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC;SACjD;KACF;CACF,CAAA;AA1GC;IAJC,IAAI,CAAC;QACJ,QAAQ,EAAE,IAAI;KACf,CAAC;IACD,QAAQ,CAAC,wBAAwB,CAAC;sDACZ;AAYvB;IAHC,IAAI,CAAC;QACJ,OAAO,EAAE,MAAM,CAAC,iBAAiB;KAClC,CAAC;+DAC8B;AAWhC;IADC,QAAQ,CAAC,qBAAqB,CAAC;gEACc;AAY9C;IADC,QAAQ,CAAC,yBAAyB,CAAC;iEAWnC;AAwBD;IADC,KAAK,CAAC,QAAQ,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;mEAIpC;AAlFkB,sBAAsB;IAD1C,SAAS;GACW,sBAAsB,CAoH1C;aApHoB,sBAAsB;;;;"}

package/js/index.js

@@ -98,6 +98,8 @@ export { default as BaseResultPreviousPrice } from './components/result/base-res
 export { default as BaseFallbackImage } from './components/result/base-result-fallback-image.vue.js';
 export { default as BasePlaceholderImage } from './components/result/base-result-placeholder-image.vue.js';
 export { default as BaseResultRating } from './components/result/base-result-rating.vue.js';
+export { default as ResultVariantsProvider } from './components/result/result-variants-provider.vue.js';
+export { default as ResultVariantSelector } from './components/result/result-variant-selector.vue.js';
 export { default as BaseScroll } from './components/scroll/base-scroll.vue.js';
 export { default as ScrollMixin } from './components/scroll/scroll.mixin.js';
 export { default as BaseSuggestion } from './components/suggestions/base-suggestion.vue.js';
@@ -118,7 +120,7 @@ export { default as SlidingPanel } from './components/sliding-panel.vue.js';
 export { default as SnippetCallbacks } from './components/snippet-callbacks.vue.js';
 export { XEmit, XOn } from './components/decorators/bus.decorators.js';
 export { Debounce } from './components/decorators/debounce.decorators.js';
-export { LIST_ITEMS_KEY, QUERY_KEY } from './components/decorators/injection.consts.js';
+export { LIST_ITEMS_KEY, QUERY_KEY, RESULT_WITH_VARIANTS_KEY, SELECTED_VARIANTS_KEY, SELECT_RESULT_VARIANT_KEY } from './components/decorators/injection.consts.js';
 export { XInject, XProvide } from './components/decorators/injection.decorators.js';
 export { Getter, State } from './components/decorators/store.decorators.js';
 export { ItemsListInjectionMixin } from './components/items-list-injection.mixin.js';

package/js/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/js/x-modules/extra-params/components/extra-params.vue_rollup-plugin-vue_script.vue.js

@@ -101,6 +101,8 @@ import '../../../components/result/base-result-previous-price.vue.js';
 import '../../../components/result/base-result-fallback-image.vue.js';
 import '../../../components/result/base-result-placeholder-image.vue.js';
 import '../../../components/result/base-result-rating.vue.js';
+import '../../../components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import '../../../components/result/result-variant-selector.vue.js';
 import '../../../components/scroll/base-scroll.vue.js';
 import '../../../components/scroll/scroll.mixin.js';
 import '../../../components/suggestions/base-suggestion.vue.js';

package/js/x-modules/extra-params/components/extra-params.vue_rollup-plugin-vue_script.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"extra-params.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../src/x-modules/extra-params/components/extra-params.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport { Dictionary } from '@empathyco/x-utils';\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { State, xComponentMixin, XEmit } from '../../../components';\nimport { extraParamsXModule } from '../x-module';\n\n/**\n * It emits a {@link ExtraParamsXEvents.ExtraParamsProvided} with the values\n * received as a prop.\n *\n * @public\n */\n@Component({\n  mixins: [xComponentMixin(extraParamsXModule)]\n})\nexport default class ExtraParams extends Vue {\n  /**\n   * Emits the initial extra params, overriding with the state extra params, just in case, those\n   * values were already set by XComponents initialization (url, plugin config, etc.).\n   */\n  mounted(): void {\n    this.$x.emit('ExtraParamsInitialized', { ...this.values });\n    this.$x.emit('ExtraParamsProvided', { ...this.values, ...this.storeExtraParams });\n  }\n\n  /**\n   * (Required) A Dictionary where the keys are the extra param names and its values.\n   *\n   * @remarks Emits the {@link ExtraParamsXEvents.ExtraParamsProvided} when the\n   * component is rendered or the values changed.\n   *\n   * @public\n   */\n  @XEmit('ExtraParamsProvided', { deep: true })\n  @Prop({ required: true })\n  public values!: Dictionary<unknown>;\n\n  /**\n   * State extra params. Used to override the initial extra params.\n   */\n  @State('extraParams', 'params')\n  public storeExtraParams!: Dictionary<unknown>;\n\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  render(): void {}\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA;;;;;;AASA,IAAqB,WAAW,GAAhC,MAAqB,WAAY,SAAQ,GAAG;;;;;IAK1C,OAAO;QACL,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;QAC3D,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;KACnF;;IAqBD,MAAM,MAAW;CAClB,CAAA;AAVC;IAFC,KAAK,CAAC,qBAAqB,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;IAC5C,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;2CACW;AAMpC;IADC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;qDACe;AA1B3B,WAAW;IAH/B,SAAS,CAAC;QACT,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;KAC9C,CAAC;GACmB,WAAW,CA8B/B;aA9BoB,WAAW;;;;"}
+{"version":3,"file":"extra-params.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../src/x-modules/extra-params/components/extra-params.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport { Dictionary } from '@empathyco/x-utils';\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { State, xComponentMixin, XEmit } from '../../../components';\nimport { extraParamsXModule } from '../x-module';\n\n/**\n * It emits a {@link ExtraParamsXEvents.ExtraParamsProvided} with the values\n * received as a prop.\n *\n * @public\n */\n@Component({\n  mixins: [xComponentMixin(extraParamsXModule)]\n})\nexport default class ExtraParams extends Vue {\n  /**\n   * Emits the initial extra params, overriding with the state extra params, just in case, those\n   * values were already set by XComponents initialization (url, plugin config, etc.).\n   */\n  mounted(): void {\n    this.$x.emit('ExtraParamsInitialized', { ...this.values });\n    this.$x.emit('ExtraParamsProvided', { ...this.values, ...this.storeExtraParams });\n  }\n\n  /**\n   * (Required) A Dictionary where the keys are the extra param names and its values.\n   *\n   * @remarks Emits the {@link ExtraParamsXEvents.ExtraParamsProvided} when the\n   * component is rendered or the values changed.\n   *\n   * @public\n   */\n  @XEmit('ExtraParamsProvided', { deep: true })\n  @Prop({ required: true })\n  public values!: Dictionary<unknown>;\n\n  /**\n   * State extra params. Used to override the initial extra params.\n   */\n  @State('extraParams', 'params')\n  public storeExtraParams!: Dictionary<unknown>;\n\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  render(): void {}\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA;;;;;;AASA,IAAqB,WAAW,GAAhC,MAAqB,WAAY,SAAQ,GAAG;;;;;IAK1C,OAAO;QACL,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;QAC3D,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;KACnF;;IAqBD,MAAM,MAAW;CAClB,CAAA;AAVC;IAFC,KAAK,CAAC,qBAAqB,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;IAC5C,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;2CACW;AAMpC;IADC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;qDACe;AA1B3B,WAAW;IAH/B,SAAS,CAAC;QACT,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;KAC9C,CAAC;GACmB,WAAW,CA8B/B;aA9BoB,WAAW;;;;"}

package/js/x-modules/extra-params/components/renderless-extra-param.vue_rollup-plugin-vue_script.vue.js

@@ -101,6 +101,8 @@ import '../../../components/result/base-result-previous-price.vue.js';
 import '../../../components/result/base-result-fallback-image.vue.js';
 import '../../../components/result/base-result-placeholder-image.vue.js';
 import '../../../components/result/base-result-rating.vue.js';
+import '../../../components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import '../../../components/result/result-variant-selector.vue.js';
 import '../../../components/scroll/base-scroll.vue.js';
 import '../../../components/scroll/scroll.mixin.js';
 import '../../../components/suggestions/base-suggestion.vue.js';

package/js/x-modules/extra-params/components/renderless-extra-param.vue_rollup-plugin-vue_script.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderless-extra-param.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../src/x-modules/extra-params/components/renderless-extra-param.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\nimport { Dictionary } from '@empathyco/x-utils';\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { NoElement, State, xComponentMixin } from '../../../components';\nimport { extraParamsXModule } from '../x-module';\n\n/**\n * It emits a {@link ExtraParamsXEvents.UserChangedExtraParams} when the `updateValue`\n * is called.\n *\n * @public\n */\n@Component({\n  mixins: [xComponentMixin(extraParamsXModule)],\n  components: {\n    NoElement\n  }\n})\nexport default class RenderlessExtraParam extends Vue {\n  /**\n   * The extra param's name.\n   *\n   * @public\n   */\n  @Prop({ required: true })\n  public name!: string;\n\n  /**\n   * A dictionary with the extra params in the store state.\n   *\n   * @public\n   */\n  @State('extraParams', 'params')\n  public stateParams!: Dictionary<unknown>;\n\n  /**\n   * It returns the value of the extra param from the store.\n   *\n   * @returns - The value from the store.\n   *\n   * @internal\n   */\n  protected get value(): unknown {\n    return this.stateParams[this.name];\n  }\n\n  /**\n   * It sets the new value to the store.\n   *\n   * @param newValue - The new value of the extra param.\n   *\n   * @internal\n   */\n  protected updateValue(newValue: unknown): void {\n    this.$x.emit('UserChangedExtraParams', { [this.name]: newValue });\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA;;;;;;AAYA,IAAqB,oBAAoB,GAAzC,MAAqB,oBAAqB,SAAQ,GAAG;;;;;;;;IAwBnD,IAAc,KAAK;QACjB,OAAO,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACpC;;;;;;;;IASS,WAAW,CAAC,QAAiB;QACrC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,GAAG,QAAQ,EAAE,CAAC,CAAC;KACnE;CACF,CAAA;AA/BC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;kDACJ;AAQrB;IADC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;yDACU;AAftB,oBAAoB;IANxC,SAAS,CAAC;QACT,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;QAC7C,UAAU,EAAE;YACV,SAAS;SACV;KACF,CAAC;GACmB,oBAAoB,CAsCxC;aAtCoB,oBAAoB;;;;"}
+{"version":3,"file":"renderless-extra-param.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../src/x-modules/extra-params/components/renderless-extra-param.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\nimport { Dictionary } from '@empathyco/x-utils';\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { NoElement, State, xComponentMixin } from '../../../components';\nimport { extraParamsXModule } from '../x-module';\n\n/**\n * It emits a {@link ExtraParamsXEvents.UserChangedExtraParams} when the `updateValue`\n * is called.\n *\n * @public\n */\n@Component({\n  mixins: [xComponentMixin(extraParamsXModule)],\n  components: {\n    NoElement\n  }\n})\nexport default class RenderlessExtraParam extends Vue {\n  /**\n   * The extra param's name.\n   *\n   * @public\n   */\n  @Prop({ required: true })\n  public name!: string;\n\n  /**\n   * A dictionary with the extra params in the store state.\n   *\n   * @public\n   */\n  @State('extraParams', 'params')\n  public stateParams!: Dictionary<unknown>;\n\n  /**\n   * It returns the value of the extra param from the store.\n   *\n   * @returns - The value from the store.\n   *\n   * @internal\n   */\n  protected get value(): unknown {\n    return this.stateParams[this.name];\n  }\n\n  /**\n   * It sets the new value to the store.\n   *\n   * @param newValue - The new value of the extra param.\n   *\n   * @internal\n   */\n  protected updateValue(newValue: unknown): void {\n    this.$x.emit('UserChangedExtraParams', { [this.name]: newValue });\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA;;;;;;AAYA,IAAqB,oBAAoB,GAAzC,MAAqB,oBAAqB,SAAQ,GAAG;;;;;;;;IAwBnD,IAAc,KAAK;QACjB,OAAO,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACpC;;;;;;;;IASS,WAAW,CAAC,QAAiB;QACrC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,GAAG,QAAQ,EAAE,CAAC,CAAC;KACnE;CACF,CAAA;AA/BC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;kDACJ;AAQrB;IADC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;yDACU;AAftB,oBAAoB;IANxC,SAAS,CAAC;QACT,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;QAC7C,UAAU,EAAE;YACV,SAAS;SACV;KACF,CAAC;GACmB,oBAAoB,CAsCxC;aAtCoB,oBAAoB;;;;"}

package/js/x-modules/facets/components/clear-filters.vue_rollup-plugin-vue_script.vue.js

@@ -101,6 +101,8 @@ import '../../../components/result/base-result-previous-price.vue.js';
 import '../../../components/result/base-result-fallback-image.vue.js';
 import '../../../components/result/base-result-placeholder-image.vue.js';
 import '../../../components/result/base-result-rating.vue.js';
+import '../../../components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import '../../../components/result/result-variant-selector.vue.js';
 import '../../../components/scroll/base-scroll.vue.js';
 import '../../../components/scroll/scroll.mixin.js';
 import '../../../components/suggestions/base-suggestion.vue.js';

package/js/x-modules/facets/components/clear-filters.vue_rollup-plugin-vue_script.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"clear-filters.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../src/x-modules/facets/components/clear-filters.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Component from 'vue-class-component';\nimport { xComponentMixin } from '../../../components';\nimport BaseEventButton from '../../../components/base-event-button.vue';\nimport { VueCSSClasses } from '../../../utils';\nimport { XEventsTypes } from '../../../wiring';\nimport { facetsXModule } from '../x-module';\nimport FacetsMixin from './facets.mixin';\n\n/**\n * Renders a simple button, emitting the needed events when clicked.\n *\n * @remarks It extends {@link FacetsMixin}.\n *\n * @public\n */\n@Component({\n  components: { BaseEventButton },\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class ClearFilters extends FacetsMixin {\n  /**\n   * The events that will be emitted when the button clear filters is clicked.\n   *\n   * @returns The events to be emitted when the button clear filters is clicked.\n   * @internal\n   */\n  protected get events(): Partial<XEventsTypes> {\n    return this.facetsIds\n      ? {\n          UserClickedClearAllFilters: this.facetsIds\n        }\n      : {\n          UserClickedClearAllFilters: undefined\n        };\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return {\n      'x-clear-filters--has-not-selected-filters': !this.hasSelectedFilters,\n      'x-clear-filters--has-selected-filters': this.hasSelectedFilters\n    };\n  }\n}\n"],"names":["BaseEventButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA;;;;;;;AAWA,IAAqB,YAAY,GAAjC,MAAqB,YAAa,SAAQ,WAAW;;;;;;;IAOnD,IAAc,MAAM;QAClB,OAAO,IAAI,CAAC,SAAS;cACjB;gBACE,0BAA0B,EAAE,IAAI,CAAC,SAAS;aAC3C;cACD;gBACE,0BAA0B,EAAE,SAAS;aACtC,CAAC;KACP;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO;YACL,2CAA2C,EAAE,CAAC,IAAI,CAAC,kBAAkB;YACrE,uCAAuC,EAAE,IAAI,CAAC,kBAAkB;SACjE,CAAC;KACH;CACF,CAAA;AA7BoB,YAAY;IAJhC,SAAS,CAAC;QACT,UAAU,EAAE,mBAAEA,iBAAe,EAAE;QAC/B,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,YAAY,CA6BhC;aA7BoB,YAAY;;;;"}
+{"version":3,"file":"clear-filters.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../src/x-modules/facets/components/clear-filters.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Component from 'vue-class-component';\nimport { xComponentMixin } from '../../../components';\nimport BaseEventButton from '../../../components/base-event-button.vue';\nimport { VueCSSClasses } from '../../../utils';\nimport { XEventsTypes } from '../../../wiring';\nimport { facetsXModule } from '../x-module';\nimport FacetsMixin from './facets.mixin';\n\n/**\n * Renders a simple button, emitting the needed events when clicked.\n *\n * @remarks It extends {@link FacetsMixin}.\n *\n * @public\n */\n@Component({\n  components: { BaseEventButton },\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class ClearFilters extends FacetsMixin {\n  /**\n   * The events that will be emitted when the button clear filters is clicked.\n   *\n   * @returns The events to be emitted when the button clear filters is clicked.\n   * @internal\n   */\n  protected get events(): Partial<XEventsTypes> {\n    return this.facetsIds\n      ? {\n          UserClickedClearAllFilters: this.facetsIds\n        }\n      : {\n          UserClickedClearAllFilters: undefined\n        };\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return {\n      'x-clear-filters--has-not-selected-filters': !this.hasSelectedFilters,\n      'x-clear-filters--has-selected-filters': this.hasSelectedFilters\n    };\n  }\n}\n"],"names":["BaseEventButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA;;;;;;;AAWA,IAAqB,YAAY,GAAjC,MAAqB,YAAa,SAAQ,WAAW;;;;;;;IAOnD,IAAc,MAAM;QAClB,OAAO,IAAI,CAAC,SAAS;cACjB;gBACE,0BAA0B,EAAE,IAAI,CAAC,SAAS;aAC3C;cACD;gBACE,0BAA0B,EAAE,SAAS;aACtC,CAAC;KACP;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO;YACL,2CAA2C,EAAE,CAAC,IAAI,CAAC,kBAAkB;YACrE,uCAAuC,EAAE,IAAI,CAAC,kBAAkB;SACjE,CAAC;KACH;CACF,CAAA;AA7BoB,YAAY;IAJhC,SAAS,CAAC;QACT,UAAU,EAAE,mBAAEA,iBAAe,EAAE;QAC/B,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,YAAY,CA6BhC;aA7BoB,YAAY;;;;"}

package/js/x-modules/facets/components/facets/facets-provider.vue_rollup-plugin-vue_script.vue.js

@@ -102,6 +102,8 @@ import '../../../../components/result/base-result-previous-price.vue.js';
 import '../../../../components/result/base-result-fallback-image.vue.js';
 import '../../../../components/result/base-result-placeholder-image.vue.js';
 import '../../../../components/result/base-result-rating.vue.js';
+import '../../../../components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import '../../../../components/result/result-variant-selector.vue.js';
 import '../../../../components/scroll/base-scroll.vue.js';
 import '../../../../components/scroll/scroll.mixin.js';
 import '../../../../components/suggestions/base-suggestion.vue.js';

package/js/x-modules/facets/components/facets/facets-provider.vue_rollup-plugin-vue_script.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"facets-provider.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/facets/facets-provider.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport { Facet, Filter, isHierarchicalFacet } from '@empathyco/x-types';\nimport Vue from 'vue';\nimport { Component, Prop, Watch } from 'vue-property-decorator';\nimport { XOn } from '../../../../components';\nimport { xComponentMixin } from '../../../../components/x-component.mixin';\nimport { clone } from '../../../../utils';\nimport { areFiltersDifferent } from '../../../../utils/filters';\nimport { FacetsGroup } from '../../service/types';\nimport { GroupId } from '../../store/types';\nimport { flatHierarchicalFilters } from '../../utils';\nimport { facetsXModule } from '../../x-module';\n\n/**\n * This component allows to provide facets by prop, to add them to the state of the\n * `Facets X-Module`. These facets will be added to the `Facets X-Module` state together with\n * the facets emitted by the `Search X-Module` through the {@link SearchXEvents.FacetsChanged}\n * event.\n *\n * @public\n */\n@Component({\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class FacetsProvider extends Vue {\n  /**\n   * An facet group identifier to distinguish the provided facets from other facets like the\n   * `Search X-Module` facets.\n   *\n   * @public\n   */\n  @Prop({ default: 'provided-facets' })\n  public groupId!: GroupId;\n\n  /**\n   * The facets to provide to the `Facets X-Module` state. They have to include the\n   * {@link @empathyco/x-types#Filter | filters}.\n   *\n   * @internal\n   */\n  @Prop({ required: true })\n  public facets!: Facet[];\n\n  /**\n   * Temporarily stores the selected filters from the {@link FacetsProvider.facets} prop.\n   * This is necessary to handle the {@link FacetsXEvents.UserChangedSelectedFilters} event.\n   *\n   * @internal\n   */\n  protected selectedFilters: Filter[] | null = null;\n\n  /**\n   * A computed property to group the facets and the groupId. This is used by the watcher.\n   *\n   * @returns The FacetGroup with the facets and the group id.\n   *\n   * @internal\n   */\n  protected get facetsGroup(): FacetsGroup {\n    return { id: this.groupId, facets: this.facets };\n  }\n\n  /**\n   * Emits the {@link FacetsXEvents.UserChangedSelectedFilters} event when the user changes\n   * the selected filters.\n   *\n   * @param selectedFilters - The new list of selected filters.\n   * @internal\n   */\n  @XOn('SelectedFiltersChanged')\n  emitSelectedFiltersChanged(selectedFilters: Filter[]): void {\n    if (\n      this.selectedFilters === null ||\n      areFiltersDifferent(this.selectedFilters, selectedFilters)\n    ) {\n      this.$x.emit('UserChangedSelectedFilters', selectedFilters);\n    }\n    this.selectedFilters = null;\n  }\n\n  /**\n   * Emits the {@link FacetsXEvents.FacetsGroupProvided} event with the\n   * {@link FacetsProvider.facetsGroup} as payload. It also extracts and saves the selected\n   * filters.\n   */\n  @Watch('facetsGroup', { immediate: true })\n  provideFacets(): void {\n    if (this.facetsGroup.facets) {\n      const facetsGroupClone = clone(this.facetsGroup);\n      this.$x.emit('FacetsGroupProvided', facetsGroupClone);\n      this.extractSelectedFilters(this.facets);\n    }\n  }\n\n  /**\n   * Extracts the selected filters from the facets and stores them in the\n   * {@link FacetsProvider.selectedFilters} property.\n   *\n   * @param facets - The facets from whom extract the selected filters.\n   * @internal\n   */\n  protected extractSelectedFilters(facets: Facet[]): void {\n    this.selectedFilters = facets\n      .flatMap(facet =>\n        isHierarchicalFacet(facet) ? flatHierarchicalFilters(facet.filters) : facet.filters\n      )\n      .filter(filter => filter.selected);\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  render(): void {}\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA;;;;;;;;AAWA,IAAqB,cAAc,GAAnC,MAAqB,cAAe,SAAQ,GAAG;IAA/C;;;;;;;;QAyBY,oBAAe,GAAoB,IAAI,CAAC;KA8DnD;;;;;;;;IArDC,IAAc,WAAW;QACvB,OAAO,EAAE,EAAE,EAAE,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;KAClD;;;;;;;;IAUD,0BAA0B,CAAC,eAAyB;QAClD,IACE,IAAI,CAAC,eAAe,KAAK,IAAI;YAC7B,mBAAmB,CAAC,IAAI,CAAC,eAAe,EAAE,eAAe,CAAC,EAC1D;YACA,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,eAAe,CAAC,CAAC;SAC7D;QACD,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;KAC7B;;;;;;IAQD,aAAa;QACX,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE;YAC3B,MAAM,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;YACjD,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,gBAAgB,CAAC,CAAC;YACtD,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SAC1C;KACF;;;;;;;;IASS,sBAAsB,CAAC,MAAe;QAC9C,IAAI,CAAC,eAAe,GAAG,MAAM;aAC1B,OAAO,CAAC,KAAK,IACZ,mBAAmB,CAAC,KAAK,CAAC,GAAG,uBAAuB,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,OAAO,CACpF;aACA,MAAM,CAAC,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,CAAC;KACtC;;IAGD,MAAM,MAAW;CAClB,CAAA;AA/EC;IADC,IAAI,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,CAAC;+CACZ;AASzB;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;8CACD;AA6BxB;IADC,GAAG,CAAC,wBAAwB,CAAC;gEAS7B;AAQD;IADC,KAAK,CAAC,aAAa,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;mDAOzC;AApEkB,cAAc;IAHlC,SAAS,CAAC;QACT,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,cAAc,CAuFlC;aAvFoB,cAAc;;;;"}
+{"version":3,"file":"facets-provider.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/facets/facets-provider.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport { Facet, Filter, isHierarchicalFacet } from '@empathyco/x-types';\nimport Vue from 'vue';\nimport { Component, Prop, Watch } from 'vue-property-decorator';\nimport { XOn } from '../../../../components';\nimport { xComponentMixin } from '../../../../components/x-component.mixin';\nimport { clone } from '../../../../utils';\nimport { areFiltersDifferent } from '../../../../utils/filters';\nimport { FacetsGroup } from '../../service/types';\nimport { GroupId } from '../../store/types';\nimport { flatHierarchicalFilters } from '../../utils';\nimport { facetsXModule } from '../../x-module';\n\n/**\n * This component allows to provide facets by prop, to add them to the state of the\n * `Facets X-Module`. These facets will be added to the `Facets X-Module` state together with\n * the facets emitted by the `Search X-Module` through the {@link SearchXEvents.FacetsChanged}\n * event.\n *\n * @public\n */\n@Component({\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class FacetsProvider extends Vue {\n  /**\n   * An facet group identifier to distinguish the provided facets from other facets like the\n   * `Search X-Module` facets.\n   *\n   * @public\n   */\n  @Prop({ default: 'provided-facets' })\n  public groupId!: GroupId;\n\n  /**\n   * The facets to provide to the `Facets X-Module` state. They have to include the\n   * {@link @empathyco/x-types#Filter | filters}.\n   *\n   * @internal\n   */\n  @Prop({ required: true })\n  public facets!: Facet[];\n\n  /**\n   * Temporarily stores the selected filters from the {@link FacetsProvider.facets} prop.\n   * This is necessary to handle the {@link FacetsXEvents.UserChangedSelectedFilters} event.\n   *\n   * @internal\n   */\n  protected selectedFilters: Filter[] | null = null;\n\n  /**\n   * A computed property to group the facets and the groupId. This is used by the watcher.\n   *\n   * @returns The FacetGroup with the facets and the group id.\n   *\n   * @internal\n   */\n  protected get facetsGroup(): FacetsGroup {\n    return { id: this.groupId, facets: this.facets };\n  }\n\n  /**\n   * Emits the {@link FacetsXEvents.UserChangedSelectedFilters} event when the user changes\n   * the selected filters.\n   *\n   * @param selectedFilters - The new list of selected filters.\n   * @internal\n   */\n  @XOn('SelectedFiltersChanged')\n  emitSelectedFiltersChanged(selectedFilters: Filter[]): void {\n    if (\n      this.selectedFilters === null ||\n      areFiltersDifferent(this.selectedFilters, selectedFilters)\n    ) {\n      this.$x.emit('UserChangedSelectedFilters', selectedFilters);\n    }\n    this.selectedFilters = null;\n  }\n\n  /**\n   * Emits the {@link FacetsXEvents.FacetsGroupProvided} event with the\n   * {@link FacetsProvider.facetsGroup} as payload. It also extracts and saves the selected\n   * filters.\n   */\n  @Watch('facetsGroup', { immediate: true })\n  provideFacets(): void {\n    if (this.facetsGroup.facets) {\n      const facetsGroupClone = clone(this.facetsGroup);\n      this.$x.emit('FacetsGroupProvided', facetsGroupClone);\n      this.extractSelectedFilters(this.facets);\n    }\n  }\n\n  /**\n   * Extracts the selected filters from the facets and stores them in the\n   * {@link FacetsProvider.selectedFilters} property.\n   *\n   * @param facets - The facets from whom extract the selected filters.\n   * @internal\n   */\n  protected extractSelectedFilters(facets: Facet[]): void {\n    this.selectedFilters = facets\n      .flatMap(facet =>\n        isHierarchicalFacet(facet) ? flatHierarchicalFilters(facet.filters) : facet.filters\n      )\n      .filter(filter => filter.selected);\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  render(): void {}\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA;;;;;;;;AAWA,IAAqB,cAAc,GAAnC,MAAqB,cAAe,SAAQ,GAAG;IAA/C;;;;;;;;QAyBY,oBAAe,GAAoB,IAAI,CAAC;KA8DnD;;;;;;;;IArDC,IAAc,WAAW;QACvB,OAAO,EAAE,EAAE,EAAE,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;KAClD;;;;;;;;IAUD,0BAA0B,CAAC,eAAyB;QAClD,IACE,IAAI,CAAC,eAAe,KAAK,IAAI;YAC7B,mBAAmB,CAAC,IAAI,CAAC,eAAe,EAAE,eAAe,CAAC,EAC1D;YACA,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,eAAe,CAAC,CAAC;SAC7D;QACD,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;KAC7B;;;;;;IAQD,aAAa;QACX,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE;YAC3B,MAAM,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;YACjD,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,gBAAgB,CAAC,CAAC;YACtD,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SAC1C;KACF;;;;;;;;IASS,sBAAsB,CAAC,MAAe;QAC9C,IAAI,CAAC,eAAe,GAAG,MAAM;aAC1B,OAAO,CAAC,KAAK,IACZ,mBAAmB,CAAC,KAAK,CAAC,GAAG,uBAAuB,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,OAAO,CACpF;aACA,MAAM,CAAC,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,CAAC;KACtC;;IAGD,MAAM,MAAW;CAClB,CAAA;AA/EC;IADC,IAAI,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,CAAC;+CACZ;AASzB;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;8CACD;AA6BxB;IADC,GAAG,CAAC,wBAAwB,CAAC;gEAS7B;AAQD;IADC,KAAK,CAAC,aAAa,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;mDAOzC;AApEkB,cAAc;IAHlC,SAAS,CAAC;QACT,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,cAAc,CAuFlC;aAvFoB,cAAc;;;;"}

package/js/x-modules/facets/components/filters/all-filter.vue_rollup-plugin-vue_script.vue.js

@@ -101,6 +101,8 @@ import '../../../../components/result/base-result-previous-price.vue.js';
 import '../../../../components/result/base-result-fallback-image.vue.js';
 import '../../../../components/result/base-result-placeholder-image.vue.js';
 import '../../../../components/result/base-result-rating.vue.js';
+import '../../../../components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import '../../../../components/result/result-variant-selector.vue.js';
 import '../../../../components/scroll/base-scroll.vue.js';
 import '../../../../components/scroll/scroll.mixin.js';
 import '../../../../components/suggestions/base-suggestion.vue.js';

package/js/x-modules/facets/components/filters/all-filter.vue_rollup-plugin-vue_script.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"all-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/all-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { Facet } from '@empathyco/x-types';\nimport { Getter, xComponentMixin } from '../../../../components';\nimport BaseEventButton from '../../../../components/base-event-button.vue';\nimport { isArrayEmpty } from '../../../../utils/array';\nimport { VueCSSClasses } from '../../../../utils/types';\nimport { XEventsTypes } from '../../../../wiring/events.types';\nimport { FiltersByFacet } from '../../store';\nimport { facetsXModule } from '../../x-module';\n\n/**\n * This component receives a required `facet` with\n * {@link @empathyco/x-types#BooleanFilter | BooleanFilter} as prop and renders a button, which\n * on clicked emits the {@link FacetsXEvents.UserClickedAllFilter} event. By default\n * the rendered button displays a message with the facet label but this content is customizable\n * through the default slot.\n *\n * @public\n */\n@Component({\n  components: { BaseEventButton },\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class AllFilter extends Vue {\n  /** The facet data. */\n  @Prop({ required: true })\n  public facet!: Facet;\n\n  /** The getter of the selectedFiltersByFacet. */\n  @Getter('facets', 'selectedFiltersByFacet')\n  public selectedFiltersByFacet!: FiltersByFacet;\n\n  /**\n   * The event that will be emitted when the all filter button is clicked.\n   *\n   * @returns The event to emit on click.\n   * @internal\n   */\n  protected get clickEvent(): Partial<XEventsTypes> {\n    return {\n      UserClickedAllFilter: [this.facet.id]\n    };\n  }\n\n  /**\n   * Computed to retrieve the selected state of this component.\n   *\n   * @returns True if is selected false otherwise.\n   */\n  protected get isSelected(): boolean {\n    return isArrayEmpty(this.selectedFiltersByFacet?.[this.facet.id]);\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @remarks This is only valid considering that in the case of HierarchicalFilters, ancestors\n   * of nested selected filters are also selected.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return {\n      'x-filter--is-selected': this.isSelected,\n      'x-all-filter--is-selected': this.isSelected\n    };\n  }\n}\n"],"names":["BaseEventButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA;;;;;;;;;AAaA,IAAqB,SAAS,GAA9B,MAAqB,SAAU,SAAQ,GAAG;;;;;;;IAexC,IAAc,UAAU;QACtB,OAAO;YACL,oBAAoB,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;SACtC,CAAC;KACH;;;;;;IAOD,IAAc,UAAU;QACtB,OAAO,YAAY,CAAC,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC;KACnE;;;;;;;;;;IAWD,IAAc,UAAU;QACtB,OAAO;YACL,uBAAuB,EAAE,IAAI,CAAC,UAAU;YACxC,2BAA2B,EAAE,IAAI,CAAC,UAAU;SAC7C,CAAC;KACH;CACF,CAAA;AA1CC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;wCACJ;AAIrB;IADC,MAAM,CAAC,QAAQ,EAAE,wBAAwB,CAAC;yDACI;AAP5B,SAAS;IAJ7B,SAAS,CAAC;QACT,UAAU,EAAE,mBAAEA,iBAAe,EAAE;QAC/B,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,SAAS,CA6C7B;aA7CoB,SAAS;;;;"}
+{"version":3,"file":"all-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/all-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { Facet } from '@empathyco/x-types';\nimport { Getter, xComponentMixin } from '../../../../components';\nimport BaseEventButton from '../../../../components/base-event-button.vue';\nimport { isArrayEmpty } from '../../../../utils/array';\nimport { VueCSSClasses } from '../../../../utils/types';\nimport { XEventsTypes } from '../../../../wiring/events.types';\nimport { FiltersByFacet } from '../../store';\nimport { facetsXModule } from '../../x-module';\n\n/**\n * This component receives a required `facet` with\n * {@link @empathyco/x-types#BooleanFilter | BooleanFilter} as prop and renders a button, which\n * on clicked emits the {@link FacetsXEvents.UserClickedAllFilter} event. By default\n * the rendered button displays a message with the facet label but this content is customizable\n * through the default slot.\n *\n * @public\n */\n@Component({\n  components: { BaseEventButton },\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class AllFilter extends Vue {\n  /** The facet data. */\n  @Prop({ required: true })\n  public facet!: Facet;\n\n  /** The getter of the selectedFiltersByFacet. */\n  @Getter('facets', 'selectedFiltersByFacet')\n  public selectedFiltersByFacet!: FiltersByFacet;\n\n  /**\n   * The event that will be emitted when the all filter button is clicked.\n   *\n   * @returns The event to emit on click.\n   * @internal\n   */\n  protected get clickEvent(): Partial<XEventsTypes> {\n    return {\n      UserClickedAllFilter: [this.facet.id]\n    };\n  }\n\n  /**\n   * Computed to retrieve the selected state of this component.\n   *\n   * @returns True if is selected false otherwise.\n   */\n  protected get isSelected(): boolean {\n    return isArrayEmpty(this.selectedFiltersByFacet?.[this.facet.id]);\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @remarks This is only valid considering that in the case of HierarchicalFilters, ancestors\n   * of nested selected filters are also selected.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return {\n      'x-filter--is-selected': this.isSelected,\n      'x-all-filter--is-selected': this.isSelected\n    };\n  }\n}\n"],"names":["BaseEventButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA;;;;;;;;;AAaA,IAAqB,SAAS,GAA9B,MAAqB,SAAU,SAAQ,GAAG;;;;;;;IAexC,IAAc,UAAU;QACtB,OAAO;YACL,oBAAoB,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;SACtC,CAAC;KACH;;;;;;IAOD,IAAc,UAAU;QACtB,OAAO,YAAY,CAAC,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC;KACnE;;;;;;;;;;IAWD,IAAc,UAAU;QACtB,OAAO;YACL,uBAAuB,EAAE,IAAI,CAAC,UAAU;YACxC,2BAA2B,EAAE,IAAI,CAAC,UAAU;SAC7C,CAAC;KACH;CACF,CAAA;AA1CC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;wCACJ;AAIrB;IADC,MAAM,CAAC,QAAQ,EAAE,wBAAwB,CAAC;yDACI;AAP5B,SAAS;IAJ7B,SAAS,CAAC;QACT,UAAU,EAAE,mBAAEA,iBAAe,EAAE;QAC/B,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,SAAS,CA6C7B;aA7CoB,SAAS;;;;"}

package/js/x-modules/facets/components/filters/number-range-filter.vue_rollup-plugin-vue_script.vue.js

@@ -101,6 +101,8 @@ import '../../../../components/result/base-result-previous-price.vue.js';
 import '../../../../components/result/base-result-fallback-image.vue.js';
 import '../../../../components/result/base-result-placeholder-image.vue.js';
 import '../../../../components/result/base-result-rating.vue.js';
+import '../../../../components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import '../../../../components/result/result-variant-selector.vue.js';
 import '../../../../components/scroll/base-scroll.vue.js';
 import '../../../../components/scroll/scroll.mixin.js';
 import '../../../../components/suggestions/base-suggestion.vue.js';

package/js/x-modules/facets/components/filters/number-range-filter.vue_rollup-plugin-vue_script.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"number-range-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/number-range-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { NumberRangeFilter as NumberRangeFilterModel } from '@empathyco/x-types';\nimport { xComponentMixin } from '../../../../components';\nimport { VueCSSClasses } from '../../../../utils/types';\nimport { XEventsTypes } from '../../../../wiring/events.types';\nimport { facetsXModule } from '../../x-module';\nimport RenderlessFilter from './renderless-filter.vue';\n\n/**\n * Renders a number range filter, emitting the needed events when clicked.\n *\n * @public\n */\n@Component({\n  components: { RenderlessFilter },\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class NumberRangeFilter extends Vue {\n  /** The filter data to render. */\n  @Prop({ required: true })\n  public filter!: NumberRangeFilterModel;\n\n  /**\n   * Additional events, with their payload, to emit when the filter is clicked.\n   *\n   * @public\n   */\n  @Prop()\n  public clickEvents?: Partial<XEventsTypes>;\n\n  /**\n   * The {@link XEventsTypes | events} to emit.\n   *\n   * @returns The events to emit when clicked.\n   * @internal\n   */\n  protected get _clickEvents(): Partial<XEventsTypes> {\n    return {\n      UserClickedANumberRangeFilter: this.filter,\n      ...this.clickEvents\n    };\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return {\n      'x-number-range-filter--is-selected': this.filter.selected\n    };\n  }\n}\n"],"names":["RenderlessFilter"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA;;;;;AASA,IAAqB,iBAAiB,GAAtC,MAAqB,iBAAkB,SAAQ,GAAG;;;;;;;IAmBhD,IAAc,YAAY;QACxB,OAAO;YACL,6BAA6B,EAAE,IAAI,CAAC,MAAM;YAC1C,GAAG,IAAI,CAAC,WAAW;SACpB,CAAC;KACH;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO;YACL,oCAAoC,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;SAC3D,CAAC;KACH;CACF,CAAA;AAlCC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;iDACc;AAQvC;IADC,IAAI,EAAE;sDACoC;AAXxB,iBAAiB;IAJrC,SAAS,CAAC;QACT,UAAU,EAAE,oBAAEA,iBAAgB,EAAE;QAChC,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,iBAAiB,CAqCrC;aArCoB,iBAAiB;;;;"}
+{"version":3,"file":"number-range-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/number-range-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { NumberRangeFilter as NumberRangeFilterModel } from '@empathyco/x-types';\nimport { xComponentMixin } from '../../../../components';\nimport { VueCSSClasses } from '../../../../utils/types';\nimport { XEventsTypes } from '../../../../wiring/events.types';\nimport { facetsXModule } from '../../x-module';\nimport RenderlessFilter from './renderless-filter.vue';\n\n/**\n * Renders a number range filter, emitting the needed events when clicked.\n *\n * @public\n */\n@Component({\n  components: { RenderlessFilter },\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class NumberRangeFilter extends Vue {\n  /** The filter data to render. */\n  @Prop({ required: true })\n  public filter!: NumberRangeFilterModel;\n\n  /**\n   * Additional events, with their payload, to emit when the filter is clicked.\n   *\n   * @public\n   */\n  @Prop()\n  public clickEvents?: Partial<XEventsTypes>;\n\n  /**\n   * The {@link XEventsTypes | events} to emit.\n   *\n   * @returns The events to emit when clicked.\n   * @internal\n   */\n  protected get _clickEvents(): Partial<XEventsTypes> {\n    return {\n      UserClickedANumberRangeFilter: this.filter,\n      ...this.clickEvents\n    };\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return {\n      'x-number-range-filter--is-selected': this.filter.selected\n    };\n  }\n}\n"],"names":["RenderlessFilter"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA;;;;;AASA,IAAqB,iBAAiB,GAAtC,MAAqB,iBAAkB,SAAQ,GAAG;;;;;;;IAmBhD,IAAc,YAAY;QACxB,OAAO;YACL,6BAA6B,EAAE,IAAI,CAAC,MAAM;YAC1C,GAAG,IAAI,CAAC,WAAW;SACpB,CAAC;KACH;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO;YACL,oCAAoC,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;SAC3D,CAAC;KACH;CACF,CAAA;AAlCC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;iDACc;AAQvC;IADC,IAAI,EAAE;sDACoC;AAXxB,iBAAiB;IAJrC,SAAS,CAAC;QACT,UAAU,EAAE,oBAAEA,iBAAgB,EAAE;QAChC,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,iBAAiB,CAqCrC;aArCoB,iBAAiB;;;;"}

package/js/x-modules/facets/components/filters/renderless-filter.vue_rollup-plugin-vue_script.vue.js

@@ -101,6 +101,8 @@ import '../../../../components/result/base-result-previous-price.vue.js';
 import '../../../../components/result/base-result-fallback-image.vue.js';
 import '../../../../components/result/base-result-placeholder-image.vue.js';
 import '../../../../components/result/base-result-rating.vue.js';
+import '../../../../components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import '../../../../components/result/result-variant-selector.vue.js';
 import '../../../../components/scroll/base-scroll.vue.js';
 import '../../../../components/scroll/scroll.mixin.js';
 import '../../../../components/suggestions/base-suggestion.vue.js';

package/js/x-modules/facets/components/filters/renderless-filter.vue_rollup-plugin-vue_script.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderless-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/renderless-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport Vue, { CreateElement, VNode } from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { BooleanFilter } from '@empathyco/x-types';\nimport { xComponentMixin } from '../../../../components';\nimport { VueCSSClasses } from '../../../../utils/types';\nimport { XEvent, XEventsTypes } from '../../../../wiring/events.types';\nimport { facetsXModule } from '../../x-module';\n\n/**\n * Renders default slot content. It binds to the default slot a\n * {@link @empathyco/x-types#BooleanFilter | BooleanFilter}, the {@link XEvent | XEvents}\n * that will be emitted when clicking the content, the css classes and if the content should be\n * disabled.\n *\n * @remarks The default slot expects a root element, if it receives a list of elements, it will\n * renders the first element.\n *\n * @public\n */\n@Component({\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class RenderlessFilter extends Vue {\n  /** The filter data to render. */\n  @Prop({ required: true })\n  public filter!: BooleanFilter;\n\n  /** Additional events with its payload to emit when the filter is clicked. */\n  @Prop()\n  public clickEvents?: Partial<XEventsTypes>;\n\n  /**\n   * The events that will be emitted when the filter is clicked.\n   *\n   * @returns The events to be emitted when the filter is clicked.\n   * @internal\n   */\n  protected get events(): Partial<XEventsTypes> {\n    return {\n      UserClickedAFilter: this.filter,\n      ...this.clickEvents\n    };\n  }\n\n  /**\n   * The events to emit to the bus.\n   *\n   * @internal\n   */\n  protected emitEvents(): void {\n    Object.entries(this.events).forEach(([event, payload]) => {\n      this.$x.emit(event as XEvent, payload, { target: this.$el as HTMLElement });\n    });\n  }\n\n  /**\n   * Returns `true` when the filter should be disabled.\n   *\n   * @returns `true` if the filter should be disabled.\n   * @internal\n   */\n  protected get isDisabled(): boolean {\n    return this.filter.totalResults === 0;\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return [\n      'x-filter',\n      {\n        'x-filter--is-selected': this.filter.selected,\n        'x-filter--is-disabled': this.isDisabled\n      }\n    ];\n  }\n\n  render(h: CreateElement): VNode {\n    return (\n      this.$scopedSlots.default?.({\n        filter: this.filter,\n        // eslint-disable-next-line @typescript-eslint/unbound-method\n        clickFilter: this.emitEvents,\n        cssClasses: this.cssClasses,\n        isDisabled: this.isDisabled\n      })?.[0] ?? h()\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;;;;;;;;;;;AAcA,IAAqB,gBAAgB,GAArC,MAAqB,gBAAiB,SAAQ,GAAG;;;;;;;IAe/C,IAAc,MAAM;QAClB,OAAO;YACL,kBAAkB,EAAE,IAAI,CAAC,MAAM;YAC/B,GAAG,IAAI,CAAC,WAAW;SACpB,CAAC;KACH;;;;;;IAOS,UAAU;QAClB,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,OAAO,CAAC;YACnD,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAe,EAAE,OAAO,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,GAAkB,EAAE,CAAC,CAAC;SAC7E,CAAC,CAAC;KACJ;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO,IAAI,CAAC,MAAM,CAAC,YAAY,KAAK,CAAC,CAAC;KACvC;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO;YACL,UAAU;YACV;gBACE,uBAAuB,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;gBAC7C,uBAAuB,EAAE,IAAI,CAAC,UAAU;aACzC;SACF,CAAC;KACH;IAED,MAAM,CAAC,CAAgB;QACrB,QACE,IAAI,CAAC,YAAY,CAAC,OAAO,GAAG;YAC1B,MAAM,EAAE,IAAI,CAAC,MAAM;;YAEnB,WAAW,EAAE,IAAI,CAAC,UAAU;YAC5B,UAAU,EAAE,IAAI,CAAC,UAAU;YAC3B,UAAU,EAAE,IAAI,CAAC,UAAU;SAC5B,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,EACd;KACH;CACF,CAAA;AAnEC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;gDACK;AAI9B;IADC,IAAI,EAAE;qDACoC;AAPxB,gBAAgB;IAHpC,SAAS,CAAC;QACT,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,gBAAgB,CAsEpC;aAtEoB,gBAAgB;;;;"}
+{"version":3,"file":"renderless-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/renderless-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport Vue, { CreateElement, VNode } from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { BooleanFilter } from '@empathyco/x-types';\nimport { xComponentMixin } from '../../../../components';\nimport { VueCSSClasses } from '../../../../utils/types';\nimport { XEvent, XEventsTypes } from '../../../../wiring/events.types';\nimport { facetsXModule } from '../../x-module';\n\n/**\n * Renders default slot content. It binds to the default slot a\n * {@link @empathyco/x-types#BooleanFilter | BooleanFilter}, the {@link XEvent | XEvents}\n * that will be emitted when clicking the content, the css classes and if the content should be\n * disabled.\n *\n * @remarks The default slot expects a root element, if it receives a list of elements, it will\n * renders the first element.\n *\n * @public\n */\n@Component({\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class RenderlessFilter extends Vue {\n  /** The filter data to render. */\n  @Prop({ required: true })\n  public filter!: BooleanFilter;\n\n  /** Additional events with its payload to emit when the filter is clicked. */\n  @Prop()\n  public clickEvents?: Partial<XEventsTypes>;\n\n  /**\n   * The events that will be emitted when the filter is clicked.\n   *\n   * @returns The events to be emitted when the filter is clicked.\n   * @internal\n   */\n  protected get events(): Partial<XEventsTypes> {\n    return {\n      UserClickedAFilter: this.filter,\n      ...this.clickEvents\n    };\n  }\n\n  /**\n   * The events to emit to the bus.\n   *\n   * @internal\n   */\n  protected emitEvents(): void {\n    Object.entries(this.events).forEach(([event, payload]) => {\n      this.$x.emit(event as XEvent, payload, { target: this.$el as HTMLElement });\n    });\n  }\n\n  /**\n   * Returns `true` when the filter should be disabled.\n   *\n   * @returns `true` if the filter should be disabled.\n   * @internal\n   */\n  protected get isDisabled(): boolean {\n    return this.filter.totalResults === 0;\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return [\n      'x-filter',\n      {\n        'x-filter--is-selected': this.filter.selected,\n        'x-filter--is-disabled': this.isDisabled\n      }\n    ];\n  }\n\n  render(h: CreateElement): VNode {\n    return (\n      this.$scopedSlots.default?.({\n        filter: this.filter,\n        // eslint-disable-next-line @typescript-eslint/unbound-method\n        clickFilter: this.emitEvents,\n        cssClasses: this.cssClasses,\n        isDisabled: this.isDisabled\n      })?.[0] ?? h()\n    );\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;;;;;;;;;;;AAcA,IAAqB,gBAAgB,GAArC,MAAqB,gBAAiB,SAAQ,GAAG;;;;;;;IAe/C,IAAc,MAAM;QAClB,OAAO;YACL,kBAAkB,EAAE,IAAI,CAAC,MAAM;YAC/B,GAAG,IAAI,CAAC,WAAW;SACpB,CAAC;KACH;;;;;;IAOS,UAAU;QAClB,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,OAAO,CAAC;YACnD,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAe,EAAE,OAAO,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,GAAkB,EAAE,CAAC,CAAC;SAC7E,CAAC,CAAC;KACJ;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO,IAAI,CAAC,MAAM,CAAC,YAAY,KAAK,CAAC,CAAC;KACvC;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO;YACL,UAAU;YACV;gBACE,uBAAuB,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;gBAC7C,uBAAuB,EAAE,IAAI,CAAC,UAAU;aACzC;SACF,CAAC;KACH;IAED,MAAM,CAAC,CAAgB;QACrB,QACE,IAAI,CAAC,YAAY,CAAC,OAAO,GAAG;YAC1B,MAAM,EAAE,IAAI,CAAC,MAAM;;YAEnB,WAAW,EAAE,IAAI,CAAC,UAAU;YAC5B,UAAU,EAAE,IAAI,CAAC,UAAU;YAC3B,UAAU,EAAE,IAAI,CAAC,UAAU;SAC5B,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,EACd;KACH;CACF,CAAA;AAnEC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;gDACK;AAI9B;IADC,IAAI,EAAE;qDACoC;AAPxB,gBAAgB;IAHpC,SAAS,CAAC;QACT,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,gBAAgB,CAsEpC;aAtEoB,gBAAgB;;;;"}

package/js/x-modules/facets/components/filters/simple-filter.vue_rollup-plugin-vue_script.vue.js

@@ -101,6 +101,8 @@ import '../../../../components/result/base-result-previous-price.vue.js';
 import '../../../../components/result/base-result-fallback-image.vue.js';
 import '../../../../components/result/base-result-placeholder-image.vue.js';
 import '../../../../components/result/base-result-rating.vue.js';
+import '../../../../components/result/result-variants-provider.vue_rollup-plugin-vue_script.vue.js';
+import '../../../../components/result/result-variant-selector.vue.js';
 import '../../../../components/scroll/base-scroll.vue.js';
 import '../../../../components/scroll/scroll.mixin.js';
 import '../../../../components/suggestions/base-suggestion.vue.js';

package/js/x-modules/facets/components/filters/simple-filter.vue_rollup-plugin-vue_script.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"simple-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/simple-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport { SimpleFilter as SimpleFilterModel } from '@empathyco/x-types';\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { xComponentMixin } from '../../../../components';\nimport { VueCSSClasses } from '../../../../utils/types';\nimport { XEventsTypes } from '../../../../wiring/events.types';\nimport { facetsXModule } from '../../x-module';\nimport RenderlessFilter from './renderless-filter.vue';\n\n/**\n * Renders a simple filter, emitting the needed events when clicked.\n *\n * @public\n */\n@Component({\n  components: { RenderlessFilter },\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class SimpleFilter extends Vue {\n  /** The filter data to render. */\n  @Prop({ required: true })\n  public filter!: SimpleFilterModel;\n\n  /**\n   * Additional events, with their payload, to emit when the filter is clicked.\n   *\n   * @public\n   */\n  @Prop()\n  public clickEvents?: Partial<XEventsTypes>;\n\n  /**\n   * The {@link XEventsTypes | events} to emit.\n   *\n   * @returns The events to emit when clicked.\n   * @internal\n   */\n  protected get _clickEvents(): Partial<XEventsTypes> {\n    return {\n      UserClickedASimpleFilter: this.filter,\n      ...this.clickEvents\n    };\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return {\n      'x-simple-filter--is-selected': this.filter.selected\n    };\n  }\n}\n"],"names":["RenderlessFilter"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA;;;;;AASA,IAAqB,YAAY,GAAjC,MAAqB,YAAa,SAAQ,GAAG;;;;;;;IAmB3C,IAAc,YAAY;QACxB,OAAO;YACL,wBAAwB,EAAE,IAAI,CAAC,MAAM;YACrC,GAAG,IAAI,CAAC,WAAW;SACpB,CAAC;KACH;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO;YACL,8BAA8B,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;SACrD,CAAC;KACH;CACF,CAAA;AAlCC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;4CACS;AAQlC;IADC,IAAI,EAAE;iDACoC;AAXxB,YAAY;IAJhC,SAAS,CAAC;QACT,UAAU,EAAE,oBAAEA,iBAAgB,EAAE;QAChC,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,YAAY,CAqChC;aArCoB,YAAY;;;;"}
+{"version":3,"file":"simple-filter.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../../src/x-modules/facets/components/filters/simple-filter.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport { SimpleFilter as SimpleFilterModel } from '@empathyco/x-types';\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { xComponentMixin } from '../../../../components';\nimport { VueCSSClasses } from '../../../../utils/types';\nimport { XEventsTypes } from '../../../../wiring/events.types';\nimport { facetsXModule } from '../../x-module';\nimport RenderlessFilter from './renderless-filter.vue';\n\n/**\n * Renders a simple filter, emitting the needed events when clicked.\n *\n * @public\n */\n@Component({\n  components: { RenderlessFilter },\n  mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class SimpleFilter extends Vue {\n  /** The filter data to render. */\n  @Prop({ required: true })\n  public filter!: SimpleFilterModel;\n\n  /**\n   * Additional events, with their payload, to emit when the filter is clicked.\n   *\n   * @public\n   */\n  @Prop()\n  public clickEvents?: Partial<XEventsTypes>;\n\n  /**\n   * The {@link XEventsTypes | events} to emit.\n   *\n   * @returns The events to emit when clicked.\n   * @internal\n   */\n  protected get _clickEvents(): Partial<XEventsTypes> {\n    return {\n      UserClickedASimpleFilter: this.filter,\n      ...this.clickEvents\n    };\n  }\n\n  /**\n   * Dynamic CSS classes to apply to the component.\n   *\n   * @returns The dynamic CSS classes to apply to the component.\n   * @internal\n   */\n  protected get cssClasses(): VueCSSClasses {\n    return {\n      'x-simple-filter--is-selected': this.filter.selected\n    };\n  }\n}\n"],"names":["RenderlessFilter"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA;;;;;AASA,IAAqB,YAAY,GAAjC,MAAqB,YAAa,SAAQ,GAAG;;;;;;;IAmB3C,IAAc,YAAY;QACxB,OAAO;YACL,wBAAwB,EAAE,IAAI,CAAC,MAAM;YACrC,GAAG,IAAI,CAAC,WAAW;SACpB,CAAC;KACH;;;;;;;IAQD,IAAc,UAAU;QACtB,OAAO;YACL,8BAA8B,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;SACrD,CAAC;KACH;CACF,CAAA;AAlCC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;4CACS;AAQlC;IADC,IAAI,EAAE;iDACoC;AAXxB,YAAY;IAJhC,SAAS,CAAC;QACT,UAAU,EAAE,oBAAEA,iBAAgB,EAAE;QAChC,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;KACzC,CAAC;GACmB,YAAY,CAqChC;aArCoB,YAAY;;;;"}