@empathyco/x-components 6.0.0-alpha.9 → 6.0.0-alpha.91

package/js/x-modules/experience-controls/store/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sources":["../../../../../src/x-modules/experience-controls/store/module.ts"],"sourcesContent":["/* eslint-disable max-len */\nimport { setStatus } from '../../../store/utils/status-store.utils';\nimport {\n  cancelFetchAndSaveControls,\n  fetchAndSaveExperienceControlsResponse\n} from './actions/fetch-and-save-experience-controls.action';\nimport { fetchExperienceControlsResponse } from './actions/fetch-experience-controls.action';\nimport { experienceControlsRequest } from './getters/experience-controls-results-request.getter';\nimport { ExperienceControlsXStoreModule } from './types';\n/* eslint-enable max-len */\n\n/**.\n * {@link XStoreModule} For the experience-controls module.\n *\n * @internal\n */\nexport const experienceControlsXStoreModule: ExperienceControlsXStoreModule = {\n  state: () => ({\n    controls: {},\n    events: {},\n    status: 'initial',\n    params: {}\n  }),\n  getters: {\n    experienceControlsRequest\n  },\n  mutations: {\n    setControls(state, controls) {\n      state.controls = controls;\n    },\n    setEvents(state, events) {\n      state.events = events;\n    },\n    setParams(state, params) {\n      state.params = params;\n    },\n    setStatus\n  },\n  actions: {\n    fetchExperienceControlsResponse,\n    fetchAndSaveExperienceControlsResponse,\n    cancelFetchAndSaveControls\n  }\n};\n"],"names":[],"mappings":";;;;;AAAA;AASA;AAEA;;;;AAIG;AACU,MAAA,8BAA8B,GAAmC;AAC5E,IAAA,KAAK,EAAE,OAAO;AACZ,QAAA,QAAQ,EAAE,EAAE;AACZ,QAAA,MAAM,EAAE,EAAE;AACV,QAAA,MAAM,EAAE,SAAS;AACjB,QAAA,MAAM,EAAE,EAAE;KACX,CAAC;AACF,IAAA,OAAO,EAAE;QACP,yBAAyB;AAC1B,KAAA;AACD,IAAA,SAAS,EAAE;QACT,WAAW,CAAC,KAAK,EAAE,QAAQ,EAAA;AACzB,YAAA,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;SAC3B;QACD,SAAS,CAAC,KAAK,EAAE,MAAM,EAAA;AACrB,YAAA,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;SACvB;QACD,SAAS,CAAC,KAAK,EAAE,MAAM,EAAA;AACrB,YAAA,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;SACvB;QACD,SAAS;AACV,KAAA;AACD,IAAA,OAAO,EAAE;QACP,+BAA+B;QAC/B,sCAAsC;QACtC,0BAA0B;AAC3B,KAAA;;;;;"}
+{"version":3,"file":"module.js","sources":["../../../../../src/x-modules/experience-controls/store/module.ts"],"sourcesContent":["import type { ExperienceControlsXStoreModule } from './types'\nimport { setStatus } from '../../../store/utils/status-store.utils'\nimport {\n  cancelFetchAndSaveControls,\n  fetchAndSaveExperienceControlsResponse,\n} from './actions/fetch-and-save-experience-controls.action'\nimport { fetchExperienceControlsResponse } from './actions/fetch-experience-controls.action'\nimport { experienceControlsRequest } from './getters/experience-controls-results-request.getter'\n\n/**.\n * {@link XStoreModule} For the experience-controls module.\n *\n * @internal\n */\nexport const experienceControlsXStoreModule: ExperienceControlsXStoreModule = {\n  state: () => ({\n    controls: {},\n    events: {},\n    status: 'initial',\n    params: {},\n  }),\n  getters: {\n    experienceControlsRequest,\n  },\n  mutations: {\n    setControls(state, controls) {\n      state.controls = controls\n    },\n    setEvents(state, events) {\n      state.events = events\n    },\n    setParams(state, params) {\n      state.params = params\n    },\n    setStatus,\n  },\n  actions: {\n    fetchExperienceControlsResponse,\n    fetchAndSaveExperienceControlsResponse,\n    cancelFetchAndSaveControls,\n  },\n}\n"],"names":[],"mappings":";;;;;AASA;;;;AAIG;AACU,MAAA,8BAA8B,GAAmC;AAC5E,IAAA,KAAK,EAAE,OAAO;AACZ,QAAA,QAAQ,EAAE,EAAE;AACZ,QAAA,MAAM,EAAE,EAAE;AACV,QAAA,MAAM,EAAE,SAAS;AACjB,QAAA,MAAM,EAAE,EAAE;KACX,CAAC;AACF,IAAA,OAAO,EAAE;QACP,yBAAyB;AAC1B,KAAA;AACD,IAAA,SAAS,EAAE;QACT,WAAW,CAAC,KAAK,EAAE,QAAQ,EAAA;AACzB,YAAA,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;SAC1B;QACD,SAAS,CAAC,KAAK,EAAE,MAAM,EAAA;AACrB,YAAA,KAAK,CAAC,MAAM,GAAG,MAAM,CAAA;SACtB;QACD,SAAS,CAAC,KAAK,EAAE,MAAM,EAAA;AACrB,YAAA,KAAK,CAAC,MAAM,GAAG,MAAM,CAAA;SACtB;QACD,SAAS;AACV,KAAA;AACD,IAAA,OAAO,EAAE;QACP,+BAA+B;QAC/B,sCAAsC;QACtC,0BAA0B;AAC3B,KAAA;;;;;"}

package/js/x-modules/experience-controls/wiring.js

@@ -33,11 +33,11 @@ const fetchAndSaveExperienceControlsWire = wireDispatch('fetchAndSaveExperienceC
  */
 const experienceControlsWiring = createWiring({
     ExtraParamsChanged: {
-        setParamsWire
+        setParamsWire,
     },
     ExperienceControlsRequestUpdated: {
-        fetchAndSaveExperienceControlsWire
-    }
+        fetchAndSaveExperienceControlsWire,
+    },
 });
 
 export { experienceControlsWiring, fetchAndSaveExperienceControlsWire, setParamsWire };

package/js/x-modules/experience-controls/wiring.js.map

@@ -1 +1 @@
-{"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/experience-controls/wiring.ts"],"sourcesContent":["import {\n  namespacedWireCommit,\n  namespacedWireDispatch\n} from '../../wiring/namespaced-wires.factory';\nimport { createWiring } from '../../wiring/wiring.utils';\n\nconst moduleName = 'experienceControls';\n\n/**\n * WireCommit for {@link ExperienceControlsXModule}.\n *\n * @internal\n */\nconst wireCommit = namespacedWireCommit(moduleName);\n\n/**\n * WireDispatch for {@link ExperienceControlsXModule}.\n *\n * @internal\n */\nconst wireDispatch = namespacedWireDispatch(moduleName);\n\n/**\n * WireCommit for {@link ExperienceControlsXModule}.\n *\n * @internal\n */\nexport const setParamsWire = wireCommit('setParams');\n\n/**\n * Requests and stores a new set of controls results.\n *\n * @public\n */\nexport const fetchAndSaveExperienceControlsWire = wireDispatch(\n  'fetchAndSaveExperienceControlsResponse'\n);\n\n/**\n * Wiring configuration for the {@link ExperienceControlsXModule | experience-controls module}.\n *\n * @internal\n */\nexport const experienceControlsWiring = createWiring({\n  ExtraParamsChanged: {\n    setParamsWire\n  },\n  ExperienceControlsRequestUpdated: {\n    fetchAndSaveExperienceControlsWire\n  }\n});\n"],"names":[],"mappings":";;;AAMA,MAAM,UAAU,GAAG,oBAAoB,CAAC;AAExC;;;;AAIG;AACH,MAAM,UAAU,GAAG,oBAAoB,CAAC,UAAU,CAAC,CAAC;AAEpD;;;;AAIG;AACH,MAAM,YAAY,GAAG,sBAAsB,CAAC,UAAU,CAAC,CAAC;AAExD;;;;AAIG;MACU,aAAa,GAAG,UAAU,CAAC,WAAW,EAAE;AAErD;;;;AAIG;MACU,kCAAkC,GAAG,YAAY,CAC5D,wCAAwC,EACxC;AAEF;;;;AAIG;AACI,MAAM,wBAAwB,GAAG,YAAY,CAAC;AACnD,IAAA,kBAAkB,EAAE;QAClB,aAAa;AACd,KAAA;AACD,IAAA,gCAAgC,EAAE;QAChC,kCAAkC;AACnC,KAAA;AACF,CAAA;;;;"}
+{"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/experience-controls/wiring.ts"],"sourcesContent":["import { namespacedWireCommit, namespacedWireDispatch } from '../../wiring/namespaced-wires.factory'\nimport { createWiring } from '../../wiring/wiring.utils'\n\nconst moduleName = 'experienceControls'\n\n/**\n * WireCommit for {@link ExperienceControlsXModule}.\n *\n * @internal\n */\nconst wireCommit = namespacedWireCommit(moduleName)\n\n/**\n * WireDispatch for {@link ExperienceControlsXModule}.\n *\n * @internal\n */\nconst wireDispatch = namespacedWireDispatch(moduleName)\n\n/**\n * WireCommit for {@link ExperienceControlsXModule}.\n *\n * @internal\n */\nexport const setParamsWire = wireCommit('setParams')\n\n/**\n * Requests and stores a new set of controls results.\n *\n * @public\n */\nexport const fetchAndSaveExperienceControlsWire = wireDispatch(\n  'fetchAndSaveExperienceControlsResponse',\n)\n\n/**\n * Wiring configuration for the {@link ExperienceControlsXModule | experience-controls module}.\n *\n * @internal\n */\nexport const experienceControlsWiring = createWiring({\n  ExtraParamsChanged: {\n    setParamsWire,\n  },\n  ExperienceControlsRequestUpdated: {\n    fetchAndSaveExperienceControlsWire,\n  },\n})\n"],"names":[],"mappings":";;;AAGA,MAAM,UAAU,GAAG,oBAAoB,CAAA;AAEvC;;;;AAIG;AACH,MAAM,UAAU,GAAG,oBAAoB,CAAC,UAAU,CAAC,CAAA;AAEnD;;;;AAIG;AACH,MAAM,YAAY,GAAG,sBAAsB,CAAC,UAAU,CAAC,CAAA;AAEvD;;;;AAIG;MACU,aAAa,GAAG,UAAU,CAAC,WAAW,EAAC;AAEpD;;;;AAIG;MACU,kCAAkC,GAAG,YAAY,CAC5D,wCAAwC,EACzC;AAED;;;;AAIG;AACI,MAAM,wBAAwB,GAAG,YAAY,CAAC;AACnD,IAAA,kBAAkB,EAAE;QAClB,aAAa;AACd,KAAA;AACD,IAAA,gCAAgC,EAAE;QAChC,kCAAkC;AACnC,KAAA;AACF,CAAA;;;;"}

package/js/x-modules/experience-controls/x-module.js

@@ -20,7 +20,7 @@ const experienceControlsXModule = {
     name: 'experienceControls',
     storeModule: experienceControlsXStoreModule,
     storeEmitters: experienceControlsEmitters,
-    wiring: experienceControlsWiring
+    wiring: experienceControlsWiring,
 };
 XPlugin.registerXModule(experienceControlsXModule);
 

package/js/x-modules/experience-controls/x-module.js.map

@@ -1 +1 @@
-{"version":3,"file":"x-module.js","sources":["../../../../src/x-modules/experience-controls/x-module.ts"],"sourcesContent":["import { XModule } from '../x-modules.types';\nimport { XPlugin } from '../../plugins/index';\nimport { experienceControlsEmitters } from './store/emitters';\nimport { experienceControlsXStoreModule } from './store/module';\nimport { ExperienceControlsXStoreModule } from './store/types';\nimport { experienceControlsWiring } from './wiring';\n\n/**\n * Search {@link XModule} alias.\n *\n * @public\n */\nexport type ExperienceControlsXModule = XModule<ExperienceControlsXStoreModule>;\n\n/**\n * Search {@link XModule} implementation. This module is auto-registered as soon as you\n * import any component from the `x-controls` entry point.\n *\n * @public\n */\nexport const experienceControlsXModule: ExperienceControlsXModule = {\n  name: 'experienceControls',\n  storeModule: experienceControlsXStoreModule,\n  storeEmitters: experienceControlsEmitters,\n  wiring: experienceControlsWiring\n};\n\nXPlugin.registerXModule(experienceControlsXModule);\n"],"names":[],"mappings":";;;;;;;;;;;;AAcA;;;;;AAKG;AACU,MAAA,yBAAyB,GAA8B;AAClE,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,WAAW,EAAE,8BAA8B;AAC3C,IAAA,aAAa,EAAE,0BAA0B;AACzC,IAAA,MAAM,EAAE,wBAAwB;EAChC;AAEF,OAAO,CAAC,eAAe,CAAC,yBAAyB,CAAC;;;;"}
+{"version":3,"file":"x-module.js","sources":["../../../../src/x-modules/experience-controls/x-module.ts"],"sourcesContent":["import type { XModule } from '../x-modules.types'\nimport type { ExperienceControlsXStoreModule } from './store/types'\nimport { XPlugin } from '../../plugins/index'\nimport { experienceControlsEmitters } from './store/emitters'\nimport { experienceControlsXStoreModule } from './store/module'\nimport { experienceControlsWiring } from './wiring'\n\n/**\n * Search {@link XModule} alias.\n *\n * @public\n */\nexport type ExperienceControlsXModule = XModule<ExperienceControlsXStoreModule>\n\n/**\n * Search {@link XModule} implementation. This module is auto-registered as soon as you\n * import any component from the `x-controls` entry point.\n *\n * @public\n */\nexport const experienceControlsXModule: ExperienceControlsXModule = {\n  name: 'experienceControls',\n  storeModule: experienceControlsXStoreModule,\n  storeEmitters: experienceControlsEmitters,\n  wiring: experienceControlsWiring,\n}\n\nXPlugin.registerXModule(experienceControlsXModule)\n"],"names":[],"mappings":";;;;;;;;;;;;AAcA;;;;;AAKG;AACU,MAAA,yBAAyB,GAA8B;AAClE,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,WAAW,EAAE,8BAA8B;AAC3C,IAAA,aAAa,EAAE,0BAA0B;AACzC,IAAA,MAAM,EAAE,wBAAwB;EACjC;AAED,OAAO,CAAC,eAAe,CAAC,yBAAyB,CAAC;;;;"}

package/js/x-modules/extra-params/components/extra-params.vue.js

@@ -1,7 +1,7 @@
 import { defineComponent, watch } from 'vue';
-import { extraParamsXModule } from '../x-module.js';
 import { use$x } from '../../../composables/use-_x.js';
 import { useState } from '../../../composables/use-state.js';
+import { extraParamsXModule } from '../x-module.js';
 
 /**
  * It emits a {@link ExtraParamsXEvents.ExtraParamsProvided} with the values
@@ -15,20 +15,19 @@ var _sfc_main = defineComponent({
     props: {
         values: {
             type: Object,
-            required: true
-        }
+            required: true,
+        },
     },
     setup(props) {
-        const params = useState('extraParams', ['params']).params;
+        const params = useState('extraParams').params;
         const $x = use$x();
         $x.emit('ExtraParamsInitialized', { ...props.values });
-        $x.emit('ExtraParamsProvided', { ...props.values, ...params.value });
+        $x.emit('ExtraParamsProvided', { ...params.value, ...props.values });
         watch(() => props.values, values => {
             $x.emit('ExtraParamsProvided', { ...values });
         }, { deep: true });
-        // eslint-disable-next-line @typescript-eslint/no-empty-function
         return () => { };
-    }
+    },
 });
 
 export { _sfc_main as default };

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

@@ -1 +1 @@
-{"version":3,"file":"extra-params.vue.js","sources":["../../../../../src/x-modules/extra-params/components/extra-params.vue"],"sourcesContent":["<script lang=\"ts\">\n  import { Dictionary } from '@empathyco/x-utils';\n  import { ComputedRef, defineComponent, PropType, watch } from 'vue';\n  import { extraParamsXModule } from '../x-module';\n  import { use$x } from '../../../composables/use-$x';\n  import { useState } from '../../../composables/use-state';\n\n  /**\n   * It emits a {@link ExtraParamsXEvents.ExtraParamsProvided} with the values\n   * received as a prop.\n   *\n   * @public\n   */\n\n  export default defineComponent({\n    name: 'ExtraParams',\n    xModule: extraParamsXModule.name,\n    props: {\n      values: {\n        type: Object as PropType<Dictionary<unknown>>,\n        required: true\n      }\n    },\n    setup(props) {\n      const params: ComputedRef<Dictionary> = useState('extraParams', ['params']).params;\n      const $x = use$x();\n\n      $x.emit('ExtraParamsInitialized', { ...props.values });\n      $x.emit('ExtraParamsProvided', { ...props.values, ...params.value });\n\n      watch(\n        () => props.values,\n        values => {\n          $x.emit('ExtraParamsProvided', { ...values });\n        },\n        { deep: true }\n      );\n      // eslint-disable-next-line @typescript-eslint/no-empty-function\n      return () => {};\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\n- [`ExtraParamsProvided`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts)\n\n## See it in action\n\n_See how the event is triggered when the component is rendered._\n\n```vue\n<template>\n  <ExtraParams :values=\"values\" />\n</template>\n\n<script>\n  import { ExtraParams } from '@empathyco/x-components/extra-params';\n\n  export default {\n    name: 'ExtraParamsDemo',\n    components: {\n      ExtraParams\n    },\n    data() {\n      return {\n        values: {\n          warehouse: 1234\n        }\n      };\n    }\n  };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;;AAOE;;;;;AAKE;AAEF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,aAAa;IACnB,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,KAAK,EAAE;AACL,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,MAAuC;AAC7C,YAAA,QAAQ,EAAE,IAAG;AACf,SAAA;AACD,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,MAAM,GAA4B,QAAQ,CAAC,aAAa,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAA;AAClF,QAAA,MAAM,EAAC,GAAI,KAAK,EAAE,CAAA;AAElB,QAAA,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAE,GAAG,KAAK,CAAC,MAAO,EAAC,CAAC,CAAA;AACtD,QAAA,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE,GAAG,MAAM,CAAC,KAAI,EAAG,CAAC,CAAA;QAEpE,KAAK,CACH,MAAM,KAAK,CAAC,MAAM,EAClB,MAAK,IAAK;YACR,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE,GAAG,MAAK,EAAG,CAAC,CAAA;AAC/C,SAAC,EACD,EAAE,IAAI,EAAE,IAAK,EAAA,CACd,CAAA;;AAED,QAAA,OAAO,MAAO,GAAC,CAAA;KACjB;AACD,CAAA,CAAC;;;;"}
+{"version":3,"file":"extra-params.vue.js","sources":["../../../../../src/x-modules/extra-params/components/extra-params.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Dictionary } from '@empathyco/x-utils'\nimport type { PropType } from 'vue'\nimport { defineComponent, watch } from 'vue'\nimport { use$x } from '../../../composables/use-$x'\nimport { useState } from '../../../composables/use-state'\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\nexport default defineComponent({\n  name: 'ExtraParams',\n  xModule: extraParamsXModule.name,\n  props: {\n    values: {\n      type: Object as PropType<Dictionary<unknown>>,\n      required: true,\n    },\n  },\n  setup(props) {\n    const params = useState('extraParams').params\n    const $x = use$x()\n\n    $x.emit('ExtraParamsInitialized', { ...props.values })\n    $x.emit('ExtraParamsProvided', { ...params.value, ...props.values })\n\n    watch(\n      () => props.values,\n      values => {\n        $x.emit('ExtraParamsProvided', { ...values })\n      },\n      { deep: true },\n    )\n\n    return () => {}\n  },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\n- [`ExtraParamsProvided`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts)\n\n## See it in action\n\n_See how the event is triggered when the component is rendered._\n\n```vue\n<template>\n  <ExtraParams :values=\"values\" />\n</template>\n\n<script>\nimport { ExtraParams } from '@empathyco/x-components/extra-params'\n\nexport default {\n  name: 'ExtraParamsDemo',\n  components: {\n    ExtraParams,\n  },\n  data() {\n    return {\n      values: {\n        warehouse: 1234,\n      },\n    }\n  },\n}\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;;AAQA;;;;;AAKE;AAEF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,aAAa;IACnB,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,KAAK,EAAE;AACL,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,MAAuC;AAC7C,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;QACT,MAAM,MAAK,GAAI,QAAQ,CAAC,aAAa,CAAC,CAAC,MAAK,CAAA;AAC5C,QAAA,MAAM,EAAC,GAAI,KAAK,EAAC,CAAA;AAEjB,QAAA,EAAE,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAE,GAAG,KAAK,CAAC,MAAK,EAAG,CAAA,CAAA;AACrD,QAAA,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE,GAAG,MAAM,CAAC,KAAK,EAAE,GAAG,KAAK,CAAC,QAAQ,CAAA,CAAA;QAEnE,KAAK,CACH,MAAM,KAAK,CAAC,MAAM,EAClB,MAAK,IAAK;YACR,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,EAAE,GAAG,QAAQ,CAAA,CAAA;AAC9C,SAAC,EACD,EAAE,IAAI,EAAE,IAAG,EAAG,CAChB,CAAA;AAEA,QAAA,OAAO,MAAO,GAAA,CAAA;KACf;AACF,CAAA,CAAA;;;;"}

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

@@ -1,7 +1,7 @@
 import { defineComponent, computed } from 'vue';
-import { extraParamsXModule } from '../x-module.js';
 import { useState } from '../../../composables/use-state.js';
 import { useXBus } from '../../../composables/use-x-bus.js';
+import { extraParamsXModule } from '../x-module.js';
 
 /**
  * It emits a {@link ExtraParamsXEvents.UserChangedExtraParams} when the `updateValue`
@@ -15,13 +15,13 @@ var _sfc_main = defineComponent({
     props: {
         name: {
             type: String,
-            required: true
-        }
+            required: true,
+        },
     },
     setup(props, { slots }) {
         const xBus = useXBus();
         /** A dictionary with the extra params in the store state. */
-        const stateParams = useState('extraParams', ['params']).params;
+        const stateParams = useState('extraParams').params;
         /** It returns the value of the extra param from the store. */
         const extraParam = computed(() => stateParams.value[props.name]);
         /**
@@ -33,7 +33,7 @@ var _sfc_main = defineComponent({
             xBus.emit('UserChangedExtraParams', { [props.name]: newValue });
         }
         return () => slots.default?.({ value: extraParam.value, updateValue })[0] ?? '';
-    }
+    },
 });
 
 export { _sfc_main as default };

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

@@ -1 +1 @@
-{"version":3,"file":"renderless-extra-param.vue.js","sources":["../../../../../src/x-modules/extra-params/components/renderless-extra-param.vue"],"sourcesContent":["<script lang=\"ts\">\n  import { computed, defineComponent } from 'vue';\n  import { extraParamsXModule } from '../x-module';\n  import { useState } from '../../../composables/use-state';\n  import { useXBus } from '../../../composables/use-x-bus';\n\n  /**\n   * It emits a {@link ExtraParamsXEvents.UserChangedExtraParams} when the `updateValue`\n   * is called.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'RenderlessExtraParam',\n    xModule: extraParamsXModule.name,\n    props: {\n      name: {\n        type: String,\n        required: true\n      }\n    },\n    setup(props, { slots }) {\n      const xBus = useXBus();\n\n      /** A dictionary with the extra params in the store state. */\n      const stateParams = useState('extraParams', ['params']).params;\n\n      /** It returns the value of the extra param from the store. */\n      const extraParam = computed(() => stateParams.value[props.name]);\n\n      /**\n       * It sets the new value to the store.\n       *\n       * @param newValue - The new value of the extra param.\n       */\n      function updateValue(newValue: unknown) {\n        xBus.emit('UserChangedExtraParams', { [props.name]: newValue });\n      }\n\n      return () => slots.default?.({ value: extraParam.value, updateValue })[0] ?? '';\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 @update:modelValue=\"updateValue\" :modelValue=\"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":[],"mappings":";;;;;AAME;;;;;AAKE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,sBAAsB;IAC5B,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,KAAK,EAAE;AACL,QAAA,IAAI,EAAE;AACJ,YAAA,IAAI,EAAE,MAAM;AACZ,YAAA,QAAQ,EAAE,IAAG;AACf,SAAA;AACD,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAE,EAAE,KAAI,EAAG,EAAA;AACpB,QAAA,MAAM,IAAG,GAAI,OAAO,EAAE,CAAA;;AAGtB,QAAA,MAAM,WAAY,GAAE,QAAQ,CAAC,aAAa,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAA;;AAG9D,QAAA,MAAM,aAAa,QAAQ,CAAC,MAAM,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAA;AAEhE;;;;AAIE;QACF,SAAS,WAAW,CAAC,QAAiB,EAAA;AACpC,YAAA,IAAI,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,GAAG,QAAS,EAAC,CAAC,CAAA;SACjE;QAEA,OAAO,MAAM,KAAK,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,UAAU,CAAC,KAAK,EAAE,WAAY,EAAC,CAAC,CAAC,CAAC,CAAA,IAAK,EAAE,CAAA;KACjF;AACD,CAAA,CAAC;;;;"}
+{"version":3,"file":"renderless-extra-param.vue.js","sources":["../../../../../src/x-modules/extra-params/components/renderless-extra-param.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { useState } from '../../../composables/use-state'\nimport { useXBus } from '../../../composables/use-x-bus'\nimport { extraParamsXModule } from '../x-module'\n\n/**\n * It emits a {@link ExtraParamsXEvents.UserChangedExtraParams} when the `updateValue`\n * is called.\n *\n * @public\n */\nexport default defineComponent({\n  name: 'RenderlessExtraParam',\n  xModule: extraParamsXModule.name,\n  props: {\n    name: {\n      type: String,\n      required: true,\n    },\n  },\n  setup(props, { slots }) {\n    const xBus = useXBus()\n\n    /** A dictionary with the extra params in the store state. */\n    const stateParams = useState('extraParams').params\n\n    /** It returns the value of the extra param from the store. */\n    const extraParam = computed(() => stateParams.value[props.name])\n\n    /**\n     * It sets the new value to the store.\n     *\n     * @param newValue - The new value of the extra param.\n     */\n    function updateValue(newValue: unknown) {\n      xBus.emit('UserChangedExtraParams', { [props.name]: newValue })\n    }\n\n    return () => slots.default?.({ value: extraParam.value, updateValue })[0] ?? ''\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 @update:modelValue=\"updateValue\" :modelValue=\"value\" :items=\"items\" />\n  </RenderlessExtraParam>\n</template>\n\n<script>\nimport { RenderlessExtraParams } from '@empathyco/x-components/extra-params'\nimport { BaseDropdown } from '@empathyco/x-components'\n\nexport 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":[],"mappings":";;;;;AAMA;;;;;AAKE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,sBAAsB;IAC5B,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,KAAK,EAAE;AACL,QAAA,IAAI,EAAE;AACJ,YAAA,IAAI,EAAE,MAAM;AACZ,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAE,EAAE,KAAI,EAAG,EAAA;AACpB,QAAA,MAAM,IAAG,GAAI,OAAO,EAAC,CAAA;;QAGrB,MAAM,WAAY,GAAE,QAAQ,CAAC,aAAa,CAAC,CAAC,MAAK,CAAA;;AAGjD,QAAA,MAAM,aAAa,QAAQ,CAAC,MAAM,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA,CAAA;AAE/D;;;;AAIE;QACF,SAAS,WAAW,CAAC,QAAiB,EAAA;AACpC,YAAA,IAAI,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,GAAG,QAAO,EAAG,CAAA,CAAA;SAChE;QAEA,OAAO,MAAM,KAAK,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,UAAU,CAAC,KAAK,EAAE,WAAU,EAAG,CAAC,CAAC,CAAC,CAAE,IAAG,EAAC,CAAA;KAC/E;AACF,CAAA,CAAA;;;;"}

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

@@ -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 { forEach, Dictionary } from '@empathyco/x-utils';\n  import { defineComponent, inject, PropType, ref, watch } from 'vue';\n  import { SnippetConfig } from '../../../x-installer/api/api.types';\n  import { extraParamsXModule } from '../x-module';\n  import ExtraParams from './extra-params.vue';\n\n  export default defineComponent({\n    name: 'SnippetConfigExtraParams',\n    xModule: extraParamsXModule.name,\n    components: {\n      ExtraParams\n    },\n    props: {\n      values: {\n        type: Object as PropType<Dictionary<unknown>>\n      },\n      excludedExtraParams: {\n        type: Array as PropType<Array<keyof SnippetConfig>>,\n        default: (): Array<keyof SnippetConfig> => [\n          'callbacks',\n          'productId',\n          'uiLang',\n          'consent',\n          'documentDirection',\n          'filters',\n          'isSpa',\n          'queriesPreview'\n        ]\n      }\n    },\n    setup(props) {\n      const snippetConfig = inject('snippetConfig') as SnippetConfig;\n      const extraParams = ref<Record<string, any>>({});\n\n      watch(\n        [() => snippetConfig, () => props.values],\n        () => {\n          forEach({ ...props.values, ...snippetConfig }, (name, value) => {\n            if (!props.excludedExtraParams.includes(name) && extraParams.value[name] !== value) {\n              extraParams.value = { ...extraParams.value, [name]: value };\n            }\n          });\n        },\n        {\n          deep: true,\n          immediate: true\n        }\n      );\n\n      return {\n        extraParams\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":["_resolveComponent"],"mappings":";;;;;AACE,EAAA,MAAA,sBAAA,GAAAA,gBAAA,CAAqC,aAAvB,CAAA,CAAA;;;;;;;"}
+{"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\">\nimport type { Dictionary } from '@empathyco/x-utils'\nimport type { PropType } from 'vue'\nimport type { SnippetConfig } from '../../../x-installer/api/api.types'\nimport { forEach } from '@empathyco/x-utils'\nimport { defineComponent, inject, ref, watch } from 'vue'\nimport { extraParamsXModule } from '../x-module'\nimport ExtraParams from './extra-params.vue'\n\nexport default defineComponent({\n  name: 'SnippetConfigExtraParams',\n  xModule: extraParamsXModule.name,\n  components: {\n    ExtraParams,\n  },\n  props: {\n    values: {\n      type: Object as PropType<Dictionary<unknown>>,\n    },\n    excludedExtraParams: {\n      type: Array as PropType<Array<keyof SnippetConfig>>,\n      default: (): Array<keyof SnippetConfig> => [\n        'callbacks',\n        'productId',\n        'uiLang',\n        'consent',\n        'documentDirection',\n        'filters',\n        'isSpa',\n        'queriesPreview',\n      ],\n    },\n  },\n  setup(props) {\n    const snippetConfig = inject('snippetConfig') as SnippetConfig\n    const extraParams = ref<Record<string, any>>({})\n\n    watch(\n      [() => snippetConfig, () => props.values],\n      () => {\n        forEach({ ...props.values, ...snippetConfig }, (name, value) => {\n          if (!props.excludedExtraParams.includes(name) && extraParams.value[name] !== value) {\n            extraParams.value = { ...extraParams.value, [name]: value }\n          }\n        })\n      },\n      {\n        deep: true,\n        immediate: true,\n      },\n    )\n\n    return {\n      extraParams,\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>\nimport { SnippetConfigExtraParams } from '@empathyco/x-components/extra-params'\n\nconst Provider = {\n  provide: {\n    snippetConfig: {\n      instance: 'demo',\n      lang: 'es',\n      warehouse: 1234,\n    },\n  },\n}\n\nexport default {\n  name: 'SnippetConfigExtraParamsDemo',\n  components: {\n    Provider,\n    SnippetConfigExtraParams,\n  },\n}\n</script>\n```\n</docs>\n"],"names":["_resolveComponent"],"mappings":";;;;;AACE,EAAA,MAAA,sBAAA,GAAAA,gBAAA,CAAqC,aAAvB,CAAA,CAAA;;;;;;;"}

package/js/x-modules/extra-params/components/snippet-config-extra-params.vue2.js

@@ -7,11 +7,11 @@ var _sfc_main = defineComponent({
     name: 'SnippetConfigExtraParams',
     xModule: extraParamsXModule.name,
     components: {
-        ExtraParams: _sfc_main$1
+        ExtraParams: _sfc_main$1,
     },
     props: {
         values: {
-            type: Object
+            type: Object,
         },
         excludedExtraParams: {
             type: Array,
@@ -23,9 +23,9 @@ var _sfc_main = defineComponent({
                 'documentDirection',
                 'filters',
                 'isSpa',
-                'queriesPreview'
-            ]
-        }
+                'queriesPreview',
+            ],
+        },
     },
     setup(props) {
         const snippetConfig = inject('snippetConfig');
@@ -38,12 +38,12 @@ var _sfc_main = defineComponent({
             });
         }, {
             deep: true,
-            immediate: true
+            immediate: true,
         });
         return {
-            extraParams
+            extraParams,
         };
-    }
+    },
 });
 
 export { _sfc_main as default };

package/js/x-modules/extra-params/components/snippet-config-extra-params.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"snippet-config-extra-params.vue2.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 { forEach, Dictionary } from '@empathyco/x-utils';\n  import { defineComponent, inject, PropType, ref, watch } from 'vue';\n  import { SnippetConfig } from '../../../x-installer/api/api.types';\n  import { extraParamsXModule } from '../x-module';\n  import ExtraParams from './extra-params.vue';\n\n  export default defineComponent({\n    name: 'SnippetConfigExtraParams',\n    xModule: extraParamsXModule.name,\n    components: {\n      ExtraParams\n    },\n    props: {\n      values: {\n        type: Object as PropType<Dictionary<unknown>>\n      },\n      excludedExtraParams: {\n        type: Array as PropType<Array<keyof SnippetConfig>>,\n        default: (): Array<keyof SnippetConfig> => [\n          'callbacks',\n          'productId',\n          'uiLang',\n          'consent',\n          'documentDirection',\n          'filters',\n          'isSpa',\n          'queriesPreview'\n        ]\n      }\n    },\n    setup(props) {\n      const snippetConfig = inject('snippetConfig') as SnippetConfig;\n      const extraParams = ref<Record<string, any>>({});\n\n      watch(\n        [() => snippetConfig, () => props.values],\n        () => {\n          forEach({ ...props.values, ...snippetConfig }, (name, value) => {\n            if (!props.excludedExtraParams.includes(name) && extraParams.value[name] !== value) {\n              extraParams.value = { ...extraParams.value, [name]: value };\n            }\n          });\n        },\n        {\n          deep: true,\n          immediate: true\n        }\n      );\n\n      return {\n        extraParams\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":["ExtraParams"],"mappings":";;;;;AAWE,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,0BAA0B;IAChC,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,UAAU,EAAE;qBACVA,WAAU;AACX,KAAA;AACD,IAAA,KAAK,EAAE;AACL,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,MAAsC;AAC7C,SAAA;AACD,QAAA,mBAAmB,EAAE;AACnB,YAAA,IAAI,EAAE,KAA6C;YACnD,OAAO,EAAE,MAAkC;gBACzC,WAAW;gBACX,WAAW;gBACX,QAAQ;gBACR,SAAS;gBACT,mBAAmB;gBACnB,SAAS;gBACT,OAAO;gBACP,gBAAe;AACjB,aAAA;AACF,SAAA;AACD,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,aAAY,GAAI,MAAM,CAAC,eAAe,CAAkB,CAAA;AAC9D,QAAA,MAAM,WAAU,GAAI,GAAG,CAAsB,EAAE,CAAC,CAAA;AAEhD,QAAA,KAAK,CACH,CAAC,MAAM,aAAa,EAAE,MAAM,KAAK,CAAC,MAAM,CAAC,EACzC,MAAM;AACJ,YAAA,OAAO,CAAC,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE,GAAG,aAAY,EAAG,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK;AAC9D,gBAAA,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,QAAQ,CAAC,IAAI,CAAA,IAAK,WAAW,CAAC,KAAK,CAAC,IAAI,CAAA,KAAM,KAAK,EAAE;AAClF,oBAAA,WAAW,CAAC,KAAI,GAAI,EAAE,GAAG,WAAW,CAAC,KAAK,EAAE,CAAC,IAAI,GAAG,KAAI,EAAG,CAAA;AAC7D,iBAAA;AACF,aAAC,CAAC,CAAA;AACJ,SAAC,EACD;AACE,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,SAAS,EAAE,IAAG;AAChB,SAAA,CACD,CAAA;QAED,OAAO;YACL,WAAU;SACX,CAAA;KACH;AACD,CAAA,CAAC;;;;"}
+{"version":3,"file":"snippet-config-extra-params.vue2.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\">\nimport type { Dictionary } from '@empathyco/x-utils'\nimport type { PropType } from 'vue'\nimport type { SnippetConfig } from '../../../x-installer/api/api.types'\nimport { forEach } from '@empathyco/x-utils'\nimport { defineComponent, inject, ref, watch } from 'vue'\nimport { extraParamsXModule } from '../x-module'\nimport ExtraParams from './extra-params.vue'\n\nexport default defineComponent({\n  name: 'SnippetConfigExtraParams',\n  xModule: extraParamsXModule.name,\n  components: {\n    ExtraParams,\n  },\n  props: {\n    values: {\n      type: Object as PropType<Dictionary<unknown>>,\n    },\n    excludedExtraParams: {\n      type: Array as PropType<Array<keyof SnippetConfig>>,\n      default: (): Array<keyof SnippetConfig> => [\n        'callbacks',\n        'productId',\n        'uiLang',\n        'consent',\n        'documentDirection',\n        'filters',\n        'isSpa',\n        'queriesPreview',\n      ],\n    },\n  },\n  setup(props) {\n    const snippetConfig = inject('snippetConfig') as SnippetConfig\n    const extraParams = ref<Record<string, any>>({})\n\n    watch(\n      [() => snippetConfig, () => props.values],\n      () => {\n        forEach({ ...props.values, ...snippetConfig }, (name, value) => {\n          if (!props.excludedExtraParams.includes(name) && extraParams.value[name] !== value) {\n            extraParams.value = { ...extraParams.value, [name]: value }\n          }\n        })\n      },\n      {\n        deep: true,\n        immediate: true,\n      },\n    )\n\n    return {\n      extraParams,\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>\nimport { SnippetConfigExtraParams } from '@empathyco/x-components/extra-params'\n\nconst Provider = {\n  provide: {\n    snippetConfig: {\n      instance: 'demo',\n      lang: 'es',\n      warehouse: 1234,\n    },\n  },\n}\n\nexport default {\n  name: 'SnippetConfigExtraParamsDemo',\n  components: {\n    Provider,\n    SnippetConfigExtraParams,\n  },\n}\n</script>\n```\n</docs>\n"],"names":["ExtraParams"],"mappings":";;;;;AAaA,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,0BAA0B;IAChC,OAAO,EAAE,kBAAkB,CAAC,IAAI;AAChC,IAAA,UAAU,EAAE;qBACVA,WAAW;AACZ,KAAA;AACD,IAAA,KAAK,EAAE;AACL,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,MAAuC;AAC9C,SAAA;AACD,QAAA,mBAAmB,EAAE;AACnB,YAAA,IAAI,EAAE,KAA6C;YACnD,OAAO,EAAE,MAAkC;gBACzC,WAAW;gBACX,WAAW;gBACX,QAAQ;gBACR,SAAS;gBACT,mBAAmB;gBACnB,SAAS;gBACT,OAAO;gBACP,gBAAgB;AACjB,aAAA;AACF,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,aAAY,GAAI,MAAM,CAAC,eAAe,CAAiB,CAAA;AAC7D,QAAA,MAAM,cAAc,GAAG,CAAsB,EAAE,CAAA,CAAA;AAE/C,QAAA,KAAK,CACH,CAAC,MAAM,aAAa,EAAE,MAAM,KAAK,CAAC,MAAM,CAAC,EACzC,MAAM;AACJ,YAAA,OAAO,CAAC,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE,GAAG,aAAY,EAAG,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK;AAC9D,gBAAA,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,QAAQ,CAAC,IAAI,CAAA,IAAK,WAAW,CAAC,KAAK,CAAC,IAAI,CAAA,KAAM,KAAK,EAAE;AAClF,oBAAA,WAAW,CAAC,KAAI,GAAI,EAAE,GAAG,WAAW,CAAC,KAAK,EAAE,CAAC,IAAI,GAAG,KAAM,EAAA,CAAA;AAC5D,iBAAA;AACF,aAAC,CAAA,CAAA;AACH,SAAC,EACD;AACE,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,SAAS,EAAE,IAAI;AAChB,SAAA,CACH,CAAA;QAEA,OAAO;YACL,WAAW;SACb,CAAA;KACD;AACF,CAAA,CAAA;;;;"}

package/js/x-modules/extra-params/store/emitters.js

@@ -1,3 +1,4 @@
+import '@empathyco/x-utils';
 import { createStoreEmitters } from '../../../store/utils/store-emitters.utils.js';
 import { extraParamsXStoreModule } from './module.js';
 
@@ -9,8 +10,8 @@ import { extraParamsXStoreModule } from './module.js';
 const extraParamsEmitters = createStoreEmitters(extraParamsXStoreModule, {
     ExtraParamsChanged: {
         selector: state => state.params,
-        metadata: { priority: 9 }
-    }
+        metadata: { priority: 9 },
+    },
 });
 
 export { extraParamsEmitters };

package/js/x-modules/extra-params/store/emitters.js.map

@@ -1 +1 @@
-{"version":3,"file":"emitters.js","sources":["../../../../../src/x-modules/extra-params/store/emitters.ts"],"sourcesContent":["import { createStoreEmitters } from '../../../store';\nimport { extraParamsXStoreModule } from './module';\n\n/**\n * {@link StoreEmitters} For the {@link ExtraParamsXModule}.\n *\n * @internal\n */\nexport const extraParamsEmitters = createStoreEmitters(extraParamsXStoreModule, {\n  ExtraParamsChanged: {\n    selector: state => state.params,\n    metadata: { priority: 9 }\n  }\n});\n"],"names":[],"mappings":";;;AAGA;;;;AAIG;AACU,MAAA,mBAAmB,GAAG,mBAAmB,CAAC,uBAAuB,EAAE;AAC9E,IAAA,kBAAkB,EAAE;AAClB,QAAA,QAAQ,EAAE,KAAK,IAAI,KAAK,CAAC,MAAM;AAC/B,QAAA,QAAQ,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE;AAC1B,KAAA;AACF,CAAA;;;;"}
+{"version":3,"file":"emitters.js","sources":["../../../../../src/x-modules/extra-params/store/emitters.ts"],"sourcesContent":["import { createStoreEmitters } from '../../../store'\nimport { extraParamsXStoreModule } from './module'\n\n/**\n * {@link StoreEmitters} For the {@link ExtraParamsXModule}.\n *\n * @internal\n */\nexport const extraParamsEmitters = createStoreEmitters(extraParamsXStoreModule, {\n  ExtraParamsChanged: {\n    selector: state => state.params,\n    metadata: { priority: 9 },\n  },\n})\n"],"names":[],"mappings":";;;;AAGA;;;;AAIG;AACU,MAAA,mBAAmB,GAAG,mBAAmB,CAAC,uBAAuB,EAAE;AAC9E,IAAA,kBAAkB,EAAE;AAClB,QAAA,QAAQ,EAAE,KAAK,IAAI,KAAK,CAAC,MAAM;AAC/B,QAAA,QAAQ,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE;AAC1B,KAAA;AACF,CAAA;;;;"}

package/js/x-modules/extra-params/store/module.js

@@ -5,15 +5,15 @@
  */
 const extraParamsXStoreModule = {
     state: () => ({
-        params: {}
+        params: {},
     }),
     getters: {},
     mutations: {
         setParams(state, params) {
             state.params = { ...state.params, ...params };
-        }
+        },
     },
-    actions: {}
+    actions: {},
 };
 
 export { extraParamsXStoreModule };

package/js/x-modules/extra-params/store/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sources":["../../../../../src/x-modules/extra-params/store/module.ts"],"sourcesContent":["import { ExtraParamsXStoreModule } from './types';\n\n/**\n * {@link XStoreModule} For the ExtraParams module.\n *\n * @internal\n */\nexport const extraParamsXStoreModule: ExtraParamsXStoreModule = {\n  state: () => ({\n    params: {}\n  }),\n  getters: {},\n  mutations: {\n    setParams(state, params) {\n      state.params = { ...state.params, ...params };\n    }\n  },\n  actions: {}\n};\n"],"names":[],"mappings":"AAEA;;;;AAIG;AACU,MAAA,uBAAuB,GAA4B;AAC9D,IAAA,KAAK,EAAE,OAAO;AACZ,QAAA,MAAM,EAAE,EAAE;KACX,CAAC;AACF,IAAA,OAAO,EAAE,EAAE;AACX,IAAA,SAAS,EAAE;QACT,SAAS,CAAC,KAAK,EAAE,MAAM,EAAA;AACrB,YAAA,KAAK,CAAC,MAAM,GAAG,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE,GAAG,MAAM,EAAE,CAAC;SAC/C;AACF,KAAA;AACD,IAAA,OAAO,EAAE,EAAE;;;;;"}
+{"version":3,"file":"module.js","sources":["../../../../../src/x-modules/extra-params/store/module.ts"],"sourcesContent":["import type { ExtraParamsXStoreModule } from './types'\n\n/**\n * {@link XStoreModule} For the ExtraParams module.\n *\n * @internal\n */\nexport const extraParamsXStoreModule: ExtraParamsXStoreModule = {\n  state: () => ({\n    params: {},\n  }),\n  getters: {},\n  mutations: {\n    setParams(state, params) {\n      state.params = { ...state.params, ...params }\n    },\n  },\n  actions: {},\n}\n"],"names":[],"mappings":"AAEA;;;;AAIG;AACU,MAAA,uBAAuB,GAA4B;AAC9D,IAAA,KAAK,EAAE,OAAO;AACZ,QAAA,MAAM,EAAE,EAAE;KACX,CAAC;AACF,IAAA,OAAO,EAAE,EAAE;AACX,IAAA,SAAS,EAAE;QACT,SAAS,CAAC,KAAK,EAAE,MAAM,EAAA;AACrB,YAAA,KAAK,CAAC,MAAM,GAAG,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;SAC9C;AACF,KAAA;AACD,IAAA,OAAO,EAAE,EAAE;;;;;"}

package/js/x-modules/extra-params/wiring.js

@@ -22,14 +22,14 @@ const setExtraParams = wireCommit('setParams');
  */
 const extraParamsWiring = createWiring({
     UserChangedExtraParams: {
-        setExtraParams
+        setExtraParams,
     },
     ExtraParamsProvided: {
-        setExtraParams
+        setExtraParams,
     },
     ExtraParamsLoadedFromUrl: {
-        setExtraParams
-    }
+        setExtraParams,
+    },
 });
 
 export { extraParamsWiring, setExtraParams };

package/js/x-modules/extra-params/wiring.js.map

@@ -1 +1 @@
-{"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/extra-params/wiring.ts"],"sourcesContent":["import { namespacedWireCommit } from '../../wiring';\nimport { createWiring } from '../../wiring/wiring.utils';\n\n/**\n * WireCommit for {@link ExtraParamsXModule}.\n *\n * @internal\n */\nconst wireCommit = namespacedWireCommit('extraParams');\n\n/**\n * Sets the extra params of the {@link ExtraParamsXModule}.\n *\n * @public\n */\nexport const setExtraParams = wireCommit('setParams');\n\n/**\n * Wiring configuration for the {@link ExtraParamsXModule | extraParams module}.\n *\n * @internal\n */\nexport const extraParamsWiring = createWiring({\n  UserChangedExtraParams: {\n    setExtraParams\n  },\n  ExtraParamsProvided: {\n    setExtraParams\n  },\n  ExtraParamsLoadedFromUrl: {\n    setExtraParams\n  }\n});\n"],"names":[],"mappings":";;;;;AAGA;;;;AAIG;AACH,MAAM,UAAU,GAAG,oBAAoB,CAAC,aAAa,CAAC,CAAC;AAEvD;;;;AAIG;MACU,cAAc,GAAG,UAAU,CAAC,WAAW,EAAE;AAEtD;;;;AAIG;AACI,MAAM,iBAAiB,GAAG,YAAY,CAAC;AAC5C,IAAA,sBAAsB,EAAE;QACtB,cAAc;AACf,KAAA;AACD,IAAA,mBAAmB,EAAE;QACnB,cAAc;AACf,KAAA;AACD,IAAA,wBAAwB,EAAE;QACxB,cAAc;AACf,KAAA;AACF,CAAA;;;;"}
+{"version":3,"file":"wiring.js","sources":["../../../../src/x-modules/extra-params/wiring.ts"],"sourcesContent":["import { namespacedWireCommit } from '../../wiring'\nimport { createWiring } from '../../wiring/wiring.utils'\n\n/**\n * WireCommit for {@link ExtraParamsXModule}.\n *\n * @internal\n */\nconst wireCommit = namespacedWireCommit('extraParams')\n\n/**\n * Sets the extra params of the {@link ExtraParamsXModule}.\n *\n * @public\n */\nexport const setExtraParams = wireCommit('setParams')\n\n/**\n * Wiring configuration for the {@link ExtraParamsXModule | extraParams module}.\n *\n * @internal\n */\nexport const extraParamsWiring = createWiring({\n  UserChangedExtraParams: {\n    setExtraParams,\n  },\n  ExtraParamsProvided: {\n    setExtraParams,\n  },\n  ExtraParamsLoadedFromUrl: {\n    setExtraParams,\n  },\n})\n"],"names":[],"mappings":";;;;;AAGA;;;;AAIG;AACH,MAAM,UAAU,GAAG,oBAAoB,CAAC,aAAa,CAAC,CAAA;AAEtD;;;;AAIG;MACU,cAAc,GAAG,UAAU,CAAC,WAAW,EAAC;AAErD;;;;AAIG;AACI,MAAM,iBAAiB,GAAG,YAAY,CAAC;AAC5C,IAAA,sBAAsB,EAAE;QACtB,cAAc;AACf,KAAA;AACD,IAAA,mBAAmB,EAAE;QACnB,cAAc;AACf,KAAA;AACD,IAAA,wBAAwB,EAAE;QACxB,cAAc;AACf,KAAA;AACF,CAAA;;;;"}

package/js/x-modules/extra-params/x-module.js

@@ -20,7 +20,7 @@ const extraParamsXModule = {
     name: 'extraParams',
     storeModule: extraParamsXStoreModule,
     storeEmitters: extraParamsEmitters,
-    wiring: extraParamsWiring
+    wiring: extraParamsWiring,
 };
 XPlugin.registerXModule(extraParamsXModule);
 

package/js/x-modules/extra-params/x-module.js.map

@@ -1 +1 @@
-{"version":3,"file":"x-module.js","sources":["../../../../src/x-modules/extra-params/x-module.ts"],"sourcesContent":["import { XModule } from '../x-modules.types';\nimport { XPlugin } from '../../plugins/index';\nimport { extraParamsEmitters } from './store/emitters';\nimport { extraParamsXStoreModule } from './store/module';\nimport { ExtraParamsXStoreModule } from './store/types';\nimport { extraParamsWiring } from './wiring';\n\n/**\n * ExtraParams {@link XModule} alias.\n *\n * @public\n */\nexport type ExtraParamsXModule = XModule<ExtraParamsXStoreModule>;\n\n/**\n * ExtraParams {@link XModule} implementation. This module is auto-registered as soon as you\n * import any component from the `extraParams` entry point.\n *\n * @public\n */\nexport const extraParamsXModule: ExtraParamsXModule = {\n  name: 'extraParams',\n  storeModule: extraParamsXStoreModule,\n  storeEmitters: extraParamsEmitters,\n  wiring: extraParamsWiring\n};\n\nXPlugin.registerXModule(extraParamsXModule);\n"],"names":[],"mappings":";;;;;;;;;;;;AAcA;;;;;AAKG;AACU,MAAA,kBAAkB,GAAuB;AACpD,IAAA,IAAI,EAAE,aAAa;AACnB,IAAA,WAAW,EAAE,uBAAuB;AACpC,IAAA,aAAa,EAAE,mBAAmB;AAClC,IAAA,MAAM,EAAE,iBAAiB;EACzB;AAEF,OAAO,CAAC,eAAe,CAAC,kBAAkB,CAAC;;;;"}
+{"version":3,"file":"x-module.js","sources":["../../../../src/x-modules/extra-params/x-module.ts"],"sourcesContent":["import type { XModule } from '../x-modules.types'\nimport type { ExtraParamsXStoreModule } from './store/types'\nimport { XPlugin } from '../../plugins/index'\nimport { extraParamsEmitters } from './store/emitters'\nimport { extraParamsXStoreModule } from './store/module'\nimport { extraParamsWiring } from './wiring'\n\n/**\n * ExtraParams {@link XModule} alias.\n *\n * @public\n */\nexport type ExtraParamsXModule = XModule<ExtraParamsXStoreModule>\n\n/**\n * ExtraParams {@link XModule} implementation. This module is auto-registered as soon as you\n * import any component from the `extraParams` entry point.\n *\n * @public\n */\nexport const extraParamsXModule: ExtraParamsXModule = {\n  name: 'extraParams',\n  storeModule: extraParamsXStoreModule,\n  storeEmitters: extraParamsEmitters,\n  wiring: extraParamsWiring,\n}\n\nXPlugin.registerXModule(extraParamsXModule)\n"],"names":[],"mappings":";;;;;;;;;;;;AAcA;;;;;AAKG;AACU,MAAA,kBAAkB,GAAuB;AACpD,IAAA,IAAI,EAAE,aAAa;AACnB,IAAA,WAAW,EAAE,uBAAuB;AACpC,IAAA,aAAa,EAAE,mBAAmB;AAClC,IAAA,MAAM,EAAE,iBAAiB;EAC1B;AAED,OAAO,CAAC,eAAe,CAAC,kBAAkB,CAAC;;;;"}

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

@@ -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=\"isVisible\"\n    class=\"x-clear-filters x-button\"\n    data-test=\"clear-filters\"\n    :disabled=\"!hasSelectedFilters\"\n    :events=\"events\"\n    :class=\"cssClasses\"\n  >\n    <slot :selectedFilters=\"selectedFilters\">Clear Filters ({{ selectedFilters.length }})</slot>\n  </BaseEventButton>\n</template>\n\n<script lang=\"ts\">\n  import { Facet } from '@empathyco/x-types';\n  import { computed, defineComponent, PropType } from 'vue';\n  import BaseEventButton from '../../../components/base-event-button.vue';\n  import { VueCSSClasses } from '../../../utils/types';\n  import { XEventsTypes } from '../../../wiring/events.types';\n  import { useFacets } from '../composables/use-facets';\n  import { facetsXModule } from '../x-module';\n\n  /**\n   * Renders a simple button, emitting the needed events when clicked.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'ClearFilters',\n    xModule: facetsXModule.name,\n    components: { BaseEventButton },\n    props: {\n      /** Array of facets ids used to get the selected filters for those facets. */\n      facetsIds: Array as PropType<Array<Facet['id']>>,\n      /** Flag to render the component even if there are no filters selected. */\n      alwaysVisible: Boolean\n    },\n    setup: function (props) {\n      const { selectedFilters, hasSelectedFilters, isVisible } = useFacets(props);\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       */\n      const events = computed<Partial<XEventsTypes>>(() => ({\n        UserClickedClearAllFilters: props.facetsIds\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       */\n      const cssClasses = computed<VueCSSClasses>(() => ({\n        'x-clear-filters--has-not-selected-filters': !hasSelectedFilters.value,\n        'x-clear-filters--has-selected-filters': hasSelectedFilters.value\n      }));\n\n      return {\n        selectedFilters,\n        hasSelectedFilters,\n        isVisible,\n        events,\n        cssClasses\n      };\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserClickedClearAllFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button to clear a certain facets filter. The event\n  payload is the id of the facets that are going to be cleared.\n- [`UserClickedClearAllFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button. The event payload is undefined.\n\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</docs>\n"],"names":["_resolveComponent","_openBlock","_createBlock","cssClasses","hasSelectedFilters","events","_withCtx","_renderSlot","_createCommentVNode"],"mappings":";;;;;AAEmB,EAAA,MAAA,0BAAA,GAAAA,gBAAA,CAAA,iBAAA,CAAA,CAAA;AAFnB,EAAA,OAAA,IAAA,CAAA,SAAA,IAAAC,SAAA,EAAA,EAAAC,WAAA,CAGU,0BAIEC,EAAAA;AAAAA,IAHR,GAAA,EAAA,CAAA;AAAA,IACC,sBAAWC,CAAkB,0BAAA,EAAA,IAAA,CAAA,UAAA,CAAA,CAAA;AAAA,IAC7B,WAAQC,EAAAA,eAAAA;AAAAA,IAAAA,QAAAA,EAAAA,CAAAA,IAAAA,CAAAA,kBAAAA;AANb,IAAA,MAAA,EAAA,IAAA,CAAA,MAAA;AAAA,GAAA,EAAA;aAAAC,OAS6C,CAAA,MAAA;AAAA,MAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAAA,EAAA,eAAA,EAAA,IAAA,CAAA,eAAA,EAAA,EAAA,MAAA;;;;;;AAT7C,OAAA,CAAA;AAAA,KAAA,CAAA;AAAA,IAAA,CAAA,EAAA,CAAA;AAAA;AAAA,GAAA,EAAA,CAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,OAAA,CAAA,CAAA,IAAAC,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}
+{"version":3,"file":"clear-filters.vue.js","sources":["../../../../../src/x-modules/facets/components/clear-filters.vue"],"sourcesContent":["<template>\n  <BaseEventButton\n    v-if=\"isVisible\"\n    class=\"x-clear-filters x-button\"\n    data-test=\"clear-filters\"\n    :disabled=\"!hasSelectedFilters\"\n    :events=\"events\"\n    :class=\"cssClasses\"\n  >\n    <slot :selected-filters=\"selectedFilters\">Clear Filters ({{ selectedFilters.length }})</slot>\n  </BaseEventButton>\n</template>\n\n<script lang=\"ts\">\nimport type { Facet } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport type { VueCSSClasses } from '../../../utils/types'\nimport type { XEventsTypes } from '../../../wiring/events.types'\nimport { computed, defineComponent } from 'vue'\nimport BaseEventButton from '../../../components/base-event-button.vue'\nimport { useFacets } from '../composables/use-facets'\nimport { facetsXModule } from '../x-module'\n\n/**\n * Renders a simple button, emitting the needed events when clicked.\n *\n * @public\n */\nexport default defineComponent({\n  name: 'ClearFilters',\n  xModule: facetsXModule.name,\n  components: { BaseEventButton },\n  props: {\n    /** Array of facets ids used to get the selected filters for those facets. */\n    facetsIds: Array as PropType<Array<Facet['id']>>,\n    /** Flag to render the component even if there are no filters selected. */\n    alwaysVisible: Boolean,\n  },\n  setup(props) {\n    const { selectedFilters, hasSelectedFilters, isVisible } = useFacets(props)\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     */\n    const events = computed<Partial<XEventsTypes>>(() => ({\n      UserClickedClearAllFilters: props.facetsIds,\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     */\n    const cssClasses = computed<VueCSSClasses>(() => ({\n      'x-clear-filters--has-not-selected-filters': !hasSelectedFilters.value,\n      'x-clear-filters--has-selected-filters': hasSelectedFilters.value,\n    }))\n\n    return {\n      selectedFilters,\n      hasSelectedFilters,\n      isVisible,\n      events,\n      cssClasses,\n    }\n  },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserClickedClearAllFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button to clear a certain facets filter. The event\n  payload is the id of the facets that are going to be cleared.\n- [`UserClickedClearAllFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button. The event payload is undefined.\n\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</docs>\n"],"names":["_resolveComponent","_openBlock","_createBlock","cssClasses","hasSelectedFilters","events","_withCtx","_renderSlot","_createCommentVNode"],"mappings":";;;;;AAEmB,EAAA,MAAA,0BAAA,GAAAA,gBAAA,CAAA,iBAAA,CAAA,CAAA;AAFnB,EAAA,OAAA,IAAA,CAAA,SAAA,IAAAC,SAAA,EAAA,EAAAC,WAAA,CAGU,0BAIEC,EAAAA;AAAAA,IAHR,GAAA,EAAA,CAAA;AAAA,IACC,sBAAWC,CAAkB,0BAAA,EAAA,IAAA,CAAA,UAAA,CAAA,CAAA;AAAA,IAC7B,WAAQC,EAAAA,eAAAA;AAAAA,IAAAA,QAAAA,EAAAA,CAAAA,IAAAA,CAAAA,kBAAAA;AANb,IAAA,MAAA,EAAA,IAAA,CAAA,MAAA;AAAA,GAAA,EAAA;aAAAC,OAS8C,CAAA,MAAA;AAAA,MAAAC,UAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,EAAA,EAAA,eAAA,EAAA,IAAA,CAAA,eAAA,EAAA,EAAA,MAAA;;;;;;AAT9C,OAAA,CAAA;AAAA,KAAA,CAAA;AAAA,IAAA,CAAA,EAAA,CAAA;AAAA;AAAA,GAAA,EAAA,CAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,OAAA,CAAA,CAAA,IAAAC,kBAAA,CAAA,MAAA,EAAA,IAAA,CAAA,CAAA;;;;;;"}

package/js/x-modules/facets/components/clear-filters.vue2.js

@@ -16,9 +16,9 @@ var _sfc_main = defineComponent({
         /** Array of facets ids used to get the selected filters for those facets. */
         facetsIds: Array,
         /** Flag to render the component even if there are no filters selected. */
-        alwaysVisible: Boolean
+        alwaysVisible: Boolean,
     },
-    setup: function (props) {
+    setup(props) {
         const { selectedFilters, hasSelectedFilters, isVisible } = useFacets(props);
         /**
          * The events that will be emitted when the button clear filters is clicked.
@@ -26,7 +26,7 @@ var _sfc_main = defineComponent({
          * @returns The events to be emitted when the button clear filters is clicked.
          */
         const events = computed(() => ({
-            UserClickedClearAllFilters: props.facetsIds
+            UserClickedClearAllFilters: props.facetsIds,
         }));
         /**
          * Dynamic CSS classes to apply to the component.
@@ -35,16 +35,16 @@ var _sfc_main = defineComponent({
          */
         const cssClasses = computed(() => ({
             'x-clear-filters--has-not-selected-filters': !hasSelectedFilters.value,
-            'x-clear-filters--has-selected-filters': hasSelectedFilters.value
+            'x-clear-filters--has-selected-filters': hasSelectedFilters.value,
         }));
         return {
             selectedFilters,
             hasSelectedFilters,
             isVisible,
             events,
-            cssClasses
+            cssClasses,
         };
-    }
+    },
 });
 
 export { _sfc_main as default };

package/js/x-modules/facets/components/clear-filters.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"clear-filters.vue2.js","sources":["../../../../../src/x-modules/facets/components/clear-filters.vue"],"sourcesContent":["<template>\n  <BaseEventButton\n    v-if=\"isVisible\"\n    class=\"x-clear-filters x-button\"\n    data-test=\"clear-filters\"\n    :disabled=\"!hasSelectedFilters\"\n    :events=\"events\"\n    :class=\"cssClasses\"\n  >\n    <slot :selectedFilters=\"selectedFilters\">Clear Filters ({{ selectedFilters.length }})</slot>\n  </BaseEventButton>\n</template>\n\n<script lang=\"ts\">\n  import { Facet } from '@empathyco/x-types';\n  import { computed, defineComponent, PropType } from 'vue';\n  import BaseEventButton from '../../../components/base-event-button.vue';\n  import { VueCSSClasses } from '../../../utils/types';\n  import { XEventsTypes } from '../../../wiring/events.types';\n  import { useFacets } from '../composables/use-facets';\n  import { facetsXModule } from '../x-module';\n\n  /**\n   * Renders a simple button, emitting the needed events when clicked.\n   *\n   * @public\n   */\n  export default defineComponent({\n    name: 'ClearFilters',\n    xModule: facetsXModule.name,\n    components: { BaseEventButton },\n    props: {\n      /** Array of facets ids used to get the selected filters for those facets. */\n      facetsIds: Array as PropType<Array<Facet['id']>>,\n      /** Flag to render the component even if there are no filters selected. */\n      alwaysVisible: Boolean\n    },\n    setup: function (props) {\n      const { selectedFilters, hasSelectedFilters, isVisible } = useFacets(props);\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       */\n      const events = computed<Partial<XEventsTypes>>(() => ({\n        UserClickedClearAllFilters: props.facetsIds\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       */\n      const cssClasses = computed<VueCSSClasses>(() => ({\n        'x-clear-filters--has-not-selected-filters': !hasSelectedFilters.value,\n        'x-clear-filters--has-selected-filters': hasSelectedFilters.value\n      }));\n\n      return {\n        selectedFilters,\n        hasSelectedFilters,\n        isVisible,\n        events,\n        cssClasses\n      };\n    }\n  });\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserClickedClearAllFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button to clear a certain facets filter. The event\n  payload is the id of the facets that are going to be cleared.\n- [`UserClickedClearAllFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button. The event payload is undefined.\n\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</docs>\n"],"names":[],"mappings":";;;;;AAsBE;;;;AAIE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,cAAc;IACpB,OAAO,EAAE,aAAa,CAAC,IAAI;IAC3B,UAAU,EAAE,EAAE,eAAc,EAAG;AAC/B,IAAA,KAAK,EAAE;;AAEL,QAAA,SAAS,EAAE,KAAqC;;AAEhD,QAAA,aAAa,EAAE,OAAM;AACtB,KAAA;IACD,KAAK,EAAE,UAAU,KAAK,EAAA;AACpB,QAAA,MAAM,EAAE,eAAe,EAAE,kBAAkB,EAAE,SAAU,EAAA,GAAI,SAAS,CAAC,KAAK,CAAC,CAAA;AAE3E;;;;AAIE;AACF,QAAA,MAAM,MAAK,GAAI,QAAQ,CAAwB,OAAO;YACpD,0BAA0B,EAAE,KAAK,CAAC,SAAQ;AAC3C,SAAA,CAAC,CAAC,CAAA;AAEH;;;;AAIE;AACF,QAAA,MAAM,UAAW,GAAE,QAAQ,CAAgB,OAAO;AAChD,YAAA,2CAA2C,EAAE,CAAC,kBAAkB,CAAC,KAAK;YACtE,uCAAuC,EAAE,kBAAkB,CAAC,KAAI;AACjE,SAAA,CAAC,CAAC,CAAA;QAEH,OAAO;YACL,eAAe;YACf,kBAAkB;YAClB,SAAS;YACT,MAAM;YACN,UAAS;SACV,CAAA;KACH;AACD,CAAA,CAAC;;;;"}
+{"version":3,"file":"clear-filters.vue2.js","sources":["../../../../../src/x-modules/facets/components/clear-filters.vue"],"sourcesContent":["<template>\n  <BaseEventButton\n    v-if=\"isVisible\"\n    class=\"x-clear-filters x-button\"\n    data-test=\"clear-filters\"\n    :disabled=\"!hasSelectedFilters\"\n    :events=\"events\"\n    :class=\"cssClasses\"\n  >\n    <slot :selected-filters=\"selectedFilters\">Clear Filters ({{ selectedFilters.length }})</slot>\n  </BaseEventButton>\n</template>\n\n<script lang=\"ts\">\nimport type { Facet } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport type { VueCSSClasses } from '../../../utils/types'\nimport type { XEventsTypes } from '../../../wiring/events.types'\nimport { computed, defineComponent } from 'vue'\nimport BaseEventButton from '../../../components/base-event-button.vue'\nimport { useFacets } from '../composables/use-facets'\nimport { facetsXModule } from '../x-module'\n\n/**\n * Renders a simple button, emitting the needed events when clicked.\n *\n * @public\n */\nexport default defineComponent({\n  name: 'ClearFilters',\n  xModule: facetsXModule.name,\n  components: { BaseEventButton },\n  props: {\n    /** Array of facets ids used to get the selected filters for those facets. */\n    facetsIds: Array as PropType<Array<Facet['id']>>,\n    /** Flag to render the component even if there are no filters selected. */\n    alwaysVisible: Boolean,\n  },\n  setup(props) {\n    const { selectedFilters, hasSelectedFilters, isVisible } = useFacets(props)\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     */\n    const events = computed<Partial<XEventsTypes>>(() => ({\n      UserClickedClearAllFilters: props.facetsIds,\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     */\n    const cssClasses = computed<VueCSSClasses>(() => ({\n      'x-clear-filters--has-not-selected-filters': !hasSelectedFilters.value,\n      'x-clear-filters--has-selected-filters': hasSelectedFilters.value,\n    }))\n\n    return {\n      selectedFilters,\n      hasSelectedFilters,\n      isVisible,\n      events,\n      cssClasses,\n    }\n  },\n})\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserClickedClearAllFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button to clear a certain facets filter. The event\n  payload is the id of the facets that are going to be cleared.\n- [`UserClickedClearAllFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user clicks the button. The event payload is undefined.\n\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</docs>\n"],"names":[],"mappings":";;;;;AAuBA;;;;AAIE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,cAAc;IACpB,OAAO,EAAE,aAAa,CAAC,IAAI;IAC3B,UAAU,EAAE,EAAE,eAAc,EAAG;AAC/B,IAAA,KAAK,EAAE;;AAEL,QAAA,SAAS,EAAE,KAAqC;;AAEhD,QAAA,aAAa,EAAE,OAAO;AACvB,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,EAAE,eAAe,EAAE,kBAAkB,EAAE,SAAQ,EAAI,GAAE,SAAS,CAAC,KAAK,CAAA,CAAA;AAE1E;;;;AAIE;AACF,QAAA,MAAM,MAAK,GAAI,QAAQ,CAAwB,OAAO;YACpD,0BAA0B,EAAE,KAAK,CAAC,SAAS;AAC5C,SAAA,CAAC,CAAA,CAAA;AAEF;;;;AAIE;AACF,QAAA,MAAM,UAAW,GAAE,QAAQ,CAAgB,OAAO;AAChD,YAAA,2CAA2C,EAAE,CAAC,kBAAkB,CAAC,KAAK;YACtE,uCAAuC,EAAE,kBAAkB,CAAC,KAAK;AAClE,SAAA,CAAC,CAAA,CAAA;QAEF,OAAO;YACL,eAAe;YACf,kBAAkB;YAClB,SAAS;YACT,MAAM;YACN,UAAU;SACZ,CAAA;KACD;AACF,CAAA,CAAA;;;;"}

package/js/x-modules/facets/components/facets/facets-provider.vue2.js

@@ -1,11 +1,11 @@
 import { isHierarchicalFacet } from '@empathyco/x-types';
 import { defineComponent, ref, computed, watch } from 'vue';
+import { use$x } from '../../../../composables/use-_x.js';
 import { clone } from '../../../../utils/clone.js';
 import { areFiltersDifferent } from '../../../../utils/filters.js';
 import '../../../../utils/storage.js';
 import { flatHierarchicalFilters } from '../../utils.js';
 import { facetsXModule } from '../../x-module.js';
-import { use$x } from '../../../../composables/use-_x.js';
 
 /**
  * This component allows to provide facets by prop, to add them to the state of the
@@ -27,7 +27,7 @@ var _sfc_main = defineComponent({
          */
         groupId: {
             type: String,
-            default: 'provided-facets'
+            default: 'provided-facets',
         },
         /**
          * The facets to provide to the `Facets X-Module` state. They have to include the
@@ -37,10 +37,10 @@ var _sfc_main = defineComponent({
          */
         facets: {
             type: Array,
-            required: true
-        }
+            required: true,
+        },
     },
-    setup: function (props) {
+    setup(props) {
         const $x = use$x();
         /**
          * Temporarily stores the selected filters from the {@link FacetsProvider.facets} prop.
@@ -96,7 +96,7 @@ var _sfc_main = defineComponent({
             }
         }, { immediate: true });
         return () => '';
-    }
+    },
 });
 
 export { _sfc_main as default };

package/js/x-modules/facets/components/facets/facets-provider.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"facets-provider.vue2.js","sources":["../../../../../../src/x-modules/facets/components/facets/facets-provider.vue"],"sourcesContent":["<script lang=\"ts\">\n  import { Facet, Filter, isHierarchicalFacet } from '@empathyco/x-types';\n  import { computed, defineComponent, PropType, Ref, ref, watch } from 'vue';\n  import { clone } from '../../../../utils';\n  import { areFiltersDifferent } from '../../../../utils/filters';\n  import { GroupId } from '../../store/types';\n  import { flatHierarchicalFilters } from '../../utils';\n  import { facetsXModule } from '../../x-module';\n  import { use$x } from '../../../../composables/use-$x';\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  export default defineComponent({\n    name: 'FacetsProvider',\n    xModule: facetsXModule.name,\n    props: {\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      groupId: {\n        type: String as PropType<GroupId>,\n        default: 'provided-facets'\n      },\n      /**\n       * The facets to provide to the `Facets X-Module` state. They have to include the\n       * {@link @empathyco/x-types#Filter}.\n       *\n       * @internal\n       */\n      facets: {\n        type: Array as PropType<Facet[]>,\n        required: true\n      }\n    },\n    setup: function (props) {\n      const $x = use$x();\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      const selectedFilters: Ref<Filter[] | null> = ref(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      const facetsGroup = computed(() => ({ id: props.groupId, facets: props.facets }));\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      $x.on('SelectedFiltersChanged', false).subscribe((selectedFiltersParams: Filter[]) => {\n        if (\n          selectedFilters.value === null ||\n          areFiltersDifferent(selectedFilters.value, selectedFiltersParams)\n        ) {\n          $x.emit('UserChangedSelectedFilters', selectedFiltersParams);\n        }\n        selectedFilters.value = null;\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      const extractSelectedFilters = (facets: Facet[]) => {\n        selectedFilters.value = facets\n          .flatMap(facet =>\n            isHierarchicalFacet(facet) ? flatHierarchicalFilters(facet.filters) : facet.filters\n          )\n          .filter(filter => filter.selected);\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(\n        () => facetsGroup.value,\n        () => {\n          if (facetsGroup.value.facets) {\n            const facetsGroupClone = clone(facetsGroup.value);\n            $x.emit('FacetsGroupProvided', facetsGroupClone);\n            extractSelectedFilters(props.facets);\n          }\n        },\n        { immediate: true }\n      );\n\n      return () => '';\n    }\n  });\n</script>\n\n<style lang=\"css\" scoped>\n  .x-facets-list {\n    list-style-type: none;\n  }\n</style>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserChangedSelectedFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user performed an action that changed the selected filters. The\n  payload is the new list of selected filters.\n- [`FacetsGroupProvided`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after updating the facets prop with a new list of facets. The payload\n  contains a Facets Group with the facets and the group id.\n\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 `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</docs>\n"],"names":[],"mappings":";;;;;;;;;AAUE;;;;;;;AAOE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,gBAAgB;IACtB,OAAO,EAAE,aAAa,CAAC,IAAI;AAC3B,IAAA,KAAK,EAAE;AACL;;;;;AAKE;AACF,QAAA,OAAO,EAAE;AACP,YAAA,IAAI,EAAE,MAA2B;AACjC,YAAA,OAAO,EAAE,iBAAgB;AAC1B,SAAA;AACD;;;;;AAKE;AACF,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,KAA0B;AAChC,YAAA,QAAQ,EAAE,IAAG;AACf,SAAA;AACD,KAAA;IACD,KAAK,EAAE,UAAU,KAAK,EAAA;AACpB,QAAA,MAAM,EAAC,GAAI,KAAK,EAAE,CAAA;AAElB;;;;;AAKE;AACF,QAAA,MAAM,eAAe,GAAyB,GAAG,CAAC,IAAI,CAAC,CAAA;AAEvD;;;;;;AAME;QACF,MAAM,WAAY,GAAE,QAAQ,CAAC,OAAO,EAAE,EAAE,EAAE,KAAK,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,MAAO,EAAC,CAAC,CAAC,CAAA;AAEjF;;;;;;AAME;AACF,QAAA,EAAE,CAAC,EAAE,CAAC,wBAAwB,EAAE,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,qBAA+B,KAAK;AACpF,YAAA,IACE,eAAe,CAAC,KAAM,KAAI,IAAG;AAC7B,gBAAA,mBAAmB,CAAC,eAAe,CAAC,KAAK,EAAE,qBAAqB,CAAA,EAChE;AACA,gBAAA,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,qBAAqB,CAAC,CAAA;AAC9D,aAAA;AACA,YAAA,eAAe,CAAC,QAAQ,IAAI,CAAA;AAC9B,SAAC,CAAC,CAAA;AAEF;;;;;;AAME;AACF,QAAA,MAAM,yBAAyB,CAAC,MAAe,KAAK;YAClD,eAAe,CAAC,KAAM,GAAE,MAAK;iBAC1B,OAAO,CAAC,SACP,mBAAmB,CAAC,KAAK,CAAA,GAAI,uBAAuB,CAAC,KAAK,CAAC,OAAO,CAAE,GAAE,KAAK,CAAC,OAAM,CACpF;iBACC,MAAM,CAAC,UAAU,MAAM,CAAC,QAAQ,CAAC,CAAA;AACtC,SAAC,CAAA;AAED;;;;AAIE;QACF,KAAK,CACH,MAAM,WAAW,CAAC,KAAK,EACvB,MAAM;AACJ,YAAA,IAAI,WAAW,CAAC,KAAK,CAAC,MAAM,EAAE;gBAC5B,MAAM,mBAAmB,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;AACjD,gBAAA,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,gBAAgB,CAAC,CAAA;AAChD,gBAAA,sBAAsB,CAAC,KAAK,CAAC,MAAM,CAAC,CAAA;AACtC,aAAA;AACF,SAAC,EACD,EAAE,SAAS,EAAE,IAAK,EAAA,CACnB,CAAA;AAED,QAAA,OAAO,MAAM,EAAE,CAAA;KACjB;AACD,CAAA,CAAC;;;;"}
+{"version":3,"file":"facets-provider.vue2.js","sources":["../../../../../../src/x-modules/facets/components/facets/facets-provider.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Facet, Filter } from '@empathyco/x-types'\nimport type { PropType, Ref } from 'vue'\nimport type { GroupId } from '../../store/types'\nimport { isHierarchicalFacet } from '@empathyco/x-types'\nimport { computed, defineComponent, ref, watch } from 'vue'\nimport { use$x } from '../../../../composables/use-$x'\nimport { clone } from '../../../../utils'\nimport { areFiltersDifferent } from '../../../../utils/filters'\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 */\nexport default defineComponent({\n  name: 'FacetsProvider',\n  xModule: facetsXModule.name,\n  props: {\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    groupId: {\n      type: String as PropType<GroupId>,\n      default: 'provided-facets',\n    },\n    /**\n     * The facets to provide to the `Facets X-Module` state. They have to include the\n     * {@link @empathyco/x-types#Filter}.\n     *\n     * @internal\n     */\n    facets: {\n      type: Array as PropType<Facet[]>,\n      required: true,\n    },\n  },\n  setup(props) {\n    const $x = use$x()\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    const selectedFilters: Ref<Filter[] | null> = ref(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    const facetsGroup = computed(() => ({ id: props.groupId, facets: props.facets }))\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    $x.on('SelectedFiltersChanged', false).subscribe((selectedFiltersParams: Filter[]) => {\n      if (\n        selectedFilters.value === null ||\n        areFiltersDifferent(selectedFilters.value, selectedFiltersParams)\n      ) {\n        $x.emit('UserChangedSelectedFilters', selectedFiltersParams)\n      }\n      selectedFilters.value = null\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    const extractSelectedFilters = (facets: Facet[]) => {\n      selectedFilters.value = facets\n        .flatMap(facet =>\n          isHierarchicalFacet(facet) ? flatHierarchicalFilters(facet.filters) : facet.filters,\n        )\n        .filter(filter => filter.selected)\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(\n      () => facetsGroup.value,\n      () => {\n        if (facetsGroup.value.facets) {\n          const facetsGroupClone = clone(facetsGroup.value)\n          $x.emit('FacetsGroupProvided', facetsGroupClone)\n          extractSelectedFilters(props.facets)\n        }\n      },\n      { immediate: true },\n    )\n\n    return () => ''\n  },\n})\n</script>\n\n<style lang=\"css\" scoped>\n.x-facets-list {\n  list-style-type: none;\n}\n</style>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- [`UserChangedSelectedFilters`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after the user performed an action that changed the selected filters. The\n  payload is the new list of selected filters.\n- [`FacetsGroupProvided`](https://github.com/empathyco/x/blob/main/packages/x-components/src/wiring/events.types.ts):\n  the event is emitted after updating the facets prop with a new list of facets. The payload\n  contains a Facets Group with the facets and the group id.\n\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 `SearchXEvents.FacetsChanged` event.\n\n```vue\n<template>\n  <FacetsProvider :facets=\"myFacets\" />\n</template>\n\n<script>\nimport { FacetsProvider } from '@empathyco/x-components/facets'\n\nexport 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</docs>\n"],"names":[],"mappings":";;;;;;;;;AAYA;;;;;;;AAOE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,gBAAgB;IACtB,OAAO,EAAE,aAAa,CAAC,IAAI;AAC3B,IAAA,KAAK,EAAE;AACL;;;;;AAKE;AACF,QAAA,OAAO,EAAE;AACP,YAAA,IAAI,EAAE,MAA2B;AACjC,YAAA,OAAO,EAAE,iBAAiB;AAC3B,SAAA;AACD;;;;;AAKE;AACF,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,KAA0B;AAChC,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;AACT,QAAA,MAAM,EAAC,GAAI,KAAK,EAAC,CAAA;AAEjB;;;;;AAKE;AACF,QAAA,MAAM,eAAe,GAAyB,GAAG,CAAC,IAAI,CAAA,CAAA;AAEtD;;;;;;AAME;QACF,MAAM,WAAY,GAAE,QAAQ,CAAC,OAAO,EAAE,EAAE,EAAE,KAAK,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,MAAK,EAAG,CAAC,CAAA,CAAA;AAEhF;;;;;;AAME;AACF,QAAA,EAAE,CAAC,EAAE,CAAC,wBAAwB,EAAE,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,qBAA+B,KAAK;AACpF,YAAA,IACE,eAAe,CAAC,KAAM,KAAI,IAAG;AAC7B,gBAAA,mBAAmB,CAAC,eAAe,CAAC,KAAK,EAAE,qBAAqB,CAAA,EAChE;AACA,gBAAA,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,qBAAqB,CAAA,CAAA;AAC7D,aAAA;AACA,YAAA,eAAe,CAAC,KAAM,GAAE,IAAG,CAAA;AAC7B,SAAC,CAAA,CAAA;AAED;;;;;;AAME;AACF,QAAA,MAAM,yBAAyB,CAAC,MAAe,KAAK;YAClD,eAAe,CAAC,KAAM,GAAE,MAAK;iBAC1B,OAAO,CAAC,SACP,mBAAmB,CAAC,KAAK,CAAA,GAAI,uBAAuB,CAAC,KAAK,CAAC,OAAO,CAAE,GAAE,KAAK,CAAC,OAAO,CACrF;iBACC,MAAM,CAAC,MAAO,IAAG,MAAM,CAAC,QAAQ,CAAA,CAAA;AACrC,SAAA,CAAA;AAEA;;;;AAIE;QACF,KAAK,CACH,MAAM,WAAW,CAAC,KAAK,EACvB,MAAM;AACJ,YAAA,IAAI,WAAW,CAAC,KAAK,CAAC,MAAM,EAAE;gBAC5B,MAAM,gBAAiB,GAAE,KAAK,CAAC,WAAW,CAAC,KAAK,CAAA,CAAA;AAChD,gBAAA,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,gBAAgB,CAAA,CAAA;AAC/C,gBAAA,sBAAsB,CAAC,KAAK,CAAC,MAAM,CAAA,CAAA;AACrC,aAAA;AACF,SAAC,EACD,EAAE,SAAS,EAAE,MAAM,CACrB,CAAA;AAEA,QAAA,OAAO,MAAM,EAAC,CAAA;KACf;AACF,CAAA,CAAA;;;;"}