npm - @empathyco/x-components - Versions diffs - 3.0.0-alpha.34 → 3.0.0-alpha.35 - Mend

@empathyco/x-components 3.0.0-alpha.34 → 3.0.0-alpha.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (421) hide show

package/js/x-modules/empathize/components/empathize.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"empathize.vue.js","sources":["../../../../../src/x-modules/empathize/components/empathize.vue"],"sourcesContent":["<template>\n <component :is=\"animation\">\n <div\n v-if=\"isOpen\"\n @mousedown.prevent\n @focusin=\"open\"\n @focusout=\"close\"\n class=\"x-empathize\"\n data-test=\"empathize\"\n >\n <!-- @slot (Required) Modal container content -->\n <slot />\n </div>\n </component>\n</template>\n\n<script lang=\"ts\">\n import Vue from 'vue';\n import Component from 'vue-class-component';\n import { Prop } from 'vue-property-decorator';\n import { XOn } from '../../../components/decorators/bus.decorators';\n import { Debounce } from '../../../components/decorators/debounce.decorators';\n import { NoElement } from '../../../components/no-element';\n import { xComponentMixin } from '../../../components/x-component.mixin';\n import { WireMetadata, XEvent } from '../../../wiring';\n import { empathizeXModule } from '../x-module';\n\n /*\n Component containing the empathize. It has a required slot to define its content and two props\n * to define when to open and close it: eventsToOpenEmpathize and eventsToCloseEmpathize.\n \n @public\n /\n @Component({\n mixins: [xComponentMixin(empathizeXModule)]\n })\n export default class Empathize extends Vue {\n /\n Animation component that will be used to animate the empathize.\n \n @public\n /\n @Prop({ default: () => NoElement })\n protected animation!: Vue;\n\n /\n Array of {@link XEvent \| xEvents} to open the empathize.\n \n @public\n /\n @Prop({ default: () => ['UserFocusedSearchBox', 'UserIsTypingAQuery', 'UserClickedSearchBox'] })\n protected eventsToOpenEmpathize!: XEvent[];\n\n /\n Array of {@link XEvent \| xEvents} to close the empathize.\n \n @public\n /\n @Prop({\n default: () => [\n 'UserClosedEmpathize',\n 'UserSelectedASuggestion',\n 'UserPressedEnter',\n 'UserBlurredSearchBox'\n ]\n })\n protected eventsToCloseEmpathize!: XEvent[];\n\n /\n The modal container is open.\n \n @internal\n /\n protected isOpen = false;\n\n /\n Open empathize. This method will be executed on any event in\n * {@link Empathize.eventsToOpenEmpathize} and on DOM event `focusin` on Empathize root element.\n \n @param payload - The payload of the {@link XEvent}, that is unused in this case.\n * @param metadata - The {@link WireMetadata} of the event, used to emit the Empathize XEvents.\n \n @internal\n /\n @XOn(component => (component as Empathize).eventsToOpenEmpathize)\n // eslint-disable-next-line @typescript-eslint/no-unused-vars-experimental\n open(payload: unknown, metadata: WireMetadata): void {\n this.changeOpenState(true, metadata);\n }\n\n /\n Close empathize. This method will be executed on any event in\n * {@link Empathize.eventsToCloseEmpathize} and on DOM event `focusout` on Empathize root\n * element.\n \n @param payload - The payload of the {@link XEvent}, that is unused in this case.\n * @param metadata - The {@link WireMetadata} of the event, used to emit the Empathize XEvents.\n \n @internal\n /\n @XOn(component => (component as Empathize).eventsToCloseEmpathize)\n // eslint-disable-next-line @typescript-eslint/no-unused-vars-experimental\n close(payload: unknown, metadata: WireMetadata): void {\n this.changeOpenState(false, metadata);\n }\n\n /\n Changes the state of {@link Empathize.isOpen} assigning to it the value of `newOpenState`\n * parameter. Also emits the {@link XEvent \| XEvents} `EmpathizeOpened` or `EmpathizeClosed` if\n * the state really changes.\n \n @param newOpenState - The new state to assign to {@link Empathize.isOpen}.\n * @param metadata - The {@link WireMetadata} to emit the {@link XEvent \| XEvents}. If is\n * undefined, a this component is used as source of info for the metadata.\n \n @internal\n */\n @Debounce(0)\n changeOpenState(newOpenState: boolean, metadata: WireMetadata): void {\n if (this.isOpen !== newOpenState) {\n this.isOpen = newOpenState;\n this.$x.emit(\n this.isOpen ? 'EmpathizeOpened' : 'EmpathizeClosed',\n undefined,\n metadata ?? { moduleName: 'empathize', target: this.$el }\n );\n }\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n# Examples\n\nThis component will listen to the configured events in `eventsToOpenEmpathize` and\n`eventsToCloseEmpathize` props and open/close itself accordingly. By default, those props values\nare:\n\n- Open: `UserFocusedSearchBox`, `'`UserIsTypingAQuery`, `'`UserClickedSearchBox` and\n- Close: `UserClosedEmpathize`, `UserSelectedASuggestion`, `UserPressedEnter`,\n 'UserBlurredSearchBox`\n\n## Basic examples\n\nThe component rendering the query suggestions, popular searches and history queries with keyboard\nnavigation.\n\n```vue\n<Empathize>\n <template #default>\n <BaseKeyboardNavigation>\n <QuerySuggestions/>\n <PopularSearches/>\n <HistoryQueries/>\n </BaseKeyboardNavigation>\n </template>\n</Empathize>\n```\n\nDefining custom values for the events to open and close the Empathize. For example opening it when\nthe search box loses the focus and closing it when the search box receives the focus:\n\n```vue\n<Empathize\n :eventsToOpenEmpathize=\"['UserBlurredSearchBox']\"\n :eventsToCloseEmpathize=\"['UserFocusedSearchBox']\"\n>\n <template #default>\n Please, type a query in the Search Box.\n </template>\n</Empathize>\n```\n\nAn animation can be used for the opening and closing using the `animation` prop. The animation, must\nbe a Component with a `Transition` with a slot inside:\n\n```vue\n<Empathize :animation=\"collapseFromTop\">\n <template #default>\n <PopularSearches/>\n </template>\n</Empathize>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `EmpathizeOpened`: the event is emitted after receiving an event to change the state `isOpen` to\n `true`. The event payload is undefined and can have a metadata with the module and the element\n that emitted it.\n- `EmpathizeClosed`: the event is emitted after receiving an event to change the state `isOpen` to\n `false`. The event payload is undefined and can have a metadata with the module and the element\n that emitted it.\n</docs>\n"],"names":["const"],"mappings":";;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"empathize.vue.js","sources":["../../../../../src/x-modules/empathize/components/empathize.vue"],"sourcesContent":["<template>\n <component :is=\"animation\">\n <div\n v-if=\"isOpen\"\n @mousedown.prevent\n @focusin=\"open\"\n @focusout=\"close\"\n class=\"x-empathize\"\n data-test=\"empathize\"\n >\n <!-- @slot (Required) Modal container content -->\n <slot />\n </div>\n </component>\n</template>\n\n<script lang=\"ts\">\n import Vue from 'vue';\n import Component from 'vue-class-component';\n import { Prop } from 'vue-property-decorator';\n import { XOn } from '../../../components/decorators/bus.decorators';\n import { Debounce } from '../../../components/decorators/debounce.decorators';\n import { NoElement } from '../../../components/no-element';\n import { xComponentMixin } from '../../../components/x-component.mixin';\n import { WireMetadata, XEvent } from '../../../wiring';\n import { empathizeXModule } from '../x-module';\n\n /*\n Component containing the empathize. It has a required slot to define its content and two props\n * to define when to open and close it: eventsToOpenEmpathize and eventsToCloseEmpathize.\n \n @public\n /\n @Component({\n mixins: [xComponentMixin(empathizeXModule)]\n })\n export default class Empathize extends Vue {\n /\n Animation component that will be used to animate the empathize.\n \n @public\n /\n @Prop({ default: () => NoElement })\n protected animation!: Vue;\n\n /\n Array of {@link XEvent \| xEvents} to open the empathize.\n \n @public\n /\n @Prop({ default: () => ['UserFocusedSearchBox', 'UserIsTypingAQuery', 'UserClickedSearchBox'] })\n protected eventsToOpenEmpathize!: XEvent[];\n\n /\n Array of {@link XEvent \| xEvents} to close the empathize.\n \n @public\n /\n @Prop({\n default: () => [\n 'UserClosedEmpathize',\n 'UserSelectedASuggestion',\n 'UserPressedEnter',\n 'UserBlurredSearchBox'\n ]\n })\n protected eventsToCloseEmpathize!: XEvent[];\n\n /\n The modal container is open.\n \n @internal\n /\n protected isOpen = false;\n\n /\n Open empathize. This method will be executed on any event in\n * {@link Empathize.eventsToOpenEmpathize} and on DOM event `focusin` on Empathize root element.\n \n @param payload - The payload of the {@link XEvent}, that is unused in this case.\n * @param metadata - The {@link WireMetadata} of the event, used to emit the Empathize XEvents.\n \n @internal\n /\n @XOn(component => (component as Empathize).eventsToOpenEmpathize)\n // eslint-disable-next-line @typescript-eslint/no-unused-vars-experimental\n open(payload: unknown, metadata: WireMetadata): void {\n this.changeOpenState(true, metadata);\n }\n\n /\n Close empathize. This method will be executed on any event in\n * {@link Empathize.eventsToCloseEmpathize} and on DOM event `focusout` on Empathize root\n * element.\n \n @param payload - The payload of the {@link XEvent}, that is unused in this case.\n * @param metadata - The {@link WireMetadata} of the event, used to emit the Empathize XEvents.\n \n @internal\n /\n @XOn(component => (component as Empathize).eventsToCloseEmpathize)\n // eslint-disable-next-line @typescript-eslint/no-unused-vars-experimental\n close(payload: unknown, metadata: WireMetadata): void {\n this.changeOpenState(false, metadata);\n }\n\n /\n Changes the state of {@link Empathize.isOpen} assigning to it the value of `newOpenState`\n * parameter. Also emits the {@link XEvent \| XEvents} `EmpathizeOpened` or `EmpathizeClosed` if\n * the state really changes.\n \n @param newOpenState - The new state to assign to {@link Empathize.isOpen}.\n * @param metadata - The {@link WireMetadata} to emit the {@link XEvent \| XEvents}. If is\n * undefined, a this component is used as source of info for the metadata.\n \n @internal\n */\n @Debounce(0)\n changeOpenState(newOpenState: boolean, metadata: WireMetadata): void {\n if (this.isOpen !== newOpenState) {\n this.isOpen = newOpenState;\n this.$x.emit(\n this.isOpen ? 'EmpathizeOpened' : 'EmpathizeClosed',\n undefined,\n metadata ?? { moduleName: 'empathize', target: this.$el }\n );\n }\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## Examples\n\nThis component will listen to the configured events in `eventsToOpenEmpathize` and\n`eventsToCloseEmpathize` props and open/close itself accordingly. By default, those props values\nare:\n\n- Open: `UserFocusedSearchBox`, `'`UserIsTypingAQuery`, `'`UserClickedSearchBox` and\n- Close: `UserClosedEmpathize`, `UserSelectedASuggestion`, `UserPressedEnter`,\n 'UserBlurredSearchBox`\n\n### Basic examples\n\nThe component rendering the query suggestions, popular searches and history queries with keyboard\nnavigation.\n\n```vue\n<Empathize>\n <template #default>\n <BaseKeyboardNavigation>\n <QuerySuggestions/>\n <PopularSearches/>\n <HistoryQueries/>\n </BaseKeyboardNavigation>\n </template>\n</Empathize>\n```\n\nDefining custom values for the events to open and close the Empathize. For example opening it when\nthe search box loses the focus and closing it when the search box receives the focus:\n\n```vue\n<Empathize\n :eventsToOpenEmpathize=\"['UserBlurredSearchBox']\"\n :eventsToCloseEmpathize=\"['UserFocusedSearchBox']\"\n>\n <template #default>\n Please, type a query in the Search Box.\n </template>\n</Empathize>\n```\n\nAn animation can be used for the opening and closing using the `animation` prop. The animation, must\nbe a Component with a `Transition` with a slot inside:\n\n```vue\n<Empathize :animation=\"collapseFromTop\">\n <template #default>\n <PopularSearches/>\n </template>\n</Empathize>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `EmpathizeOpened`: the event is emitted after receiving an event to change the state `isOpen` to\n `true`. The event payload is undefined and can have a metadata with the module and the element\n that emitted it.\n- `EmpathizeClosed`: the event is emitted after receiving an event to change the state `isOpen` to\n `false`. The event payload is undefined and can have a metadata with the module and the element\n that emitted it.\n</docs>\n"],"names":["const"],"mappings":";;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/js/x-modules/empathize/components/empathize.vue_rollup-plugin-vue=script.js CHANGED Viewed

@@ -4,8 +4,8 @@ import { Prop } from 'vue-property-decorator';
 import Component from 'vue-class-component';
 import { NoElement } from '../../../components/no-element.js';
 import { XOn } from '../../../components/decorators/bus.decorators.js';
-import { Debounce } from '../../../components/decorators/debounce.decorators.js';
 import { xComponentMixin } from '../../../components/x-component.mixin.js';
+import { Debounce } from '../../../components/decorators/debounce.decorators.js';
 import { empathizeXModule } from '../x-module.js';
 /**

package/js/x-modules/extra-params/components/extra-params.vue_rollup-plugin-vue=script.js CHANGED Viewed

@@ -8,7 +8,7 @@ import '../../../components/animations/collapse-height.vue.js';
 import '../../../components/animations/collapse-width.vue.js';
 import '../../../components/animations/cross-fade.vue.js';
 import '../../../components/animations/fade-and-slide.vue.js';
-import '../../../components/staggering-transition-group.vue.js';
+import '../../../components/animations/staggering-transition-group.vue.js';
 import '../../../components/animations/staggered-fade-and-slide.vue.js';
 import '../../../components/animations/translate-from-left.vue.js';
 import '../../../components/animations/translate-from-right.vue.js';
@@ -69,16 +69,24 @@ import '../../../components/icons/trash.vue.js';
 import '../../../components/icons/trending-tiny.vue.js';
 import '../../../components/icons/trending.vue.js';
 import '../../../components/icons/user.vue.js';
-import '../../../components/modals/base-events-modal-close.vue.js';
+import { State } from '../../../components/decorators/store.decorators.js';
+import '../../../components/x-component.utils.js';
+import { xComponentMixin } from '../../../components/x-component.mixin.js';
 import '../../../components/modals/base-modal.vue.js';
+import '../../../components/modals/base-id-modal.vue.js';
+import '../../../components/scroll/scroll.mixin.js';
+import '../../../components/scroll/base-scroll.vue.js';
+import '../../../components/layouts/fixed-header-and-asides-layout.vue.js';
+import '../../../components/panels/base-toggle-panel.vue.js';
+import '../../../components/panels/base-id-toggle-panel.vue.js';
+import '../../../components/layouts/multi-column-max-width-layout.vue.js';
+import '../../../components/layouts/single-column-layout.vue.js';
+import '../../../components/modals/base-events-modal-close.vue.js';
 import '../../../components/modals/base-events-modal.vue.js';
 import '../../../components/modals/base-events-modal-open.vue.js';
-import '../../../components/modals/base-id-modal.vue.js';
 import '../../../components/modals/base-id-modal-close.vue.js';
 import '../../../components/modals/base-id-modal-open.vue.js';
-import '../../../components/panels/base-toggle-panel.vue.js';
 import '../../../components/panels/base-header-toggle-panel.vue.js';
-import '../../../components/panels/base-id-toggle-panel.vue.js';
 import '../../../components/panels/base-id-toggle-panel-button.vue.js';
 import '../../../components/result/base-result-add-to-cart.vue.js';
 import '../../../components/result/base-result-current-price.vue.js';
@@ -87,8 +95,6 @@ import '../../../components/result/base-result-link.vue.js';
 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/scroll/scroll.mixin.js';
-import '../../../components/scroll/base-scroll.vue.js';
 import '../../../components/suggestions/base-suggestion.vue.js';
 import '../../../components/suggestions/base-suggestions.vue.js';
 import '../../../components/auto-progress-bar.vue.js';
@@ -99,11 +105,6 @@ import '../../../components/base-variable-column-grid.vue.js';
 import '../../../components/decorators/debounce.decorators.js';
 import '../../../components/sliding-panel.vue.js';
 import '../../../components/items-list.vue.js';
-import { State } from '../../../components/decorators/store.decorators.js';
-import '../../../components/x-component.utils.js';
-import { xComponentMixin } from '../../../components/x-component.mixin.js';
-import '../../../components/layouts/multi-column-max-width-layout.vue.js';
-import '../../../components/layouts/single-column-layout.vue.js';
 import '../../../components/location-provider.vue.js';
 import '../../../components/global-x-bus.vue.js';
 import '../../../components/snippet-callbacks.vue.js';

package/js/x-modules/extra-params/components/extra-params.vue_rollup-plugin-vue=script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"extra-params.vue_rollup-plugin-vue=script.js","sources":["../../../../../src/x-modules/extra-params/components/extra-params.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { State, xComponentMixin, XEmit } from '../../../components';\nimport { Dictionary } from '../../../utils';\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;IAAyC,+BAAG;IAA5C;;KA8BC;;;;;IAzBC,6BAAO,GAAP;QACE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QACpD,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,wBAAO,IAAI,CAAC,MAAM,GAAK,IAAI,CAAC,gBAAgB,EAAG,CAAC;KACnF;;IAqBD,4BAAM,GAAN,eAAiB;IATjB;QAFC,KAAK,CAAC,qBAAqB,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;QAC5C,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;+CACW;IAMpC;QADC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;yDACe;IA1B3B,WAAW;QAH/B,SAAS,CAAC;YACT,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;SAC9C,CAAC;OACmB,WAAW,CA8B/B;IAAD,kBAAC;CAAA,CA9BwC,GAAG;;;;"}
1	+ {"version":3,"file":"extra-params.vue_rollup-plugin-vue=script.js","sources":["../../../../../src/x-modules/extra-params/components/extra-params.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { State, xComponentMixin, XEmit } from '../../../components';\nimport { Dictionary } from '../../../utils';\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;IAAyC,+BAAG;IAA5C;;KA8BC;;;;;IAzBC,6BAAO,GAAP;QACE,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QACpD,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,qBAAqB,wBAAO,IAAI,CAAC,MAAM,GAAK,IAAI,CAAC,gBAAgB,EAAG,CAAC;KACnF;;IAqBD,4BAAM,GAAN,eAAiB;IATjB;QAFC,KAAK,CAAC,qBAAqB,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;QAC5C,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;+CACW;IAMpC;QADC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;yDACe;IA1B3B,WAAW;QAH/B,SAAS,CAAC;YACT,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;SAC9C,CAAC;OACmB,WAAW,CA8B/B;IAAD,kBAAC;CAAA,CA9BwC,GAAG;;;;"}

package/js/x-modules/extra-params/components/renderless-extra-param.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"renderless-extra-param.vue.js","sources":["../../../../../src/x-modules/extra-params/components/renderless-extra-param.vue"],"sourcesContent":["<template>\n <NoElement>\n <slot v-bind=\"{ value, updateValue }\"></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 { NoElement, State, xComponentMixin } from '../../../components';\n import { Dictionary } from '../../../utils';\n import { 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 })\n export 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</script>\n\n<docs lang=\"mdx\">\n# Examples\n\nRenders default slot content. It binds to the default slot the name of the extra parameter and the\ndefault value of it.\n\n## Basic usage\n\n```vue\n<template>\n <RenderlessExtraParam #default=\"{ value, updateValue }\" name=\"store\">\n <BaseDropdown @change=\"updateValue\" :value=\"value\" :items=\"items\" />\n </RenderlessExtraParam>\n</template>\n\n<script>\n import { RenderlessExtraParams } from '@empathyco/x-components/extra-params';\n import { BaseDropdown } from '@empathyco/x-components';\n\n export default {\n name: 'RenderlessExtraParamsDemo',\n components: {\n RenderlessExtraParams,\n BaseDropdown\n },\n props: ['name'],\n data() {\n return {\n items: ['spain', 'portugal']\n };\n }\n };\n</script>\n```\n</docs>\n"],"names":["const"],"mappings":";;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"renderless-extra-param.vue.js","sources":["../../../../../src/x-modules/extra-params/components/renderless-extra-param.vue"],"sourcesContent":["<template>\n <NoElement>\n <slot v-bind=\"{ value, updateValue }\"></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 { NoElement, State, xComponentMixin } from '../../../components';\n import { Dictionary } from '../../../utils';\n import { 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 })\n export 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</script>\n\n<docs lang=\"mdx\">\n## Examples\n\nRenders default slot content. It binds to the default slot the name of the extra parameter and the\ndefault value of it.\n\n### Basic usage\n\n```vue\n<template>\n <RenderlessExtraParam #default=\"{ value, updateValue }\" name=\"store\">\n <BaseDropdown @change=\"updateValue\" :value=\"value\" :items=\"items\" />\n </RenderlessExtraParam>\n</template>\n\n<script>\n import { RenderlessExtraParams } from '@empathyco/x-components/extra-params';\n import { BaseDropdown } from '@empathyco/x-components';\n\n export default {\n name: 'RenderlessExtraParamsDemo',\n components: {\n RenderlessExtraParams,\n BaseDropdown\n },\n props: ['name'],\n data() {\n return {\n items: ['spain', 'portugal']\n };\n }\n };\n</script>\n```\n</docs>\n"],"names":["const"],"mappings":";;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/js/x-modules/extra-params/components/renderless-extra-param.vue_rollup-plugin-vue=script.js CHANGED Viewed

@@ -8,7 +8,7 @@ import '../../../components/animations/collapse-height.vue.js';
 import '../../../components/animations/collapse-width.vue.js';
 import '../../../components/animations/cross-fade.vue.js';
 import '../../../components/animations/fade-and-slide.vue.js';
-import '../../../components/staggering-transition-group.vue.js';
+import '../../../components/animations/staggering-transition-group.vue.js';
 import '../../../components/animations/staggered-fade-and-slide.vue.js';
 import '../../../components/animations/translate-from-left.vue.js';
 import '../../../components/animations/translate-from-right.vue.js';
@@ -69,16 +69,24 @@ import '../../../components/icons/trash.vue.js';
 import '../../../components/icons/trending-tiny.vue.js';
 import '../../../components/icons/trending.vue.js';
 import '../../../components/icons/user.vue.js';
-import '../../../components/modals/base-events-modal-close.vue.js';
+import { State } from '../../../components/decorators/store.decorators.js';
+import '../../../components/x-component.utils.js';
+import { xComponentMixin } from '../../../components/x-component.mixin.js';
 import '../../../components/modals/base-modal.vue.js';
+import '../../../components/modals/base-id-modal.vue.js';
+import '../../../components/scroll/scroll.mixin.js';
+import '../../../components/scroll/base-scroll.vue.js';
+import '../../../components/layouts/fixed-header-and-asides-layout.vue.js';
+import '../../../components/panels/base-toggle-panel.vue.js';
+import '../../../components/panels/base-id-toggle-panel.vue.js';
+import '../../../components/layouts/multi-column-max-width-layout.vue.js';
+import '../../../components/layouts/single-column-layout.vue.js';
+import '../../../components/modals/base-events-modal-close.vue.js';
 import '../../../components/modals/base-events-modal.vue.js';
 import '../../../components/modals/base-events-modal-open.vue.js';
-import '../../../components/modals/base-id-modal.vue.js';
 import '../../../components/modals/base-id-modal-close.vue.js';
 import '../../../components/modals/base-id-modal-open.vue.js';
-import '../../../components/panels/base-toggle-panel.vue.js';
 import '../../../components/panels/base-header-toggle-panel.vue.js';
-import '../../../components/panels/base-id-toggle-panel.vue.js';
 import '../../../components/panels/base-id-toggle-panel-button.vue.js';
 import '../../../components/result/base-result-add-to-cart.vue.js';
 import '../../../components/result/base-result-current-price.vue.js';
@@ -87,8 +95,6 @@ import '../../../components/result/base-result-link.vue.js';
 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/scroll/scroll.mixin.js';
-import '../../../components/scroll/base-scroll.vue.js';
 import '../../../components/suggestions/base-suggestion.vue.js';
 import '../../../components/suggestions/base-suggestions.vue.js';
 import '../../../components/auto-progress-bar.vue.js';
@@ -99,11 +105,6 @@ import '../../../components/base-variable-column-grid.vue.js';
 import '../../../components/decorators/debounce.decorators.js';
 import '../../../components/sliding-panel.vue.js';
 import '../../../components/items-list.vue.js';
-import { State } from '../../../components/decorators/store.decorators.js';
-import '../../../components/x-component.utils.js';
-import { xComponentMixin } from '../../../components/x-component.mixin.js';
-import '../../../components/layouts/multi-column-max-width-layout.vue.js';
-import '../../../components/layouts/single-column-layout.vue.js';
 import '../../../components/location-provider.vue.js';
 import '../../../components/global-x-bus.vue.js';
 import '../../../components/snippet-callbacks.vue.js';

package/js/x-modules/extra-params/components/renderless-extra-param.vue_rollup-plugin-vue=script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"renderless-extra-param.vue_rollup-plugin-vue=script.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 Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { NoElement, State, xComponentMixin } from '../../../components';\nimport { Dictionary } from '../../../utils';\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;IAAkD,wCAAG;IAArD;;KAsCC;IAdC,sBAAc,uCAAK;;;;;;;;aAAnB;YACE,OAAO,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACpC;;;OAAA;;;;;;;;IASS,0CAAW,GAArB,UAAsB,QAAiB;;QACrC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,YAAI,GAAC,IAAI,CAAC,IAAI,IAAG,QAAQ,MAAG,CAAC;KACnE;IA9BD;QADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;sDACJ;IAQrB;QADC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;6DACU;IAftB,oBAAoB;QANxC,SAAS,CAAC;YACT,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;YAC7C,UAAU,EAAE;gBACV,SAAS,WAAA;aACV;SACF,CAAC;OACmB,oBAAoB,CAsCxC;IAAD,2BAAC;CAAA,CAtCiD,GAAG;;;;"}
1	+ {"version":3,"file":"renderless-extra-param.vue_rollup-plugin-vue=script.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 Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { NoElement, State, xComponentMixin } from '../../../components';\nimport { Dictionary } from '../../../utils';\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;IAAkD,wCAAG;IAArD;;KAsCC;IAdC,sBAAc,uCAAK;;;;;;;;aAAnB;YACE,OAAO,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACpC;;;OAAA;;;;;;;;IASS,0CAAW,GAArB,UAAsB,QAAiB;;QACrC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,wBAAwB,YAAI,GAAC,IAAI,CAAC,IAAI,IAAG,QAAQ,MAAG,CAAC;KACnE;IA9BD;QADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;sDACJ;IAQrB;QADC,KAAK,CAAC,aAAa,EAAE,QAAQ,CAAC;6DACU;IAftB,oBAAoB;QANxC,SAAS,CAAC;YACT,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;YAC7C,UAAU,EAAE;gBACV,SAAS,WAAA;aACV;SACF,CAAC;OACmB,oBAAoB,CAsCxC;IAAD,2BAAC;CAAA,CAtCiD,GAAG;;;;"}

package/js/x-modules/extra-params/components/snippet-config-extra-params.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"snippet-config-extra-params.vue.js","sources":["../../../../../src/x-modules/extra-params/components/snippet-config-extra-params.vue"],"sourcesContent":["<template>\n <ExtraParams :values=\"extraParams\" />\n</template>\n\n<script lang=\"ts\">\n import Vue from 'vue';\n import { Component, Watch, Inject } from 'vue-property-decorator';\n import { xComponentMixin } from '../../../components';\n import { Dictionary, forEach } from '../../../utils';\n import { SnippetConfig } from '../../../x-installer';\n import { extraParamsXModule } from '../x-module';\n import ExtraParams from './extra-params.vue';\n\n /*\n Extracts the extra parameters from the {@link SnippetConfig} and syncs it with the request\n * objects of every x-module.\n \n @public\n /\n @Component({\n components: { ExtraParams },\n mixins: [xComponentMixin(extraParamsXModule)]\n })\n export default class SnippetConfigExtraParams extends Vue {\n /\n It injects {@link SnippetConfig} provided by an ancestor as snippetConfig.\n \n @internal\n /\n @Inject('snippetConfig')\n public snippetConfig!: SnippetConfig;\n\n /\n Custom object containing the extra params from the snippet config.\n \n @remarks This object keeps manually the desired snippet config properties to avoid\n * unnecessary re-renders.\n \n @internal\n /\n protected extraParams: Dictionary<unknown> = {};\n\n /\n Updates the extraParams object when the snippet config changes.\n \n @param snippetConfig - The new snippet config.\n \n @internal\n */\n @Watch('snippetConfig', { deep: true, immediate: true })\n syncExtraParams({\n instance,\n scope,\n lang,\n searchLang,\n consent,\n documentDirection,\n currency,\n ...snippetExtraParams\n }: SnippetConfig): void {\n forEach(snippetExtraParams, (name, value) => {\n this.$set(this.extraParams, name, value);\n });\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## See it in action\n\n_See how the snippet config is injected and passed to the SnippetConfigExtraParams component._\n\n```vue\n<template>\n <Provider>\n <SnippetConfigExtraParams />\n </Provider>\n</template>\n\n<script>\n import { SnippetConfigExtraParams } from '@empathyco/x-components/extra-params';\n\n const Provider = {\n provide: {\n snippetConfig: {\n instance: 'demo',\n lang: 'es',\n warehouse: 1234\n }\n }\n };\n\n export default {\n name: 'SnippetConfigExtraParamsDemo',\n components: {\n Provider,\n SnippetConfigExtraParams\n }\n };\n</script>\n```\n</docs>\n"],"names":["const"],"mappings":";;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"snippet-config-extra-params.vue.js","sources":["../../../../../src/x-modules/extra-params/components/snippet-config-extra-params.vue"],"sourcesContent":["<template>\n <ExtraParams :values=\"extraParams\" />\n</template>\n\n<script lang=\"ts\">\n import Vue from 'vue';\n import { Component, Watch, Inject } from 'vue-property-decorator';\n import { xComponentMixin } from '../../../components';\n import { Dictionary, forEach } from '../../../utils';\n import { SnippetConfig } from '../../../x-installer';\n import { extraParamsXModule } from '../x-module';\n import ExtraParams from './extra-params.vue';\n\n /*\n Extracts the extra parameters from the {@link SnippetConfig} and syncs it with the request\n * objects of every x-module.\n \n @public\n /\n @Component({\n components: { ExtraParams },\n mixins: [xComponentMixin(extraParamsXModule)]\n })\n export default class SnippetConfigExtraParams extends Vue {\n /\n It injects {@link SnippetConfig} provided by an ancestor as snippetConfig.\n \n @internal\n /\n @Inject('snippetConfig')\n public snippetConfig!: SnippetConfig;\n\n /\n Custom object containing the extra params from the snippet config.\n \n @remarks This object keeps manually the desired snippet config properties to avoid\n * unnecessary re-renders.\n \n @internal\n /\n protected extraParams: Dictionary<unknown> = {};\n\n /\n Collection of properties from the snippet config not allowed to be sent as extra params.\n \n @internal\n /\n protected notAllowedExtraParams: Array<keyof SnippetConfig> = ['callbacks'];\n\n /\n Updates the extraParams object when the snippet config changes.\n \n @param snippetConfig - The new snippet config.\n \n @internal\n */\n @Watch('snippetConfig', { deep: true, immediate: true })\n syncExtraParams({\n instance,\n scope,\n lang,\n searchLang,\n consent,\n documentDirection,\n currency,\n ...snippetExtraParams\n }: SnippetConfig): void {\n forEach(snippetExtraParams, (name, value) => {\n if (this.notAllowedExtraParams.includes(name)) {\n return;\n }\n this.$set(this.extraParams, name, value);\n });\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## See it in action\n\n_See how the snippet config is injected and passed to the SnippetConfigExtraParams component._\n\n```vue\n<template>\n <Provider>\n <SnippetConfigExtraParams />\n </Provider>\n</template>\n\n<script>\n import { SnippetConfigExtraParams } from '@empathyco/x-components/extra-params';\n\n const Provider = {\n provide: {\n snippetConfig: {\n instance: 'demo',\n lang: 'es',\n warehouse: 1234\n }\n }\n };\n\n export default {\n name: 'SnippetConfigExtraParamsDemo',\n components: {\n Provider,\n SnippetConfigExtraParams\n }\n };\n</script>\n```\n</docs>\n"],"names":["const"],"mappings":";;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/js/x-modules/extra-params/components/snippet-config-extra-params.vue_rollup-plugin-vue=script.js CHANGED Viewed

@@ -25,7 +25,7 @@ import '../../../utils/sanitize.js';
 import '../../../utils/storage.js';
 import '../../../utils/string.js';
 import '../../../utils/throttle.js';
-import '../../../components/staggering-transition-group.vue.js';
+import '../../../components/animations/staggering-transition-group.vue.js';
 import '../../../components/animations/staggered-fade-and-slide.vue.js';
 import '../../../components/animations/translate-from-left.vue.js';
 import '../../../components/animations/translate-from-right.vue.js';
@@ -86,16 +86,24 @@ import '../../../components/icons/trash.vue.js';
 import '../../../components/icons/trending-tiny.vue.js';
 import '../../../components/icons/trending.vue.js';
 import '../../../components/icons/user.vue.js';
-import '../../../components/modals/base-events-modal-close.vue.js';
+import '../../../components/decorators/store.decorators.js';
+import '../../../components/x-component.utils.js';
+import { xComponentMixin } from '../../../components/x-component.mixin.js';
 import '../../../components/modals/base-modal.vue.js';
+import '../../../components/modals/base-id-modal.vue.js';
+import '../../../components/scroll/scroll.mixin.js';
+import '../../../components/scroll/base-scroll.vue.js';
+import '../../../components/layouts/fixed-header-and-asides-layout.vue.js';
+import '../../../components/panels/base-toggle-panel.vue.js';
+import '../../../components/panels/base-id-toggle-panel.vue.js';
+import '../../../components/layouts/multi-column-max-width-layout.vue.js';
+import '../../../components/layouts/single-column-layout.vue.js';
+import '../../../components/modals/base-events-modal-close.vue.js';
 import '../../../components/modals/base-events-modal.vue.js';
 import '../../../components/modals/base-events-modal-open.vue.js';
-import '../../../components/modals/base-id-modal.vue.js';
 import '../../../components/modals/base-id-modal-close.vue.js';
 import '../../../components/modals/base-id-modal-open.vue.js';
-import '../../../components/panels/base-toggle-panel.vue.js';
 import '../../../components/panels/base-header-toggle-panel.vue.js';
-import '../../../components/panels/base-id-toggle-panel.vue.js';
 import '../../../components/panels/base-id-toggle-panel-button.vue.js';
 import '../../../components/result/base-result-add-to-cart.vue.js';
 import '../../../components/result/base-result-current-price.vue.js';
@@ -104,8 +112,6 @@ import '../../../components/result/base-result-link.vue.js';
 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/scroll/scroll.mixin.js';
-import '../../../components/scroll/base-scroll.vue.js';
 import '../../../components/suggestions/base-suggestion.vue.js';
 import '../../../components/suggestions/base-suggestions.vue.js';
 import '../../../components/auto-progress-bar.vue.js';
@@ -116,11 +122,6 @@ import '../../../components/base-variable-column-grid.vue.js';
 import '../../../components/decorators/debounce.decorators.js';
 import '../../../components/sliding-panel.vue.js';
 import '../../../components/items-list.vue.js';
-import '../../../components/decorators/store.decorators.js';
-import '../../../components/x-component.utils.js';
-import { xComponentMixin } from '../../../components/x-component.mixin.js';
-import '../../../components/layouts/multi-column-max-width-layout.vue.js';
-import '../../../components/layouts/single-column-layout.vue.js';
 import '../../../components/location-provider.vue.js';
 import '../../../components/global-x-bus.vue.js';
 import '../../../components/snippet-callbacks.vue.js';
@@ -147,6 +148,12 @@ var SnippetConfigExtraParams = /** @class */ (function (_super) {
          * @internal
          */
         _this.extraParams = {};
+        /**
+         * Collection of properties from the snippet config not allowed to be sent as extra params.
+         *
+         * @internal
+         */
+        _this.notAllowedExtraParams = ['callbacks'];
         return _this;
     }
     /**
@@ -160,6 +167,9 @@ var SnippetConfigExtraParams = /** @class */ (function (_super) {
         var _this = this;
         var instance = _a.instance, scope = _a.scope, lang = _a.lang, searchLang = _a.searchLang, consent = _a.consent, documentDirection = _a.documentDirection, currency = _a.currency, snippetExtraParams = __rest(_a, ["instance", "scope", "lang", "searchLang", "consent", "documentDirection", "currency"]);
         forEach(snippetExtraParams, function (name, value) {
+            if (_this.notAllowedExtraParams.includes(name)) {
+                return;
+            }
             _this.$set(_this.extraParams, name, value);
         });
     };

package/js/x-modules/extra-params/components/snippet-config-extra-params.vue_rollup-plugin-vue=script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"snippet-config-extra-params.vue_rollup-plugin-vue=script.js","sources":["../../../../../src/x-modules/extra-params/components/snippet-config-extra-params.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Watch, Inject } from 'vue-property-decorator';\nimport { xComponentMixin } from '../../../components';\nimport { Dictionary, forEach } from '../../../utils';\nimport { SnippetConfig } from '../../../x-installer';\nimport { extraParamsXModule } from '../x-module';\nimport ExtraParams from './extra-params.vue';\n\n/*\n Extracts the extra parameters from the {@link SnippetConfig} and syncs it with the request\n * objects of every x-module.\n \n @public\n /\n@Component({\n components: { ExtraParams },\n mixins: [xComponentMixin(extraParamsXModule)]\n})\nexport default class SnippetConfigExtraParams extends Vue {\n /\n It injects {@link SnippetConfig} provided by an ancestor as snippetConfig.\n \n @internal\n /\n @Inject('snippetConfig')\n public snippetConfig!: SnippetConfig;\n\n /\n Custom object containing the extra params from the snippet config.\n \n @remarks This object keeps manually the desired snippet config properties to avoid\n * unnecessary re-renders.\n \n @internal\n /\n protected extraParams: Dictionary<unknown> = {};\n\n /\n Updates the extraParams object when the snippet config changes.\n \n @param snippetConfig - The new snippet config.\n \n @internal\n */\n @Watch('snippetConfig', { deep: true, immediate: true })\n syncExtraParams({\n instance,\n scope,\n lang,\n searchLang,\n consent,\n documentDirection,\n currency,\n ...snippetExtraParams\n }: SnippetConfig): void {\n forEach(snippetExtraParams, (name, value) => {\n this.$set(this.extraParams, name, value);\n });\n }\n}\n"],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAaA;;;;;;AAUA;IAAsD,4CAAG;IAAzD;QAAA,~~qEAyCC~~;;;;;;;;;~~QAxBW~~,iBAAW,GAAwB,EAAE,CAAC;;~~KAwBjD~~;;;;;;;;~~IAdC~~,kDAAe,GAAf,UAAgB,EASA;QAVhB,~~iBAcC~~;~~QAZC~~,IAAA,QAAQ,cAAA,EACR,KAAK,WAAA,EACL,IAAI,UAAA,EACJ,UAAU,gBAAA,EACV,OAAO,aAAA,EACP,iBAAiB,uBAAA,EACjB,QAAQ,cAAA,EACL,kBAAkB,cARP,uFASf,CADsB;QAErB,OAAO,CAAC,kBAAkB,EAAE,UAAC,IAAI,EAAE,KAAK;YACtC,KAAI,CAAC,IAAI,CAAC,KAAI,CAAC,WAAW,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;SAC1C,CAAC,CAAC;KACJ;~~IAjCD~~;QADC,MAAM,CAAC,eAAe,CAAC;mEACa;~~IAoBrC~~;QADC,KAAK,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;~~mEAcvD~~;~~IAxCkB~~,wBAAwB;QAJ5C,SAAS,CAAC;YACT,UAAU,EAAE,EAAE,WAAW,aAAA,EAAE;YAC3B,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;SAC9C,CAAC;OACmB,wBAAwB,~~CAyC5C~~;IAAD,+BAAC;CAAA,~~CAzCqD~~,GAAG;;;;"}
1	+ {"version":3,"file":"snippet-config-extra-params.vue_rollup-plugin-vue=script.js","sources":["../../../../../src/x-modules/extra-params/components/snippet-config-extra-params.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Watch, Inject } from 'vue-property-decorator';\nimport { xComponentMixin } from '../../../components';\nimport { Dictionary, forEach } from '../../../utils';\nimport { SnippetConfig } from '../../../x-installer';\nimport { extraParamsXModule } from '../x-module';\nimport ExtraParams from './extra-params.vue';\n\n/*\n Extracts the extra parameters from the {@link SnippetConfig} and syncs it with the request\n * objects of every x-module.\n \n @public\n /\n@Component({\n components: { ExtraParams },\n mixins: [xComponentMixin(extraParamsXModule)]\n})\nexport default class SnippetConfigExtraParams extends Vue {\n /\n It injects {@link SnippetConfig} provided by an ancestor as snippetConfig.\n \n @internal\n /\n @Inject('snippetConfig')\n public snippetConfig!: SnippetConfig;\n\n /\n Custom object containing the extra params from the snippet config.\n \n @remarks This object keeps manually the desired snippet config properties to avoid\n * unnecessary re-renders.\n \n @internal\n /\n protected extraParams: Dictionary<unknown> = {};\n\n /\n Collection of properties from the snippet config not allowed to be sent as extra params.\n \n @internal\n /\n protected notAllowedExtraParams: Array<keyof SnippetConfig> = ['callbacks'];\n\n /\n Updates the extraParams object when the snippet config changes.\n \n @param snippetConfig - The new snippet config.\n \n @internal\n */\n @Watch('snippetConfig', { deep: true, immediate: true })\n syncExtraParams({\n instance,\n scope,\n lang,\n searchLang,\n consent,\n documentDirection,\n currency,\n ...snippetExtraParams\n }: SnippetConfig): void {\n forEach(snippetExtraParams, (name, value) => {\n if (this.notAllowedExtraParams.includes(name)) {\n return;\n }\n this.$set(this.extraParams, name, value);\n });\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA;;;;;;AAUA;IAAsD,4CAAG;IAAzD;QAAA,qEAmDC;;;;;;;;;QAlCW,iBAAW,GAAwB,EAAE,CAAC;;;;;;QAOtC,2BAAqB,GAA+B,CAAC,WAAW,CAAC,CAAC;;KA2B7E;;;;;;;;IAjBC,kDAAe,GAAf,UAAgB,EASA;QAVhB,iBAiBC;QAfC,IAAA,QAAQ,cAAA,EACR,KAAK,WAAA,EACL,IAAI,UAAA,EACJ,UAAU,gBAAA,EACV,OAAO,aAAA,EACP,iBAAiB,uBAAA,EACjB,QAAQ,cAAA,EACL,kBAAkB,cARP,uFASf,CADsB;QAErB,OAAO,CAAC,kBAAkB,EAAE,UAAC,IAAI,EAAE,KAAK;YACtC,IAAI,KAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;gBAC7C,OAAO;aACR;YACD,KAAI,CAAC,IAAI,CAAC,KAAI,CAAC,WAAW,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;SAC1C,CAAC,CAAC;KACJ;IA3CD;QADC,MAAM,CAAC,eAAe,CAAC;mEACa;IA2BrC;QADC,KAAK,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;mEAiBvD;IAlDkB,wBAAwB;QAJ5C,SAAS,CAAC;YACT,UAAU,EAAE,EAAE,WAAW,aAAA,EAAE;YAC3B,MAAM,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;SAC9C,CAAC;OACmB,wBAAwB,CAmD5C;IAAD,+BAAC;CAAA,CAnDqD,GAAG;;;;"}

package/js/x-modules/facets/components/clear-filters.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"clear-filters.vue.js","sources":["../../../../../src/x-modules/facets/components/clear-filters.vue"],"sourcesContent":["<template>\n <BaseEventButton\n v-if=\"show\"\n class=\"x-button x-clear-filters\"\n data-test=\"clear-filters\"\n :disabled=\"!areThereSelectedFilters\"\n :events=\"events\"\n :class=\"cssClasses\"\n >\n <slot :selectedFilters=\"facetsSelectedFilters\">\n Clear Filters ({{ facetsSelectedFilters.length }})\n </slot>\n </BaseEventButton>\n</template>\n\n<script lang=\"ts\">\n import { Facet, Filter, isFacetFilter } from '@empathyco/x-types';\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { Getter, xComponentMixin } from '../../../components';\n import BaseEventButton from '../../../components/base-event-button.vue';\n import { VueCSSClasses } from '../../../utils';\n import { XEventsTypes } from '../../../wiring';\n import { facetsXModule } from '../x-module';\n\n /*\n Renders a simple button, emitting the needed events when clicked.\n \n @public\n /\n @Component({\n components: { BaseEventButton },\n mixins: [xComponentMixin(facetsXModule)]\n })\n export default class ClearFilters extends Vue {\n /\n It handles if the ClearFilters button is always visible no matter if there are not\n * filters selected. If false, the ClearFilters button is not visible whether\n * there are no filters selected.\n \n @public\n /\n @Prop({ default: false })\n public alwaysVisible!: boolean;\n\n /\n Array of facets ids that will be passed to event like payload.\n \n @public\n /\n @Prop()\n public facetsIds?: Array<Facet['id']>;\n\n /\n Get the selected filters from store.\n \n @internal\n /\n @Getter('facets', 'selectedFilters')\n public allSelectedFilters!: Filter[];\n\n /\n If alwaysVisible prop is true, ClearAllFilters button is always shown, but disabled\n * if there are no filters selected.\n * If alwaysVisible prop is false, ClearAllFilters button is shown whether there\n * are some filter selected.\n \n @returns True if alwaysVisible is true or in the opposite case true or false depends\n * on if there are selected filters or not.\n \n @internal\n /\n protected get show(): boolean {\n return this.alwaysVisible \|\| this.areThereSelectedFilters;\n }\n\n /\n Get selected filters.\n * If there are facets ids, get selected filters whose facet id match with some of facets ids.\n * If there aren't facets ids, get selected filters.\n \n @returns Array of selected filters depends on there are facets ids or not.\n * @internal\n /\n protected get facetsSelectedFilters(): Filter[] {\n if (this.facetsIds) {\n return this.allSelectedFilters.filter(\n filter => isFacetFilter(filter) && this.facetsIds!.includes(filter.facetId)\n );\n } else {\n return this.allSelectedFilters;\n }\n }\n\n /\n Check if there are selected filters.\n \n @returns True or false depends on if there are facets ids and if there are selected filters.\n * @internal\n /\n protected get areThereSelectedFilters(): boolean {\n return !!this.facetsSelectedFilters.length;\n }\n\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.areThereSelectedFilters,\n 'x-clear-filters--has-selected-filters': this.areThereSelectedFilters\n };\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n# Examples\n\nThis component renders a button, which on clicked emits the `UserClickedClearAllFilters` or\n`UserClickedClearAllFilters` event.\n\n## Basic usage\n\n```vue\n<ClearFilters />\n```\n\n## Customizing its contents\n\nIn this example, show the custom message in button.\n\n```vue\n<ClearFilters v-slot=\"{ selectedFilters }\">\n Delete {{ selectedFilters.length }} selected\n</ClearFilters>\n```\n\nIn this example, show the custom message in button with always visible a true and list of facets\nids.\n\n```vue\n<ClearFilters v-slot=\"{ selectedFilters }\" :alwaysVisible=\"true\" :facetsIds=\"facetsIds\">\n Delete {{ selectedFilters.length }} selected\n</ClearFilters>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `UserClickedClearAllFilters`: the event is emitted after the user clicks the button to clear a\n certain facets filter. The event payload is the id of the facets that are going to be cleared.\n- `UserClickedClearAllFilters`: the event is emitted after the user clicks the button. The event\n payload is undefined.\n</docs>\n"],"names":["const"],"mappings":";;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"clear-filters.vue.js","sources":["../../../../../src/x-modules/facets/components/clear-filters.vue"],"sourcesContent":["<template>\n <BaseEventButton\n v-if=\"show\"\n class=\"x-button x-clear-filters\"\n data-test=\"clear-filters\"\n :disabled=\"!areThereSelectedFilters\"\n :events=\"events\"\n :class=\"cssClasses\"\n >\n <slot :selectedFilters=\"facetsSelectedFilters\">\n Clear Filters ({{ facetsSelectedFilters.length }})\n </slot>\n </BaseEventButton>\n</template>\n\n<script lang=\"ts\">\n import { Facet, Filter, isFacetFilter } from '@empathyco/x-types';\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { Getter, xComponentMixin } from '../../../components';\n import BaseEventButton from '../../../components/base-event-button.vue';\n import { VueCSSClasses } from '../../../utils';\n import { XEventsTypes } from '../../../wiring';\n import { facetsXModule } from '../x-module';\n\n /*\n Renders a simple button, emitting the needed events when clicked.\n \n @public\n /\n @Component({\n components: { BaseEventButton },\n mixins: [xComponentMixin(facetsXModule)]\n })\n export default class ClearFilters extends Vue {\n /\n It handles if the ClearFilters button is always visible no matter if there are not\n * filters selected. If false, the ClearFilters button is not visible whether\n * there are no filters selected.\n \n @public\n /\n @Prop({ default: false })\n public alwaysVisible!: boolean;\n\n /\n Array of facets ids that will be passed to event like payload.\n \n @public\n /\n @Prop()\n public facetsIds?: Array<Facet['id']>;\n\n /\n Get the selected filters from store.\n \n @internal\n /\n @Getter('facets', 'selectedFilters')\n public allSelectedFilters!: Filter[];\n\n /\n If alwaysVisible prop is true, ClearAllFilters button is always shown, but disabled\n * if there are no filters selected.\n * If alwaysVisible prop is false, ClearAllFilters button is shown whether there\n * are some filter selected.\n \n @returns True if alwaysVisible is true or in the opposite case true or false depends\n * on if there are selected filters or not.\n \n @internal\n /\n protected get show(): boolean {\n return this.alwaysVisible \|\| this.areThereSelectedFilters;\n }\n\n /\n Get selected filters.\n * If there are facets ids, get selected filters whose facet id match with some of facets ids.\n * If there aren't facets ids, get selected filters.\n \n @returns Array of selected filters depends on there are facets ids or not.\n * @internal\n /\n protected get facetsSelectedFilters(): Filter[] {\n if (this.facetsIds) {\n return this.allSelectedFilters.filter(\n filter => isFacetFilter(filter) && this.facetsIds!.includes(filter.facetId)\n );\n } else {\n return this.allSelectedFilters;\n }\n }\n\n /\n Check if there are selected filters.\n \n @returns True or false depends on if there are facets ids and if there are selected filters.\n * @internal\n /\n protected get areThereSelectedFilters(): boolean {\n return !!this.facetsSelectedFilters.length;\n }\n\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.areThereSelectedFilters,\n 'x-clear-filters--has-selected-filters': this.areThereSelectedFilters\n };\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## Examples\n\nThis component renders a button, which on clicked emits the `UserClickedClearAllFilters` or\n`UserClickedClearAllFilters` event.\n\n### Basic usage\n\n```vue\n<ClearFilters />\n```\n\n### Customizing its contents\n\nIn this example, show the custom message in button.\n\n```vue\n<ClearFilters v-slot=\"{ selectedFilters }\">\n Delete {{ selectedFilters.length }} selected\n</ClearFilters>\n```\n\nIn this example, show the custom message in button with always visible a true and list of facets\nids.\n\n```vue\n<ClearFilters v-slot=\"{ selectedFilters }\" :alwaysVisible=\"true\" :facetsIds=\"facetsIds\">\n Delete {{ selectedFilters.length }} selected\n</ClearFilters>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `UserClickedClearAllFilters`: the event is emitted after the user clicks the button to clear a\n certain facets filter. The event payload is the id of the facets that are going to be cleared.\n- `UserClickedClearAllFilters`: the event is emitted after the user clicks the button. The event\n payload is undefined.\n</docs>\n"],"names":["const"],"mappings":";;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/js/x-modules/facets/components/clear-filters.vue_rollup-plugin-vue=script.js CHANGED Viewed

@@ -8,7 +8,7 @@ import '../../../components/animations/collapse-height.vue.js';
 import '../../../components/animations/collapse-width.vue.js';
 import '../../../components/animations/cross-fade.vue.js';
 import '../../../components/animations/fade-and-slide.vue.js';
-import '../../../components/staggering-transition-group.vue.js';
+import '../../../components/animations/staggering-transition-group.vue.js';
 import '../../../components/animations/staggered-fade-and-slide.vue.js';
 import '../../../components/animations/translate-from-left.vue.js';
 import '../../../components/animations/translate-from-right.vue.js';
@@ -69,16 +69,24 @@ import '../../../components/icons/trash.vue.js';
 import '../../../components/icons/trending-tiny.vue.js';
 import '../../../components/icons/trending.vue.js';
 import '../../../components/icons/user.vue.js';
-import '../../../components/modals/base-events-modal-close.vue.js';
+import { Getter } from '../../../components/decorators/store.decorators.js';
+import '../../../components/x-component.utils.js';
+import { xComponentMixin } from '../../../components/x-component.mixin.js';
 import '../../../components/modals/base-modal.vue.js';
+import '../../../components/modals/base-id-modal.vue.js';
+import '../../../components/scroll/scroll.mixin.js';
+import '../../../components/scroll/base-scroll.vue.js';
+import '../../../components/layouts/fixed-header-and-asides-layout.vue.js';
+import '../../../components/panels/base-toggle-panel.vue.js';
+import '../../../components/panels/base-id-toggle-panel.vue.js';
+import '../../../components/layouts/multi-column-max-width-layout.vue.js';
+import '../../../components/layouts/single-column-layout.vue.js';
+import '../../../components/modals/base-events-modal-close.vue.js';
 import '../../../components/modals/base-events-modal.vue.js';
 import '../../../components/modals/base-events-modal-open.vue.js';
-import '../../../components/modals/base-id-modal.vue.js';
 import '../../../components/modals/base-id-modal-close.vue.js';
 import '../../../components/modals/base-id-modal-open.vue.js';
-import '../../../components/panels/base-toggle-panel.vue.js';
 import '../../../components/panels/base-header-toggle-panel.vue.js';
-import '../../../components/panels/base-id-toggle-panel.vue.js';
 import '../../../components/panels/base-id-toggle-panel-button.vue.js';
 import '../../../components/result/base-result-add-to-cart.vue.js';
 import '../../../components/result/base-result-current-price.vue.js';
@@ -87,8 +95,6 @@ import '../../../components/result/base-result-link.vue.js';
 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/scroll/scroll.mixin.js';
-import '../../../components/scroll/base-scroll.vue.js';
 import '../../../components/suggestions/base-suggestion.vue.js';
 import '../../../components/suggestions/base-suggestions.vue.js';
 import '../../../components/auto-progress-bar.vue.js';
@@ -99,11 +105,6 @@ import '../../../components/base-variable-column-grid.vue.js';
 import '../../../components/decorators/debounce.decorators.js';
 import '../../../components/sliding-panel.vue.js';
 import '../../../components/items-list.vue.js';
-import { Getter } from '../../../components/decorators/store.decorators.js';
-import '../../../components/x-component.utils.js';
-import { xComponentMixin } from '../../../components/x-component.mixin.js';
-import '../../../components/layouts/multi-column-max-width-layout.vue.js';
-import '../../../components/layouts/single-column-layout.vue.js';
 import '../../../components/location-provider.vue.js';
 import '../../../components/global-x-bus.vue.js';
 import '../../../components/snippet-callbacks.vue.js';

package/js/x-modules/facets/components/clear-filters.vue_rollup-plugin-vue=script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"clear-filters.vue_rollup-plugin-vue=script.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\n\n\nimport { Facet, Filter, isFacetFilter } from '@empathyco/x-types';\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { Getter, xComponentMixin } from '../../../components';\nimport BaseEventButton from '../../../components/base-event-button.vue';\nimport { VueCSSClasses } from '../../../utils';\nimport { XEventsTypes } from '../../../wiring';\nimport { facetsXModule } from '../x-module';\n\n/*\n Renders a simple button, emitting the needed events when clicked.\n \n @public\n /\n@Component({\n components: { BaseEventButton },\n mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class ClearFilters extends Vue {\n /\n It handles if the ClearFilters button is always visible no matter if there are not\n * filters selected. If false, the ClearFilters button is not visible whether\n * there are no filters selected.\n \n @public\n /\n @Prop({ default: false })\n public alwaysVisible!: boolean;\n\n /\n Array of facets ids that will be passed to event like payload.\n \n @public\n /\n @Prop()\n public facetsIds?: Array<Facet['id']>;\n\n /\n Get the selected filters from store.\n \n @internal\n /\n @Getter('facets', 'selectedFilters')\n public allSelectedFilters!: Filter[];\n\n /\n If alwaysVisible prop is true, ClearAllFilters button is always shown, but disabled\n * if there are no filters selected.\n * If alwaysVisible prop is false, ClearAllFilters button is shown whether there\n * are some filter selected.\n \n @returns True if alwaysVisible is true or in the opposite case true or false depends\n * on if there are selected filters or not.\n \n @internal\n /\n protected get show(): boolean {\n return this.alwaysVisible \|\| this.areThereSelectedFilters;\n }\n\n /\n Get selected filters.\n * If there are facets ids, get selected filters whose facet id match with some of facets ids.\n * If there aren't facets ids, get selected filters.\n \n @returns Array of selected filters depends on there are facets ids or not.\n * @internal\n /\n protected get facetsSelectedFilters(): Filter[] {\n if (this.facetsIds) {\n return this.allSelectedFilters.filter(\n filter => isFacetFilter(filter) && this.facetsIds!.includes(filter.facetId)\n );\n } else {\n return this.allSelectedFilters;\n }\n }\n\n /\n Check if there are selected filters.\n \n @returns True or false depends on if there are facets ids and if there are selected filters.\n * @internal\n /\n protected get areThereSelectedFilters(): boolean {\n return !!this.facetsSelectedFilters.length;\n }\n\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.areThereSelectedFilters,\n 'x-clear-filters--has-selected-filters': this.areThereSelectedFilters\n };\n }\n}\n"],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAyBA;;;;;AASA;IAA0C,gCAAG;IAA7C;;KAkGC;IA5DC,sBAAc,8BAAI;;;;;;;;;;;;aAAlB;YACE,OAAO,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,uBAAuB,CAAC;SAC3D;;;OAAA;IAUD,sBAAc,+CAAqB;;;;;;;;;aAAnC;YAAA,iBAQC;YAPC,IAAI,IAAI,CAAC,SAAS,EAAE;gBAClB,OAAO,IAAI,CAAC,kBAAkB,CAAC,MAAM,CACnC,UAAA,MAAM,IAAI,OAAA,aAAa,CAAC,MAAM,CAAC,IAAI,KAAI,CAAC,SAAU,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,GAAA,CAC5E,CAAC;aACH;iBAAM;gBACL,OAAO,IAAI,CAAC,kBAAkB,CAAC;aAChC;SACF;;;OAAA;IAQD,sBAAc,iDAAuB;;;;;;;aAArC;YACE,OAAO,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,MAAM,CAAC;SAC5C;;;OAAA;IAQD,sBAAc,gCAAM;;;;;;;aAApB;YACE,OAAO,IAAI,CAAC,SAAS;kBACjB;oBACE,0BAA0B,EAAE,IAAI,CAAC,SAAS;iBAC3C;kBACD;oBACE,0BAA0B,EAAE,SAAS;iBACtC,CAAC;SACP;;;OAAA;IAQD,sBAAc,oCAAU;;;;;;;aAAxB;YACE,OAAO;gBACL,2CAA2C,EAAE,CAAC,IAAI,CAAC,uBAAuB;gBAC1E,uCAAuC,EAAE,IAAI,CAAC,uBAAuB;aACtE,CAAC;SACH;;;OAAA;IAxFD;QADC,IAAI,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;uDACM;IAQ/B;QADC,IAAI,EAAE;mDAC+B;IAQtC;QADC,MAAM,CAAC,QAAQ,EAAE,iBAAiB,CAAC;4DACC;IAzBlB,YAAY;QAJhC,SAAS,CAAC;YACT,UAAU,EAAE,EAAE,eAAe,iBAAA,EAAE;YAC/B,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;SACzC,CAAC;OACmB,YAAY,CAkGhC;IAAD,mBAAC;CAAA,CAlGyC,GAAG;;;;"}
1	+ {"version":3,"file":"clear-filters.vue_rollup-plugin-vue=script.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\n\n\nimport { Facet, Filter, isFacetFilter } from '@empathyco/x-types';\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { Getter, xComponentMixin } from '../../../components';\nimport BaseEventButton from '../../../components/base-event-button.vue';\nimport { VueCSSClasses } from '../../../utils';\nimport { XEventsTypes } from '../../../wiring';\nimport { facetsXModule } from '../x-module';\n\n/*\n Renders a simple button, emitting the needed events when clicked.\n \n @public\n /\n@Component({\n components: { BaseEventButton },\n mixins: [xComponentMixin(facetsXModule)]\n})\nexport default class ClearFilters extends Vue {\n /\n It handles if the ClearFilters button is always visible no matter if there are not\n * filters selected. If false, the ClearFilters button is not visible whether\n * there are no filters selected.\n \n @public\n /\n @Prop({ default: false })\n public alwaysVisible!: boolean;\n\n /\n Array of facets ids that will be passed to event like payload.\n \n @public\n /\n @Prop()\n public facetsIds?: Array<Facet['id']>;\n\n /\n Get the selected filters from store.\n \n @internal\n /\n @Getter('facets', 'selectedFilters')\n public allSelectedFilters!: Filter[];\n\n /\n If alwaysVisible prop is true, ClearAllFilters button is always shown, but disabled\n * if there are no filters selected.\n * If alwaysVisible prop is false, ClearAllFilters button is shown whether there\n * are some filter selected.\n \n @returns True if alwaysVisible is true or in the opposite case true or false depends\n * on if there are selected filters or not.\n \n @internal\n /\n protected get show(): boolean {\n return this.alwaysVisible \|\| this.areThereSelectedFilters;\n }\n\n /\n Get selected filters.\n * If there are facets ids, get selected filters whose facet id match with some of facets ids.\n * If there aren't facets ids, get selected filters.\n \n @returns Array of selected filters depends on there are facets ids or not.\n * @internal\n /\n protected get facetsSelectedFilters(): Filter[] {\n if (this.facetsIds) {\n return this.allSelectedFilters.filter(\n filter => isFacetFilter(filter) && this.facetsIds!.includes(filter.facetId)\n );\n } else {\n return this.allSelectedFilters;\n }\n }\n\n /\n Check if there are selected filters.\n \n @returns True or false depends on if there are facets ids and if there are selected filters.\n * @internal\n /\n protected get areThereSelectedFilters(): boolean {\n return !!this.facetsSelectedFilters.length;\n }\n\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.areThereSelectedFilters,\n 'x-clear-filters--has-selected-filters': this.areThereSelectedFilters\n };\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA;;;;;AASA;IAA0C,gCAAG;IAA7C;;KAkGC;IA5DC,sBAAc,8BAAI;;;;;;;;;;;;aAAlB;YACE,OAAO,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,uBAAuB,CAAC;SAC3D;;;OAAA;IAUD,sBAAc,+CAAqB;;;;;;;;;aAAnC;YAAA,iBAQC;YAPC,IAAI,IAAI,CAAC,SAAS,EAAE;gBAClB,OAAO,IAAI,CAAC,kBAAkB,CAAC,MAAM,CACnC,UAAA,MAAM,IAAI,OAAA,aAAa,CAAC,MAAM,CAAC,IAAI,KAAI,CAAC,SAAU,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,GAAA,CAC5E,CAAC;aACH;iBAAM;gBACL,OAAO,IAAI,CAAC,kBAAkB,CAAC;aAChC;SACF;;;OAAA;IAQD,sBAAc,iDAAuB;;;;;;;aAArC;YACE,OAAO,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,MAAM,CAAC;SAC5C;;;OAAA;IAQD,sBAAc,gCAAM;;;;;;;aAApB;YACE,OAAO,IAAI,CAAC,SAAS;kBACjB;oBACE,0BAA0B,EAAE,IAAI,CAAC,SAAS;iBAC3C;kBACD;oBACE,0BAA0B,EAAE,SAAS;iBACtC,CAAC;SACP;;;OAAA;IAQD,sBAAc,oCAAU;;;;;;;aAAxB;YACE,OAAO;gBACL,2CAA2C,EAAE,CAAC,IAAI,CAAC,uBAAuB;gBAC1E,uCAAuC,EAAE,IAAI,CAAC,uBAAuB;aACtE,CAAC;SACH;;;OAAA;IAxFD;QADC,IAAI,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;uDACM;IAQ/B;QADC,IAAI,EAAE;mDAC+B;IAQtC;QADC,MAAM,CAAC,QAAQ,EAAE,iBAAiB,CAAC;4DACC;IAzBlB,YAAY;QAJhC,SAAS,CAAC;YACT,UAAU,EAAE,EAAE,eAAe,iBAAA,EAAE;YAC/B,MAAM,EAAE,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;SACzC,CAAC;OACmB,YAAY,CAkGhC;IAAD,mBAAC;CAAA,CAlGyC,GAAG;;;;"}

package/js/x-modules/facets/components/facets/facets-provider.vue.js CHANGED Viewed

@@ -10,11 +10,11 @@ var __vue_script__ = script;
   /* style */
   var __vue_inject_styles__ = function (inject) {
     if (!inject) { return }
-    inject("data-v-0739bd06_0", { source: ".x-facets-list[data-v-0739bd06] {\n  list-style-type: none;\n}", map: undefined, media: undefined });
+    inject("data-v-8b95797a_0", { source: ".x-facets-list[data-v-8b95797a] {\n  list-style-type: none;\n}", map: undefined, media: undefined });
   };
   /* scoped */
-  var __vue_scope_id__ = "data-v-0739bd06";
+  var __vue_scope_id__ = "data-v-8b95797a";
   /* module identifier */
   var __vue_module_identifier__ = undefined;
   /* functional template */

package/js/x-modules/facets/components/facets/facets-provider.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"facets-provider.vue.js","sources":["../../../../../../src/x-modules/facets/components/facets/facets-provider.vue"],"sourcesContent":["<script lang=\"ts\">\n import { Facet, Filter } from '@empathyco/x-types';\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { XOn } from '../../../../components';\n import { xComponentMixin } from '../../../../components/x-component.mixin';\n import { areFiltersDifferent } from '../../../../utils/filters';\n import { FacetsGroup } from '../../service/types';\n import { GroupId } from '../../store/types';\n import { 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 })\n export 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 Creates a watcher for the `facetsGroup`, if they're set, emitting an\n * event whenever they change. This is done this way because the {@link XBus} is not injected\n * until the component is created.\n \n @internal\n /\n protected created(): void {\n this.$watch('facetsGroup', this.provideFacets.bind(this), { immediate: true });\n }\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 provideFacets(): void {\n if (this.facetsGroup.facets) {\n this.$x.emit('FacetsGroupProvided', this.facetsGroup);\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 => facet.filters)\n .filter(filter => filter.selected);\n }\n\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n render(): void {}\n }\n</script>\n\n<style lang=\"scss\" scoped>\n .x-facets-list {\n list-style-type: none;\n }\n</style>\n\n<docs lang=\"mdx\">\n# Example\n\nThis component allows to provide facets by prop, to add them to the state of the `Facets X-Module`.\nThese facets will be added to the `Facets X-Module` state together with the facets emitted by the\n`Search X-Module` through the {@link SearchXEvents.FacetsChanged} event.\n\n```vue\n<template>\n <FacetsProvider :facets=\"myFacets\" />\n</template>\n\n<script>\n import { FacetsProvider } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n FacetsProvider\n },\n data() {\n return {\n myFacets: [\n {\n modelName: 'SimpleFacet',\n id: 'color-facet',\n label: 'Color',\n filters: [\n {\n modelName: 'SimpleFilter',\n id: 'color:red',\n facetId: 'color-facet',\n label: 'Red',\n selected: false,\n value: 'color:red',\n totalResults: 10\n },\n {\n modelName: 'SimpleFilter',\n id: 'color:blue',\n facetId: 'color-facet',\n label: 'Blue',\n selected: false,\n value: 'color:blue',\n totalResults: 10\n }\n ]\n }\n ]\n };\n }\n };\n</script>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `UserChangedSelectedFilters`: the event is emitted after the user performed an action that changed\n the selected filters. The payload is the new list of selected filters.\n- `FacetsGroupProvided`: the event is emitted after updating the facets prop with a new list of\n facets. The payload contains a Facets Group with the facets and the group id.\n</docs>\n"],"names":["const"],"mappings":";;;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"facets-provider.vue.js","sources":["../../../../../../src/x-modules/facets/components/facets/facets-provider.vue"],"sourcesContent":["<script lang=\"ts\">\n import { Facet, Filter } from '@empathyco/x-types';\n import Vue from 'vue';\n import { Component, Prop, Watch } from 'vue-property-decorator';\n import { XOn } from '../../../../components';\n import { xComponentMixin } from '../../../../components/x-component.mixin';\n import { areFiltersDifferent } from '../../../../utils/filters';\n import { FacetsGroup } from '../../service/types';\n import { GroupId } from '../../store/types';\n import { 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 })\n export 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 this.$x.emit('FacetsGroupProvided', this.facetsGroup);\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 => facet.filters)\n .filter(filter => filter.selected);\n }\n\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n render(): void {}\n }\n</script>\n\n<style lang=\"scss\" scoped>\n .x-facets-list {\n list-style-type: none;\n }\n</style>\n\n<docs lang=\"mdx\">\n## Example\n\nThis component allows to provide facets by prop, to add them to the state of the `Facets X-Module`.\nThese facets will be added to the `Facets X-Module` state together with the facets emitted by the\n`Search X-Module` through the {@link SearchXEvents.FacetsChanged} event.\n\n```vue\n<template>\n <FacetsProvider :facets=\"myFacets\" />\n</template>\n\n<script>\n import { FacetsProvider } from '@empathyco/x-components/facets';\n\n export default {\n components: {\n FacetsProvider\n },\n data() {\n return {\n myFacets: [\n {\n modelName: 'SimpleFacet',\n id: 'color-facet',\n label: 'Color',\n filters: [\n {\n modelName: 'SimpleFilter',\n id: 'color:red',\n facetId: 'color-facet',\n label: 'Red',\n selected: false,\n value: 'color:red',\n totalResults: 10\n },\n {\n modelName: 'SimpleFilter',\n id: 'color:blue',\n facetId: 'color-facet',\n label: 'Blue',\n selected: false,\n value: 'color:blue',\n totalResults: 10\n }\n ]\n }\n ]\n };\n }\n };\n</script>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `UserChangedSelectedFilters`: the event is emitted after the user performed an action that changed\n the selected filters. The payload is the new list of selected filters.\n- `FacetsGroupProvided`: the event is emitted after updating the facets prop with a new list of\n facets. The payload contains a Facets Group with the facets and the group id.\n</docs>\n"],"names":["const"],"mappings":";;;;;AAEAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}