@empathyco/x-components 3.0.0-alpha.144 → 3.0.0-alpha.147

package/CHANGELOG.md

@@ -3,6 +3,51 @@
 All notable changes to this project will be documented in this file. See
 [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.0.0-alpha.147](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.146...@empathyco/x-components@3.0.0-alpha.147) (2022-08-03)
+
+### ⚠ BREAKING CHANGES
+
+- **facets:** Removed the `setFilter`mutation from `facets` X-Module. Use `mutateFilter` instead.
+- **facets:** Modified the `HierarchicalFilter.children` Model type. Now it is an
+  `Array<HierarchicalFilter>` instead of an array of ids.
+
+### Features
+
+- **facets:** Move filters flattening from `x-adapter-platform` to `x-components`. (#626)
+  ([2bebaeb](https://github.com/empathyco/x/commit/2bebaeb2863fe794f1b3bea924904651b9302ef6)),
+  closes [EX-6484](https://searchbroker.atlassian.net/browse/EX-6484)
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [3.0.0-alpha.146](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.145...@empathyco/x-components@3.0.0-alpha.146) (2022-08-03)
+
+### Documentation
+
+- bring functional docs from eDocs project (#630)
+  ([27e6dd6](https://github.com/empathyco/x/commit/27e6dd646084983c37fc52894dc95544253405d5)),
+  closes [EX-6237](https://searchbroker.atlassian.net/browse/EX-6237)
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [3.0.0-alpha.145](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.144...@empathyco/x-components@3.0.0-alpha.145) (2022-08-01)
+
+### Documentation
+
+- update archetype integration and x-adapter docs (#628)
+  ([247899e](https://github.com/empathyco/x/commit/247899e39d4f415f59b8ec1b7376fc72530028c2)),
+  closes [EX-6728](https://searchbroker.atlassian.net/browse/EX-6728)
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
 ## [3.0.0-alpha.144](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.143...@empathyco/x-components@3.0.0-alpha.144) (2022-08-01)
 
 ### ⚠ BREAKING CHANGES

package/design-system/default-theme.css

@@ -1166,6 +1166,34 @@
   font-weight: var(--x-number-font-weight-input-placeholder-default);
   line-height: var(--x-size-line-height-input-placeholder-default);
 }
+:root {
+  --x-color-background-input-default: var(--x-color-base-neutral-100);
+  --x-color-border-input-default: var(--x-color-base-neutral-70);
+  --x-color-border-input-default-focus: var(--x-color-base-lead);
+  --x-color-text-input-default: var(--x-color-text-default);
+  --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
+  --x-size-border-width-input-default: var(--x-size-border-width-base);
+  --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
+  --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
+  --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
+  --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
+  --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
+  --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
+  --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
+  --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
+  --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
+  --x-size-height-input-default: var(--x-size-base-07);
+  --x-size-padding-right-input-default: var(--x-size-base-04);
+  --x-size-padding-left-input-default: var(--x-size-base-04);
+  --x-font-family-input-default: var(--x-font-family-text);
+  --x-size-font-input-default: var(--x-size-font-text);
+  --x-size-line-height-input-default: var(--x-size-line-height-text);
+  --x-number-font-weight-input-default: var(--x-number-font-weight-text);
+  --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
+  --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
+  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
+  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
+}
 :root {
   --x-string-flow-list: column nowrap;
   --x-size-padding-list: 0;
@@ -2878,32 +2906,4 @@
   --x-size-line-height-base-s: 16px;
   --x-size-line-height-base-m: 24px;
   --x-size-line-height-base-l: 32px;
-}
-:root {
-  --x-color-background-input-default: var(--x-color-base-neutral-100);
-  --x-color-border-input-default: var(--x-color-base-neutral-70);
-  --x-color-border-input-default-focus: var(--x-color-base-lead);
-  --x-color-text-input-default: var(--x-color-text-default);
-  --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
-  --x-size-border-width-input-default: var(--x-size-border-width-base);
-  --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
-  --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
-  --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
-  --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
-  --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
-  --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
-  --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
-  --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
-  --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
-  --x-size-height-input-default: var(--x-size-base-07);
-  --x-size-padding-right-input-default: var(--x-size-base-04);
-  --x-size-padding-left-input-default: var(--x-size-base-04);
-  --x-font-family-input-default: var(--x-font-family-text);
-  --x-size-font-input-default: var(--x-size-font-text);
-  --x-size-line-height-input-default: var(--x-size-line-height-text);
-  --x-number-font-weight-input-default: var(--x-number-font-weight-text);
-  --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
-  --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
-  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
-  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
 }

package/design-system/full-theme.css

@@ -121,6 +121,59 @@
   --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
   --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
 }
+[dir="ltr"] .x-button {
+  padding-right: var(--x-size-padding-right-button-default);
+}
+[dir="rtl"] .x-button {
+  padding-left: var(--x-size-padding-right-button-default);
+}
+[dir="ltr"] .x-button {
+  padding-left: var(--x-size-padding-left-button-default);
+}
+[dir="rtl"] .x-button {
+  padding-right: var(--x-size-padding-left-button-default);
+}
+[dir="ltr"] .x-button {
+  border-left-width: var(--x-size-border-width-left-button-default);
+}
+[dir="rtl"] .x-button {
+  border-right-width: var(--x-size-border-width-left-button-default);
+}
+[dir="ltr"] .x-button {
+  border-right-width: var(--x-size-border-width-right-button-default);
+}
+[dir="rtl"] .x-button {
+  border-left-width: var(--x-size-border-width-right-button-default);
+}
+.x-button {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  box-sizing: border-box;
+  margin: 0;
+  gap: var(--x-size-gap-button-default);
+  min-height: var(--x-size-height-button-default);
+  background-color: var(--x-color-background-button-default);
+  border-color: var(--x-color-border-button-default);
+  color: var(--x-color-text-button-default);
+  border-style: solid;
+  border-top-width: var(--x-size-border-width-top-button-default);
+  border-bottom-width: var(--x-size-border-width-bottom-button-default);
+  border-radius: var(--x-size-border-radius-top-left-button-default) var(--x-size-border-radius-top-right-button-default) var(--x-size-border-radius-bottom-right-button-default) var(--x-size-border-radius-bottom-left-button-default);
+  font-family: var(--x-font-family-button-default);
+  font-size: var(--x-size-font-button-default);
+  font-weight: var(--x-number-font-weight-button-default);
+  line-height: var(--x-size-line-height-button-default);
+  cursor: pointer;
+}
+@media not all and (min-resolution: 0.001dpcm) {
+  .x-button {
+    gap: 0;
+  }
+  .x-button > *:not(:last-child) {
+    margin-right: var(--x-size-gap-button-default);
+  }
+}
 :root {
   --x-color-background-button-default: var(--x-color-base-lead);
   --x-color-border-button-default: var(--x-color-background-button-default);
@@ -7540,57 +7593,3 @@
 .x-normal-case {
   text-transform: none;
 }
-
-[dir="ltr"] .x-button {
-  padding-right: var(--x-size-padding-right-button-default);
-}
-[dir="rtl"] .x-button {
-  padding-left: var(--x-size-padding-right-button-default);
-}
-[dir="ltr"] .x-button {
-  padding-left: var(--x-size-padding-left-button-default);
-}
-[dir="rtl"] .x-button {
-  padding-right: var(--x-size-padding-left-button-default);
-}
-[dir="ltr"] .x-button {
-  border-left-width: var(--x-size-border-width-left-button-default);
-}
-[dir="rtl"] .x-button {
-  border-right-width: var(--x-size-border-width-left-button-default);
-}
-[dir="ltr"] .x-button {
-  border-right-width: var(--x-size-border-width-right-button-default);
-}
-[dir="rtl"] .x-button {
-  border-left-width: var(--x-size-border-width-right-button-default);
-}
-.x-button {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  box-sizing: border-box;
-  margin: 0;
-  gap: var(--x-size-gap-button-default);
-  min-height: var(--x-size-height-button-default);
-  background-color: var(--x-color-background-button-default);
-  border-color: var(--x-color-border-button-default);
-  color: var(--x-color-text-button-default);
-  border-style: solid;
-  border-top-width: var(--x-size-border-width-top-button-default);
-  border-bottom-width: var(--x-size-border-width-bottom-button-default);
-  border-radius: var(--x-size-border-radius-top-left-button-default) var(--x-size-border-radius-top-right-button-default) var(--x-size-border-radius-bottom-right-button-default) var(--x-size-border-radius-bottom-left-button-default);
-  font-family: var(--x-font-family-button-default);
-  font-size: var(--x-size-font-button-default);
-  font-weight: var(--x-number-font-weight-button-default);
-  line-height: var(--x-size-line-height-button-default);
-  cursor: pointer;
-}
-@media not all and (min-resolution: 0.001dpcm) {
-  .x-button {
-    gap: 0;
-  }
-  .x-button > *:not(:last-child) {
-    margin-right: var(--x-size-gap-button-default);
-  }
-}

package/docs/API-reference/api/x-adapter-platform.md

@@ -11,7 +11,6 @@
 |  [extractUrlParameters(url)](./x-adapter-platform.extracturlparameters.md) | Returns the base url path and an object with the query parameters. |
 |  [getFacetConfig(facet)](./x-adapter-platform.getfacetconfig.md) | Returns the facet's config. |
 |  [getTaggingInfoFromUrl(taggingUrl)](./x-adapter-platform.gettagginginfofromurl.md) | Extracts the tagging info from a URL. |
-|  [searchResponseFacetsMapper(from, { mappedValue })](./x-adapter-platform.searchresponsefacetsmapper.md) | Mapper to flatten hierarchical facet filters. |
 
 ## Interfaces
 

package/docs/API-reference/api/x-adapter-platform.searchresponsemapper.md

@@ -7,15 +7,5 @@
 <b>Signature:</b>
 
 ```typescript
-searchResponseMapper: import("@empathyco/x-adapter").Mapper<PlatformSearchResponse, {
-    banners: import("@empathyco/x-types").Banner[];
-    facets: import("@empathyco/x-types").Facet[];
-    partialResults: import("@empathyco/x-types").PartialResult[];
-    promoteds: import("@empathyco/x-types").Promoted[];
-    queryTagging: import("@empathyco/x-types").TaggingRequest;
-    redirections: import("@empathyco/x-types").Redirection[];
-    results: import("@empathyco/x-types").Result[];
-    spellcheck: string;
-    totalResults: number;
-}>
+searchResponseMapper: import("@empathyco/x-adapter").Mapper<PlatformSearchResponse, SearchResponse>
 ```

package/docs/API-reference/api/x-components.facetsmutations.md

@@ -16,12 +16,12 @@ export interface FacetsMutations
 
 |  Method | Description |
 |  --- | --- |
+|  [mutateFilter(payload)](./x-components.facetsmutations.mutatefilter.md) | Updates the state of a filter. |
 |  [removeFacet(facet)](./x-components.facetsmutations.removefacet.md) | Removes the facet from the [facets](./x-components.facetsstate.facets.md) record. |
 |  [removeFilter(filter)](./x-components.facetsmutations.removefilter.md) | Removes the filter from the [filters](./x-components.facetsstate.filters.md) record. |
 |  [removeFilters(filters)](./x-components.facetsmutations.removefilters.md) | Removes a list of filters from the [filters](./x-components.facetsstate.filters.md) record. |
 |  [setFacet(facet)](./x-components.facetsmutations.setfacet.md) | Adds the facet to the [facets](./x-components.facetsstate.facets.md) record. |
 |  [setFacetGroup(facetGroupEntry)](./x-components.facetsmutations.setfacetgroup.md) | Sets the group id of the facet. |
-|  [setFilter(filter)](./x-components.facetsmutations.setfilter.md) | Adds the filter to the [filters](./x-components.facetsstate.filters.md) record. |
 |  [setFilters(filters)](./x-components.facetsmutations.setfilters.md) | Adds a list of filters to the [filters](./x-components.facetsstate.filters.md) record. |
 |  [setPreselectedFilters(filters)](./x-components.facetsmutations.setpreselectedfilters.md) | Adds a list of filters to the [preselectedFilters](./x-components.facetsstate.preselectedfilters.md) record. |
 

package/docs/API-reference/api/x-components.facetsmutations.mutatefilter.md

@@ -0,0 +1,24 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [FacetsMutations](./x-components.facetsmutations.md) &gt; [mutateFilter](./x-components.facetsmutations.mutatefilter.md)
+
+## FacetsMutations.mutateFilter() method
+
+Updates the state of a filter.
+
+<b>Signature:</b>
+
+```typescript
+mutateFilter(payload: MutateFilterPayload): void;
+```
+
+## Parameters
+
+|  Parameter | Type | Description |
+|  --- | --- | --- |
+|  payload | [MutateFilterPayload](./x-components.mutatefilterpayload.md) | An object containing the filter to update, and the properties to modify. |
+
+<b>Returns:</b>
+
+void
+

package/docs/API-reference/api/x-components.flathierarchicalfilters.md

@@ -0,0 +1,26 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [flatHierarchicalFilters](./x-components.flathierarchicalfilters.md)
+
+## flatHierarchicalFilters() function
+
+This function flattens the Hierarchical Filters, returning an array with all filters including the children.
+
+<b>Signature:</b>
+
+```typescript
+export declare function flatHierarchicalFilters(hierarchicalFilters: HierarchicalFilter[]): HierarchicalFilter[];
+```
+
+## Parameters
+
+|  Parameter | Type | Description |
+|  --- | --- | --- |
+|  hierarchicalFilters | HierarchicalFilter\[\] | The list of Hierarchical Filters to flatten. |
+
+<b>Returns:</b>
+
+HierarchicalFilter\[\]
+
+An array with all the Hierarchical filters.
+

package/docs/API-reference/api/x-components.md

@@ -166,6 +166,7 @@ X-Components is a library usable everywhere not only for search experiences.
 |  [filterFalsyPayload(wire)](./x-components.filterfalsypayload.md) | Creates a [Wire](./x-components.wire.md) that is only executed when the payload is truthy. A truthy value is whatever is not a [falsy value](https://developer.mozilla.org/en-US/docs/Glossary/Falsy)<!-- -->. |
 |  [filterTruthyPayload(wire)](./x-components.filtertruthypayload.md) | Creates a [Wire](./x-components.wire.md) that is only executed when the payload is a [falsy value](https://developer.mozilla.org/en-US/docs/Glossary/Falsy)<!-- -->. |
 |  [filterWhitelistedModules(wire, whitelist)](./x-components.filterwhitelistedmodules.md) | Creates a [Wire](./x-components.wire.md) that is only executed if the event is emitted from a [XModule](./x-components.xmodule.md) that is included in the <code>whitelist</code> array passed as parameter. |
+|  [flatHierarchicalFilters(hierarchicalFilters)](./x-components.flathierarchicalfilters.md) | This function flattens the Hierarchical Filters, returning an array with all filters including the children. |
 |  [getRootXComponent(component)](./x-components.getrootxcomponent.md) | Given a component, finds the root XComponent in the ancestors hierarchy. |
 |  [getStateAndGettersFromModule(state, getters, moduleName)](./x-components.getstateandgettersfrommodule.md) | Returns an object with the getters and state of a module of store defined by the moduleName parameter. |
 |  [Getter(module, getter)](./x-components.getter.md) | Generates a computed property which returns the selected getter value.<!-- -->The decorated property needs to be public for type inference to work. |
@@ -253,6 +254,7 @@ X-Components is a library usable everywhere not only for search experiences.
 |  [InitWrapper](./x-components.initwrapper.md) | Interface for the returned type of the [XInstaller.init()](./x-components.xinstaller.init.md) function. |
 |  [InstallXOptions](./x-components.installxoptions.md) | Interface for the parameter of the constructor of [XInstaller](./x-components.xinstaller.md) function. It is an extended version of [XPluginOptions](./x-components.xpluginoptions.md)<!-- -->. |
 |  [InternalSearchRequest](./x-components.internalsearchrequest.md) | An internal search request containing the page used to calculate the start and rows properties of a [SearchRequest](./x-types.searchrequest.md)<!-- -->. |
+|  [MutateFilterPayload](./x-components.mutatefilterpayload.md) | Payload to use in the <code>mutateFilter</code> mutation. |
 |  [NamespacedWireCommit](./x-components.namespacedwirecommit.md) | Namespaced type for the [wireCommit()](./x-components.wirecommit.md) which creates a wire with its payload associated. Possible ways for creating a wire that commits a mutation. If a payload is passed, then the observable payload can be ignored, so the wire is applicable to any event. If no payload is passed, then the wire is only applicable to events with the same payload type than the mutation. |
 |  [NamespacedWireDispatch](./x-components.namespacedwiredispatch.md) | Namespaced type for the [wireDispatch()](./x-components.wiredispatch.md) which creates a wire with its payload associated. Possible ways for creating a wire that dispatches an action. If a payload is passed, then the observable payload can be ignored, so the wire is applicable to any event. If no payload is passed, then the wire is only applicable to events with the same payload type than the action. |
 |  [NextQueriesActions](./x-components.nextqueriesactions.md) | Next queries module actions. |

package/docs/API-reference/api/x-components.mutatefilterpayload.filter.md

@@ -0,0 +1,13 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [MutateFilterPayload](./x-components.mutatefilterpayload.md) &gt; [filter](./x-components.mutatefilterpayload.filter.md)
+
+## MutateFilterPayload.filter property
+
+The filter to modify. If it does not belong to the store it will be added.
+
+<b>Signature:</b>
+
+```typescript
+filter: Filter;
+```

package/docs/API-reference/api/x-components.mutatefilterpayload.md

@@ -0,0 +1,21 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [MutateFilterPayload](./x-components.mutatefilterpayload.md)
+
+## MutateFilterPayload interface
+
+Payload to use in the `mutateFilter` mutation.
+
+<b>Signature:</b>
+
+```typescript
+export interface MutateFilterPayload 
+```
+
+## Properties
+
+|  Property | Type | Description |
+|  --- | --- | --- |
+|  [filter](./x-components.mutatefilterpayload.filter.md) | Filter | The filter to modify. If it does not belong to the store it will be added. |
+|  [newFilterState](./x-components.mutatefilterpayload.newfilterstate.md) | Partial&lt;Filter&gt; | The new fields values to modify in the filter. |
+

package/docs/API-reference/api/x-components.mutatefilterpayload.newfilterstate.md

@@ -0,0 +1,13 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [MutateFilterPayload](./x-components.mutatefilterpayload.md) &gt; [newFilterState](./x-components.mutatefilterpayload.newfilterstate.md)
+
+## MutateFilterPayload.newFilterState property
+
+The new fields values to modify in the filter.
+
+<b>Signature:</b>
+
+```typescript
+newFilterState: Partial<Filter>;
+```

package/docs/API-reference/api/x-types.hierarchicalfilter.children.md

@@ -4,10 +4,10 @@
 
 ## HierarchicalFilter.children property
 
-Descendants filters id.
+Descendants filters.
 
 <b>Signature:</b>
 
 ```typescript
-children?: Filter['id'][];
+children?: HierarchicalFilter[];
 ```

package/docs/API-reference/api/x-types.hierarchicalfilter.md

@@ -17,7 +17,7 @@ export interface HierarchicalFilter extends BooleanFilter
 
 |  Property | Type | Description |
 |  --- | --- | --- |
-|  [children?](./x-types.hierarchicalfilter.children.md) | [Filter](./x-types.filter.md)<!-- -->\['id'\]\[\] | <i>(Optional)</i> Descendants filters id. |
+|  [children?](./x-types.hierarchicalfilter.children.md) | [HierarchicalFilter](./x-types.hierarchicalfilter.md)<!-- -->\[\] | <i>(Optional)</i> Descendants filters. |
 |  [modelName](./x-types.hierarchicalfilter.modelname.md) | 'HierarchicalFilter' | Model name to indicate the filter type. |
-|  [parentId](./x-types.hierarchicalfilter.parentid.md) | [Filter](./x-types.filter.md)<!-- -->\['id'\] \| null | An unique id used to reference the parent filter or null if it hasn't. |
+|  [parentId](./x-types.hierarchicalfilter.parentid.md) | [Filter](./x-types.filter.md)<!-- -->\['id'\] \| null | A unique id used to reference the parent filter or null if it hasn't. |
 

package/docs/API-reference/api/x-types.hierarchicalfilter.parentid.md

@@ -4,7 +4,7 @@
 
 ## HierarchicalFilter.parentId property
 
-An unique id used to reference the parent filter or null if it hasn't.
+A unique id used to reference the parent filter or null if it hasn't.
 
 <b>Signature:</b>
 

package/docs/build-search-ui/web-archetype-development-guide.md

@@ -22,9 +22,9 @@ requires knowledge of JavaScript and Vue.js.
 
 To use Interface X Archetype as a search UI layer, you need:
 
-- **Empathy Search API** (or any search API that you use to retrieve search data).
-- **Empathy Search Adapter** to communicate with the Empathy Search API (or any search adapter to
-  connect with the search API you are using).
+- **Empathy Platform Search API** (or any search API that you use to retrieve search data).
+- **Empathy Platform Search Adapter** to communicate with the Empathy Platform Search API (or the
+  Empathy Search Adapter to connect with the search API you are using).
 
 :::
 
@@ -102,16 +102,19 @@ Interface X Archetype repository.
 
 ## Configuring the search adapter
 
-Before using your project, configure the Empathy Search Adapter in the
-`x-archetype/src/adapter/adapter.ts` file to make it work with the Empathy Search API.
+Before using your project, configure the Empathy Platform Search Adapter in the
+`x-archetype/src/adapter/adapter.ts` file. The Empathy Platform Search Adapter contains a sample
+configuration for setup, global configurations, or mappers that points to a demo environment. You
+need to adjust the configuration according to the search features you use in your project.
 
 Export the required search adapter with your configuration as you will need it for the search
 [xPlugin configuration](#configuring-the-plugin).
 
 ::: interact
 
-For detailed information about other configuration options in the Empathy Search Adapter, go to the
-[x-adapter repository](https://github.com/empathyco/x/tree/main/packages/x-adapter).
+For detailed information about other configuration options in the Empathy Platform Search Adapter,
+go to the
+[x-adapter-platform repository](https://github.com/empathyco/x/tree/main/packages/x-adapter-platform).
 
 :::
 

package/docs/build-search-ui/web-archetype-integration-guide.md

@@ -69,7 +69,6 @@ initialize Interface X:
 ```js
 window.initX = {
   instance: 'my-store',
-  env: 'live',
   scope: 'desktop',
   lang: 'en',
   currency: 'EUR',
@@ -83,7 +82,7 @@ window.initX = {
 window.initX = function () {
   return {
     instance: 'my-store',
-    env: location.href.includes('.pre.') ? 'staging' : 'live',
+    env: location.href.includes('.pre.') ? 'staging' : undefined,
     scope: 'web',
     lang: localStorage.get('lang'),
     currency: localStorage.get('currency'),
@@ -105,7 +104,9 @@ more information on the supported parameters, check out
 
 Once the snippet configuration is ready, add the Interface X script to your webpage. The script
 is hosted in a URL with the following syntax:
-`https://x.<environment?>.empathy.co/<instance>/app.js`.
+
+- **Production**: `https://x.empathy.co/{INSTANCE}/app.js`
+- **Staging**: `https://x.staging.empathy.co/{INSTANCE}/app.js`
 
 For example, to load the production version script for the instance _my-store_, you need to add the
 following scripts to your HTML:
@@ -114,7 +115,6 @@ following scripts to your HTML:
 <script>
   window.initX = {
     instance: 'my-store',
-    env: 'live',
     scope: 'desktop',
     lang: 'en',
     currency: 'EUR',
@@ -131,7 +131,7 @@ attribute `src` so that it points to the staging environment as follows:
 <script>
   window.initX = {
     instance: 'my-store',
-    env: 'live', // Note that here you are using a production API with the staging version of Interface X
+    env: 'staging', // By removing this param you would be using a production API with the staging version of Interface X
     scope: 'desktop',
     lang: 'en',
     currency: 'EUR',
@@ -156,7 +156,9 @@ On-demand initialization allows you to control when Interface&nbsp;X is loaded.
 #### Loading the script
 
 Add the Interface&nbsp;X script hosted in a URL with the following syntax:
-`https://x.<environment?>.empathy.co/<instance>/app.js`.
+
+- **Production**: `https://x.empathy.co/{INSTANCE}/app.js`
+- **Staging**: `https://x.staging.empathy.co/{INSTANCE}/app.js`
 
 For example, to load the production version script for the instance _my-store_, you need to add the
 following script to your HTML:
@@ -180,11 +182,10 @@ initialization function** created automatically in the
 object to provide the initialization options:
 
 ```html
-<script src="https://x.empathy.co/my-store/app.js"></script>
+<script src="https://x.empathy.co/my-store/app.js" type="module"></script>
 <script>
   window.InterfaceX.init({
     instance: 'my-store',
-    env: 'live',
     scope: 'desktop',
     lang: 'en',
     currency: 'EUR',
@@ -219,12 +220,12 @@ The
 [snippet configuration](https://github.com/empathyco/x-archetype/blob/main/public/snippet-script.js)
 allows you to configure multiple initialization options for the Interface&nbsp;X project such as
 language, currency, and shopper's personal data consent. The snippet configuration supports the
-following configuration options:
+following configuration parameters:
 
-| Name                                                   | Type                                                                                 | Description                                                                                                                                                                                                                                                                                      |
+| Parameter                                              | Type                                                                                 | Description                                                                                                                                                                                                                                                                                      |
 | ------------------------------------------------------ | ------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
 | `instance`                                             | `string`                                                                             | _Required._ ID of the API client instance. It's provided by Empathy.                                                                                                                                                                                                                             |
-| `env`                                                  | `'live'` &#124; `'staging'`                                                          | _Optional_. API environment to use. You can use the Interface&nbsp;X production version with the staging API, and vice versa.                                                                                                                                                                    |
+| `env`                                                  | `staging`                                                                            | _Optional_. API environment to use. Note that if you **do not** declare this parameter, you'll use the production API. Instead, use `env: 'staging'` to point to the staging API.                                                                                                                |
 | `scope`                                                | `string`                                                                             | _Optional_. Context where the search interface is executed, i.e. `mobile`, `mobile-app`, `tablet`, `desktop`.                                                                                                                                                                                    |
 | `lang`                                                 | `string`                                                                             | _Required._ Language to use. By default, it's used for both the frontend and the API requests.                                                                                                                                                                                                   |
 | `searchLang`                                           | `string`                                                                             | _Optional_. Language to use for the API requests **only**.                                                                                                                                                                                                                                       |
@@ -260,11 +261,10 @@ For example, you subscribe to the `UserClickedResultAddToCart` event to add a pr
 shopping cart:
 
 ```html
-<script src="https://x.empathy.co/my-store/app.js"></script>
+<script src="https://x.empathy.co/my-store/app.js" type="module"></script>
 <script>
   window.InterfaceX.init({
     instance: 'my-store',
-    env: 'live',
     scope: 'desktop',
     lang: 'en',
     currency: 'EUR',
@@ -297,7 +297,8 @@ etc.). See the corresponding `events.types.ts` file for each module in the
 The
 [X&nbsp;API](https://github.com/empathyco/x/blob/main/packages/x-components/src/x-installer/api/base-api.ts)
 object allows your commerce store to communicate with Interface&nbsp;X. It supports multiple
-functions to integrate Interface&nbsp;X in your website.
+functions to integrate Interface&nbsp;X in your website. You can access these functions inside the
+`window.InterfaceX` object.
 
 | Function           | Parameters                                                                                  | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                  |
 | ------------------ | ------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |

package/docs/build-search-ui/web-x-components-development-guide.md

@@ -33,8 +33,7 @@ You can find the X Components library in the
 To integrate the X Components in a frontend UI, you need:
 
 - **Empathy Search API** to retrieve search data (or any other search API)
-- A **search adapter** to communicate with the search API. You can use the
-  [Empathy Platform Adapter](https://github.com/empathyco/x/tree/main/packages/x-adapter-platform)
+- A **search adapter** to communicate with the search API.
 - Your commerce store built on a **Vue** project, or on a **React** project using the
   [React Wrapper](https://github.com/empathyco/x/tree/main/packages/react-wrapper).
 
@@ -93,8 +92,10 @@ If you do not use the Empathy Search API, you need to build your own adapter.
 
 :::
 
-For more information, see
-[Using the Empathy Search Adapter](https://github.com/empathyco/x/tree/main/packages/x-adapter).
+For more information, see the
+[Empathy Search Adapter](https://github.com/empathyco/x/tree/main/packages/x-adapter) and
+[Empathy Platform Search Adapter](https://github.com/empathyco/x/tree/main/packages/x-adapter-platform)
+libraries.
 
 ## Configuring the plugin