@coveo/atomic-react 3.11.48 → 3.11.49

package/dist/cjs/atomic-react.cjs

@@ -5379,9 +5379,22 @@ function isAutomaticFacetGenerator(element) {
 function isPseudoFacet(el) {
     return 'facetId' in el;
 }
+function isPopover(element) {
+    return 'ATOMIC-POPOVER' === element.tagName;
+}
+function isFacetNestedInPopover(facet) {
+    return !!facet.parentElement && isPopover(facet.parentElement);
+}
+function getFacetElementToReorder(facet) {
+    return isFacetNestedInPopover(facet) ? facet.parentElement : facet;
+}
 function getFacetsInChildren(parent) {
-    const facets = Array.from(parent.children).filter((child)=>isPseudoFacet(child));
-    return facets;
+    return Array.from(parent.children).flatMap((child)=>{
+        if (isPseudoFacet(child)) return [
+            child
+        ];
+        return isPopover(child) ? Array.from(child.children).filter(isPseudoFacet) : [];
+    });
 }
 function getAutomaticFacetGenerator(parent) {
     return Array.from(parent.children).find(isAutomaticFacetGenerator);
@@ -8437,11 +8450,15 @@ function buildCommonLayout(element, mobileBreakpoint, layoutWebComponentTagName,
        }
     }`;
     };
-    const horizontalFacets = ()=>`${mediaQuerySelector} {
-      ${layoutSelector} ${sectionSelector('horizontal-facets')} > atomic-popover:not(.atomic-hidden) {
+    const horizontalFacets = ()=>{
+        const horizontalFacetsSelector = `${layoutSelector} ${sectionSelector('horizontal-facets')}`;
+        return `${mediaQuerySelector} {
+      ${horizontalFacetsSelector} > atomic-popover:not(.atomic-hidden),
+      ${horizontalFacetsSelector} > atomic-facet-manager > atomic-popover:not(.atomic-hidden) {
         display: block;
       }
     }`;
+    };
     return [
         display,
         search,
@@ -8456,7 +8473,7 @@ function getWindow$1() {
 }
 function getAtomicEnvironment(headlessVersion) {
     return {
-        version: "3.64.0",
+        version: "3.64.1",
         headlessVersion
     };
 }
@@ -19305,6 +19322,10 @@ let AtomicFocusTrap$1 = class AtomicFocusTrap extends LightDomMixin(lit.LitEleme
         if (element.hasAttribute('aria-hidden') || element.hasAttribute('aria-live') || 'atomic-aria-live' === element.tagName.toLowerCase()) return;
         element.setAttribute('aria-hidden', 'true');
         this.hiddenElements.push(element);
+        if (!element.hasAttribute('inert')) {
+            element.setAttribute('inert', '');
+            this.inertElements.push(element);
+        }
     }
     showAll() {
         let el = this.hiddenElements.pop();
@@ -19312,6 +19333,11 @@ let AtomicFocusTrap$1 = class AtomicFocusTrap extends LightDomMixin(lit.LitEleme
             el.removeAttribute('aria-hidden');
             el = this.hiddenElements.pop();
         }
+        let inertElement = this.inertElements.pop();
+        while(inertElement){
+            inertElement.removeAttribute('inert');
+            inertElement = this.inertElements.pop();
+        }
     }
     hideSiblingsRecursively(element) {
         const parent = getParent(element);
@@ -19345,6 +19371,7 @@ let AtomicFocusTrap$1 = class AtomicFocusTrap extends LightDomMixin(lit.LitEleme
         this.showSelf();
         if (!isInitialLoad) {
             await defer$1();
+            if (!this.active) return;
             getFirstFocusableDescendant(this)?.focus();
         }
         this.hideSiblingsRecursively(this);
@@ -19358,7 +19385,7 @@ let AtomicFocusTrap$1 = class AtomicFocusTrap extends LightDomMixin(lit.LitEleme
         return this.container ?? this;
     }
     constructor(...args){
-        super(...args), this.active = false, this.shouldHideSelf = true, this.scope = document.body, this.hiddenElements = [], this.onFocusChanged = (e)=>{
+        super(...args), this.active = false, this.shouldHideSelf = true, this.scope = document.body, this.hiddenElements = [], this.inertElements = [], this.onFocusChanged = (e)=>{
             if (!e.target || !this.active) return;
             const focusedElement = getFocusedElement();
             if (focusedElement && isAncestorOf(this, focusedElement)) return;
@@ -27849,9 +27876,13 @@ let AtomicFacetManager$1 = class AtomicFacetManager extends ChildrenUpdateComple
             const sortedFacets = this.sortFacetsUsingManager(facets, this.facetManager);
             const { visibleFacets, invisibleFacets } = sortFacetVisibility(sortedFacets, this.bindings.store.getAllFacets());
             const generator = getAutomaticFacetGenerator(this);
-            collapseFacetsAfter(visibleFacets, this.collapseFacetsAfter);
-            generator?.updateCollapseFacetsDependingOnFacetsVisibility?.(this.collapseFacetsAfter, visibleFacets.length);
-            this.append(...visibleFacets, ...invisibleFacets, ...generator ? [
+            const collapsibleFacets = visibleFacets.filter((facet)=>!isFacetNestedInPopover(facet));
+            collapseFacetsAfter(collapsibleFacets, this.collapseFacetsAfter);
+            generator?.updateCollapseFacetsDependingOnFacetsVisibility?.(this.collapseFacetsAfter, collapsibleFacets.length);
+            this.append(...[
+                ...visibleFacets,
+                ...invisibleFacets
+            ].map((facet)=>getFacetElementToReorder(facet)), ...generator ? [
                 generator
             ] : []);
         };
@@ -30359,9 +30390,8 @@ let AtomicPopover$1 = class AtomicPopover extends lit.LitElement {
         .active=${this.isOpen}
         .shouldHideSelf=${false}
       >
-        ${this.renderPopover()}
+        ${this.renderPopover()} ${when_js.when(this.isOpen, ()=>this.renderBackdrop())}
       </atomic-focus-trap>
-      ${when_js.when(this.isOpen, ()=>this.renderBackdrop())}
     `;
     }
     updated() {
@@ -36593,7 +36623,7 @@ AtomicSearchInterface$1 = _ts_decorate$c([
 
 const styles$4 = lit.css`.atomic-modal-opened{overflow-y:hidden}atomic-layout-section[section=search]{grid-area:atomic-section-search}atomic-layout-section[section=facets]{grid-area:atomic-section-facets}atomic-layout-section[section=main]{grid-area:atomic-section-main}atomic-layout-section[section=status]{grid-area:atomic-section-status}atomic-layout-section[section=pagination]{grid-area:atomic-section-pagination}atomic-search-layout{width:100%;height:100%;display:none;grid-template-areas:". atomic-section-search ." ". atomic-section-main .";grid-template-columns:var(--atomic-layout-spacing-x) minmax(0,1fr) var(
         --atomic-layout-spacing-x
-      );atomic-layout-section[section=search]{margin:var(--atomic-layout-spacing-y) 0;max-width:var(--atomic-layout-max-search-box-input-width,678px);width:100%;justify-self:center;atomic-search-box{&::part(suggestions-double-list){width:125%;max-width:var(--atomic-layout-max-search-box-double-suggestions-width,800px)}&::part(suggestions-left){flex-basis:var(--atomic-layout-search-box-left-suggestions-width,30%)}&::part(suggestions-right){flex-basis:calc(100% - var(--atomic-layout-search-box-left-suggestions-width, 30%))}}}atomic-layout-section[section=facets]{display:none;& *{margin-bottom:var(--atomic-layout-spacing-y)}}atomic-layout-section[section=main]{margin-bottom:var(--atomic-layout-spacing-y)}atomic-layout-section[section=horizontal-facets]{display:flex;flex-wrap:wrap;margin-bottom:var(--atomic-layout-spacing-y);row-gap:.5rem;&>*{max-width:100%}&>atomic-popover,&>atomic-segmented-facet{margin-right:.5rem}&>atomic-popover{display:none}}atomic-layout-section[section=status]{display:grid;justify-content:space-between;grid-template-areas:"atomic-breadbox       atomic-breadbox" "atomic-query-summary  atomic-sort" "atomic-did-you-mean   atomic-did-you-mean" "atomic-notifications  atomic-notifications";&>*{margin-bottom:var(--atomic-layout-spacing-y)}atomic-breadbox{grid-area:atomic-breadbox}atomic-query-summary{grid-area:atomic-query-summary;align-self:center;overflow:hidden}atomic-sort-dropdown{justify-self:end}atomic-refine-toggle,atomic-sort-dropdown{grid-area:atomic-sort}atomic-did-you-mean{grid-area:atomic-did-you-mean}atomic-notifications{grid-area:atomic-notifications}}atomic-layout-section[section=results]{atomic-smart-snippet,atomic-smart-snippet-suggestions{margin-bottom:1.5rem}}atomic-layout-section[section=pagination]{display:flex;flex-direction:column;justify-content:space-between;align-items:center;atomic-load-more-results{width:100%}&:has(:only-child){justify-content:center}&>*{margin-top:var(--atomic-layout-spacing-y)}@media only screen and (min-width:50rem){flex-direction:row}}}`;
+      );atomic-layout-section[section=search]{margin:var(--atomic-layout-spacing-y) 0;max-width:var(--atomic-layout-max-search-box-input-width,678px);width:100%;justify-self:center;atomic-search-box{&::part(suggestions-double-list){width:125%;max-width:var(--atomic-layout-max-search-box-double-suggestions-width,800px)}&::part(suggestions-left){flex-basis:var(--atomic-layout-search-box-left-suggestions-width,30%)}&::part(suggestions-right){flex-basis:calc(100% - var(--atomic-layout-search-box-left-suggestions-width, 30%))}}}atomic-layout-section[section=facets]{display:none;& *{margin-bottom:var(--atomic-layout-spacing-y)}}atomic-layout-section[section=main]{margin-bottom:var(--atomic-layout-spacing-y)}atomic-layout-section[section=horizontal-facets]{display:flex;flex-wrap:wrap;margin-bottom:var(--atomic-layout-spacing-y);row-gap:.5rem;&>*{max-width:100%}&>atomic-facet-manager{display:contents;&>*{max-width:100%}}&>atomic-facet-manager>atomic-popover,&>atomic-popover,&>atomic-segmented-facet{margin-right:.5rem}&>atomic-facet-manager>atomic-popover,&>atomic-popover{display:none}}atomic-layout-section[section=status]{display:grid;justify-content:space-between;grid-template-areas:"atomic-breadbox       atomic-breadbox" "atomic-query-summary  atomic-sort" "atomic-did-you-mean   atomic-did-you-mean" "atomic-notifications  atomic-notifications";&>*{margin-bottom:var(--atomic-layout-spacing-y)}atomic-breadbox{grid-area:atomic-breadbox}atomic-query-summary{grid-area:atomic-query-summary;align-self:center;overflow:hidden}atomic-sort-dropdown{justify-self:end}atomic-refine-toggle,atomic-sort-dropdown{grid-area:atomic-sort}atomic-did-you-mean{grid-area:atomic-did-you-mean}atomic-notifications{grid-area:atomic-notifications}}atomic-layout-section[section=results]{atomic-smart-snippet,atomic-smart-snippet-suggestions{margin-bottom:1.5rem}}atomic-layout-section[section=pagination]{display:flex;flex-direction:column;justify-content:space-between;align-items:center;atomic-load-more-results{width:100%}&:has(:only-child){justify-content:center}&>*{margin-top:var(--atomic-layout-spacing-y)}@media only screen and (min-width:50rem){flex-direction:row}}}`;
 const atomic_search_layout_tw_css = styles$4;
 
 function _ts_decorate$b(decorators, target, key, desc) {