@coveo/atomic 3.35.0-pre.e757e0d8ec → 3.35.0-pre.ff63a360d9

package/docs/atomic-docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-10-08T18:39:44",
+  "timestamp": "2025-10-08T23:16:02",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.20.0",
@@ -9073,8 +9073,7 @@
       "dependents": [
         "atomic-folded-result-list",
         "atomic-result-children",
-        "atomic-result-list",
-        "atomic-search-box-instant-results"
+        "atomic-result-list"
       ],
       "dependencies": [],
       "dependencyGraph": {
@@ -9086,9 +9085,6 @@
         ],
         "atomic-result-list": [
           "atomic-result"
-        ],
-        "atomic-search-box-instant-results": [
-          "atomic-result"
         ]
       }
     },
@@ -11825,327 +11821,11 @@
       ],
       "dependents": [],
       "dependencies": [
-        "atomic-suggestion-renderer",
-        "atomic-search-box-query-suggestions"
+        "atomic-suggestion-renderer"
       ],
       "dependencyGraph": {
         "atomic-search-box": [
-          "atomic-suggestion-renderer",
-          "atomic-search-box-query-suggestions"
-        ]
-      }
-    },
-    {
-      "filePath": "src/components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results.tsx",
-      "encapsulation": "shadow",
-      "tag": "atomic-search-box-instant-results",
-      "docs": "The `atomic-search-box-instant-results` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of instant results behavior.\n\nThis component does not support accessibility out-of-the-box. To do so, see [Instant Results Accessibility](https://docs.coveo.com/en/atomic/latest/usage/accessibility/#instant-results-accessibility).\n\nThis component is not supported on mobile.",
-      "docsTags": [
-        {
-          "name": "slot",
-          "text": "default - The default slot where the instant results are rendered."
-        }
-      ],
-      "usage": {},
-      "props": [
-        {
-          "name": "ariaLabelGenerator",
-          "type": "((bindings: Bindings, result: Result) => string | undefined) | undefined",
-          "complexType": {
-            "original": "AriaLabelGenerator",
-            "resolved": "((bindings: Bindings, result: Result) => string | undefined) | undefined",
-            "references": {
-              "AriaLabelGenerator": {
-                "location": "local",
-                "path": "/home/runner/work/ui-kit/ui-kit/packages/atomic/src/components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results.tsx",
-                "id": "src/components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results.tsx::AriaLabelGenerator"
-              }
-            }
-          },
-          "mutable": false,
-          "reflectToAttr": false,
-          "docs": "The callback to generate an [`aria-label`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) for a given result so that accessibility tools can fully describe what's visually rendered by a result.\n\nBy default, or if an empty string is returned, `result.title` is used.",
-          "docsTags": [],
-          "values": [
-            {
-              "type": "((bindings: Bindings, result: Result) => string"
-            },
-            {
-              "type": "undefined)"
-            },
-            {
-              "type": "undefined"
-            }
-          ],
-          "optional": true,
-          "required": false
-        },
-        {
-          "name": "density",
-          "type": "\"comfortable\" | \"compact\" | \"normal\"",
-          "complexType": {
-            "original": "ItemDisplayDensity",
-            "resolved": "\"comfortable\" | \"compact\" | \"normal\"",
-            "references": {
-              "ItemDisplayDensity": {
-                "location": "import",
-                "path": "../../../common/layout/display-options",
-                "id": "src/components/common/layout/display-options.ts::ItemDisplayDensity"
-              }
-            }
-          },
-          "mutable": false,
-          "attr": "density",
-          "reflectToAttr": true,
-          "docs": "The spacing of various elements in the result list, including the gap between results, the gap between parts of a result, and the font sizes of different parts in a result.",
-          "docsTags": [],
-          "default": "'normal'",
-          "values": [
-            {
-              "value": "comfortable",
-              "type": "string"
-            },
-            {
-              "value": "compact",
-              "type": "string"
-            },
-            {
-              "value": "normal",
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
-        {
-          "name": "imageSize",
-          "type": "\"icon\" | \"large\" | \"none\" | \"small\"",
-          "complexType": {
-            "original": "ItemDisplayImageSize",
-            "resolved": "\"icon\" | \"large\" | \"none\" | \"small\"",
-            "references": {
-              "ItemDisplayImageSize": {
-                "location": "import",
-                "path": "../../../common/layout/display-options",
-                "id": "src/components/common/layout/display-options.ts::ItemDisplayImageSize"
-              }
-            }
-          },
-          "mutable": false,
-          "attr": "image-size",
-          "reflectToAttr": true,
-          "docs": "The expected size of the image displayed in the results.",
-          "docsTags": [],
-          "default": "'icon'",
-          "values": [
-            {
-              "value": "icon",
-              "type": "string"
-            },
-            {
-              "value": "large",
-              "type": "string"
-            },
-            {
-              "value": "none",
-              "type": "string"
-            },
-            {
-              "value": "small",
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
-        {
-          "name": "maxResultsPerQuery",
-          "type": "number",
-          "complexType": {
-            "original": "number",
-            "resolved": "number",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "max-results-per-query",
-          "reflectToAttr": true,
-          "docs": "The maximum number of results to show.",
-          "docsTags": [],
-          "default": "4",
-          "values": [
-            {
-              "type": "number"
-            }
-          ],
-          "optional": false,
-          "required": false
-        }
-      ],
-      "methods": [
-        {
-          "name": "setRenderFunction",
-          "returns": {
-            "type": "Promise<void>",
-            "docs": ""
-          },
-          "complexType": {
-            "signature": "(resultRenderingFunction: ItemRenderingFunction) => Promise<void>",
-            "parameters": [
-              {
-                "name": "resultRenderingFunction",
-                "type": "((result: AnyItem, root: HTMLElement, linkContainer?: HTMLElement | undefined) => string) | undefined",
-                "docs": ""
-              }
-            ],
-            "references": {
-              "Promise": {
-                "location": "global",
-                "id": "global::Promise"
-              },
-              "ItemRenderingFunction": {
-                "location": "import",
-                "path": "../../../common/item-list/stencil-item-list-common",
-                "id": "src/components/common/item-list/stencil-item-list-common.tsx::ItemRenderingFunction"
-              }
-            },
-            "return": "Promise<void>"
-          },
-          "signature": "setRenderFunction(resultRenderingFunction: ItemRenderingFunction) => Promise<void>",
-          "parameters": [
-            {
-              "name": "resultRenderingFunction",
-              "type": "((result: AnyItem, root: HTMLElement, linkContainer?: HTMLElement | undefined) => string) | undefined",
-              "docs": ""
-            }
-          ],
-          "docs": "Sets a rendering function to bypass the standard HTML template mechanism for rendering results.\nYou can use this function while working with web frameworks that don't use plain HTML syntax, e.g., React, Angular or Vue.\n\nDo not use this method if you integrate Atomic in a plain HTML deployment.",
-          "docsTags": [
-            {
-              "name": "param",
-              "text": "resultRenderingFunction"
-            }
-          ]
-        }
-      ],
-      "events": [],
-      "listeners": [],
-      "styles": [],
-      "slots": [
-        {
-          "name": "default",
-          "docs": "The default slot where the instant results are rendered."
-        }
-      ],
-      "parts": [
-        {
-          "name": "outline",
-          "docs": ""
-        }
-      ],
-      "dependents": [],
-      "dependencies": [
-        "atomic-result"
-      ],
-      "dependencyGraph": {
-        "atomic-search-box-instant-results": [
-          "atomic-result"
-        ]
-      }
-    },
-    {
-      "filePath": "src/components/search/search-box-suggestions/atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.tsx",
-      "encapsulation": "shadow",
-      "tag": "atomic-search-box-query-suggestions",
-      "docs": "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.",
-      "docsTags": [],
-      "usage": {},
-      "props": [
-        {
-          "name": "icon",
-          "type": "string | undefined",
-          "complexType": {
-            "original": "string",
-            "resolved": "string | undefined",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "icon",
-          "reflectToAttr": false,
-          "docs": "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.",
-          "docsTags": [],
-          "values": [
-            {
-              "type": "string"
-            },
-            {
-              "type": "undefined"
-            }
-          ],
-          "optional": true,
-          "required": false
-        },
-        {
-          "name": "maxWithQuery",
-          "type": "number | undefined",
-          "complexType": {
-            "original": "number",
-            "resolved": "number | undefined",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "max-with-query",
-          "reflectToAttr": true,
-          "docs": "The maximum number of suggestions that will be displayed if the user has typed something into the input field.",
-          "docsTags": [],
-          "values": [
-            {
-              "type": "number"
-            },
-            {
-              "type": "undefined"
-            }
-          ],
-          "optional": true,
-          "required": false
-        },
-        {
-          "name": "maxWithoutQuery",
-          "type": "number | undefined",
-          "complexType": {
-            "original": "number",
-            "resolved": "number | undefined",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "max-without-query",
-          "reflectToAttr": true,
-          "docs": "The maximum number of suggestions that will be displayed initially when the input field is empty.",
-          "docsTags": [],
-          "values": [
-            {
-              "type": "number"
-            },
-            {
-              "type": "undefined"
-            }
-          ],
-          "optional": true,
-          "required": false
-        }
-      ],
-      "methods": [],
-      "events": [],
-      "listeners": [],
-      "styles": [],
-      "slots": [],
-      "parts": [],
-      "dependents": [
-        "atomic-search-box"
-      ],
-      "dependencies": [],
-      "dependencyGraph": {
-        "atomic-search-box": [
-          "atomic-search-box-query-suggestions"
+          "atomic-suggestion-renderer"
         ]
       }
     },
@@ -14741,6 +14421,11 @@
       "docstring": "The recommendation engine configuration.",
       "path": "src/components/recommendations/atomic-recs-interface/atomic-recs-interface.tsx"
     },
+    "src/components/common/layout/display-options.ts::ItemDisplayLayout": {
+      "declaration": "export type ItemDisplayLayout = ItemDisplayBasicLayout | 'table';",
+      "docstring": "",
+      "path": "src/components/common/layout/display-options.ts"
+    },
     "src/components/common/layout/display-options.ts::ItemDisplayDensity": {
       "declaration": "export type ItemDisplayDensity = 'comfortable' | 'normal' | 'compact';",
       "docstring": "",
@@ -14751,21 +14436,6 @@
       "docstring": "",
       "path": "src/components/common/layout/display-options.ts"
     },
-    "src/components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results.tsx::AriaLabelGenerator": {
-      "declaration": "(\n  bindings: Bindings,\n  result: Result\n) => string | undefined",
-      "docstring": "",
-      "path": "src/components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results.tsx"
-    },
-    "src/components/common/item-list/stencil-item-list-common.tsx::ItemRenderingFunction": {
-      "declaration": "export type ItemRenderingFunction<SpecificResult extends AnyItem = AnyItem> =\n  | ((\n      result: SpecificResult,\n      root: HTMLElement,\n      linkContainer?: HTMLElement\n    ) => string)\n  | undefined;",
-      "docstring": "",
-      "path": "src/components/common/item-list/stencil-item-list-common.tsx"
-    },
-    "src/components/common/layout/display-options.ts::ItemDisplayLayout": {
-      "declaration": "export type ItemDisplayLayout = ItemDisplayBasicLayout | 'table';",
-      "docstring": "",
-      "path": "src/components/common/layout/display-options.ts"
-    },
     "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.",
@@ -14871,6 +14541,11 @@
       "docstring": "",
       "path": "src/components/insight/atomic-insight-interface/store.ts"
     },
+    "src/components/common/item-list/stencil-item-list-common.tsx::ItemRenderingFunction": {
+      "declaration": "export type ItemRenderingFunction<SpecificResult extends AnyItem = AnyItem> =\n  | ((\n      result: SpecificResult,\n      root: HTMLElement,\n      linkContainer?: HTMLElement\n    ) => string)\n  | undefined;",
+      "docstring": "",
+      "path": "src/components/common/item-list/stencil-item-list-common.tsx"
+    },
     "../headless/dist/definitions/index.d.ts::ResultTemplateCondition": {
       "declaration": "any",
       "docstring": "",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@coveo/atomic",
   "type": "module",
-  "version": "3.35.0-pre.e757e0d8ec",
+  "version": "3.35.0-pre.ff63a360d9",
   "description": "A web-component library for building modern UIs interfacing with the Coveo platform",
   "homepage": "https://docs.coveo.com/en/atomic/latest/",
   "repository": {
@@ -61,8 +61,9 @@
     "prod": "npx serve www -l 3333 --no-request-logging",
     "test": "npm run test:stencil && npm run test:lit",
     "test:stencil": "stencil test --spec -- src/utils/initialization-utils.spec.ts",
-    "test:lit": "vitest run",
-    "test:watch": "vitest",
+    "test:lit": "vitest run --project=atomic-default",
+    "test:watch": "vitest --project=atomic-default",
+    "test:storybook": "vitest run --project=storybook",
     "e2e": "cypress run --browser chrome",
     "e2e:firefox": "cypress run --browser firefox",
     "e2e:watch": "cypress open --browser chrome --e2e",
@@ -81,7 +82,7 @@
   },
   "dependencies": {
     "@coveo/bueno": "1.1.3",
-    "@coveo/headless": "3.31.2",
+    "@coveo/headless": "3.31.3-pre.ff63a360d9",
     "@lit/context": "1.1.6",
     "@open-wc/lit-helpers": "0.7.0",
     "@popperjs/core": "2.11.8",
@@ -110,6 +111,7 @@
     "@stencil/react-output-target": "0.5.3",
     "@storybook/addon-a11y": "9.1.2",
     "@storybook/addon-docs": "9.1.2",
+    "@storybook/addon-vitest": "9.1.2",
     "@storybook/icons": "1.4.0",
     "@storybook/web-components-vite": "9.1.2",
     "@tailwindcss/postcss": "4.1.13",
@@ -118,6 +120,7 @@
     "@types/jest": "29.5.14",
     "@types/puppeteer": "7.0.4",
     "@vitest/browser": "3.2.4",
+    "@vitest/coverage-v8": "^3.2.4",
     "@wc-toolkit/storybook-helpers": "9.0.1",
     "axe-core": "4.10.3",
     "cypress": "13.7.3",
@@ -153,7 +156,7 @@
   },
   "peerDependencies": {
     "@coveo/bueno": "1.1.3",
-    "@coveo/headless": "3.31.2",
+    "@coveo/headless": "3.31.3-pre.ff63a360d9",
     "typescript": ">=5.0.0"
   },
   "peerDependenciesMeta": {

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

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../../types/components";
-
-interface AtomicSearchBoxInstantResults extends Components.AtomicSearchBoxInstantResults, HTMLElement {}
-export const AtomicSearchBoxInstantResults: {
-    prototype: AtomicSearchBoxInstantResults;
-    new (): AtomicSearchBoxInstantResults;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/atomic/components/atomic-search-box-instant-results.js.map

@@ -1 +0,0 @@
-{"file":"atomic-search-box-instant-results.js","mappings":"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","names":["AtomicSearchBoxInstantResults"],"sources":["src/components/common/suggestions/stencil-instant-item.tsx","src/components/search/search-box-suggestions/atomic-search-box-instant-results/atomic-search-box-instant-results.tsx"],"sourcesContent":["import {FunctionalComponent, h} from '@stencil/core';\nimport {i18n} from 'i18next';\nimport {encodeForDomAttribute} from '../../../utils/string-utils';\nimport {getClassNameForButtonStyle} from '../stencil-button-style';\nimport {SearchBoxSuggestionElement} from './suggestions-types';\n\n/**\n * @deprecated should only be used for Stencil components.\n */\nexport const getPartialInstantItemElement = (\n  i18n: i18n,\n  itemTitle: string,\n  itemUniqueId: string\n): Pick<SearchBoxSuggestionElement, 'ariaLabel' | 'key' | 'part'> => {\n  return {\n    ariaLabel: i18n.t('instant-results-suggestion-label', {\n      title: itemTitle,\n      interpolation: {escapeValue: false},\n    }),\n    key: `instant-result-${encodeForDomAttribute(itemUniqueId)}`,\n    part: 'instant-results-item',\n  };\n};\n\n/**\n * @deprecated should only be used for Stencil components.\n */\nexport const getPartialInstantItemShowAllElement = (\n  i18n: i18n\n): Pick<SearchBoxSuggestionElement, 'key' | 'part' | 'ariaLabel'> => {\n  return {\n    key: 'instant-results-show-all-button',\n    part: 'instant-results-show-all',\n    ariaLabel: i18n.t('show-all-results'),\n  };\n};\n\ninterface InstantItemShowAllButtonProps {\n  i18n: i18n;\n}\n\n/**\n * @deprecated should only be used for Stencil components.\n */\nexport const InstantItemShowAllButton: FunctionalComponent<\n  InstantItemShowAllButtonProps\n> = ({i18n}) => {\n  return (\n    <div\n      part=\"instant-results-show-all-button\"\n      class={getClassNameForButtonStyle('text-primary')}\n    >\n      {i18n.t('show-all-results')}\n    </div>\n  );\n};\n","import {\n  buildInstantResults,\n  buildInteractiveInstantResult,\n  InstantResults,\n  Result,\n  SearchBox,\n} from '@coveo/headless';\nimport {Component, Element, State, h, Prop, Method} from '@stencil/core';\nimport {InitializableComponent} from '../../../../utils/initialization-utils';\nimport {encodeForDomAttribute} from '../../../../utils/string-utils';\nimport {ItemTemplateProvider} from '../../../common/item-list/item-template-provider';\nimport {ItemRenderingFunction} from '../../../common/item-list/stencil-item-list-common';\nimport {\n  ItemDisplayDensity,\n  ItemDisplayImageSize,\n  ItemDisplayLayout,\n} from '../../../common/layout/display-options';\nimport {\n  getPartialInstantItemElement,\n  getPartialInstantItemShowAllElement,\n  InstantItemShowAllButton,\n} from '../../../common/suggestions/stencil-instant-item';\nimport {\n  dispatchSearchBoxSuggestionsEvent,\n} from '../../../common/suggestions/suggestions-events';\nimport type {\n  SearchBoxSuggestionElement,\n  SearchBoxSuggestions,\n  SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-types';\nimport {Bindings} from '../../atomic-search-interface/atomic-search-interface';\n\nexport type AriaLabelGenerator = (\n  bindings: Bindings,\n  result: Result\n) => string | undefined;\n\n/**\n * The `atomic-search-box-instant-results` component can be added as a child of an `atomic-search-box` component, allowing for the configuration of instant results behavior.\n *\n * This component does not support accessibility out-of-the-box. To do so, see [Instant Results Accessibility](https://docs.coveo.com/en/atomic/latest/usage/accessibility/#instant-results-accessibility).\n *\n * This component is not supported on mobile.\n *\n * @slot default - The default slot where the instant results are rendered.\n */\n@Component({\n  tag: 'atomic-search-box-instant-results',\n  shadow: true,\n})\nexport class AtomicSearchBoxInstantResults implements InitializableComponent {\n  public bindings!: SearchBoxSuggestionsBindings<SearchBox, Bindings>;\n  private itemRenderingFunction: ItemRenderingFunction;\n  private results: Result[] = [];\n  private itemTemplateProvider!: ItemTemplateProvider;\n  private instantResults!: InstantResults;\n  private display: ItemDisplayLayout = 'list';\n\n  @Element() public host!: HTMLElement;\n\n  @State() public error!: Error;\n  @State() private templateHasError = false;\n\n  /**\n   * Sets a rendering function to bypass the standard HTML template mechanism for rendering results.\n   * You can use this function while working with web frameworks that don't use plain HTML syntax, e.g., React, Angular or Vue.\n   *\n   * Do not use this method if you integrate Atomic in a plain HTML deployment.\n   *\n   * @param resultRenderingFunction\n   */\n  @Method() public async setRenderFunction(\n    resultRenderingFunction: ItemRenderingFunction\n  ) {\n    this.itemRenderingFunction = resultRenderingFunction;\n  }\n  /**\n   * The maximum number of results to show.\n   */\n  @Prop({reflect: true}) public maxResultsPerQuery = 4;\n  /**\n   * The spacing of various elements in the result list, including the gap between results, the gap between parts of a result, and the font sizes of different parts in a result.\n   */\n  @Prop({reflect: true}) public density: ItemDisplayDensity = 'normal';\n  /**\n   * The expected size of the image displayed in the results.\n   */\n  @Prop({reflect: true}) public imageSize: ItemDisplayImageSize = 'icon';\n  /**\n   * The callback to generate an [`aria-label`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) for a given result so that accessibility tools can fully describe what's visually rendered by a result.\n   *\n   * By default, or if an empty string is returned, `result.title` is used.\n   */\n  @Prop() public ariaLabelGenerator?: AriaLabelGenerator;\n\n  public 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 getLink(el: HTMLElement): HTMLElement | null {\n    const atomicResult =\n      el.tagName === 'ATOMIC-RESULT' ? el : el?.querySelector('atomic-result');\n\n    return (\n      atomicResult?.shadowRoot?.querySelector(\n        'atomic-result-link a:not([slot])'\n      ) || null\n    );\n  }\n\n  private handleLinkClick(el: HTMLElement, hasModifier: boolean) {\n    const setTarget = (value: string) => el.setAttribute('target', value);\n    const initialTarget = el.getAttribute('target');\n\n    hasModifier && setTarget('_blank');\n    el.click();\n    hasModifier && setTarget(initialTarget || '');\n\n    return true;\n  }\n\n  private renderItems(): SearchBoxSuggestionElement[] {\n    if (!this.bindings.suggestedQuery() || this.bindings.store.isMobile()) {\n      return [];\n    }\n    const results = this.instantResults.state.results.length\n      ? this.instantResults.state.results\n      : this.results;\n\n    const elements: SearchBoxSuggestionElement[] = results.map(\n      (result: Result) => {\n        const partialItem = getPartialInstantItemElement(\n          this.bindings.i18n,\n          this.ariaLabelGenerator?.(this.bindings, result) || result.title,\n          result.uniqueId\n        );\n        return {\n          ...partialItem,\n          content: (\n            <atomic-result\n              key={`instant-result-${encodeForDomAttribute(result.uniqueId)}`}\n              part=\"outline\"\n              result={result}\n              interactiveResult={buildInteractiveInstantResult(\n                this.bindings.engine,\n                {\n                  options: {result},\n                }\n              )}\n              display={this.display}\n              density={this.density}\n              imageSize={this.imageSize}\n              content={this.itemTemplateProvider.getTemplateContent(result)}\n              stopPropagation={false}\n              renderingFunction={this.itemRenderingFunction}\n            ></atomic-result>\n          ),\n          onSelect: (e: MouseEvent) => {\n            const link = this.getLink(e.target as HTMLElement);\n\n            if (!link) {\n              return;\n            }\n            this.handleLinkClick(link, e.ctrlKey || e.metaKey);\n          },\n        };\n      }\n    );\n    if (elements.length) {\n      const partialItem = getPartialInstantItemShowAllElement(\n        this.bindings.i18n\n      );\n      elements.push({\n        ...partialItem,\n        content: <InstantItemShowAllButton i18n={this.bindings.i18n} />,\n        onSelect: () => {\n          this.bindings.clearSuggestions();\n          this.bindings.searchBoxController.updateText(\n            this.instantResults.state.q\n          );\n          this.bindings.searchBoxController.submit();\n        },\n      });\n    }\n    return elements;\n  }\n\n  public initialize(): SearchBoxSuggestions {\n    this.instantResults = buildInstantResults(this.bindings.engine, {\n      options: {\n        maxResultsPerQuery: this.maxResultsPerQuery,\n      },\n    });\n\n    this.itemTemplateProvider = new ItemTemplateProvider({\n      includeDefaultTemplate: true,\n      templateElements: Array.from(\n        this.host.querySelectorAll('atomic-result-template')\n      ),\n      getResultTemplateRegistered: () => true,\n      setResultTemplateRegistered: () => {},\n      getTemplateHasError: () => this.templateHasError,\n      setTemplateHasError: (value: boolean) => {\n        this.templateHasError = value;\n      },\n      bindings: this.bindings,\n    });\n\n    return {\n      position: Array.from(this.host.parentNode!.children).indexOf(this.host),\n      panel: 'right',\n      onSuggestedQueryChange: (q) => {\n        this.instantResults.updateQuery(q);\n        return this.onSuggestedQueryChange();\n      },\n      renderItems: () => this.renderItems(),\n    };\n  }\n\n  private onSuggestedQueryChange() {\n    if (\n      !this.bindings.getSuggestionElements().length &&\n      !this.bindings.searchBoxController.state.value\n    ) {\n      console.warn(\n        \"There doesn't seem to be any query suggestions configured. Make sure to include either an atomic-search-box-query-suggestions or atomic-search-box-recent-queries in your search box in order to see some instant results.\"\n      );\n    }\n\n    return new Promise<void>((resolve) => {\n      const unsubscribe = this.instantResults.subscribe(() => {\n        const state = this.instantResults.state;\n        if (!state.isLoading) {\n          if (state.results.length) {\n            this.results = state.results;\n          }\n          unsubscribe();\n          resolve();\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"],"version":3}

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

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../../types/components";
-
-interface AtomicSearchBoxQuerySuggestions extends Components.AtomicSearchBoxQuerySuggestions, HTMLElement {}
-export const AtomicSearchBoxQuerySuggestions: {
-    prototype: AtomicSearchBoxQuerySuggestions;
-    new (): AtomicSearchBoxQuerySuggestions;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/atomic/components/atomic-search-box-query-suggestions.js

@@ -1,8 +0,0 @@
-import { A as AtomicSearchBoxQuerySuggestions$1, d as defineCustomElement$1 } from './atomic-search-box-query-suggestions2.js';
-
-const AtomicSearchBoxQuerySuggestions = AtomicSearchBoxQuerySuggestions$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { AtomicSearchBoxQuerySuggestions, defineCustomElement };
-
-//# sourceMappingURL=atomic-search-box-query-suggestions.js.map

package/dist/atomic/components/atomic-search-box-query-suggestions.js.map

@@ -1 +0,0 @@
-{"file":"atomic-search-box-query-suggestions.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/atomic/components/atomic-search-box-query-suggestions2.js

@@ -1,89 +0,0 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { loadQuerySuggestActions } from '@coveo/headless';
-import { S as SearchIcon } from './search.js';
-import { g as getPartialSearchBoxSuggestionElement, Q as QuerySuggestionContainer, a as QuerySuggestionIcon, b as QuerySuggestionText } from './stencil-query-suggestions.js';
-import { d as dispatchSearchBoxSuggestionsEvent } from './suggestions-events.js';
-
-const AtomicSearchBoxQuerySuggestions = /*@__PURE__*/ proxyCustomElement(class AtomicSearchBoxQuerySuggestions extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.error = undefined;
-        this.icon = undefined;
-        this.maxWithQuery = undefined;
-        this.maxWithoutQuery = undefined;
-    }
-    componentWillLoad() {
-        try {
-            dispatchSearchBoxSuggestionsEvent((bindings) => {
-                this.bindings = bindings;
-                return this.initialize();
-            }, this.host, ['atomic-search-box']);
-        }
-        catch (error) {
-            this.error = error;
-        }
-    }
-    initialize() {
-        const engine = this.bindings.engine;
-        const { registerQuerySuggest, fetchQuerySuggestions } = loadQuerySuggestActions(engine);
-        engine.dispatch(registerQuerySuggest({
-            id: this.bindings.id,
-            count: this.bindings.numberOfQueries,
-        }));
-        return {
-            position: Array.from(this.host.parentNode.children).indexOf(this.host),
-            onInput: () => engine.dispatch(fetchQuerySuggestions({
-                id: this.bindings.id,
-            })),
-            renderItems: () => this.renderItems(),
-        };
-    }
-    renderItems() {
-        const hasQuery = this.bindings.searchBoxController.state.value !== '';
-        const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;
-        return this.bindings.searchBoxController.state.suggestions
-            .slice(0, max)
-            .map((suggestion) => this.renderItem(suggestion));
-    }
-    renderItem(suggestion) {
-        const hasQuery = this.bindings.searchBoxController.state.value !== '';
-        const partialItem = getPartialSearchBoxSuggestionElement(suggestion, this.bindings.i18n);
-        return {
-            ...partialItem,
-            content: (h(QuerySuggestionContainer, null, h(QuerySuggestionIcon, { icon: this.icon || SearchIcon, hasSuggestion: this.bindings.getSuggestions().length > 1 }), h(QuerySuggestionText, { suggestion: suggestion, hasQuery: hasQuery }))),
-            onSelect: () => {
-                this.bindings.searchBoxController.selectSuggestion(suggestion.rawValue);
-            },
-        };
-    }
-    render() {
-        if (this.error) {
-            return (h("atomic-component-error", { key: '7fdb4afa7291ad70c37a9709fd7108f4fe0fb94d', element: this.host, error: this.error }));
-        }
-    }
-    get host() { return this; }
-}, [1, "atomic-search-box-query-suggestions", {
-        "icon": [1],
-        "maxWithQuery": [514, "max-with-query"],
-        "maxWithoutQuery": [514, "max-without-query"],
-        "error": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["atomic-search-box-query-suggestions"];
-    components.forEach(tagName => { switch (tagName) {
-        case "atomic-search-box-query-suggestions":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, AtomicSearchBoxQuerySuggestions);
-            }
-            break;
-    } });
-}
-
-export { AtomicSearchBoxQuerySuggestions as A, defineCustomElement as d };
-
-//# sourceMappingURL=atomic-search-box-query-suggestions2.js.map

package/dist/atomic/components/atomic-search-box-query-suggestions2.js.map

@@ -1 +0,0 @@
-{"file":"atomic-search-box-query-suggestions2.js","mappings":";;;;;;MA8Ba,+BAA+B;;;;;;;;;;IAwB1C,iBAAiB;QACf,IAAI;YACF,iCAAiC,CAC/B,CAAC,QAAQ;gBACP,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;gBACzB,OAAO,IAAI,CAAC,UAAU,EAAE,CAAC;aAC1B,EACD,IAAI,CAAC,IAAI,EACT,CAAC,mBAAmB,CAAC,CACtB,CAAC;SACH;QAAC,OAAO,KAAK,EAAE;YACd,IAAI,CAAC,KAAK,GAAG,KAAc,CAAC;SAC7B;KACF;IAEO,UAAU;QAChB,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,MAG3B,CAAC;QACH,MAAM,EAAC,oBAAoB,EAAE,qBAAqB,EAAC,GACjD,uBAAuB,CAAC,MAAM,CAAC,CAAC;QAElC,MAAM,CAAC,QAAQ,CACb,oBAAoB,CAAC;YACnB,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;YACpB,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,eAAe;SACrC,CAAC,CACH,CAAC;QAEF,OAAO;YACL,QAAQ,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,UAAW,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;YACvE,OAAO,EAAE,MACP,MAAM,CAAC,QAAQ,CACb,qBAAqB,CAAC;gBACpB,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,EAAE;aACrB,CAAC,CACH;YACH,WAAW,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE;SACtC,CAAC;KACH;IAEO,WAAW;QACjB,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,KAAK,KAAK,EAAE,CAAC;QACtE,MAAM,GAAG,GAAG,QAAQ,GAAG,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,CAAC;QAChE,OAAO,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,WAAW;aACvD,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC;aACb,GAAG,CAAC,CAAC,UAAU,KAAK,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC;KACrD;IAEO,UAAU,CAAC,UAAsB;QACvC,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,KAAK,CAAC,KAAK,KAAK,EAAE,CAAC;QACtE,MAAM,WAAW,GAAG,oCAAoC,CACtD,UAAU,EACV,IAAI,CAAC,QAAQ,CAAC,IAAI,CACnB,CAAC;QAEF,OAAO;YACL,GAAG,WAAW;YACd,OAAO,GACL,EAAC,wBAAwB,QACvB,EAAC,mBAAmB,IAClB,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,UAAU,EAC7B,aAAa,EAAE,IAAI,CAAC,QAAQ,CAAC,cAAc,EAAE,CAAC,MAAM,GAAG,CAAC,GACxD,EAEF,EAAC,mBAAmB,IAAC,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAC1C,CAC5B;YACD,QAAQ,EAAE;gBACR,IAAI,CAAC,QAAQ,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;aACzE;SACF,CAAC;KACH;IAEM,MAAM;QACX,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,QACE,+EACE,OAAO,EAAE,IAAI,CAAC,IAAI,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,GACO,EAC1B;SACH;KACF;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/search/search-box-suggestions/atomic-search-box-query-suggestions/atomic-search-box-query-suggestions.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} from '../../../common/suggestions/suggestions-events';\nimport type {\n  SearchBoxSuggestionElement,\n  SearchBoxSuggestions,\n  SearchBoxSuggestionsBindings,\n} from '../../../common/suggestions/suggestions-types';\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"],"version":3}