@coveo/atomic 3.34.0-pre.4c6dc408dd → 3.34.0-pre.4f2ee671ee

package/dist/atomic/components/components/common/layout/custom-render-controller.js

@@ -0,0 +1,37 @@
+/**
+ * A reactive controller that manages custom rendering function execution for item components.
+ */
+export class CustomRenderController {
+    constructor(host, options) {
+        this.hasExecutedRenderFunction = false;
+        this.options = {
+            linkContainerRef: () => undefined,
+            onRenderComplete: () => { },
+            ...options,
+        };
+        host.addController(this);
+    }
+    hostConnected() {
+        this.resetRenderState();
+    }
+    hostUpdated() {
+        this.executeRenderFunction();
+    }
+    resetRenderState() {
+        this.hasExecutedRenderFunction = false;
+    }
+    executeRenderFunction() {
+        const renderingFunction = this.options.renderingFunction();
+        const itemData = this.options.itemData();
+        const rootElementRef = this.options.rootElementRef();
+        if (!renderingFunction ||
+            !itemData ||
+            !rootElementRef ||
+            this.hasExecutedRenderFunction) {
+            return;
+        }
+        const customRenderOutput = renderingFunction(itemData, rootElementRef, this.options.linkContainerRef());
+        this.options.onRenderComplete(rootElementRef, customRenderOutput);
+        this.hasExecutedRenderFunction = true;
+    }
+}

package/dist/atomic/components/components/common/layout/display-options.js

@@ -1,4 +1,4 @@
-import { containsSections } from './sections';
+import { containsSections, } from './item-layout-sections';
 function getDisplayClass(display) {
     switch (display) {
         case 'grid':

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

@@ -0,0 +1,103 @@
+import { ItemLayout, } from './display-options';
+/**
+ * A reactive controller that manages layout creation and class application for item components.
+ */
+export class ItemLayoutController {
+    constructor(host, options) {
+        this.layoutInstance = null;
+        this.host = host;
+        this.options = {
+            ...options,
+        };
+        host.addController(this);
+    }
+    hostConnected() {
+        this.createLayout();
+    }
+    hostUpdated() {
+        this.applyLayoutClasses();
+    }
+    /**
+     * Gets the current layout instance
+     */
+    getLayout() {
+        return this.layoutInstance;
+    }
+    /**
+     * Gets combined layout and extra classes
+     */
+    getCombinedClasses(additionalContent) {
+        const layout = this.getLayout();
+        const layoutClasses = layout ? layout.getClasses(additionalContent) : [];
+        const itemClasses = this.options
+            .itemClasses()
+            .split(/\s+/)
+            .filter((c) => c);
+        return [...layoutClasses, ...itemClasses];
+    }
+    /**
+     * Applies layout classes to a specific element (useful for custom rendering)
+     */
+    applyLayoutClassesToElement(element, additionalContent) {
+        const layout = this.getLayout();
+        if (!layout) {
+            return;
+        }
+        const classes = this.getCombinedClasses(additionalContent);
+        if (classes.length > 0) {
+            element.classList.add(...classes);
+        }
+    }
+    applyLayoutClasses() {
+        const layout = this.getLayout();
+        if (!layout) {
+            return;
+        }
+        const classes = this.getCombinedClasses();
+        const root = this.host.shadowRoot?.querySelector('.result-root');
+        if (!root || classes.length === 0) {
+            return;
+        }
+        if (this.hasCustomRenderFunction()) {
+            this.observeAndApplyClasses(root, classes);
+        }
+        else {
+            this.addClassesToElements(root, classes);
+        }
+    }
+    createLayout() {
+        const content = this.options.content();
+        if (!content) {
+            console.warn(`${this.options.elementPrefix}: content property is undefined. Cannot create layout.`, this.host);
+            this.layoutInstance = null;
+            return;
+        }
+        const config = this.options.layoutConfig();
+        this.layoutInstance = new ItemLayout(content.children, config.display, config.density, config.imageSize);
+    }
+    hasCustomRenderFunction() {
+        return this.options.renderingFunction() !== undefined;
+    }
+    addClassesToElements(root, classes) {
+        if (classes.length === 0) {
+            return;
+        }
+        const elements = root.querySelectorAll('*');
+        elements.forEach((element) => {
+            const tagName = element.tagName.toLowerCase();
+            if (tagName.startsWith(`${this.options.elementPrefix}-`)) {
+                element.classList.add(...classes);
+            }
+        });
+    }
+    observeAndApplyClasses(root, classes) {
+        const observer = new MutationObserver((mutations) => {
+            const hasNewElements = mutations.some((mutation) => mutation.type === 'childList' && mutation.addedNodes.length > 0);
+            if (hasNewElements) {
+                this.addClassesToElements(root, classes);
+                observer.disconnect();
+            }
+        });
+        observer.observe(root, { childList: true, subtree: true });
+    }
+}

package/dist/atomic/components/components/common/layout/{sections.js → item-layout-sections.js}

@@ -1,4 +1,4 @@
-import { isElementNode } from '../../../utils/utils';
+import { isElementNode } from "../../../utils/utils";
 const resultSectionTags = new Set([
     'atomic-result-section-visual',
     'atomic-result-section-badges',

package/dist/atomic/components/components/common/product-template/product-template-common.js

@@ -2,7 +2,7 @@ import { ProductTemplatesHelpers, } from '@coveo/headless/commerce';
 import { intersection } from '../../../utils/set';
 import { isElementNode, isVisualNode } from '../../../utils/utils';
 import { tableElementTagName } from '../../search/atomic-table-result/table-element-utils';
-import { isResultSectionNode } from '../layout/sections';
+import { isResultSectionNode } from '../layout/item-layout-sections';
 export function getTemplateNodeType(node) {
     if (isResultSectionNode(node)) {
         return 'section';

package/dist/atomic/components/components/insight/atomic-insight-layout/insight-layout.js

@@ -1,4 +1,4 @@
-import { findSection, sectionSelector, } from '../../common/atomic-layout-section/sections';
+import { findSection, sectionSelector, } from '../../common/atomic-layout-section/atomic-layout-section-utils';
 const tabsSelector = 'atomic-insight-tabs';
 const refineModalSelector = 'atomic-insight-refine-modal';
 const searchBoxSelector = 'atomic-insight-search-box';

package/dist/atomic/components/components/search/atomic-result-section-actions/atomic-result-section-actions.js

@@ -0,0 +1,25 @@
+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 { css, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section allows the information seeker to perform an action on an item without having to view its details.
+ * For example, in Commerce you can add an item to the cart directly or add it to a wish list to view at a later time.
+ *
+ * Behavior:
+ * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.
+ * ** You should ensure that elements inside of it have `height: var(--line-height)`.
+ * * Is a wrapping flexbox with a gap.
+ * * May appear over, next to, or beneath the visual section.
+ */
+let AtomicResultSectionActions = class AtomicResultSectionActions extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */atomic-result-section-actions{text-align:left;&.with-sections{overflow:hidden;text-overflow:ellipsis}&.with-sections{display:flex;flex-wrap:wrap;gap:.5rem;grid-area:actions;max-height:calc(var(--row-height, 2rem)*2 + .5rem);--row-height:2rem;atomic-result-quickview{display:inline-block}@media (width >= 1024px){&.display-list{&.density-comfortable{margin-bottom:1.5rem}&.density-compact,&.density-normal{margin-bottom:1rem}}&.display-grid{&.density-comfortable{margin-top:2.25rem;--row-height:2.5rem}&.density-normal{margin-top:1.75rem}&.density-compact,&.density-normal{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}&.density-compact{margin-top:1.25rem}}}@media not all and (width >= 1024px){&.display-list{--row-height:2.5rem;&.density-comfortable{margin-top:1rem}&.density-normal{margin-top:.75rem}&.density-compact{margin-top:.5em}}&.display-grid{&.image-large{--row-height:2.5rem;&.density-comfortable{margin-top:1rem}&.density-normal{margin-top:.75rem}&.density-compact{margin-top:.5em}}&.image-icon,&.image-none,&.image-small{&.density-comfortable{margin-top:1.25rem}&.density-normal{margin-top:1rem}&.density-compact{margin-top:.75rem}}}}&.display-table{&.density-comfortable{margin-bottom:1.5rem}&.density-compact,&.density-normal{margin-bottom:1rem}}}}`) {
+};
+AtomicResultSectionActions = __decorate([
+    customElement('atomic-result-section-actions')
+], AtomicResultSectionActions);
+export { AtomicResultSectionActions };

package/dist/atomic/components/components/search/atomic-result-section-badges/atomic-result-section-badges.js

@@ -0,0 +1,24 @@
+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 { css, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section provides badges that highlight special features of the item.
+ *
+ * Behavior:
+ * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.
+ * ** You should ensure that elements inside of it have `height: var(--line-height)`.
+ * * Is a wrapping flexbox with a gap.
+ * * May appear over, next to, or beneath the visual section.
+ */
+let AtomicResultSectionBadges = class AtomicResultSectionBadges extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */atomic-result-section-badges{text-align:left;&.with-sections{overflow:hidden;text-overflow:ellipsis}&.with-sections{display:flex;flex-wrap:wrap;gap:.5rem;grid-area:badges;margin-bottom:1rem;max-height:calc(var(--row-height, 2rem)*2 + .5rem);--row-height:2rem;@media (width >= 1024px){&.display-list{&.density-comfortable{margin-bottom:1.5rem}}&.display-grid{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);&.image-icon{&.density-comfortable{margin-bottom:2rem}&.density-normal{margin-bottom:1.5rem}}}}@media not all and (width >= 1024px){&.display-list{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}&.display-grid{&.image-icon,&.image-none,&.image-small{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}}}&.display-table{&.density-comfortable{margin-bottom:1.5rem}}}}`) {
+};
+AtomicResultSectionBadges = __decorate([
+    customElement('atomic-result-section-badges')
+], AtomicResultSectionBadges);
+export { AtomicResultSectionBadges };

package/dist/atomic/components/components/search/atomic-result-section-bottom-metadata/atomic-result-section-bottom-metadata.js

@@ -0,0 +1,25 @@
+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 { css, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section displays additional descriptive information about the item.
+ *
+ * Behavior:
+ * * Has a maximum height of two lines.
+ * ** We recommend that you use `atomic-result-fields-list` to ensure that the fields in this section don’t overflow.
+ * * Exposes the `--line-height` variable so child elements can adjust to the current line height.
+ * * Has a defined CSS `color` property for text.
+ * * Has a font weight.
+ */
+let AtomicResultSectionBottomMetadata = class AtomicResultSectionBottomMetadata extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */atomic-result-section-bottom-metadata{&.with-sections{overflow:hidden;text-overflow:ellipsis}&.with-sections{color:var(--atomic-neutral-dark);grid-area:bottom-metadata;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);@media (width >= 1024px){&.display-list{&.density-comfortable{margin-top:1.25rem;max-height:4rem}&.density-normal{margin-top:.875rem;max-height:3.5rem}&.density-compact{margin-top:.6875rem;max-height:3.25rem}}&.display-grid{&.density-comfortable{margin-top:1.75rem;max-height:4rem}&.density-normal{margin-top:1.375rem;max-height:3.5rem}&.density-compact{margin-top:.9375rem;max-height:3.25rem}}}@media not all and (width >= 1024px){&.display-list{&.density-comfortable{margin-top:.75rem;max-height:4rem}&.density-normal{margin-top:.625rem;max-height:3.5rem}&.density-compact{margin-top:.4375rem;max-height:3.25rem}}&.display-grid{&.image-large{&.density-comfortable{margin-top:.75rem;max-height:4rem}&.density-normal{margin-top:.625rem;max-height:3.5rem}&.density-compact{margin-top:.4375rem;max-height:3.25rem}}&.image-icon,&.image-none,&.image-small{max-height:3rem;&.density-comfortable{margin-top:1rem}&.density-normal{margin-top:.75rem}&.density-compact{margin-top:.5rem}}}}&.display-table{&.density-comfortable{margin-top:1.25rem;max-height:4rem}&.density-normal{margin-top:.875rem;max-height:3.5rem}&.density-compact{margin-top:.6875rem;max-height:3.25rem}}}}`) {
+};
+AtomicResultSectionBottomMetadata = __decorate([
+    customElement('atomic-result-section-bottom-metadata')
+], AtomicResultSectionBottomMetadata);
+export { AtomicResultSectionBottomMetadata };

package/dist/atomic/components/components/search/atomic-result-section-children/atomic-result-section-children.js

@@ -0,0 +1,21 @@
+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 { css, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section displays the folded results, available when using the <atomic-result-children> component.
+ *
+ * Behavior:
+ * * Shows children at the bottom of the result, indented and wrapped in a border.
+ */
+let AtomicResultSectionChildren = class AtomicResultSectionChildren extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer properties;atomic-result-section-children{&.with-sections{grid-area:children;@media (width >= 1024px){&.display-list{atomic-insight-result-children::part(children-root),atomic-result-children::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px}&.density-comfortable{atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:1.25rem;padding:1.75rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.75rem}}&.density-normal{margin-top:1rem;atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.875rem;padding:1.5rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.5rem}}&.density-compact{margin-top:.75rem;atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.475rem;padding:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1rem}}}}@media not all and (width >= 1024px){&.display-list{atomic-insight-result-children::part(children-root),atomic-result-children::part(children-root){border-top:1px var(--tw-border-style) var(--atomic-neutral)}}&.display-grid{&.image-large{atomic-insight-result-children::part(children-root),atomic-result-children::part(children-root){border-top:1px var(--tw-border-style) var(--atomic-neutral)}}&.image-icon,&.image-none,&.image-small{&.density-comfortable{margin-top:1.25rem;atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:calc(var(--spacing, .25rem)*-4);margin-top:calc(var(--spacing, .25rem)*4);padding-top:1.75rem;padding-inline:calc(var(--spacing, .25rem)*4)}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.75rem}}&.density-normal{margin-top:1rem;atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:calc(var(--spacing, .25rem)*-4);margin-top:calc(var(--spacing, .25rem)*4);padding-top:1.5rem;padding-inline:calc(var(--spacing, .25rem)*4)}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.5rem}}&.density-compact{margin-top:.75rem;atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:calc(var(--spacing, .25rem)*-4);margin-top:calc(var(--spacing, .25rem)*4);padding-top:1rem;padding-inline:calc(var(--spacing, .25rem)*4)}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1rem}}}}}&.display-table{atomic-insight-result-children::part(children-root),atomic-result-children::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px}&.density-comfortable{atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:1.25rem;padding:1.75rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.75rem}}&.density-normal{margin-top:1rem;atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.875rem;padding:1.5rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.5rem}}&.density-compact{margin-top:.75rem;atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.475rem;padding:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1rem}}}}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-border-style:solid}}}`) {
+};
+AtomicResultSectionChildren = __decorate([
+    customElement('atomic-result-section-children')
+], AtomicResultSectionChildren);
+export { AtomicResultSectionChildren };

package/dist/atomic/components/components/search/atomic-result-section-emphasized/atomic-result-section-emphasized.js

@@ -0,0 +1,23 @@
+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 { css, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section displays the field that's important for its search criteria.
+ * For example, in Commerce, a product's cost is often more important than the title itself.
+ *
+ * Behavior:
+ * * Has a very large font size.
+ * * Is the second closest element beneath the title section.
+ */
+let AtomicResultSectionEmphasized = class AtomicResultSectionEmphasized extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.5rem;&.with-sections{grid-area:emphasized;overflow:hidden;text-overflow:ellipsis}}`) {
+};
+AtomicResultSectionEmphasized = __decorate([
+    customElement('atomic-result-section-emphasized')
+], AtomicResultSectionEmphasized);
+export { AtomicResultSectionEmphasized };

package/dist/atomic/components/components/search/atomic-result-section-excerpt/atomic-result-section-excerpt.js

@@ -0,0 +1,24 @@
+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 { css, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section contains an informative summary of the item's content.
+ *
+ * Behavior:
+ * * Has a fixed height of one to three lines, depending on the layout and density.
+ * * Ellipses overflowing text.
+ * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.
+ * * Has a defined CSS `color` property for text.
+ */
+let AtomicResultSectionExcerpt = class AtomicResultSectionExcerpt extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */atomic-result-section-excerpt{&.with-sections{text-overflow:ellipsis}&.with-sections{color:var(--atomic-neutral-dark);display:-webkit-box;grid-area:excerpt;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;@media (width >= 1024px){&.density-comfortable{--font-size:var(--atomic-text-lg);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);-webkit-line-clamp:3}&.density-comfortable,&.density-compact{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical}&.density-compact{-webkit-line-clamp:1}&.display-list{&.density-comfortable{margin-top:1.75rem;max-height:4.5rem}&.density-normal{margin-top:1.25rem;max-height:2.5rem}&.density-compact{margin-top:1rem;max-height:1.25rem}}&.display-grid{&.density-comfortable{margin-top:2.25rem}&.density-normal{margin-top:1.75rem}&.density-compact{margin-top:1.25rem}}}@media not all and (width >= 1024px){&.display-list{&.density-comfortable,&.density-normal{max-height:2.5rem}&.density-comfortable{margin-top:1.25rem}&.density-normal{margin-top:1rem}}&.display-grid{&.image-large{&.density-comfortable,&.density-normal{max-height:2.5rem}&.density-comfortable{margin-top:1.25rem}&.density-normal{margin-top:1rem}}&.image-icon,&.image-none,&.image-small{&.density-comfortable{margin-top:1.25rem}&.density-normal{margin-top:1rem}&.density-compact{display:-webkit-box;margin-top:.75rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}}}}&.display-table{&.density-comfortable{margin-top:1.75rem;max-height:4.5rem}&.density-normal{margin-top:1.25rem;max-height:2.5rem}&.density-compact{margin-top:1rem;max-height:1.25rem}}}}`) {
+};
+AtomicResultSectionExcerpt = __decorate([
+    customElement('atomic-result-section-excerpt')
+], AtomicResultSectionExcerpt);
+export { AtomicResultSectionExcerpt };

package/dist/atomic/components/components/search/atomic-result-section-title/atomic-result-section-title.js

@@ -0,0 +1,24 @@
+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 { css, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section identifies the item by its name, and its main use is to make the result list scannable.
+ * This is usually the page title.
+ *
+ * Behavior:
+ * * Has a fixed height of two lines on grid layouts.
+ * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.
+ * * Has a defined CSS `color` property for text.
+ */
+let AtomicResultSectionTitle = class AtomicResultSectionTitle extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */atomic-result-section-title{&.with-sections{overflow:hidden;text-overflow:ellipsis}&.with-sections{color:var(--atomic-on-background);grid-area:title;--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);&.density-comfortable{--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}@media (width >= 1024px){&.display-grid{display:-webkit-box;overflow:hidden;word-break:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2}}@media not all and (width >= 1024px){&.display-list{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}&.display-grid{&.image-large{--font-size:var(--atomic-text-xl);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio))}&.image-icon,&.image-large,&.image-none,&.image-small{font-size:var(--font-size);line-height:var(--line-height)}&.image-icon,&.image-none,&.image-small{--font-size:var(--atomic-text-lg);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;max-height:3rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}}}}}`) {
+};
+AtomicResultSectionTitle = __decorate([
+    customElement('atomic-result-section-title')
+], AtomicResultSectionTitle);
+export { AtomicResultSectionTitle };

package/dist/atomic/components/components/search/atomic-result-section-title-metadata/atomic-result-section-title-metadata.js

@@ -0,0 +1,24 @@
+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 { css, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section surfaces some fields that are directly related to the title of the item.
+ * For example, in Commerce, this could be the item's rating, which is tied to the nature of the product itself,
+ * rather than to the product's description.
+ *
+ * Behavior:
+ * * Has a very small font size.
+ * * Is the closest element beneath the title section.
+ */
+let AtomicResultSectionTitleMetadata = class AtomicResultSectionTitleMetadata extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);&.with-sections{grid-area:title-metadata;margin-top:.475rem;overflow:hidden;text-overflow:ellipsis}}`) {
+};
+AtomicResultSectionTitleMetadata = __decorate([
+    customElement('atomic-result-section-title-metadata')
+], AtomicResultSectionTitleMetadata);
+export { AtomicResultSectionTitleMetadata };

package/dist/atomic/components/components/search/atomic-result-section-visual/atomic-result-section-visual.js

@@ -0,0 +1,29 @@
+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 { css, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { ItemSectionMixin } from "../../../mixins/item-section-mixin";
+/**
+ * This section provides visual information about the item.
+ * For example, in Commerce, an image is a great shorthand for a result category.
+ * An icon can quickly show the item type, or an avatar can help identify to whom it is related.
+ *
+ * Behavior:
+ * * Has a fixed size that depends on the specified image size, the layout, the density, and the screen size.
+ * ** When the image size is set to `icon`, this section stays very small.
+ * ** You should ensure that elements inside of it take the available space.
+ * * Always has a 1:1 aspect ratio.
+ */
+let AtomicResultSectionVisual = class AtomicResultSectionVisual extends ItemSectionMixin(LitElement, css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */atomic-result-section-visual{&.with-sections{overflow:hidden;text-overflow:ellipsis}&.with-sections{grid-area:visual;&.image-icon{border-radius:var(--atomic-border-radius);height:2rem;width:2rem}&.image-none{display:none}@media (width >= 1024px){&.display-list{margin-right:1rem;&.density-comfortable{margin-right:1.5rem}&.image-large{&.density-compact{height:10rem;width:10rem}&.density-comfortable,&.density-normal{height:20.375rem;width:20.375rem}}&.image-small{height:10rem;width:10rem}}&.display-grid{margin-bottom:.5rem;&.image-large,&.image-small{width:100%;&.density-comfortable{margin:0 auto 2rem}&.density-normal{margin:0 auto 1.5rem}&.density-compact{margin:0 auto 1rem}}&.image-large{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:19.75rem}}&.image-small{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:14rem}}}}@media not all and (width >= 1024px){&.display-list{margin-right:1rem;&.image-large{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:7.25rem}margin-bottom:1rem;margin-right:0;width:100%}&.image-small{height:24vw;margin-bottom:1rem;width:24vw}&.image-icon{margin-bottom:0}}&.display-grid{&.image-large{margin-right:1rem;&.image-large{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:7.25rem}margin-bottom:1rem;margin-right:0;width:100%}&.image-small{height:24vw;margin-bottom:1rem;width:24vw}&.image-icon{margin-bottom:0}}&.image-icon,&.image-none,&.image-small{&.image-large,&.image-small{width:100%;&.density-comfortable{margin-bottom:1rem}&.density-normal{margin-bottom:.75rem}&.density-compact{margin-bottom:.5rem}}&.image-small{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:9rem}height:10.25rem;width:10.25rem}}}}&.display-table{margin-right:1rem;&.density-comfortable{margin-right:1.5rem}&.image-large{&.density-compact{height:10rem;width:10rem}&.density-comfortable,&.density-normal{height:20.375rem;width:20.375rem}}&.image-small{height:10rem;width:10rem}}}}`) {
+};
+__decorate([
+    property({ reflect: true, attribute: 'image-size', type: Object })
+], AtomicResultSectionVisual.prototype, "imageSize", void 0);
+AtomicResultSectionVisual = __decorate([
+    customElement('atomic-result-section-visual')
+], AtomicResultSectionVisual);
+export { AtomicResultSectionVisual };

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

@@ -0,0 +1,137 @@
+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 { buildRecentQueriesList, } from '@coveo/headless';
+import { html, LitElement, nothing } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { errorGuard } from "../../../decorators/error-guard";
+import { SafeStorage, StorageItems } from "../../../utils/local-storage-utils";
+import { once } from "../../../utils/utils";
+const Clock = "<svg fill=\"none\" stroke=\"currentColor\" stroke-linejoin=\"round\" stroke-linecap=\"round\"  viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"8\" cy=\"8\" r=\"7.5\"/><path d=\"m8.5 4.5v4\"/><path d=\"m10.3066 10.1387-1.80932-1.5768\"/></svg>";
+import { getPartialRecentQueryClearElement, getPartialRecentQueryElement, renderRecentQuery, renderRecentQueryClear, } from '../../common/suggestions/recent-queries';
+import { dispatchSearchBoxSuggestionsEvent } from '../../common/suggestions/suggestions-events';
+/**
+ * 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.
+ */
+let AtomicSearchBoxRecentQueries = class AtomicSearchBoxRecentQueries extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * The maximum number of suggestions to display when the user types in the input field.
+         */
+        this.maxWithQuery = 3;
+        this.warnUser = once(() => this.bindings.engine.logger.warn('The recent queries feature is deactivated because analytics are disabled.'));
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        try {
+            dispatchSearchBoxSuggestionsEvent((bindings) => {
+                this.bindings = bindings;
+                return this.initialize();
+            }, this, ['atomic-search-box']);
+        }
+        catch (error) {
+            this.error = error;
+        }
+    }
+    initialize() {
+        this.storage = new SafeStorage();
+        this.recentQueriesList = buildRecentQueriesList(this.bindings.engine, {
+            initialState: { queries: this.retrieveLocalStorage() },
+            options: {
+                maxLength: 1000,
+                clearFilters: this.bindings.clearFilters,
+            },
+        });
+        this.recentQueriesList.subscribe(() => this.updateLocalStorage());
+        return {
+            position: Array.from(this.parentNode.children).indexOf(this),
+            renderItems: () => this.renderItems(),
+        };
+    }
+    retrieveLocalStorage() {
+        return this.storage.getParsedJSON(StorageItems.RECENT_QUERIES, []);
+    }
+    updateLocalStorage() {
+        if (!this.recentQueriesList.state.analyticsEnabled) {
+            return this.disableFeature();
+        }
+        return this.storage.setJSON(StorageItems.RECENT_QUERIES, this.recentQueriesList.state.queries);
+    }
+    disableFeature() {
+        this.warnUser();
+        this.storage.removeItem(StorageItems.RECENT_QUERIES);
+    }
+    renderItems() {
+        if (!this.recentQueriesList.state.analyticsEnabled) {
+            return [];
+        }
+        const query = this.bindings.searchBoxController.state.value;
+        const hasQuery = query !== '';
+        const max = hasQuery ? this.maxWithQuery : this.maxWithoutQuery;
+        const filteredQueries = this.recentQueriesList.state.queries
+            .filter((recentQuery) => recentQuery.toLowerCase().startsWith(query.toLowerCase()))
+            .slice(0, max);
+        const suggestionElements = filteredQueries.map((value) => this.renderItem(value));
+        if (suggestionElements.length) {
+            suggestionElements.unshift(this.renderClear());
+        }
+        return suggestionElements;
+    }
+    renderClear() {
+        const partialItem = getPartialRecentQueryClearElement(this.bindings.i18n);
+        return {
+            ...partialItem,
+            content: renderRecentQueryClear({ i18n: this.bindings.i18n }),
+            onSelect: () => {
+                this.recentQueriesList.clear();
+                this.bindings.triggerSuggestions();
+            },
+        };
+    }
+    renderItem(value) {
+        const query = this.bindings.searchBoxController.state.value;
+        const partialItem = getPartialRecentQueryElement(value, this.bindings.i18n);
+        return {
+            ...partialItem,
+            content: renderRecentQuery({
+                icon: this.icon || Clock,
+                query,
+                value,
+            }),
+            onSelect: () => {
+                if (this.bindings.isStandalone) {
+                    this.bindings.searchBoxController.updateText(value);
+                    this.bindings.searchBoxController.submit();
+                    return;
+                }
+                this.recentQueriesList.executeRecentQuery(this.recentQueriesList.state.queries.indexOf(value));
+            },
+        };
+    }
+    render() {
+        return html `${nothing}`;
+    }
+};
+__decorate([
+    state()
+], AtomicSearchBoxRecentQueries.prototype, "error", void 0);
+__decorate([
+    property()
+], AtomicSearchBoxRecentQueries.prototype, "icon", void 0);
+__decorate([
+    property({ type: Number, attribute: 'max-with-query', reflect: true })
+], AtomicSearchBoxRecentQueries.prototype, "maxWithQuery", void 0);
+__decorate([
+    property({ type: Number, attribute: 'max-without-query', reflect: true })
+], AtomicSearchBoxRecentQueries.prototype, "maxWithoutQuery", void 0);
+__decorate([
+    errorGuard()
+], AtomicSearchBoxRecentQueries.prototype, "render", null);
+AtomicSearchBoxRecentQueries = __decorate([
+    customElement('atomic-search-box-recent-queries')
+], AtomicSearchBoxRecentQueries);
+export { AtomicSearchBoxRecentQueries };

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

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 { buildSearchEngine, buildSearchStatus, buildUrlManager, EcommerceDefaultFieldsToInclude, VERSION as HEADLESS_VERSION, loadConfigurationActions, loadFieldActions, loadQueryActions, loadSearchConfigurationActions, } from '@coveo/headless';
+import { buildSearchEngine, buildSearchStatus, buildUrlManager, EcommerceDefaultFieldsToInclude, VERSION as HEADLESS_VERSION, loadFieldActions, loadQueryActions, loadSearchConfigurationActions, } from '@coveo/headless';
 import { provide } from '@lit/context';
 import i18next from 'i18next';
 import { css, html, LitElement } from 'lit';
@@ -26,7 +26,6 @@ import { getAnalyticsConfig } from './analytics-config';
 import { createSearchStore } from './store';
 // TODO - Remove once all components that use atomic-modal have been migrated.
 import "../../common/atomic-modal/atomic-modal";
-import { augmentAnalyticsConfigWithAtomicVersion } from '../../common/interface/analytics-config';
 const FirstSearchExecutedFlag = 'firstSearchExecuted';
 /**
  * The `atomic-search-interface` component is the parent to all other atomic components in a search page. It handles the headless search engine and localization configurations.
@@ -173,9 +172,6 @@ let AtomicSearchInterface = class AtomicSearchInterface extends ChildrenUpdateCo
         if (this.searchHub && this.searchHub !== engine.state.searchHub) {
             console.warn('Mismatch between search interface search hub and engine search hub. The engine search hub will be used.');
         }
-        engine.dispatch(loadConfigurationActions(engine).updateAnalyticsConfiguration({
-            ...augmentAnalyticsConfigWithAtomicVersion(),
-        }));
         return this.internalInitialization(() => {
             this.engine = engine;
         });

package/dist/atomic/components/components/search/index.js

@@ -2,6 +2,16 @@
 export { AtomicPager } from './atomic-pager/atomic-pager.js';
 export { AtomicQuerySummary } from './atomic-query-summary/atomic-query-summary.js';
 export { AtomicRelevanceInspector } from './atomic-relevance-inspector/atomic-relevance-inspector.js';
+export { AtomicResultSectionActions } from './atomic-result-section-actions/atomic-result-section-actions.js';
+export { AtomicResultSectionBadges } from './atomic-result-section-badges/atomic-result-section-badges.js';
+export { AtomicResultSectionBottomMetadata } from './atomic-result-section-bottom-metadata/atomic-result-section-bottom-metadata.js';
+export { AtomicResultSectionChildren } from './atomic-result-section-children/atomic-result-section-children.js';
+export { AtomicResultSectionEmphasized } from './atomic-result-section-emphasized/atomic-result-section-emphasized.js';
+export { AtomicResultSectionExcerpt } from './atomic-result-section-excerpt/atomic-result-section-excerpt.js';
+export { AtomicResultSectionTitle } from './atomic-result-section-title/atomic-result-section-title.js';
+export { AtomicResultSectionTitleMetadata } from './atomic-result-section-title-metadata/atomic-result-section-title-metadata.js';
+export { AtomicResultSectionVisual } from './atomic-result-section-visual/atomic-result-section-visual.js';
 export { AtomicResultsPerPage } from './atomic-results-per-page/atomic-results-per-page.js';
+export { AtomicSearchBoxRecentQueries } from './atomic-search-box-recent-queries/atomic-search-box-recent-queries.js';
 export { AtomicSearchInterface } from './atomic-search-interface/atomic-search-interface.js';
 export { AtomicSearchLayout } from './atomic-search-layout/atomic-search-layout.js';