@coveo/atomic 3.33.8-pre.a40e031589 → 3.33.8-pre.a6a23b4390

package/dist/esm/{suggestions-common-2b20db26.js → suggestions-events-b7a6f007.js}

@@ -1,6 +1,22 @@
 import { c as closest } from './dom-utils-f6086cd3.js';
 import { b as buildCustomEvent } from './event-utils-8de63ec3.js';
 
+/**
+ * Dispatches an event which retrieves the `SearchBoxSuggestionsBindings` on a configured parent search box.
+ *
+ * @param event Event sent from the registered query suggestions to the parent search box
+ * @param element Element on which to dispatch the event, which must be the child of a configured search box
+ * @param allowedSearchBoxElements Optional array of allowed search box element selectors
+ *
+ * @throws Error if the element is not a child of an allowed search box element
+ */
+const dispatchSearchBoxSuggestionsEvent = (event, element, allowedSearchBoxElements = searchBoxElements) => {
+    const interfaceElement = closest(element, searchBoxElements.join(', '));
+    if (!interfaceElement) {
+        throw new Error(`The "${element.nodeName.toLowerCase()}" component was not handled, as it is not a child of the following elements: ${allowedSearchBoxElements.join(', ')}`);
+    }
+    void dispatchSearchBoxSuggestionsEventEventually(interfaceElement, element, event);
+};
 const searchBoxElements = [
     'atomic-search-box',
     'atomic-insight-search-box',
@@ -18,25 +34,7 @@ const dispatchSearchBoxSuggestionsEventEventually = async (interfaceElement, ele
     }
     element.dispatchEvent(buildCustomEvent('atomic/searchBoxSuggestion/register', event));
 };
-/**
- * Dispatches an event which retrieves the `SearchBoxSuggestionsBindings` on a configured parent search box.
- * @param event Event sent from the registered query suggestions to the parent search box.
- * @param element Element on which to dispatch the event, which must be the child of a configured search box.
- */
-const dispatchSearchBoxSuggestionsEvent = (event, element, allowedSearchBoxElements = searchBoxElements) => {
-    const interfaceElement = closest(element, searchBoxElements.join(', '));
-    if (!interfaceElement) {
-        throw new Error(`The "${element.nodeName.toLowerCase()}" component was not handled, as it is not a child of the following elements: ${allowedSearchBoxElements.join(', ')}`);
-    }
-    void dispatchSearchBoxSuggestionsEventEventually(interfaceElement, element, event);
-};
-function elementHasNoQuery(el) {
-    return !el.query || el.query.trim() === '';
-}
-function elementHasQuery(el) {
-    return !!el.query && el.query.trim() !== '';
-}
 
-export { elementHasNoQuery as a, dispatchSearchBoxSuggestionsEvent as d, elementHasQuery as e };
+export { dispatchSearchBoxSuggestionsEvent as d };
 
-//# sourceMappingURL=suggestions-common-2b20db26.js.map
+//# sourceMappingURL=suggestions-events-b7a6f007.js.map

package/dist/esm/suggestions-events-b7a6f007.js.map

@@ -0,0 +1 @@
+{"file":"suggestions-events-b7a6f007.js","mappings":";;;AAOA;;;;;;;;;MASa,iCAAiC,GAAG,CAI/C,KAA+D,EAC/D,OAAoB,EACpB,2BAA0E,iBAAiB;IAE3F,MAAM,gBAAgB,GAAG,OAAO,CAAC,OAAO,EAAE,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IACxE,IAAI,CAAC,gBAAgB,EAAE;QACrB,MAAM,IAAI,KAAK,CACb,QAAQ,OAAO,CAAC,QAAQ,CAAC,WAAW,EAAE,gFAAgF,wBAAwB,CAAC,IAAI,CACjJ,IAAI,CACL,EAAE,CACJ,CAAC;KACH;IACD,KAAK,2CAA2C,CAC9C,gBAAgB,EAChB,OAAO,EACP,KAAK,CACN,CAAC;AACJ,EAAE;AAEF,MAAM,iBAAiB,GAAG;IACxB,mBAAmB;IACnB,2BAA2B;IAC3B,4BAA4B;CACpB,CAAC;AAEX,MAAM,mBAAmB,GAAG,CAAC,SAAkB,KAC7C,gBAAgB,IAAK,SAAwB;IAC5C,SAAwB,CAAC,cAAc,YAAY,OAAO,CAAC;AAE9D,MAAM,2CAA2C,GAAG,OAIlD,gBAAyB,EACzB,OAAoB,EACpB,KAA+D;IAE/D,MAAM,cAAc,CAAC,WAAW,CAAC,gBAAgB,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAC;IAC1E,IAAI,mBAAmB,CAAC,gBAAgB,CAAC,EAAE;QACzC,MAAM,gBAAgB,CAAC,cAAc,CAAC;KACvC;SAAM,IAAI,kBAAkB,IAAI,gBAAgB,EAAE;QACjD,MAAO,gBAAuC,CAAC,gBAAgB,EAAE,CAAC;KACnE;IACD,OAAO,CAAC,aAAa,CACnB,gBAAgB,CAAC,qCAAqC,EAAE,KAAK,CAAC,CAC/D,CAAC;AACJ,CAAC;;;;","names":[],"sources":["src/components/common/suggestions/suggestions-events.ts"],"sourcesContent":["import type {HTMLStencilElement} from '@stencil/core/internal';\nimport type {LitElement} from 'lit';\nimport {closest} from '../../../utils/dom-utils';\nimport {buildCustomEvent} from '../../../utils/event-utils';\nimport type {AnyBindings} from '../interface/bindings';\nimport type {SearchBoxSuggestionsEvent} from './suggestions-types';\n\n/**\n * Dispatches an event which retrieves the `SearchBoxSuggestionsBindings` on a configured parent search box.\n *\n * @param event Event sent from the registered query suggestions to the parent search box\n * @param element Element on which to dispatch the event, which must be the child of a configured search box\n * @param allowedSearchBoxElements Optional array of allowed search box element selectors\n *\n * @throws Error if the element is not a child of an allowed search box element\n */\nexport const dispatchSearchBoxSuggestionsEvent = <\n  SearchBoxController,\n  Bindings = AnyBindings,\n>(\n  event: SearchBoxSuggestionsEvent<SearchBoxController, Bindings>,\n  element: HTMLElement,\n  allowedSearchBoxElements: readonly (typeof searchBoxElements)[number][] = searchBoxElements\n) => {\n  const interfaceElement = closest(element, searchBoxElements.join(', '));\n  if (!interfaceElement) {\n    throw new Error(\n      `The \"${element.nodeName.toLowerCase()}\" component was not handled, as it is not a child of the following elements: ${allowedSearchBoxElements.join(\n        ', '\n      )}`\n    );\n  }\n  void dispatchSearchBoxSuggestionsEventEventually(\n    interfaceElement,\n    element,\n    event\n  );\n};\n\nconst searchBoxElements = [\n  'atomic-search-box',\n  'atomic-insight-search-box',\n  'atomic-commerce-search-box',\n] as const;\n\nconst isLitElementLoosely = (candidate: unknown): candidate is LitElement =>\n  'updateComplete' in (candidate as LitElement) &&\n  (candidate as LitElement).updateComplete instanceof Promise;\n\nconst dispatchSearchBoxSuggestionsEventEventually = async <\n  SearchBoxController,\n  Bindings = AnyBindings,\n>(\n  interfaceElement: Element,\n  element: HTMLElement,\n  event: SearchBoxSuggestionsEvent<SearchBoxController, Bindings>\n) => {\n  await customElements.whenDefined(interfaceElement.nodeName.toLowerCase());\n  if (isLitElementLoosely(interfaceElement)) {\n    await interfaceElement.updateComplete;\n  } else if ('componentOnReady' in interfaceElement) {\n    await (interfaceElement as HTMLStencilElement).componentOnReady();\n  }\n  element.dispatchEvent(\n    buildCustomEvent('atomic/searchBoxSuggestion/register', event)\n  );\n};\n"],"version":3}

package/dist/esm/suggestions-utils-591559a0.js

@@ -0,0 +1,22 @@
+/**
+ * Checks if a search box suggestion element has no query.
+ *
+ * @param el - The search box suggestion element to check
+ * @returns True if the element has no query or the query is whitespace-only
+ */
+function elementHasNoQuery(el) {
+    return !el.query || el.query.trim() === '';
+}
+/**
+ * Checks if a search box suggestion element has a query.
+ *
+ * @param el - The search box suggestion element to check
+ * @returns True if the element has a non-empty, non-whitespace query
+ */
+function elementHasQuery(el) {
+    return !!el.query && el.query.trim() !== '';
+}
+
+export { elementHasQuery as a, elementHasNoQuery as e };
+
+//# sourceMappingURL=suggestions-utils-591559a0.js.map

package/dist/esm/suggestions-utils-591559a0.js.map

@@ -0,0 +1 @@
+{"file":"suggestions-utils-591559a0.js","mappings":"AAEA;;;;;;SAMgB,iBAAiB,CAAC,EAA8B;IAC9D,OAAO,CAAC,EAAE,CAAC,KAAK,IAAI,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC;AAC7C,CAAC;AAED;;;;;;SAMgB,eAAe,CAAC,EAA8B;IAC5D,OAAO,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC;AAC9C;;;;","names":[],"sources":["src/components/common/suggestions/suggestions-utils.ts"],"sourcesContent":["import type {SearchBoxSuggestionElement} from './suggestions-types';\n\n/**\n * Checks if a search box suggestion element has no query.\n *\n * @param el - The search box suggestion element to check\n * @returns True if the element has no query or the query is whitespace-only\n */\nexport function elementHasNoQuery(el: SearchBoxSuggestionElement): boolean {\n  return !el.query || el.query.trim() === '';\n}\n\n/**\n * Checks if a search box suggestion element has a query.\n *\n * @param el - The search box suggestion element to check\n * @returns True if the element has a non-empty, non-whitespace query\n */\nexport function elementHasQuery(el: SearchBoxSuggestionElement): boolean {\n  return !!el.query && el.query.trim() !== '';\n}\n"],"version":3}

package/dist/esm/version.js

@@ -1,2 +1,2 @@
-export const headlessVersion = '3.31.0';
-export const atomicVersion = '3.33.8-pre.a40e031589';
+export const headlessVersion = '3.32.0-pre.a6a23b4390';
+export const atomicVersion = '3.33.8-pre.a6a23b4390';

package/dist/types/components/commerce/atomic-commerce-breadbox/atomic-commerce-breadbox.d.ts

@@ -52,8 +52,7 @@ export declare class AtomicCommerceBreadbox extends LitElement implements Initia
      */
     pathLimit: number;
     initialize(): void;
-    willUpdate(changedProperties: Map<string, unknown>): void;
-    updated(): void;
+    updated(changedProperties: Map<string, unknown>): void;
     private validateProps;
     disconnectedCallback(): void;
     private get breadcrumbs();

package/dist/types/components/commerce/atomic-commerce-interface/atomic-commerce-interface.d.ts

@@ -118,6 +118,7 @@ export declare class AtomicCommerceInterface extends AtomicCommerceInterface_bas
     private onHashChange;
     scrollToTop(): void;
     private updateHash;
+    private updateMobileBreakpoint;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/types/components/commerce/atomic-commerce-layout/atomic-commerce-layout.d.ts

@@ -8,19 +8,19 @@ declare const AtomicCommerceLayout_base: import("../../../mixins/mixin-common").
  * @cssprop --atomic-layout-max-search-box-input-width: The maximum width that the search box input will take.
  * @cssprop --atomic-layout-max-search-box-double-suggestions-width: The maximum width that the search box suggestions will take when displaying a double list.
  * @cssprop --atomic-layout-search-box-left-suggestions-width: The width of the left list when displaying a double list.
+ *
+ * @slot default - The default slot for the layout content.
  */
 export declare class AtomicCommerceLayout extends AtomicCommerceLayout_base {
     static styles: import("lit").CSSResult[];
+    private addStyles;
     error: Error;
     /**
      * The viewport width at which the layout goes from desktop to mobile.
      * E.g., 800px, 65rem.
      */
     mobileBreakpoint: string;
-    private layoutStylesController;
     connectedCallback(): void;
-    private emitBreakpointChangeEvent;
-    onMobileBreakpointChange(): void;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/types/components/commerce/atomic-commerce-search-box/atomic-commerce-search-box.d.ts

@@ -137,7 +137,6 @@ export declare class AtomicCommerceSearchBox extends LitElement implements Initi
     private renderSuggestions;
     private renderPanel;
     private renderSuggestion;
-    private renderSlotContent;
     render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/dist/types/components/commerce/atomic-commerce-search-box-instant-products/atomic-commerce-search-box-instant-products.d.ts

@@ -2,7 +2,7 @@ import { type Product, type SearchBox } from '@coveo/headless/commerce';
 import { LitElement } from 'lit';
 import type { ItemRenderingFunction } from "../../common/item-list/item-list-common";
 import type { ItemDisplayDensity, ItemDisplayImageSize } from "../../common/layout/display-options";
-import { type SearchBoxSuggestions, type SearchBoxSuggestionsBindings } from "../../common/suggestions/suggestions-common";
+import type { SearchBoxSuggestions, SearchBoxSuggestionsBindings } from "../../common/suggestions/suggestions-types";
 import type { SearchBoxSuggestionsComponent } from "../../../decorators/types";
 import type { CommerceBindings } from '../atomic-commerce-interface/atomic-commerce-interface';
 export type AriaLabelGenerator = (bindings: CommerceBindings, product: Product) => string | undefined;

package/dist/types/components/commerce/atomic-commerce-search-box-query-suggestions/atomic-commerce-search-box-query-suggestions.d.ts

@@ -1,6 +1,6 @@
 import { type SearchBox } from '@coveo/headless/commerce';
 import { LitElement } from 'lit';
-import { type SearchBoxSuggestions, type SearchBoxSuggestionsBindings } from "../../common/suggestions/suggestions-common";
+import type { SearchBoxSuggestions, SearchBoxSuggestionsBindings } from "../../common/suggestions/suggestions-types";
 import type { SearchBoxSuggestionsComponent } from "../../../decorators/types";
 import type { CommerceBindings } from '../atomic-commerce-interface/atomic-commerce-interface';
 /**

package/dist/types/components/commerce/atomic-commerce-search-box-recent-queries/atomic-commerce-search-box-recent-queries.d.ts

@@ -1,7 +1,7 @@
 import { type SearchBox } from '@coveo/headless/commerce';
 import { LitElement } from 'lit';
 import type { SearchBoxSuggestionsComponent } from "../../../decorators/types";
-import { type SearchBoxSuggestions, type SearchBoxSuggestionsBindings } from '../../common/suggestions/suggestions-common';
+import type { SearchBoxSuggestions, SearchBoxSuggestionsBindings } from '../../common/suggestions/suggestions-types';
 import type { CommerceBindings } from '../atomic-commerce-interface/atomic-commerce-interface';
 /**
  * The `atomic-commerce-search-box-recent-queries` component can be added as a child of an `atomic-commerce-search-box` component, allowing for the configuration of recent query suggestions.

package/dist/types/components/common/atomic-suggestion-renderer/atomic-suggestion-renderer.d.ts

@@ -1,5 +1,5 @@
 import { i18n } from 'i18next';
-import { SearchBoxSuggestionElement } from '../suggestions/suggestions-common';
+import { SearchBoxSuggestionElement } from '../suggestions/suggestions-types';
 /**
  * The `atomic-suggestion-renderer` component is used to render individual suggestions. It was created to isolate
  * the rendering logic of the 'content' property of the `SearchBoxSuggestionElement` interface. This property can be Stencil

package/dist/types/components/common/suggestions/instant-item.d.ts

@@ -1,5 +1,5 @@
 import type { i18n } from 'i18next';
-import type { SearchBoxSuggestionElement } from './suggestions-common';
+import type { SearchBoxSuggestionElement } from './suggestions-types';
 export declare const getPartialInstantItemElement: (i18n: i18n, itemTitle: string, itemUniqueId: string) => Pick<SearchBoxSuggestionElement, "ariaLabel" | "key" | "part">;
 export declare const getPartialInstantItemShowAllElement: (i18n: i18n) => Pick<SearchBoxSuggestionElement, "key" | "part" | "ariaLabel">;
 interface InstantItemShowAllButtonProps {

package/dist/types/components/common/suggestions/query-suggestions.d.ts

@@ -1,5 +1,5 @@
 import type { i18n } from 'i18next';
-import type { SearchBoxSuggestionElement } from './suggestions-common.js';
+import type { SearchBoxSuggestionElement } from './suggestions-types.js';
 interface Suggestion {
     highlightedValue: string;
     rawValue: string;

package/dist/types/components/common/suggestions/recent-queries.d.ts

@@ -1,5 +1,5 @@
 import type { i18n } from 'i18next';
-import type { SearchBoxSuggestionElement } from './suggestions-common';
+import type { SearchBoxSuggestionElement } from './suggestions-types';
 export declare const getPartialRecentQueryElement: (value: string, i18n: i18n) => Pick<SearchBoxSuggestionElement, "ariaLabel" | "key" | "query" | "part">;
 export declare const getPartialRecentQueryClearElement: (i18n: i18n) => Pick<SearchBoxSuggestionElement, "ariaLabel" | "key" | "part" | "hideIfLast">;
 export interface RecentQueriesContainerProps {

package/dist/types/components/common/suggestions/stencil-instant-item.d.ts

@@ -1,6 +1,6 @@
 import { FunctionalComponent } from '../../../stencil-public-runtime';
 import { i18n } from 'i18next';
-import { SearchBoxSuggestionElement } from './suggestions-common';
+import { SearchBoxSuggestionElement } from './suggestions-types';
 export declare const getPartialInstantItemElement: (i18n: i18n, itemTitle: string, itemUniqueId: string) => Pick<SearchBoxSuggestionElement, "ariaLabel" | "key" | "part">;
 export declare const getPartialInstantItemShowAllElement: (i18n: i18n) => Pick<SearchBoxSuggestionElement, "key" | "part" | "ariaLabel">;
 interface InstantItemShowAllButtonProps {

package/dist/types/components/common/suggestions/stencil-query-suggestions.d.ts

@@ -1,6 +1,6 @@
 import { FunctionalComponent } from '../../../stencil-public-runtime';
 import { i18n } from 'i18next';
-import { SearchBoxSuggestionElement } from './suggestions-common.js';
+import { SearchBoxSuggestionElement } from './suggestions-types.js';
 interface Suggestion {
     highlightedValue: string;
     rawValue: string;

package/dist/types/components/common/suggestions/stencil-recent-queries.d.ts

@@ -1,6 +1,6 @@
 import { FunctionalComponent } from '../../../stencil-public-runtime';
 import { i18n } from 'i18next';
-import { SearchBoxSuggestionElement } from './suggestions-common';
+import { SearchBoxSuggestionElement } from './suggestions-types';
 export declare const getPartialRecentQueryElement: (value: string, i18n: i18n) => Pick<SearchBoxSuggestionElement, "ariaLabel" | "key" | "query" | "part">;
 export declare const getPartialRecentQueryClearElement: (i18n: i18n) => Pick<SearchBoxSuggestionElement, "ariaLabel" | "key" | "part" | "hideIfLast">;
 export declare const RecentQueriesContainer: FunctionalComponent;

package/dist/types/components/common/suggestions/stencil-suggestion-manager.d.ts

@@ -1,4 +1,4 @@
-import { type SearchBoxSuggestionElement, type SearchBoxSuggestionsBindings, type SearchBoxSuggestionsEvent } from './suggestions-common';
+import type { SearchBoxSuggestionElement, SearchBoxSuggestionsBindings, SearchBoxSuggestionsEvent } from './suggestions-types';
 /**
  * List of suggestions that will be displayed along other lists (e.g recent queries) when the search box's input is selected.
  */

package/dist/types/components/common/suggestions/suggestion-manager.d.ts

@@ -1,5 +1,5 @@
 import type { LitElement } from 'lit';
-import { type SearchBoxSuggestionElement, type SearchBoxSuggestionsBindings, type SearchBoxSuggestionsEvent } from './suggestions-common';
+import type { SearchBoxSuggestionElement, SearchBoxSuggestionsBindings, SearchBoxSuggestionsEvent } from './suggestions-types';
 /**
  * List of suggestions that will be displayed along other lists (e.g recent queries) when the search box's input is selected.
  */

package/dist/types/components/common/suggestions/suggestions-events.d.ts

@@ -0,0 +1,14 @@
+import type { AnyBindings } from '../interface/bindings';
+import type { SearchBoxSuggestionsEvent } from './suggestions-types';
+/**
+ * Dispatches an event which retrieves the `SearchBoxSuggestionsBindings` on a configured parent search box.
+ *
+ * @param event Event sent from the registered query suggestions to the parent search box
+ * @param element Element on which to dispatch the event, which must be the child of a configured search box
+ * @param allowedSearchBoxElements Optional array of allowed search box element selectors
+ *
+ * @throws Error if the element is not a child of an allowed search box element
+ */
+export declare const dispatchSearchBoxSuggestionsEvent: <SearchBoxController, Bindings = AnyBindings>(event: SearchBoxSuggestionsEvent<SearchBoxController, Bindings>, element: HTMLElement, allowedSearchBoxElements?: readonly (typeof searchBoxElements)[number][]) => void;
+declare const searchBoxElements: readonly ["atomic-search-box", "atomic-insight-search-box", "atomic-commerce-search-box"];
+export {};

package/dist/types/components/common/suggestions/{suggestions-common.d.ts → suggestions-types.d.ts}

@@ -68,15 +68,6 @@ export interface SearchBoxSuggestions {
      */
     onSuggestedQueryChange?(q: string): Promise<unknown>;
 }
-/**
- * Event sent from the registered query suggestions to the parent search box.
- */
-export type SearchBoxSuggestionsEvent<SearchBoxController, Bindings = AnyBindings> = (
-/**
- * The bindings passed from the search box to the suggestions.
- */
-bindings: SearchBoxSuggestionsBindings<SearchBoxController, Bindings>) => SearchBoxSuggestions;
-declare const searchBoxElements: readonly ["atomic-search-box", "atomic-insight-search-box", "atomic-commerce-search-box"];
 /**
  * The bindings passed from the search box to the suggestions.
  */
@@ -124,11 +115,10 @@ export type SearchBoxSuggestionsBindings<SearchBoxController, Bindings = AnyBind
     getSuggestionElements(): SearchBoxSuggestionElement[];
 };
 /**
- * Dispatches an event which retrieves the `SearchBoxSuggestionsBindings` on a configured parent search box.
- * @param event Event sent from the registered query suggestions to the parent search box.
- * @param element Element on which to dispatch the event, which must be the child of a configured search box.
+ * Event sent from the registered query suggestions to the parent search box.
  */
-export declare const dispatchSearchBoxSuggestionsEvent: <SearchBoxController, Bindings = AnyBindings>(event: SearchBoxSuggestionsEvent<SearchBoxController, Bindings>, element: HTMLElement, allowedSearchBoxElements?: readonly (typeof searchBoxElements)[number][]) => void;
-export declare function elementHasNoQuery(el: SearchBoxSuggestionElement): boolean;
-export declare function elementHasQuery(el: SearchBoxSuggestionElement): boolean;
-export {};
+export type SearchBoxSuggestionsEvent<SearchBoxController, Bindings = AnyBindings> = (
+/**
+ * The bindings passed from the search box to the suggestions.
+ */
+bindings: SearchBoxSuggestionsBindings<SearchBoxController, Bindings>) => SearchBoxSuggestions;

package/dist/types/components/common/suggestions/suggestions-utils.d.ts

@@ -0,0 +1,15 @@
+import type { SearchBoxSuggestionElement } from './suggestions-types';
+/**
+ * Checks if a search box suggestion element has no query.
+ *
+ * @param el - The search box suggestion element to check
+ * @returns True if the element has no query or the query is whitespace-only
+ */
+export declare function elementHasNoQuery(el: SearchBoxSuggestionElement): boolean;
+/**
+ * Checks if a search box suggestion element has a query.
+ *
+ * @param el - The search box suggestion element to check
+ * @returns True if the element has a non-empty, non-whitespace query
+ */
+export declare function elementHasQuery(el: SearchBoxSuggestionElement): boolean;

package/dist/types/components/search/atomic-search-box/atomic-search-box.d.ts

@@ -2,7 +2,7 @@ import { SearchBox, StandaloneSearchBox } from '@coveo/headless';
 import { EventEmitter } from '../../../stencil-public-runtime';
 import { InitializableComponent } from '../../../utils/initialization-utils';
 import { RedirectionPayload } from '../../common/search-box/redirection-payload';
-import { SearchBoxSuggestionsEvent } from '../../common/suggestions/suggestions-common';
+import type { SearchBoxSuggestionsEvent } from '../../common/suggestions/suggestions-types';
 import { Bindings } from '../atomic-search-interface/atomic-search-interface';
 /**
  * The `atomic-search-box` component creates a search box with built-in support for suggestions.
@@ -161,6 +161,5 @@ export declare class AtomicSearchBox implements InitializableComponent<Bindings>
     private getSearchInputLabel;
     private announceNewActiveSuggestionToScreenReader;
     private announceNewSuggestionsToScreenReader;
-    private renderSlotContent;
     render(): any;
 }

package/dist/types/components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results.d.ts

@@ -2,7 +2,7 @@ import { Result, SearchBox } from '@coveo/headless';
 import { InitializableComponent } from '../../../../utils/initialization-utils';
 import { ItemRenderingFunction } from '../../../common/item-list/stencil-item-list-common';
 import { ItemDisplayDensity, ItemDisplayImageSize } from '../../../common/layout/display-options';
-import { SearchBoxSuggestions, SearchBoxSuggestionsBindings } from '../../../common/suggestions/suggestions-common';
+import type { SearchBoxSuggestions, SearchBoxSuggestionsBindings } from '../../../common/suggestions/suggestions-types';
 import { Bindings } from '../../atomic-search-interface/atomic-search-interface';
 export type AriaLabelGenerator = (bindings: Bindings, result: Result) => string | undefined;
 /**

package/dist/types/components.d.ts

@@ -26,7 +26,7 @@ import { RedirectionPayload } from "./components/common/search-box/redirection-p
 import { AriaLabelGenerator } from "./components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results";
 import { InitializationOptions } from "./components/search/atomic-search-interface/atomic-search-interface";
 import { StandaloneSearchBoxData } from "./utils/local-storage-utils";
-import { SearchBoxSuggestionElement } from "./components/common/suggestions/suggestions-common";
+import { SearchBoxSuggestionElement } from "./components/common/suggestions/suggestions-types";
 export { AutomaticFacet, CategoryFacetSortCriterion, DateFilterRange, DateRangeRequest, FacetResultsMustMatch, FacetSortCriterion, FoldedResult, GeneratedAnswer, GeneratedAnswerCitation, InlineLink, InteractiveCitation, InteractiveResult, LogLevel, NumericFilter, NumericFilterState, RangeFacetRangeAlgorithm, RangeFacetSortCriterion, RelativeDateUnit, Result, ResultTemplate, ResultTemplateCondition, SearchEngine, SearchStatus } from "@coveo/headless";
 export { AtomicInterface } from "./utils/initialization-utils";
 export { AnyBindings } from "./components/common/interface/bindings";
@@ -48,7 +48,7 @@ export { RedirectionPayload } from "./components/common/search-box/redirection-p
 export { AriaLabelGenerator } from "./components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results";
 export { InitializationOptions } from "./components/search/atomic-search-interface/atomic-search-interface";
 export { StandaloneSearchBoxData } from "./utils/local-storage-utils";
-export { SearchBoxSuggestionElement } from "./components/common/suggestions/suggestions-common";
+export { SearchBoxSuggestionElement } from "./components/common/suggestions/suggestions-types";
 export namespace Components {
     /**
      * An automatic facet is a special type of facet generated by the automatic facets feature.

package/dist/types/decorators/types.d.ts

@@ -1,7 +1,7 @@
 import type { LitElement, TemplateResult } from 'lit';
 import type { TemplateResultType } from 'lit/directive-helpers.js';
 import type { AnyBindings } from '../components/common/interface/bindings';
-import type { SearchBoxSuggestions } from '../components/common/suggestions/suggestions-common';
+import type { SearchBoxSuggestions } from '../components/common/suggestions/suggestions-types';
 export type GenericRender<T extends TemplateResultType> = TemplateResult<T>;
 export type RenderGuardDecorator<Component, T extends TemplateResultType, Descriptor = TypedPropertyDescriptor<() => GenericRender<T>>> = (target: Component, propertyKey: 'render', descriptor: Descriptor) => Descriptor;
 /**

package/dist/types/index.d.ts

@@ -5,7 +5,9 @@ export { SelectChildProductEventArgs } from './components/commerce/atomic-produc
 export { productContext } from './components/commerce/product-template-component-utils/stencil-product-template-decorators';
 export { PopoverChildFacet } from './components/common/facets/popover/popover-type';
 export { RedirectionPayload } from './components/common/search-box/redirection-payload';
-export { dispatchSearchBoxSuggestionsEvent, SearchBoxSuggestionElement, SearchBoxSuggestions, SearchBoxSuggestionsBindings, SearchBoxSuggestionsEvent, } from './components/common/suggestions/suggestions-common';
+export { dispatchSearchBoxSuggestionsEvent } from './components/common/suggestions/suggestions-events';
+export type { SearchBoxSuggestionElement, SearchBoxSuggestions, SearchBoxSuggestionsBindings, SearchBoxSuggestionsEvent, } from './components/common/suggestions/suggestions-types';
+export { elementHasNoQuery, elementHasQuery, } from './components/common/suggestions/suggestions-utils';
 export { RecsBindings } from './components/recommendations/atomic-recs-interface/atomic-recs-interface';
 export { Bindings } from './components/search/atomic-search-interface/atomic-search-interface';
 export { resultContext } from './components/search/result-template-components/result-template-decorators';

package/docs/atomic-docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-09-25T16:58:50",
+  "timestamp": "2025-09-24T19:45:57",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.20.0",
@@ -16089,10 +16089,10 @@
       "docstring": "",
       "path": "src/components/common/layout/display-options.ts"
     },
-    "src/components/common/suggestions/suggestions-common.ts::SearchBoxSuggestionElement": {
+    "src/components/common/suggestions/suggestions-types.ts::SearchBoxSuggestionElement": {
       "declaration": "export interface SearchBoxSuggestionElement {\n  /**\n   * Stable identity which enables Stencil to reuse DOM elements for better performance.\n   * The best way to pick a key is to use a string that uniquely identifies that list item among its siblings (often your data will already have IDs).\n   */\n  key: string;\n  /**\n   * Rendered content of the element.\n   *\n   * @remarks\n   * The `VNode` type will be deprecated in v4 as we are detaching from Stencil.\n   */\n  content: Element | VNode;\n  /**\n   * Hook called when the selection is selected.\n   * @param e DOM event.\n   */\n  onSelect?(e: Event): void;\n  /**\n   * The query associated with the suggestion which will replace the query in the search box if the suggestion is selected.\n   */\n  query?: string;\n  /**\n   * For improved accessibility, provide this property with additional information.\n   * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label\n   */\n  ariaLabel?: string;\n  /**\n   * Adds a specific shadow part attribute that can be selected with the CSS ::part pseudo-element.\n   * https://developer.mozilla.org/en-US/docs/Web/CSS/::part\n   */\n  part?: string;\n  /**\n   * Hide the suggestion if it's the last in the list.\n   */\n  hideIfLast?: boolean;\n}",
       "docstring": "Element which will be rendered in the list of suggestions.",
-      "path": "src/components/common/suggestions/suggestions-common.ts"
+      "path": "src/components/common/suggestions/suggestions-types.ts"
     },
     "../headless/dist/definitions/index.d.ts::RelativeDateUnit": {
       "declaration": "any",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@coveo/atomic",
   "type": "module",
-  "version": "3.33.8-pre.a40e031589",
+  "version": "3.33.8-pre.a6a23b4390",
   "description": "A web-component library for building modern UIs interfacing with the Coveo platform",
   "homepage": "https://docs.coveo.com/en/atomic/latest/",
   "repository": {
@@ -81,7 +81,7 @@
   },
   "dependencies": {
     "@coveo/bueno": "1.1.2",
-    "@coveo/headless": "3.31.0",
+    "@coveo/headless": "3.32.0-pre.a6a23b4390",
     "@lit/context": "1.1.6",
     "@open-wc/lit-helpers": "0.7.0",
     "@popperjs/core": "2.11.8",
@@ -153,7 +153,7 @@
   },
   "peerDependencies": {
     "@coveo/bueno": "1.1.2",
-    "@coveo/headless": "3.31.0",
+    "@coveo/headless": "3.32.0-pre.a6a23b4390",
     "typescript": ">=5.0.0"
   },
   "peerDependenciesMeta": {

package/dist/atomic/components/components/common/layout/layout-styles-controller.js

@@ -1,40 +0,0 @@
-import { randomID } from "../../../utils/utils";
-/**
- * A reactive controller that manages dynamic layout styles.
- */
-export class LayoutStylesController {
-    constructor(host, stylesBuilder, componentPrefix) {
-        this.dynamicStyleSheet = null;
-        this.host = host;
-        this.stylesBuilder = stylesBuilder;
-        this.componentPrefix = componentPrefix;
-        this.host.addController(this);
-    }
-    hostConnected() {
-        if (!this.host.id) {
-            this.host.id = randomID(this.componentPrefix);
-        }
-        this.host.updateComplete.then(() => this.updateStyles());
-    }
-    /**
-     * Updates the dynamic styles based on the current mobile breakpoint
-     */
-    updateStyles() {
-        const parent = this.host.getRootNode();
-        const isDocumentOrShadowRoot = parent instanceof Document || parent instanceof ShadowRoot;
-        if (!isDocumentOrShadowRoot) {
-            return;
-        }
-        const newStylesCSS = this.stylesBuilder(this.host, this.host.mobileBreakpoint);
-        if (!this.dynamicStyleSheet) {
-            this.dynamicStyleSheet = new CSSStyleSheet();
-            this.dynamicStyleSheet.replaceSync(newStylesCSS);
-            parent.adoptedStyleSheets = [
-                ...parent.adoptedStyleSheets,
-                this.dynamicStyleSheet,
-            ];
-            return;
-        }
-        this.dynamicStyleSheet.replaceSync(newStylesCSS);
-    }
-}

package/dist/atomic/components/components/common/layout/mobile-breakpoint-controller.js

@@ -1,26 +0,0 @@
-/**
- * A reactive controller that manages mobile breakpoint changes through event communication.
- * This controller listens for 'atomic-layout-breakpoint-change' events and updates a store
- * with the new breakpoint value.
- */
-export class MobileBreakpointController {
-    constructor(host, store) {
-        this.host = host;
-        this.store = store;
-        this.eventListener = this.handleBreakpointChange.bind(this);
-        this.host.addController(this);
-    }
-    hostConnected() {
-        this.host.addEventListener('atomic-layout-breakpoint-change', this.eventListener);
-    }
-    hostDisconnected() {
-        this.host.removeEventListener('atomic-layout-breakpoint-change', this.eventListener);
-    }
-    handleBreakpointChange(e) {
-        const customEvent = e;
-        const newBreakpoint = customEvent.detail?.breakpoint;
-        if (newBreakpoint && this.store.state.mobileBreakpoint !== newBreakpoint) {
-            this.store.state.mobileBreakpoint = newBreakpoint;
-        }
-    }
-}

package/dist/atomic/components/suggestions-common.js.map

@@ -1 +0,0 @@
-{"file":"suggestions-common.js","mappings":";;;AA0FA,MAAM,iBAAiB,GAAG;IACxB,mBAAmB;IACnB,2BAA2B;IAC3B,4BAA4B;CACpB,CAAC;AAoDX,MAAM,mBAAmB,GAAG,CAAC,SAAkB,KAC7C,gBAAgB,IAAK,SAAwB;IAC5C,SAAwB,CAAC,cAAc,YAAY,OAAO,CAAC;AAE9D,MAAM,2CAA2C,GAAG,OAIlD,gBAAyB,EACzB,OAAoB,EACpB,KAA+D;IAE/D,MAAM,cAAc,CAAC,WAAW,CAAC,gBAAgB,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,CAAC;IAC1E,IAAI,mBAAmB,CAAC,gBAAgB,CAAC,EAAE;QACzC,MAAM,gBAAgB,CAAC,cAAc,CAAC;KACvC;SAAM,IAAI,kBAAkB,IAAI,gBAAgB,EAAE;QACjD,MAAO,gBAAuC,CAAC,gBAAgB,EAAE,CAAC;KACnE;IACD,OAAO,CAAC,aAAa,CACnB,gBAAgB,CAAC,qCAAqC,EAAE,KAAK,CAAC,CAC/D,CAAC;AACJ,CAAC,CAAC;AAEF;;;;;MAKa,iCAAiC,GAAG,CAI/C,KAA+D,EAC/D,OAAoB,EACpB,2BAA0E,iBAAiB;IAE3F,MAAM,gBAAgB,GAAG,OAAO,CAAC,OAAO,EAAE,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IACxE,IAAI,CAAC,gBAAgB,EAAE;QACrB,MAAM,IAAI,KAAK,CACb,QAAQ,OAAO,CAAC,QAAQ,CAAC,WAAW,EAAE,gFAAgF,wBAAwB,CAAC,IAAI,CACjJ,IAAI,CACL,EAAE,CACJ,CAAC;KACH;IACD,KAAK,2CAA2C,CAC9C,gBAAgB,EAChB,OAAO,EACP,KAAK,CACN,CAAC;AACJ,EAAE;SAEc,iBAAiB,CAAC,EAA8B;IAC9D,OAAO,CAAC,EAAE,CAAC,KAAK,IAAI,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC;AAC7C,CAAC;SAEe,eAAe,CAAC,EAA8B;IAC5D,OAAO,CAAC,CAAC,EAAE,CAAC,KAAK,IAAI,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC;AAC9C;;;;","names":[],"sources":["src/components/common/suggestions/suggestions-common.ts"],"sourcesContent":["import type {VNode} from '@stencil/core';\nimport type {HTMLStencilElement} from '@stencil/core/internal';\nimport type {LitElement} from 'lit';\nimport {closest} from '../../../utils/dom-utils';\nimport {buildCustomEvent} from '../../../utils/event-utils';\nimport type {AnyBindings} from '../interface/bindings';\n\n/**\n * Element which will be rendered in the list of suggestions.\n */\nexport interface SearchBoxSuggestionElement {\n  /**\n   * Stable identity which enables Stencil to reuse DOM elements for better performance.\n   * The best way to pick a key is to use a string that uniquely identifies that list item among its siblings (often your data will already have IDs).\n   */\n  key: string;\n  /**\n   * Rendered content of the element.\n   *\n   * @remarks\n   * The `VNode` type will be deprecated in v4 as we are detaching from Stencil.\n   */\n  content: Element | VNode;\n  /**\n   * Hook called when the selection is selected.\n   * @param e DOM event.\n   */\n  onSelect?(e: Event): void;\n  /**\n   * The query associated with the suggestion which will replace the query in the search box if the suggestion is selected.\n   */\n  query?: string;\n  /**\n   * For improved accessibility, provide this property with additional information.\n   * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label\n   */\n  ariaLabel?: string;\n  /**\n   * Adds a specific shadow part attribute that can be selected with the CSS ::part pseudo-element.\n   * https://developer.mozilla.org/en-US/docs/Web/CSS/::part\n   */\n  part?: string;\n  /**\n   * Hide the suggestion if it's the last in the list.\n   */\n  hideIfLast?: boolean;\n}\n\n/**\n * List of suggestions that will be displayed along other lists (e.g recent queries) when the search box's input is selected.\n */\nexport interface SearchBoxSuggestions {\n  /**\n   * The search box will sort the position of suggestions using this value. The lowest value being first.\n   * By default, the DOM position will be used.\n   */\n  position: number;\n  /**\n   * Whether the suggestions should be listed in the right or left panel. By default, the suggestions are listed in the right panel.\n   */\n  panel?: 'left' | 'right';\n  /**\n   * Method that returns the list of elements which will be rendered in the list of suggestions.\n   */\n  renderItems(): SearchBoxSuggestionElement[];\n  /**\n   * Hook called when the user changes the search box's input value. This can lead to all the query suggestions being updated.\n   */\n  onInput?(): Promise<unknown>;\n  /**\n   * Hook called when the suggested query changes as a user traverses through the list of suggestions.\n   * This is used for instant results, which are rendered based on the current suggested query.\n   * @param q The new suggested query.\n   */\n  onSuggestedQueryChange?(q: string): Promise<unknown>;\n}\n\n/**\n * Event sent from the registered query suggestions to the parent search box.\n */\nexport type SearchBoxSuggestionsEvent<\n  SearchBoxController,\n  Bindings = AnyBindings,\n> = (\n  /**\n   * The bindings passed from the search box to the suggestions.\n   */\n  bindings: SearchBoxSuggestionsBindings<SearchBoxController, Bindings>\n) => SearchBoxSuggestions;\n\nconst searchBoxElements = [\n  'atomic-search-box',\n  'atomic-insight-search-box',\n  'atomic-commerce-search-box',\n] as const;\n\n/**\n * The bindings passed from the search box to the suggestions.\n */\nexport type SearchBoxSuggestionsBindings<\n  SearchBoxController,\n  Bindings = AnyBindings,\n> = Bindings & {\n  /**\n   * The unique id of the search box.\n   */\n  id: string;\n  /**\n   * Whether the search box is [standalone](https://docs.coveo.com/en/atomic/latest/usage/ssb/).\n   */\n  isStandalone: boolean;\n  /**\n   * The search box headless controller.\n   */\n  searchBoxController: SearchBoxController;\n  /**\n   * The number of queries to display when the user interacts with the search box.\n   */\n  numberOfQueries: number;\n  /**\n   * Whether to clear all active query filters when the end user submits a new query from the search box.\n   */\n  clearFilters: boolean;\n  /**\n   * Retrieves the suggested query, meaning the query that would be sent if the search is executed.\n   * The suggested query changes as a user traverses through the list of suggestions.\n   */\n  suggestedQuery(): string;\n  /**\n   * Removes the current suggestions.\n   */\n  clearSuggestions(): void;\n  /**\n   * Triggers update & retrieval of all suggestions.\n   */\n  triggerSuggestions(): void;\n  /**\n   * Retrieves the current suggestions.\n   */\n  getSuggestions(): SearchBoxSuggestions[];\n  /**\n   * Retrieves the current suggestions elements.\n   */\n  getSuggestionElements(): SearchBoxSuggestionElement[];\n};\n\nconst isLitElementLoosely = (candidate: unknown): candidate is LitElement =>\n  'updateComplete' in (candidate as LitElement) &&\n  (candidate as LitElement).updateComplete instanceof Promise;\n\nconst dispatchSearchBoxSuggestionsEventEventually = async <\n  SearchBoxController,\n  Bindings = AnyBindings,\n>(\n  interfaceElement: Element,\n  element: HTMLElement,\n  event: SearchBoxSuggestionsEvent<SearchBoxController, Bindings>\n) => {\n  await customElements.whenDefined(interfaceElement.nodeName.toLowerCase());\n  if (isLitElementLoosely(interfaceElement)) {\n    await interfaceElement.updateComplete;\n  } else if ('componentOnReady' in interfaceElement) {\n    await (interfaceElement as HTMLStencilElement).componentOnReady();\n  }\n  element.dispatchEvent(\n    buildCustomEvent('atomic/searchBoxSuggestion/register', event)\n  );\n};\n\n/**\n * Dispatches an event which retrieves the `SearchBoxSuggestionsBindings` on a configured parent search box.\n * @param event Event sent from the registered query suggestions to the parent search box.\n * @param element Element on which to dispatch the event, which must be the child of a configured search box.\n */\nexport const dispatchSearchBoxSuggestionsEvent = <\n  SearchBoxController,\n  Bindings = AnyBindings,\n>(\n  event: SearchBoxSuggestionsEvent<SearchBoxController, Bindings>,\n  element: HTMLElement,\n  allowedSearchBoxElements: readonly (typeof searchBoxElements)[number][] = searchBoxElements\n) => {\n  const interfaceElement = closest(element, searchBoxElements.join(', '));\n  if (!interfaceElement) {\n    throw new Error(\n      `The \"${element.nodeName.toLowerCase()}\" component was not handled, as it is not a child of the following elements: ${allowedSearchBoxElements.join(\n        ', '\n      )}`\n    );\n  }\n  void dispatchSearchBoxSuggestionsEventEventually(\n    interfaceElement,\n    element,\n    event\n  );\n};\n\nexport function elementHasNoQuery(el: SearchBoxSuggestionElement) {\n  return !el.query || el.query.trim() === '';\n}\n\nexport function elementHasQuery(el: SearchBoxSuggestionElement) {\n  return !!el.query && el.query.trim() !== '';\n}\n"],"version":3}

package/dist/atomic/p-1f22292a.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["AtomicSearchBoxQuerySuggestions","componentWillLoad","dispatchSearchBoxSuggestionsEvent","bindings","this","initialize","host","error","engine","registerQuerySuggest","fetchQuerySuggestions","loadQuerySuggestActions","dispatch","id","count","numberOfQueries","position","Array","from","parentNode","children","indexOf","onInput","renderItems","hasQuery","searchBoxController","state","value","max","maxWithQuery","maxWithoutQuery","suggestions","slice","map","suggestion","renderItem","partialItem","getPartialSearchBoxSuggestionElement","i18n","content","h","QuerySuggestionContainer","QuerySuggestionIcon","icon","SearchIcon","hasSuggestion","getSuggestions","length","QuerySuggestionText","onSelect","selectSuggestion","rawValue","render","key","element","getPartialRecentQueryElement","part","query","encodeForDomAttribute","ariaLabel","t","interpolation","escapeValue","getPartialRecentQueryClearElement","hideIfLast","RecentQueriesContainer","_","class","RecentQueryIcon","RecentQueryText","innerHTML","HighlightUtils","highlightString","openingDelimiter","closingDelimiter","highlights","offset","RecentQueryClear","AtomicSearchBoxRecentQueries","warnUser","once","logger","warn","renderIcon","Clock","storage","SafeStorage","recentQueriesList","buildRecentQueriesList","initialState","queries","retrieveLocalStorage","options","maxLength","clearFilters","subscribe","updateLocalStorage","getParsedJSON","StorageItems","RECENT_QUERIES","analyticsEnabled","disableFeature","setJSON","removeItem","filteredQueries","filter","recentQuery","toLowerCase","startsWith","suggestionElements","unshift","renderClear","clear","triggerSuggestions","isStandalone","updateText","submit","executeRecentQuery"],"sources":["src/components/search/search-box-suggestions/atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.tsx","src/components/common/suggestions/stencil-recent-queries.tsx","src/components/search/search-box-suggestions/atomic-search-box-recent-queries/atomic-search-box-recent-queries.tsx"],"sourcesContent":["import {\n  loadQuerySuggestActions,\n  SearchBox,\n  SearchEngine,\n  Suggestion,\n} from '@coveo/headless';\nimport {Component, Element, Prop, State, h} from '@stencil/core';\nimport SearchIcon from '../../../../images/search.svg';\nimport {\n  getPartialSearchBoxSuggestionElement,\n  QuerySuggestionContainer,\n  QuerySuggestionIcon,\n  QuerySuggestionText,\n} from '../../../common/suggestions/stencil-query-suggestions';\nimport {\n  dispatchSearchBoxSuggestionsEvent,\n  SearchBoxSuggestionElement,\n  SearchBoxSuggestions,\n  SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-common';\n\n/**\n * The `atomic-search-box-query-suggestions` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of query suggestion behavior.\n */\n@Component({\n  tag: 'atomic-search-box-query-suggestions',\n  shadow: true,\n})\nexport class AtomicSearchBoxQuerySuggestions {\n  private bindings!: SearchBoxSuggestionsBindings<SearchBox>;\n  @Element() private host!: HTMLElement;\n\n  @State() public error!: Error;\n\n  /**\n   * The SVG icon to display.\n   *\n   * - Use a value that starts with `http://`, `https://`, `./`, or `../`, to fetch and display an icon from a given location.\n   * - Use a value that starts with `assets://`, to display an icon from the Atomic package.\n   * - Use a stringified SVG to display it directly.\n   */\n  @Prop() public icon?: string;\n\n  /**\n   * The maximum number of suggestions that will be displayed if the user has typed something into the input field.\n   */\n  @Prop({reflect: true}) public maxWithQuery?: number;\n  /**\n   * The maximum number of suggestions that will be displayed initially when the input field is empty.\n   */\n  @Prop({reflect: true}) public maxWithoutQuery?: number;\n\n  componentWillLoad() {\n    try {\n      dispatchSearchBoxSuggestionsEvent<SearchBox>(\n        (bindings) => {\n          this.bindings = bindings;\n          return this.initialize();\n        },\n        this.host,\n        ['atomic-search-box']\n      );\n    } catch (error) {\n      this.error = error as Error;\n    }\n  }\n\n  private initialize(): SearchBoxSuggestions {\n    const engine = this.bindings.engine as SearchEngine<{\n      querySet: string;\n      querySuggest: string;\n    }>;\n    const {registerQuerySuggest, fetchQuerySuggestions} =\n      loadQuerySuggestActions(engine);\n\n    engine.dispatch(\n      registerQuerySuggest({\n        id: this.bindings.id,\n        count: this.bindings.numberOfQueries,\n      })\n    );\n\n    return {\n      position: Array.from(this.host.parentNode!.children).indexOf(this.host),\n      onInput: () =>\n        engine.dispatch(\n          fetchQuerySuggestions({\n            id: this.bindings.id,\n          })\n        ),\n      renderItems: () => this.renderItems(),\n    };\n  }\n\n  private renderItems(): SearchBoxSuggestionElement[] {\n    const hasQuery = this.bindings.searchBoxController.state.value !== '';\n    const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;\n    return this.bindings.searchBoxController.state.suggestions\n      .slice(0, max)\n      .map((suggestion) => this.renderItem(suggestion));\n  }\n\n  private renderItem(suggestion: Suggestion) {\n    const hasQuery = this.bindings.searchBoxController.state.value !== '';\n    const partialItem = getPartialSearchBoxSuggestionElement(\n      suggestion,\n      this.bindings.i18n\n    );\n\n    return {\n      ...partialItem,\n      content: (\n        <QuerySuggestionContainer>\n          <QuerySuggestionIcon\n            icon={this.icon || SearchIcon}\n            hasSuggestion={this.bindings.getSuggestions().length > 1}\n          />\n\n          <QuerySuggestionText suggestion={suggestion} hasQuery={hasQuery} />\n        </QuerySuggestionContainer>\n      ),\n      onSelect: () => {\n        this.bindings.searchBoxController.selectSuggestion(suggestion.rawValue);\n      },\n    };\n  }\n\n  public render() {\n    if (this.error) {\n      return (\n        <atomic-component-error\n          element={this.host}\n          error={this.error}\n        ></atomic-component-error>\n      );\n    }\n  }\n}\n","import {HighlightUtils} from '@coveo/headless';\nimport {FunctionalComponent, h} from '@stencil/core';\nimport {i18n} from 'i18next';\nimport {encodeForDomAttribute} from '../../../utils/string-utils';\nimport {SearchBoxSuggestionElement} from './suggestions-common';\n\nexport const getPartialRecentQueryElement = (\n  value: string,\n  i18n: i18n\n): Pick<SearchBoxSuggestionElement, 'ariaLabel' | 'key' | 'query' | 'part'> => {\n  return {\n    part: 'recent-query-item',\n    query: value,\n    key: `recent-${encodeForDomAttribute(value)}`,\n    ariaLabel: i18n.t('recent-query-suggestion-label', {\n      query: value,\n      interpolation: {escapeValue: false},\n    }),\n  };\n};\n\nexport const getPartialRecentQueryClearElement = (\n  i18n: i18n\n): Pick<\n  SearchBoxSuggestionElement,\n  'ariaLabel' | 'key' | 'part' | 'hideIfLast'\n> => {\n  return {\n    key: 'recent-query-clear',\n    ariaLabel: i18n.t('clear-recent-searches', {\n      interpolation: {escapeValue: false},\n    }),\n    part: 'recent-query-title-item suggestion-divider',\n    hideIfLast: true,\n  };\n};\n\nexport const RecentQueriesContainer: FunctionalComponent = (_, children) => {\n  return (\n    <div\n      part=\"recent-query-content\"\n      class=\"flex items-center text-left break-all\"\n    >\n      {children}\n    </div>\n  );\n};\n\ninterface RecentQueryIconProps {\n  icon: string;\n}\n\nexport const RecentQueryIcon: FunctionalComponent<RecentQueryIconProps> = ({\n  icon,\n}) => {\n  return (\n    <atomic-icon\n      part=\"recent-query-icon\"\n      icon={icon}\n      class=\"mr-2 h-4 w-4 shrink-0\"\n    ></atomic-icon>\n  );\n};\n\ninterface RecentQueryTextProps {\n  query: string;\n  value: string;\n}\n\nexport const RecentQueryText: FunctionalComponent<RecentQueryTextProps> = ({\n  query,\n  value,\n}) => {\n  if (query === '') {\n    return (\n      <span part=\"recent-query-text\" class=\"line-clamp-2 break-all\">\n        {value}\n      </span>\n    );\n  }\n  return (\n    <span\n      part=\"recent-query-text\"\n      class=\"line-clamp-2 break-all\"\n      innerHTML={HighlightUtils.highlightString({\n        content: value,\n        openingDelimiter:\n          '<span part=\"recent-query-text-highlight\" class=\"font-bold\">',\n        closingDelimiter: '</span>',\n        highlights: [\n          {\n            offset: query.length,\n            length: value.length - query.length,\n          },\n        ],\n      })}\n    ></span>\n  );\n};\n\ninterface RecentQueryClearProps {\n  i18n: i18n;\n}\n\nexport const RecentQueryClear: FunctionalComponent<RecentQueryClearProps> = ({\n  i18n,\n}) => {\n  return (\n    <div part=\"recent-query-title-content\" class=\"flex w-full justify-between\">\n      <span class=\"font-bold\" part=\"recent-query-title\">\n        {i18n.t('recent-searches')}\n      </span>\n      <span part=\"recent-query-clear\">{i18n.t('clear')}</span>\n    </div>\n  );\n};\n","import {\n  buildRecentQueriesList,\n  RecentQueriesList,\n  SearchBox,\n} from '@coveo/headless';\nimport {Component, Element, Prop, State, h} from '@stencil/core';\nimport Clock from '../../../../images/clock.svg';\nimport {SafeStorage, StorageItems} from '../../../../utils/local-storage-utils';\nimport {once} from '../../../../utils/utils';\nimport {\n  getPartialRecentQueryClearElement,\n  getPartialRecentQueryElement,\n  RecentQueriesContainer,\n  RecentQueryClear,\n  RecentQueryIcon,\n  RecentQueryText,\n} from '../../../common/suggestions/stencil-recent-queries';\nimport {\n  dispatchSearchBoxSuggestionsEvent,\n  SearchBoxSuggestionElement,\n  SearchBoxSuggestions,\n  SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-common';\nimport {Bindings} from '../../atomic-search-interface/atomic-search-interface';\n\n/**\n * The `atomic-search-box-recent-queries` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of recent query suggestions.\n */\n@Component({\n  tag: 'atomic-search-box-recent-queries',\n  shadow: true,\n})\nexport class AtomicSearchBoxRecentQueries {\n  private bindings!: SearchBoxSuggestionsBindings<SearchBox, Bindings>;\n  private recentQueriesList!: RecentQueriesList;\n  private storage!: SafeStorage;\n\n  @Element() private host!: HTMLElement;\n\n  @State() public error!: Error;\n\n  /**\n   * The SVG icon to display.\n   *\n   * - Use a value that starts with `http://`, `https://`, `./`, or `../`, to fetch and display an icon from a given location.\n   * - Use a value that starts with `assets://`, to display an icon from the Atomic package.\n   * - Use a stringified SVG to display it directly.\n   */\n  @Prop() public icon?: string;\n\n  /**\n   * The maximum number of suggestions that will be displayed if the user has typed something into the input field.\n   */\n  @Prop({reflect: true}) public maxWithQuery = 3;\n  /**\n   * The maximum number of suggestions that will be displayed initially when the input field is empty.\n   */\n  @Prop({reflect: true}) public maxWithoutQuery?: number;\n\n  componentWillLoad() {\n    try {\n      dispatchSearchBoxSuggestionsEvent<SearchBox, Bindings>(\n        (bindings) => {\n          this.bindings = bindings;\n          return this.initialize();\n        },\n        this.host,\n        ['atomic-search-box']\n      );\n    } catch (error) {\n      this.error = error as Error;\n    }\n  }\n\n  private renderIcon() {\n    return this.icon || Clock;\n  }\n\n  private initialize(): SearchBoxSuggestions {\n    this.storage = new SafeStorage();\n    this.recentQueriesList = buildRecentQueriesList(this.bindings.engine, {\n      initialState: {queries: this.retrieveLocalStorage()},\n      options: {maxLength: 1000, clearFilters: this.bindings.clearFilters},\n    });\n\n    this.recentQueriesList.subscribe(() => this.updateLocalStorage());\n\n    return {\n      position: Array.from(this.host.parentNode!.children).indexOf(this.host),\n      renderItems: () => this.renderItems(),\n    };\n  }\n\n  private retrieveLocalStorage() {\n    return this.storage.getParsedJSON(StorageItems.RECENT_QUERIES, []);\n  }\n\n  private updateLocalStorage() {\n    if (!this.recentQueriesList.state.analyticsEnabled) {\n      return this.disableFeature();\n    }\n\n    return this.storage.setJSON(\n      StorageItems.RECENT_QUERIES,\n      this.recentQueriesList.state.queries\n    );\n  }\n\n  private warnUser = once(() =>\n    this.bindings.engine.logger.warn(\n      'Because analytics are disabled, the recent queries feature is deactivated.'\n    )\n  );\n\n  private disableFeature() {\n    this.warnUser();\n    this.storage.removeItem(StorageItems.RECENT_QUERIES);\n  }\n\n  private renderItems(): SearchBoxSuggestionElement[] {\n    if (!this.recentQueriesList.state.analyticsEnabled) {\n      return [];\n    }\n\n    const query = this.bindings.searchBoxController.state.value;\n    const hasQuery = query !== '';\n    const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;\n    const filteredQueries = this.recentQueriesList.state.queries\n      .filter((recentQuery) =>\n        recentQuery.toLowerCase().startsWith(query.toLowerCase())\n      )\n      .slice(0, max);\n\n    const suggestionElements: SearchBoxSuggestionElement[] =\n      filteredQueries.map((value) => this.renderItem(value));\n    if (suggestionElements.length) {\n      suggestionElements.unshift(this.renderClear());\n    }\n\n    return suggestionElements;\n  }\n\n  private renderClear(): SearchBoxSuggestionElement {\n    const partialItem = getPartialRecentQueryClearElement(this.bindings.i18n);\n\n    return {\n      ...partialItem,\n      content: <RecentQueryClear i18n={this.bindings.i18n} />,\n      onSelect: () => {\n        this.recentQueriesList.clear();\n        this.bindings.triggerSuggestions();\n      },\n    };\n  }\n\n  private renderItem(value: string): SearchBoxSuggestionElement {\n    const query = this.bindings.searchBoxController.state.value;\n    const partialItem = getPartialRecentQueryElement(value, this.bindings.i18n);\n    return {\n      ...partialItem,\n      content: (\n        <RecentQueriesContainer>\n          <RecentQueryIcon icon={this.renderIcon()} />\n          <RecentQueryText query={query} value={value} />\n        </RecentQueriesContainer>\n      ),\n\n      onSelect: () => {\n        if (this.bindings.isStandalone) {\n          this.bindings.searchBoxController.updateText(value);\n          this.bindings.searchBoxController.submit();\n          return;\n        }\n\n        this.recentQueriesList.executeRecentQuery(\n          this.recentQueriesList.state.queries.indexOf(value)\n        );\n      },\n    };\n  }\n\n  public render() {\n    if (this.error) {\n      return (\n        <atomic-component-error\n          element={this.host}\n          error={this.error}\n        ></atomic-component-error>\n      );\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}