@coveo/atomic 3.34.0-pre.17f1048110 → 3.34.0-pre.1afb643042

package/dist/atomic/components/{components/search/atomic-search-box-instant-results/atomic-search-box-instant-results.js → atomic-search-box-instant-results.js}

@@ -1,34 +1,37 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
+import { h, proxyCustomElement, HTMLElement } from '@stencil/core/internal/client';
+import { buildInteractiveInstantResult, buildInstantResults } from '@coveo/headless';
+import { e as encodeForDomAttribute } from './string-utils.js';
+import { I as ItemTemplateProvider } from './item-template-provider.js';
+import { g as getClassNameForButtonStyle } from './stencil-button-style.js';
+import { d as dispatchSearchBoxSuggestionsEvent } from './suggestions-events.js';
+import { d as defineCustomElement$2 } from './atomic-result2.js';
+
+const getPartialInstantItemElement = (i18n, itemTitle, itemUniqueId) => {
+    return {
+        ariaLabel: i18n.t('instant-results-suggestion-label', {
+            title: itemTitle,
+            interpolation: { escapeValue: false },
+        }),
+        key: `instant-result-${encodeForDomAttribute(itemUniqueId)}`,
+        part: 'instant-results-item',
+    };
 };
-import { buildInstantResults, buildInteractiveInstantResult, } from '@coveo/headless';
-import { html, LitElement, nothing, render } from 'lit';
-import { customElement, property, state } from 'lit/decorators.js';
-import { keyed } from 'lit/directives/keyed.js';
-import { getPartialInstantItemElement, getPartialInstantItemShowAllElement, renderInstantItemShowAllButton, } from "../../common/suggestions/instant-item";
-import { dispatchSearchBoxSuggestionsEvent } from "../../common/suggestions/suggestions-events";
-import { errorGuard } from "../../../decorators/error-guard";
-import { withTailwindStyles } from "../../../decorators/with-tailwind-styles.js";
-import { encodeForDomAttribute } from "../../../utils/string-utils";
-import { ItemTemplateProvider } from '../../common/item-list/item-template-provider';
-/**
- * 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.
- *
- * 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).
- *
- * This component is not supported on mobile.
- *
- * @part instant-results-show-all-button - The 'See all results' button.
- * @part instant-results-item - The individual instant result item.
- *
- * @slot default - The default slot where the instant results are rendered.
- */
-let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends LitElement {
+const getPartialInstantItemShowAllElement = (i18n) => {
+    return {
+        key: 'instant-results-show-all-button',
+        part: 'instant-results-show-all',
+        ariaLabel: i18n.t('show-all-results'),
+    };
+};
+const InstantItemShowAllButton = ({ i18n }) => {
+    return (h("div", { part: "instant-results-show-all-button", class: getClassNameForButtonStyle('text-primary') }, i18n.t('show-all-results')));
+};
+
+const AtomicSearchBoxInstantResults$1 = /*@__PURE__*/ proxyCustomElement(class AtomicSearchBoxInstantResults extends HTMLElement {
     constructor() {
-        super(...arguments);
+        super();
+        this.__registerHost();
+        this.__attachShadow();
         this.results = [];
         this.display = 'list';
         this.templateHasError = false;
@@ -44,6 +47,12 @@ let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends
          * The expected size of the image displayed in the results.
          */
         this.imageSize = 'icon';
+        this.error = undefined;
+        this.templateHasError = false;
+        this.maxResultsPerQuery = 4;
+        this.density = 'normal';
+        this.imageSize = 'icon';
+        this.ariaLabelGenerator = undefined;
     }
     /**
      * Sets a rendering function to bypass the standard HTML template mechanism for rendering results.
@@ -56,13 +65,12 @@ let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends
     async setRenderFunction(resultRenderingFunction) {
         this.itemRenderingFunction = resultRenderingFunction;
     }
-    connectedCallback() {
-        super.connectedCallback();
+    componentWillLoad() {
         try {
             dispatchSearchBoxSuggestionsEvent((bindings) => {
                 this.bindings = bindings;
                 return this.initialize();
-            }, this, ['atomic-search-box']);
+            }, this.host, ['atomic-search-box']);
         }
         catch (error) {
             this.error = error;
@@ -78,6 +86,7 @@ let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends
         hasModifier && setTarget('_blank');
         el.click();
         hasModifier && setTarget(initialTarget || '');
+        return true;
     }
     renderItems() {
         if (!this.bindings.suggestedQuery() || this.bindings.store.isMobile()) {
@@ -87,27 +96,12 @@ let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends
             ? this.instantResults.state.results
             : this.results;
         const elements = results.map((result) => {
-            const partialItem = getPartialInstantItemElement(this.bindings.i18n, 'instant-results-suggestion-label', this.ariaLabelGenerator?.(this.bindings, result) || result.title, result.uniqueId);
-            const key = `instant-result-${encodeForDomAttribute(result.uniqueId)}`;
-            const template = html `${keyed(key, html `<atomic-result
-            part="outline"
-            .result=${result}
-            .interactiveResult=${buildInteractiveInstantResult(this.bindings.engine, {
-                options: { result },
-            })}
-            .display=${this.display}
-            .density=${this.density}
-            .imageSize=${this.imageSize}
-            .content=${this.itemTemplateProvider.getTemplateContent(result)}
-            .stopPropagation=${false}
-            .renderingFunction=${this.itemRenderingFunction}
-          ></atomic-result>`)}`;
-            const container = document.createElement('div');
-            render(template, container);
-            const resultElement = container.firstElementChild;
+            const partialItem = getPartialInstantItemElement(this.bindings.i18n, this.ariaLabelGenerator?.(this.bindings, result) || result.title, result.uniqueId);
             return {
                 ...partialItem,
-                content: resultElement,
+                content: (h("atomic-result", { key: `instant-result-${encodeForDomAttribute(result.uniqueId)}`, part: "outline", result: result, interactiveResult: buildInteractiveInstantResult(this.bindings.engine, {
+                        options: { result },
+                    }), display: this.display, density: this.density, imageSize: this.imageSize, content: this.itemTemplateProvider.getTemplateContent(result), stopPropagation: false, renderingFunction: this.itemRenderingFunction })),
                 onSelect: (e) => {
                     const link = this.getLink(e.target);
                     if (!link) {
@@ -118,13 +112,10 @@ let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends
             };
         });
         if (elements.length) {
-            const partialItem = getPartialInstantItemShowAllElement(this.bindings.i18n, 'show-all-results');
+            const partialItem = getPartialInstantItemShowAllElement(this.bindings.i18n);
             elements.push({
                 ...partialItem,
-                content: renderInstantItemShowAllButton({
-                    i18n: this.bindings.i18n,
-                    i18nKey: 'show-all-results',
-                }),
+                content: h(InstantItemShowAllButton, { i18n: this.bindings.i18n }),
                 onSelect: () => {
                     this.bindings.clearSuggestions();
                     this.bindings.searchBoxController.updateText(this.instantResults.state.q);
@@ -142,7 +133,7 @@ let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends
         });
         this.itemTemplateProvider = new ItemTemplateProvider({
             includeDefaultTemplate: true,
-            templateElements: Array.from(this.querySelectorAll('atomic-result-template')),
+            templateElements: Array.from(this.host.querySelectorAll('atomic-result-template')),
             getResultTemplateRegistered: () => true,
             setResultTemplateRegistered: () => { },
             getTemplateHasError: () => this.templateHasError,
@@ -152,7 +143,7 @@ let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends
             bindings: this.bindings,
         });
         return {
-            position: Array.from(this.parentNode.children).indexOf(this),
+            position: Array.from(this.host.parentNode.children).indexOf(this.host),
             panel: 'right',
             onSuggestedQueryChange: (q) => {
                 this.instantResults.updateQuery(q);
@@ -180,32 +171,42 @@ let AtomicSearchBoxInstantResults = class AtomicSearchBoxInstantResults extends
         });
     }
     render() {
-        return html `${nothing}`;
+        if (this.error) {
+            return (h("atomic-component-error", { key: 'c458b821ec8f13321a674f00e6e5f8dfa50d2525', element: this.host, error: this.error }));
+        }
     }
-};
-__decorate([
-    state()
-], AtomicSearchBoxInstantResults.prototype, "error", void 0);
-__decorate([
-    state()
-], AtomicSearchBoxInstantResults.prototype, "templateHasError", void 0);
-__decorate([
-    property({ attribute: 'max-results-per-query', reflect: true, type: Number })
-], AtomicSearchBoxInstantResults.prototype, "maxResultsPerQuery", void 0);
-__decorate([
-    property({ reflect: true })
-], AtomicSearchBoxInstantResults.prototype, "density", void 0);
-__decorate([
-    property({ attribute: 'image-size', reflect: true })
-], AtomicSearchBoxInstantResults.prototype, "imageSize", void 0);
-__decorate([
-    property({ attribute: 'aria-label-generator' })
-], AtomicSearchBoxInstantResults.prototype, "ariaLabelGenerator", void 0);
-__decorate([
-    errorGuard()
-], AtomicSearchBoxInstantResults.prototype, "render", null);
-AtomicSearchBoxInstantResults = __decorate([
-    customElement('atomic-search-box-instant-results'),
-    withTailwindStyles
-], AtomicSearchBoxInstantResults);
-export { AtomicSearchBoxInstantResults };
+    get host() { return this; }
+}, [1, "atomic-search-box-instant-results", {
+        "maxResultsPerQuery": [514, "max-results-per-query"],
+        "density": [513],
+        "imageSize": [513, "image-size"],
+        "ariaLabelGenerator": [16],
+        "error": [32],
+        "templateHasError": [32],
+        "setRenderFunction": [64]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["atomic-search-box-instant-results", "atomic-result"];
+    components.forEach(tagName => { switch (tagName) {
+        case "atomic-search-box-instant-results":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, AtomicSearchBoxInstantResults$1);
+            }
+            break;
+        case "atomic-result":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const AtomicSearchBoxInstantResults = AtomicSearchBoxInstantResults$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { AtomicSearchBoxInstantResults, defineCustomElement };
+
+//# sourceMappingURL=atomic-search-box-instant-results.js.map

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

@@ -0,0 +1 @@
+{"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\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\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}\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-suggestions2.js

@@ -60,7 +60,7 @@ const AtomicSearchBoxQuerySuggestions = /*@__PURE__*/ proxyCustomElement(class A
     }
     render() {
         if (this.error) {
-            return (h("atomic-component-error", { key: '473f8988f08fd8dae7efa056dd16f91427b90a25', element: this.host, error: this.error }));
+            return (h("atomic-component-error", { key: 'c5e8f0a3254a31cdae54c36868f70432c1673888', element: this.host, error: this.error }));
         }
     }
     get host() { return this; }

package/dist/atomic/components/atomic-search-box-recent-queries2.js

@@ -154,7 +154,7 @@ const AtomicSearchBoxRecentQueries = /*@__PURE__*/ proxyCustomElement(class Atom
     }
     render() {
         if (this.error) {
-            return (h("atomic-component-error", { key: '610c29ab15737a0fa9e79aaae6886026015b53f5', element: this.host, error: this.error }));
+            return (h("atomic-component-error", { key: 'a428e82c6ce29e81704777cbbf3bea98937b906a', element: this.host, error: this.error }));
         }
     }
     get host() { return this; }

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

@@ -436,14 +436,14 @@ const AtomicSearchBox$1 = /*@__PURE__*/ proxyCustomElement(class AtomicSearchBox
         if (!this.suggestionManager.suggestions.length) {
             this.registerSearchboxSuggestionEvents();
         }
-        return (h(Host, { key: '3ac7917db88e36ba7e549c86edc193bdbd20b778' }, this.renderAbsolutePositionSpacer(), [
-            h(SearchBoxWrapper, { key: '1da351ddacf20df9f8b0f916bfcbe0b249c85aa2', disabled: isDisabled, onFocusout: (event) => {
+        return (h(Host, { key: '6a53ad9feb241283fd9bcb638b8f0f703691937a' }, this.renderAbsolutePositionSpacer(), [
+            h(SearchBoxWrapper, { key: 'c704424a22aa17ead0ca97f0104e336df2c57475', disabled: isDisabled, onFocusout: (event) => {
                     if (!isFocusingOut(event)) {
                         return;
                     }
                     this.suggestionManager.clearSuggestions();
                     this.isExpanded = false;
-                } }, this.renderTextBox(searchLabel), h(SubmitButton, { key: 'f01fee04428c18a2ccf1e531ae54b27a43398a5b', bindings: this.bindings, disabled: isDisabled, onClick: () => {
+                } }, this.renderTextBox(searchLabel), h(SubmitButton, { key: 'ee7fc79825b31c970bad13d6568e0a91b01ff60e', bindings: this.bindings, disabled: isDisabled, onClick: () => {
                     this.searchBox.submit();
                     this.suggestionManager.clearSuggestions();
                 } }), this.renderSuggestions()),

package/dist/atomic/components/atomic-smart-snippet-answer2.js

@@ -89,7 +89,7 @@ const AtomicSmartSnippetAnswer = /*@__PURE__*/ proxyCustomElement(class AtomicSm
             }), ref: (element) => element && this.bindAnalyticsToLinks(element), part: "answer", class: "margin" })));
     }
     render() {
-        return (h(Host, { key: 'cce0ec413e760316ae056f93682b19094d33f276' }, this.renderStyle(), this.renderContent()));
+        return (h(Host, { key: '70444fee1d3384fa1a413605776003ec98eafdcf' }, this.renderStyle(), this.renderContent()));
     }
     get host() { return this; }
     static get style() { return AtomicSmartSnippetAnswerStyle0; }

package/dist/atomic/components/atomic-smart-snippet-collapse-wrapper2.js

@@ -56,11 +56,11 @@ const AtomicSmartSnippetCollapseWrapper = /*@__PURE__*/ proxyCustomElement(class
         return (h("button", { onClick: () => (this.isExpanded = !this.isExpanded), class: "text-primary mb-4 hover:underline", part: this.isExpanded ? 'show-less-button' : 'show-more-button' }, this.bindings.i18n.t(this.isExpanded ? 'show-less' : 'show-more'), h("atomic-icon", { icon: ArrowDown, class: "ml-2 w-3 align-baseline" })));
     }
     render() {
-        return (h(Host, { key: '645b95297bb1d6f7fcffa20e7a125a9bde1ee22c', class: this.fullHeight || !this.shouldRenderButton
+        return (h(Host, { key: 'f54077986855f352d54274719926b720d67666f4', class: this.fullHeight || !this.shouldRenderButton
                 ? this.isExpanded
                     ? 'expanded'
                     : ''
-                : 'invisible' }, h("div", { key: 'd55d778beaf9212aea559cb4b9a691eb44c27e5d', part: "smart-snippet-collapse-wrapper", class: "block overflow-hidden" }, h("slot", { key: '4de0f0d9432cf0172323c093216223692662bafb' })), this.shouldRenderButton && this.renderButton()));
+                : 'invisible' }, h("div", { key: '50da7008c14259a00157127af608164375ac6fee', part: "smart-snippet-collapse-wrapper", class: "block overflow-hidden" }, h("slot", { key: 'c6e9c1299180b61315c6727ff44f594b55d73843' })), this.shouldRenderButton && this.renderButton()));
     }
     get host() { return this; }
     static get style() { return AtomicSmartSnippetCollapseWrapperStyle0; }

package/dist/atomic/components/atomic-smart-snippet-expandable-answer2.js

@@ -87,7 +87,7 @@ const AtomicSmartSnippetExpandableAnswer = /*@__PURE__*/ proxyCustomElement(clas
         return (h("button", { onClick: () => this.isExpanded ? this.collapse.emit() : this.expand.emit(), class: "text-primary mb-4 hover:underline", part: this.isExpanded ? 'show-less-button' : 'show-more-button' }, this.bindings.i18n.t(this.isExpanded ? 'show-less' : 'show-more'), h("atomic-icon", { icon: ArrowDown, class: "ml-2 w-3 align-baseline" })));
     }
     render() {
-        return (h("div", { key: '311ce5272afaf23c8f8ac80bb85bb955f7e82022', class: this.isExpanded ? 'expanded' : '' }, this.renderAnswer(), this.renderButton()));
+        return (h("div", { key: '19443f9310f0a6705f7f55eb74f7383ae7ff98bf', class: this.isExpanded ? 'expanded' : '' }, this.renderAnswer(), this.renderButton()));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/atomic/components/atomic-smart-snippet-feedback-modal2.js

@@ -43,9 +43,9 @@ const AtomicSmartSnippetFeedbackModal = /*@__PURE__*/ proxyCustomElement(class A
     }
     render() {
         updateBreakpoints(this.host);
-        return (h("atomic-modal", { key: 'c587543ffb9a18313185e112686739f6b157915b', fullscreen: false, source: this.source, container: this.host, isOpen: this.isOpen, close: () => this.close(), exportparts: ATOMIC_MODAL_EXPORT_PARTS }, h(SmartSnippetFeedbackModalHeader, { key: '4b66f9362a410e047bf00cec40f49634de75967d', i18n: this.bindings.i18n }), h(SmartSnippetFeedbackModalBody, { key: 'b0b37d0ed08a77931704769f90d328ae0649fcd1', formId: this.formId, onSubmit: (e) => this.sendFeedback(e) }, h(SmartSnippetFeebackModalOptions, { key: 'e2010f65820b87e18ce6966bd34b0435fabdbe86', i18n: this.bindings.i18n }, smartSnippetFeedbackOptions.map(({ id, localeKey, correspondingAnswer }) => (h(SmartSnippetFeedbackModalOption, { correspondingAnswer: correspondingAnswer, currentAnswer: this.currentAnswer, i18n: this.bindings.i18n, id: id, localeKey: localeKey, onChange: () => {
+        return (h("atomic-modal", { key: 'fccd069b2c45bf7e14d51654d375b8bd41504d07', fullscreen: false, source: this.source, container: this.host, isOpen: this.isOpen, close: () => this.close(), exportparts: ATOMIC_MODAL_EXPORT_PARTS }, h(SmartSnippetFeedbackModalHeader, { key: '10fe706ebe195c1e5b242c7eff7bf5816c48a82e', i18n: this.bindings.i18n }), h(SmartSnippetFeedbackModalBody, { key: 'bcd2f185ac47ac85c441b935eea1c9b3e91aae9b', formId: this.formId, onSubmit: (e) => this.sendFeedback(e) }, h(SmartSnippetFeebackModalOptions, { key: 'e3fb4765abb2ca7088fbc8917cb9ef7e5877622c', i18n: this.bindings.i18n }, smartSnippetFeedbackOptions.map(({ id, localeKey, correspondingAnswer }) => (h(SmartSnippetFeedbackModalOption, { correspondingAnswer: correspondingAnswer, currentAnswer: this.currentAnswer, i18n: this.bindings.i18n, id: id, localeKey: localeKey, onChange: () => {
                 this.currentAnswer = correspondingAnswer;
-            } })))), h(SmartSnippetFeedbackModalDetails, { key: 'c21d230fbe0a1dc6f2d7346361cc8fa80bdd2c36', currentAnswer: this.currentAnswer, i18n: this.bindings.i18n, setDetailsInputRef: (ref) => (this.detailsInputRef = ref) })), h(SmartSnippetFeedbackModalFooter, { key: 'bf3639d3290de47267e2727c6b4b3a9448c86759', formId: this.formId, i18n: this.bindings.i18n, onClick: () => this.close() })));
+            } })))), h(SmartSnippetFeedbackModalDetails, { key: 'c34b35c68d485dac9e6812d33c524d14bb8e56f3', currentAnswer: this.currentAnswer, i18n: this.bindings.i18n, setDetailsInputRef: (ref) => (this.detailsInputRef = ref) })), h(SmartSnippetFeedbackModalFooter, { key: '937338ef8608a5c01130f592386bb07f858c960a', formId: this.formId, i18n: this.bindings.i18n, onClick: () => this.close() })));
     }
     close() {
         this.isOpen = false;

package/dist/atomic/components/atomic-smart-snippet-source2.js

@@ -33,7 +33,7 @@ const AtomicSmartSnippetSource = /*@__PURE__*/ proxyCustomElement(class AtomicSm
         }
     }
     render() {
-        return (h(Host, { key: '96792749116f1972051903cc58c5d1dbb5ce4abf' }, h(LinkWithItemAnalytics, { key: 'd5f10f307c3647095dbef5086762d2518ed1a8dd', title: this.source.clickUri, href: this.source.clickUri, className: "block truncate", part: "source-url", attributes: this.anchorAttributes, onSelect: () => this.selectSource.emit(), onBeginDelayedSelect: () => this.beginDelayedSelectSource.emit(), onCancelPendingSelect: () => this.cancelPendingSelectSource.emit() }, this.source.clickUri), h(LinkWithItemAnalytics, { key: 'bd1e1ad6cf93f0cd5ca638f41c8fd0ed1bb02ea2', title: this.source.title, href: this.source.clickUri, attributes: this.anchorAttributes, className: "block", part: "source-title", onSelect: () => this.selectSource.emit(), onBeginDelayedSelect: () => this.beginDelayedSelectSource.emit(), onCancelPendingSelect: () => this.cancelPendingSelectSource.emit() }, h("atomic-result-text", { field: "title", default: "no-title", key: this.source.uniqueId }))));
+        return (h(Host, { key: '01141ee8feb5120848bdd8932943a34c4cc39314' }, h(LinkWithItemAnalytics, { key: '824f2a0b8166ff4f785c2c03e68e4a8e57f96df8', title: this.source.clickUri, href: this.source.clickUri, className: "block truncate", part: "source-url", attributes: this.anchorAttributes, onSelect: () => this.selectSource.emit(), onBeginDelayedSelect: () => this.beginDelayedSelectSource.emit(), onCancelPendingSelect: () => this.cancelPendingSelectSource.emit() }, this.source.clickUri), h(LinkWithItemAnalytics, { key: '509f68c6ccc999f50522cfc7c24e6ee90e0974f2', title: this.source.title, href: this.source.clickUri, attributes: this.anchorAttributes, className: "block", part: "source-title", onSelect: () => this.selectSource.emit(), onBeginDelayedSelect: () => this.beginDelayedSelectSource.emit(), onCancelPendingSelect: () => this.cancelPendingSelectSource.emit() }, h("atomic-result-text", { field: "title", default: "no-title", key: this.source.uniqueId }))));
     }
 }, [0, "atomic-smart-snippet-source", {
         "source": [1040],

package/dist/atomic/components/atomic-sort-dropdown.js

@@ -117,8 +117,8 @@ const AtomicSortDropdown$1 = /*@__PURE__*/ proxyCustomElement(class AtomicSortDr
         const { hasError, hasResults, firstSearchExecuted } = this.searchStatusState;
         const { bindings: { i18n }, id, } = this;
         return [
-            h(SortGuard, { key: '00c9898487df32ef1748e32d2e76d7d94181e7fd', firstSearchExecuted: firstSearchExecuted, hasError: hasError, hasResults: hasResults }, h(SortContainer, { key: 'a78b7ecda574b86e31e7a104a076cf22ae37216c' }, h(SortLabel, { key: 'e8fb5995619b06ca6057a456dd12de565320485e', i18n: i18n, id: id }), h(SortSelect, { key: '35999c1e1d4af07b597b7fcc88ece68244f03a7d', i18n: i18n, id: id, onSelect: (evt) => this.select(evt) }, this.options.map(({ label, criteria, expression }) => (h(SortOption, { i18n: i18n, label: label, selected: this.sort.isSortedBy(criteria), value: expression })))))),
-            h("slot", { key: '665df044cedf46b559b9720ce71a76fb376873e1' }),
+            h(SortGuard, { key: '66f0c9de176fd2c9cb547d369f10fa3416d9a5fd', firstSearchExecuted: firstSearchExecuted, hasError: hasError, hasResults: hasResults }, h(SortContainer, { key: '5b3008b4f26abdeee78d2cd964d137f8001ad251' }, h(SortLabel, { key: '3f94d35e35aba4ec3f98711e33464327ba491174', i18n: i18n, id: id }), h(SortSelect, { key: '2c905601b8771fef1b74855608f4d28ece6bf662', i18n: i18n, id: id, onSelect: (evt) => this.select(evt) }, this.options.map(({ label, criteria, expression }) => (h(SortOption, { i18n: i18n, label: label, selected: this.sort.isSortedBy(criteria), value: expression })))))),
+            h("slot", { key: '6f21e177b858af29840e03dcfe0c3e932753b3a0' }),
         ];
     }
     get host() { return this; }

package/dist/atomic/components/atomic-sort-expression.js

@@ -47,7 +47,7 @@ const AtomicSortExpression$1 = /*@__PURE__*/ proxyCustomElement(class AtomicSort
         const dropdownComponent = 'atomic-sort-dropdown';
         if (!this.host.closest(dropdownComponent)) {
             const error = new Error(`The "${this.host.nodeName.toLowerCase()}" component has to be used inside an ${dropdownComponent} element.`);
-            return (h("atomic-component-error", { key: 'd52a918ec46b88b093adb54eac2e9295538a82a1', element: this.host, error: error }));
+            return (h("atomic-component-error", { key: '3b2db477a74789f11e9423b37104e5c27e30e61f', element: this.host, error: error }));
         }
     }
     get host() { return this; }

package/dist/atomic/components/atomic-stencil-facet-date-input.js

@@ -66,13 +66,13 @@ const FacetDateInput = /*@__PURE__*/ proxyCustomElement(class FacetDateInput ext
         // Fallback for Safari < 14.1, date with format yyyy-mm-dd over 1400 (API limit)
         const pattern = '^(1[4-9]\\d{2}|2\\d{3})-(0[1-9]|1[0-2])-(0[1-9]|[12]\\d|3[01])$';
         const range = this.rangeGetter();
-        return (h("form", { key: '44e7366f894057448e7973eff257888f86cf9c10', class: "mt-4 grid grid-cols-[min-content_1fr] gap-2 px-2", onSubmit: (e) => {
+        return (h("form", { key: '60acc60ec8b30e3eaa4d0e2e1426732925ff352c', class: "mt-4 grid grid-cols-[min-content_1fr] gap-2 px-2", onSubmit: (e) => {
                 e.preventDefault();
                 this.apply();
                 return false;
-            } }, h("label", { key: '86dce4f7e03bc309c9db6a2def796a4a5a613cfd', part: "input-label", class: labelClasses, htmlFor: `${this.facetId}_start` }, startLabel, ":"), h("input", { key: 'c3fb0f5642b53d6377d4dc43949aef4221fad6c8', id: `${this.facetId}_start`, part: "input-start", type: "date", ref: (ref) => (this.startRef = ref), class: inputClasses, "aria-label": startAria, placeholder: placeholder, pattern: pattern, required: true,
+            } }, h("label", { key: 'a43bd6b7f3ae352a7592e9de3390e5b8e180cb29', part: "input-label", class: labelClasses, htmlFor: `${this.facetId}_start` }, startLabel, ":"), h("input", { key: '7908bdd17fb8d035d2b75ab02417b13cd1516bd2', id: `${this.facetId}_start`, part: "input-start", type: "date", ref: (ref) => (this.startRef = ref), class: inputClasses, "aria-label": startAria, placeholder: placeholder, pattern: pattern, required: true,
             // API/Index minimum supported date
-            min: this.min || this.formattedDateValue('1401-01-01'), max: this.end ? this.formattedDateValue(this.end) : this.max, value: this.formattedDateValue(range?.start), onInput: (e) => (this.start = parseDate(e.target.value).toDate()) }), h("label", { key: '43ed82c6eca183be159813d44f51c732413dcaaa', part: "input-label", class: labelClasses, htmlFor: `${this.facetId}_end` }, endLabel, ":"), h("input", { key: '51352a0b076687d08364d3e21f641298f02c8ab3', id: `${this.facetId}_end`, part: "input-end", type: "date", ref: (ref) => (this.endRef = ref), class: inputClasses, "aria-label": endAria, placeholder: placeholder, pattern: pattern, required: true, min: this.formattedDateValue(this.start) || this.min, max: this.max, value: this.formattedDateValue(range?.end), onInput: (e) => (this.end = parseDate(e.target.value).toDate()) }), h(Button, { key: '74d042dc073534c62f16e2be356f1deafca98a9a', style: "outline-primary", type: "submit", part: "input-apply-button", class: "col-span-2 truncate p-2.5", ariaLabel: applyAria, text: apply })));
+            min: this.min || this.formattedDateValue('1401-01-01'), max: this.end ? this.formattedDateValue(this.end) : this.max, value: this.formattedDateValue(range?.start), onInput: (e) => (this.start = parseDate(e.target.value).toDate()) }), h("label", { key: 'd5d35be72e99ae7488fae004a61682d597ab7d7f', part: "input-label", class: labelClasses, htmlFor: `${this.facetId}_end` }, endLabel, ":"), h("input", { key: 'b6b30c327c78cecef22c0b6eeec8cbf29b1d711a', id: `${this.facetId}_end`, part: "input-end", type: "date", ref: (ref) => (this.endRef = ref), class: inputClasses, "aria-label": endAria, placeholder: placeholder, pattern: pattern, required: true, min: this.formattedDateValue(this.start) || this.min, max: this.max, value: this.formattedDateValue(range?.end), onInput: (e) => (this.end = parseDate(e.target.value).toDate()) }), h(Button, { key: 'd0b34163e43a90cf982155bf7eeb315212c9e1d2', style: "outline-primary", type: "submit", part: "input-apply-button", class: "col-span-2 truncate p-2.5", ariaLabel: applyAria, text: apply })));
     }
 }, [0, "atomic-stencil-facet-date-input", {
         "bindings": [16],

package/dist/atomic/components/atomic-suggestion-renderer2.js

@@ -80,7 +80,7 @@ const AtomicSuggestionRenderer = /*@__PURE__*/ proxyCustomElement(class AtomicSu
     }
     render() {
         const isButton = !!(this.suggestion.onSelect || this.suggestion.query);
-        return (h(Host, { key: 'c4dfadd01e3dda6b755a6c4f7883705683043fc6', class: "contents" }, isButton ? (h("button", { id: this.id, key: this.suggestion.key, part: this.parts, class: this.classes, onMouseDown: (e) => e.preventDefault(), onClick: (e) => this.onClick?.(e), onMouseOver: (e) => this.onMouseOver?.(e), "data-query": this.suggestion.query, "aria-label": this.ariaLabel(isButton), ref: (el) => {
+        return (h(Host, { key: 'c332ae13efeac08cbbad4bdb4d86f15f3400ea60', class: "contents" }, isButton ? (h("button", { id: this.id, key: this.suggestion.key, part: this.parts, class: this.classes, onMouseDown: (e) => e.preventDefault(), onClick: (e) => this.onClick?.(e), onMouseOver: (e) => this.onMouseOver?.(e), "data-query": this.suggestion.query, "aria-label": this.ariaLabel(isButton), ref: (el) => {
                 if (!el) {
                     return;
                 }

package/dist/atomic/components/atomic-tab-manager.js

@@ -59,7 +59,7 @@ const AtomicTabManager$1 = /*@__PURE__*/ proxyCustomElement(class AtomicTabManag
         });
     }
     render() {
-        return (h(Host, { key: '0c04e8919712039a5c273b61e2e5babb21ed4354' }, h("atomic-tab-bar", { key: '13dde2d89d24822933497d3f0c283deee6144b82' }, h("div", { key: 'ff96e6a1c77b0e2579839a81c20dfbaeb0db54a3', role: "list", "aria-label": "tab-area", part: "tab-area", class: "border-neutral mb-2 flex w-full flex-row border-b" }, this.tabs.map((tab) => (h("atomic-tab-button", { active: this.tabManagerState.activeTab === tab.name, label: this.bindings.i18n.t(tab.label, {
+        return (h(Host, { key: '4530028bc53f31ae55c59cb476942e8b5e93ad1b' }, h("atomic-tab-bar", { key: 'c698720cc485471ec0c320b8d4ffbe32736e7028' }, h("div", { key: '9eed11f8457ca0fc6a6781eaf3fc8b6f510d1ea9', role: "list", "aria-label": "tab-area", part: "tab-area", class: "border-neutral mb-2 flex w-full flex-row border-b" }, this.tabs.map((tab) => (h("atomic-tab-button", { active: this.tabManagerState.activeTab === tab.name, label: this.bindings.i18n.t(tab.label, {
                 defaultValue: tab.label,
             }), select: () => {
                 if (!tab.tabController.state.isActive) {

package/dist/atomic/components/components/commerce/atomic-commerce-breadbox/atomic-commerce-breadbox.js

@@ -8,6 +8,15 @@ import { NumberValue, Schema } from '@coveo/bueno';
 import { buildContext, buildProductListing, buildSearch, } from '@coveo/headless/commerce';
 import { html, LitElement, nothing } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
+import { renderBreadcrumbButton } from "../../common/breadbox/breadcrumb-button";
+import { renderBreadcrumbClearAll } from "../../common/breadbox/breadcrumb-clear-all";
+import { renderBreadcrumbContainer } from "../../common/breadbox/breadcrumb-container";
+import { renderBreadcrumbContent } from "../../common/breadbox/breadcrumb-content";
+import { renderBreadcrumbShowLess } from "../../common/breadbox/breadcrumb-show-less";
+import { renderBreadcrumbShowMore } from "../../common/breadbox/breadcrumb-show-more";
+import { formatHumanReadable } from "../../common/facets/numeric-facet/formatter";
+import { defaultCurrencyFormatter, defaultNumberFormatter, } from "../../common/formats/format-common";
+import { ValidatePropsController } from "../../common/validate-props-controller/validate-props-controller";
 import { bindStateToController } from "../../../decorators/bind-state";
 import { bindingGuard } from "../../../decorators/binding-guard";
 import { bindings } from "../../../decorators/bindings";
@@ -16,14 +25,6 @@ import { withTailwindStyles } from "../../../decorators/with-tailwind-styles.js"
 import { FocusTargetController } from "../../../utils/accessibility-utils";
 import { parseDate } from "../../../utils/date-utils";
 import { getFieldValueCaption } from "../../../utils/field-utils";
-import { renderBreadcrumbButton } from '../../common/breadbox/breadcrumb-button';
-import { renderBreadcrumbClearAll } from '../../common/breadbox/breadcrumb-clear-all';
-import { renderBreadcrumbContainer } from '../../common/breadbox/breadcrumb-container';
-import { renderBreadcrumbContent } from '../../common/breadbox/breadcrumb-content';
-import { renderBreadcrumbShowLess } from '../../common/breadbox/breadcrumb-show-less';
-import { renderBreadcrumbShowMore } from '../../common/breadbox/breadcrumb-show-more';
-import { formatHumanReadable } from '../../common/facets/numeric-facet/formatter';
-import { defaultCurrencyFormatter, defaultNumberFormatter, } from '../../common/formats/format-common';
 import styles from './atomic-commerce-breadbox.tw.css';
 /**
  * The `atomic-commerce-breadbox` component creates breadcrumbs that display a summary of the currently active facet values.
@@ -42,7 +43,7 @@ import styles from './atomic-commerce-breadbox.tw.css';
  */
 let AtomicCommerceBreadbox = class AtomicCommerceBreadbox extends LitElement {
     constructor() {
-        super(...arguments);
+        super();
         this.lastRemovedBreadcrumbIndex = 0;
         this.numberOfBreadcrumbs = 0;
         this.numberOfCollapsedBreadcrumbs = 0;
@@ -96,9 +97,15 @@ let AtomicCommerceBreadbox = class AtomicCommerceBreadbox extends LitElement {
                 }
             }
         };
+        new ValidatePropsController(this, () => ({ pathLimit: this.pathLimit }), new Schema({
+            pathLimit: new NumberValue({
+                default: 3,
+                min: 1,
+                required: false,
+            }),
+        }));
     }
     initialize() {
-        this.validateProps();
         if (this.bindings.interfaceElement.type === 'product-listing') {
             this.searchOrListing = buildProductListing(this.bindings.engine);
         }
@@ -115,31 +122,9 @@ let AtomicCommerceBreadbox = class AtomicCommerceBreadbox extends LitElement {
         this.breadcrumbShowMoreFocus = new FocusTargetController(this, this.bindings);
         this.breadcrumbShowLessFocus = new FocusTargetController(this, this.bindings);
     }
-    willUpdate(changedProperties) {
-        if (changedProperties.has('pathLimit')) {
-            this.validateProps();
-        }
-    }
     updated() {
         this.adaptBreadcrumbs();
     }
-    validateProps() {
-        try {
-            new Schema({
-                pathLimit: new NumberValue({
-                    default: 3,
-                    min: 1,
-                    required: false,
-                }),
-            }).validate({
-                pathLimit: this.pathLimit,
-            });
-        }
-        catch (error) {
-            this.error = error;
-            return;
-        }
-    }
     disconnectedCallback() {
         this.resizeObserver?.disconnect();
     }