@coveo/atomic 3.33.1-pre.deccecae3e → 3.33.1-pre.e2196e1c80

package/dist/atomic/components/components/commerce/atomic-commerce-facet-number-input/atomic-commerce-facet-number-input.tw.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+const styles = css`[part=input-form]{grid-template-columns:1fr 1fr auto;grid-template-areas:"label-start label-end.""input-start input-end apply-button";display:grid}[part=label-start]{grid-area:label-start}[part=label-end]{grid-area:label-end}[part=input-start]{grid-area:input-start}[part=input-end]{grid-area:input-end}[part=input-apply-button]{grid-area:apply-button}`;
+export default styles;

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

@@ -48,13 +48,8 @@ let AtomicCommerceInterface = class AtomicCommerceInterface extends ChildrenUpda
         this.analytics = true;
         /**
          * Whether the state should be reflected in the URL parameters.
-         * @deprecated - replaced by `disable-state-reflection-in-url` (this defaults to `true`, while the replacement defaults to `false`).
          */
         this.reflectStateInUrl = true;
-        /**
-         * Disable state reflection in the URL parameters.
-         */
-        this.disableStateReflectionInUrl = false;
         /**
          * The CSS selector for the container where the interface will scroll back to.
          */
@@ -228,9 +223,6 @@ let AtomicCommerceInterface = class AtomicCommerceInterface extends ChildrenUpda
         return window.location.hash.slice(1);
     }
     initUrlManager() {
-        if (this.disableStateReflectionInUrl) {
-            return;
-        }
         if (!this.reflectStateInUrl) {
             return;
         }
@@ -319,13 +311,6 @@ __decorate([
         converter: booleanConverter,
     })
 ], AtomicCommerceInterface.prototype, "reflectStateInUrl", void 0);
-__decorate([
-    property({
-        type: Boolean,
-        attribute: 'disable-state-reflection-in-url',
-        reflect: true,
-    })
-], AtomicCommerceInterface.prototype, "disableStateReflectionInUrl", void 0);
 __decorate([
     property({ type: String, attribute: 'scroll-container', reflect: true })
 ], AtomicCommerceInterface.prototype, "scrollContainer", void 0);

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

@@ -4,40 +4,33 @@ 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;
 };
-var AtomicCommerceLayout_1;
-import { html, LitElement, unsafeCSS } from 'lit';
+import { html, LitElement } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { errorGuard } from "../../../decorators/error-guard";
-import { injectStylesForNoShadowDOM } from "../../../decorators/inject-styles-for-no-shadow-dom";
-import { randomID } from "../../../utils/utils";
+import { CommerceLayoutMixin } from "../../../mixins/commerce-layout-mixin";
 import { DEFAULT_MOBILE_BREAKPOINT } from '../../../utils/replace-breakpoint';
 import styles from './atomic-commerce-layout.tw.css';
-import { buildCommerceLayout } from './commerce-layout';
 /**
  * The `atomic-commerce-layout` helps organize elements in the commerce page.
  *
  * @slot default - The default slot where you can add child components to the layout.
  */
-let AtomicCommerceLayout = AtomicCommerceLayout_1 = class AtomicCommerceLayout extends LitElement {
+let AtomicCommerceLayout = class AtomicCommerceLayout extends CommerceLayoutMixin(LitElement, styles) {
     constructor() {
-        super();
+        super(...arguments);
         /**
          * CSS value that defines where the layout goes from mobile to desktop.
          * e.g., 800px, 65rem.
          */
         this.mobileBreakpoint = DEFAULT_MOBILE_BREAKPOINT;
-        this.id = randomID('atomic-commerce-layout-');
     }
-    connectedCallback() {
-        super.connectedCallback();
-        const layout = unsafeCSS(buildCommerceLayout(this, this.mobileBreakpoint));
-        AtomicCommerceLayout_1.styles.unshift(layout);
+    createRenderRoot() {
+        return this;
     }
     render() {
         return html `<slot></slot>`;
     }
 };
-AtomicCommerceLayout.styles = [styles];
 __decorate([
     state()
 ], AtomicCommerceLayout.prototype, "error", void 0);
@@ -47,8 +40,7 @@ __decorate([
 __decorate([
     errorGuard()
 ], AtomicCommerceLayout.prototype, "render", null);
-AtomicCommerceLayout = AtomicCommerceLayout_1 = __decorate([
-    customElement('atomic-commerce-layout'),
-    injectStylesForNoShadowDOM
+AtomicCommerceLayout = __decorate([
+    customElement('atomic-commerce-layout')
 ], AtomicCommerceLayout);
 export { AtomicCommerceLayout };

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

@@ -1,4 +1,4 @@
-import { buildCommonLayout } from '../../common/atomic-layout-section/layout';
+import { buildSearchLayoutCommon } from '../../common/atomic-layout-section/search-layout';
 export const layoutWebComponentTagName = 'atomic-commerce-layout';
 export const containerWebComponentTagName = 'atomic-commerce-interface';
 export const noProductsSelector = `${containerWebComponentTagName}-no-results`;
@@ -8,5 +8,5 @@ export function makeDesktopQuery(mobileBreakpoint) {
     return `only screen and (min-width: ${mobileBreakpoint})`;
 }
 export function buildCommerceLayout(element, mobileBreakpoint) {
-    return buildCommonLayout(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noProductsSelector, errorSelector, 'atomic-commerce-refine-toggle', 'atomic-commerce-sort-dropdown');
+    return buildSearchLayoutCommon(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noProductsSelector, errorSelector, 'atomic-commerce-refine-toggle', 'atomic-commerce-sort-dropdown');
 }

package/dist/atomic/components/components/commerce/atomic-commerce-numeric-facet/atomic-commerce-numeric-facet.js

@@ -5,7 +5,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { buildContext, } from '@coveo/headless/commerce';
-import { html, LitElement } from 'lit';
+import { css, html, LitElement } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { when } from 'lit/directives/when.js';
 import { renderNumericFacetValuesGroup } from "../../common/facets/numeric-facet/values-container";
@@ -22,7 +22,6 @@ import { renderNumericFacetValue } from '../../common/facets/numeric-facet/value
 import { defaultCurrencyFormatter, defaultNumberFormatter, } from '../../common/formats/format-common';
 import '../atomic-commerce-facet-number-input/atomic-commerce-facet-number-input';
 import { bindings } from "../../../decorators/bindings";
-import numericFacetCommonStyles from '../../common/facets/numeric-facet-common.tw.css';
 /**
  * The `atomic-commerce-numeric-facet` component renders a commerce facet that allows the user to filter products using numeric ranges.
  *
@@ -87,7 +86,7 @@ let AtomicCommerceNumericFacet = class AtomicCommerceNumericFacet extends LitEle
             0);
     }
     get hasInputRange() {
-        return !!this.facetState.manualRange;
+        return !!this.facetState.manualRange || this.summaryState.isLoading;
     }
     get shouldRenderValues() {
         return !this.hasInputRange && !!this.valuesToRender.length;
@@ -183,7 +182,8 @@ let AtomicCommerceNumericFacet = class AtomicCommerceNumericFacet extends LitEle
         }
     }
 };
-AtomicCommerceNumericFacet.styles = numericFacetCommonStyles;
+AtomicCommerceNumericFacet.styles = css`/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}.value-checkbox{width:var(--atomic-facet-checkbox-size,1rem);height:var(--atomic-facet-checkbox-size,1rem);left:calc(var(--spacing,.25rem)*2);z-index:1;position:absolute}.value-checkbox+label{cursor:pointer;text-overflow:ellipsis;white-space:nowrap;width:100%;padding-block:calc(var(--spacing,.25rem)*2.5);padding-right:calc(var(--spacing,.25rem)*2);padding-left:calc(var(--spacing,.25rem)*8);color:var(--atomic-on-background);flex-direction:row;display:flex;overflow:hidden;&:hover{@media (hover:hover){&{background-color:var(--atomic-neutral-light)}}}}.value-checkbox.selected:focus-visible+label .value-label,.value-checkbox.selected:hover+label .value-label{color:var(--atomic-primary)}.value-checkbox.excluded:focus-visible+label .value-label,.value-checkbox.excluded:hover+label .value-label{color:var(--atomic-error)}.value-exclude-button:focus-visible atomic-icon{visibility:visible}.value-count{margin-left:calc(var(--spacing,.25rem)*1.5);color:var(--atomic-neutral-dark);[part=value-exclude-button]+&{margin-right:calc(var(--spacing,.25rem)*2)}}:host(.popover-nested){min-width:var(--container-2xs,18rem);&::part(label-button){display:none}&::part(facet){--tw-shadow:0px 2px 8px var(--tw-shadow-color,#e5e8e8bf);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}&::part(values){margin-top:calc(var(--spacing,.25rem)*0);max-height:calc(var(--spacing,.25rem)*96);overflow-y:auto}&::part(search-wrapper){margin-bottom:calc(var(--spacing,.25rem)*2)}}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}`;
 __decorate([
     property({ type: Object })
 ], AtomicCommerceNumericFacet.prototype, "summary", void 0);

package/dist/atomic/components/components/commerce/atomic-commerce-recommendation-list/atomic-commerce-recommendation-list.js

@@ -55,6 +55,12 @@ let AtomicCommerceRecommendationList = class AtomicCommerceRecommendationList ex
         this.templateHasError = false;
         this.isEveryProductReady = false;
         this.currentPage = 0;
+        /**
+         * The identifier used by the Commerce API to retrieve the desired recommendation list for the component.
+         * You can configure recommendation lists and get their respective slot IDs through the Coveo Merchandising Hub (CMH).
+         * You can include multiple `atomic-commerce-recommendation-list` components with different slot IDs in the same page to display several recommendation lists.
+         */
+        this.slotId = 'Recommendation';
         /**
          * The layout to apply when displaying the products. This does not affect the display of the surrounding list itself.
          * To modify the number of products per column, modify the `--atomic-recs-number-of-columns` CSS variable.
@@ -159,13 +165,11 @@ let AtomicCommerceRecommendationList = class AtomicCommerceRecommendationList ex
                 constrainTo: ['small', 'large', 'icon', 'none'],
             }),
             productsPerPage: new NumberValue({ min: 0 }),
-            slotId: new StringValue({ emptyAllowed: false }),
         }).validate({
             density: this.density,
             display: this.display,
             imageSize: this.imageSize,
             productsPerPage: this.productsPerPage,
-            slotId: this.slotId,
         });
     }
     validateSlotID() {

package/dist/atomic/components/components/commerce/atomic-commerce-timeframe-facet/atomic-commerce-timeframe-facet.js

@@ -5,7 +5,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { deserializeRelativeDate, } from '@coveo/headless/commerce';
-import { html, LitElement } from 'lit';
+import { css, html, LitElement } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { when } from 'lit/directives/when.js';
 import { renderFacetContainer } from "../../common/facets/facet-container/facet-container";
@@ -23,7 +23,6 @@ import { parseDate } from "../../../utils/date-utils";
 import '../../common/atomic-facet-date-input/atomic-facet-date-input';
 import { bindings } from "../../../decorators/bindings";
 import { shouldDisplayInputForFacetRange } from '../../common/facets/facet-common';
-import facetCommonStyles from '../../common/facets/facet-common.tw.css';
 /**
  * A facet is a list of values for a certain field occurring in the results.
  * An `atomic-commerce-timeframe-facet` displays a facet of the results for the current query as date intervals.
@@ -217,7 +216,8 @@ let AtomicCommerceTimeframeFacet = class AtomicCommerceTimeframeFacet extends Li
         }
     }
 };
-AtomicCommerceTimeframeFacet.styles = facetCommonStyles;
+AtomicCommerceTimeframeFacet.styles = css`/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}.value-count{margin-left:calc(var(--spacing,.25rem)*1.5);color:var(--atomic-neutral-dark);[part=value-exclude-button]+&{margin-right:calc(var(--spacing,.25rem)*2)}}:host(.popover-nested){min-width:var(--container-2xs,18rem);&::part(label-button){display:none}&::part(facet){--tw-shadow:0px 2px 8px var(--tw-shadow-color,#e5e8e8bf);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}&::part(values){margin-top:calc(var(--spacing,.25rem)*0);max-height:calc(var(--spacing,.25rem)*96);overflow-y:auto}&::part(search-wrapper){margin-bottom:calc(var(--spacing,.25rem)*2)}}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}`;
 __decorate([
     property({ type: Object })
 ], AtomicCommerceTimeframeFacet.prototype, "summary", void 0);

package/dist/atomic/components/components/commerce/atomic-product-description/atomic-product-description.js

@@ -34,7 +34,6 @@ let AtomicProductDescription = class AtomicProductDescription extends LitElement
         this.descriptionRef = createRef();
         /**
          * The number of lines after which the product description should be truncated. A value of "none" will disable truncation.
-         * @default '2'
          */
         this.truncateAfter = '2';
         /**

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

@@ -71,7 +71,7 @@ __decorate([
     state()
 ], AtomicProductTemplate.prototype, "error", void 0);
 __decorate([
-    property({ attribute: false, type: Array })
+    property({ type: Array })
 ], AtomicProductTemplate.prototype, "conditions", void 0);
 __decorate([
     mapProperty({ splitValues: true, attributePrefix: 'must-match' })

package/dist/atomic/components/components/commerce/atomic-product-text/atomic-product-text.js

@@ -26,15 +26,10 @@ let AtomicProductText = class AtomicProductText extends LitElement {
         super(...arguments);
         /**
          * Whether to highlight the string field value.
-         * @deprecated - replaced by `no-highlight` (this defaults to `true`, while the replacement is the inverse and defaults to `false`).
+         *
          * Only works if the `field` property is set to `excerpt` or `ec_name`.
          */
         this.shouldHighlight = true;
-        /**
-         * Disable highlighting of the string field value.
-         * Only works if the `field` property is set to `excerpt` or `ec_name`.
-         */
-        this.disableHighlight = false;
         this.productController = createProductContextController(this);
     }
     createRenderRoot() {
@@ -46,9 +41,7 @@ let AtomicProductText = class AtomicProductText extends LitElement {
         }
     }
     get shouldRenderHighlights() {
-        return (!this.disableHighlight &&
-            this.shouldHighlight &&
-            this.isFieldSupportedForHighlighting());
+        return this.shouldHighlight && this.isFieldSupportedForHighlighting();
     }
     isFieldSupportedForHighlighting() {
         return ['ec_name', 'excerpt'].includes(this.field);
@@ -123,14 +116,6 @@ __decorate([
         converter: booleanConverter,
     })
 ], AtomicProductText.prototype, "shouldHighlight", void 0);
-__decorate([
-    property({
-        type: Boolean,
-        reflect: true,
-        useDefault: true,
-        attribute: 'no-highlight',
-    })
-], AtomicProductText.prototype, "disableHighlight", void 0);
 __decorate([
     property({ type: String, reflect: true })
 ], AtomicProductText.prototype, "default", void 0);

package/dist/atomic/components/components/common/atomic-layout-section/{layout.js → search-layout.js}

@@ -1,8 +1,8 @@
-import { findSection, sectionSelector } from './sections';
+import { findSection, sectionSelector, } from '../../common/atomic-layout-section/sections';
 export function makeDesktopQuery(mobileBreakpoint) {
     return `only screen and (min-width: ${mobileBreakpoint})`;
 }
-export function buildCommonLayout(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noItemsSelector, errorSelector, refineToggleSelector, sortDropdownSelector) {
+export function buildSearchLayoutCommon(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noItemsSelector, errorSelector, refineToggleSelector, sortDropdownSelector) {
     const id = element.id;
     const layoutSelector = `${layoutWebComponentTagName}#${id}`;
     const cleanStatusSelector = `${containerWebComponentTagName}:not(.${noItemsSelector}, .${errorSelector})`;

package/dist/atomic/components/components/common/facets/facet-common.tw.css.js

@@ -1,4 +1,3 @@
-import { css } from 'lit';
-const styles = css`/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
+const css = `/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
 @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}.value-count{margin-left:calc(var(--spacing,.25rem)*1.5);color:var(--atomic-neutral-dark);[part=value-exclude-button]+&{margin-right:calc(var(--spacing,.25rem)*2)}}:host(.popover-nested){min-width:var(--container-2xs,18rem);&::part(label-button){display:none}&::part(facet){--tw-shadow:0px 2px 8px var(--tw-shadow-color,#e5e8e8bf);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}&::part(values){margin-top:calc(var(--spacing,.25rem)*0);max-height:calc(var(--spacing,.25rem)*96);overflow-y:auto}&::part(search-wrapper){margin-bottom:calc(var(--spacing,.25rem)*2)}}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}`;
-export default styles;
+export default css;

package/dist/atomic/components/components/common/facets/facet-search/facet-search.tw.css.js

@@ -1,4 +1,3 @@
-import { css } from 'lit';
-const styles = css`/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
+const css = `/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
 input[type=text]:focus-visible~.search-icon{color:var(--atomic-primary)}input[type=text]:hover~.search-icon{color:var(--atomic-primary-light)}.search-icon atomic-icon{width:var(--atomic-facet-search-icon-size,.75rem);height:var(--atomic-facet-search-icon-size,.75rem)}.search-clear-button atomic-icon{width:var(--atomic-facet-search-clear-icon-size,.625rem);height:var(--atomic-facet-search-clear-icon-size,.625rem)}`;
-export default styles;
+export default css;

package/dist/atomic/components/components/common/facets/facet-value-box/facet-value-box.tw.css.js

@@ -1,4 +1,3 @@
-import { css } from 'lit';
-const styles = css`/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
+const css = `/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
 .box-container{padding-inline:calc(var(--spacing,.25rem)*2);grid-template-columns:repeat(var(--atomic-facet-boxes-per-row,4),minmax(0,1fr));gap:var(--atomic-facet-boxes-gap,.5rem);display:grid}.value-box .value-label,.value-box-count{width:100%;display:block}.value-box.selected{box-shadow:0 0 0 1px var(--atomic-primary)}`;
-export default styles;
+export default css;

package/dist/atomic/components/components/common/facets/facet-value-checkbox/facet-value-checkbox.tw.css.js

@@ -1,4 +1,3 @@
-import { css } from 'lit';
-const styles = css`/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
+const css = `/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
 .value-checkbox{width:var(--atomic-facet-checkbox-size,1rem);height:var(--atomic-facet-checkbox-size,1rem);left:calc(var(--spacing,.25rem)*2);z-index:1;position:absolute}.value-checkbox+label{cursor:pointer;text-overflow:ellipsis;white-space:nowrap;width:100%;padding-block:calc(var(--spacing,.25rem)*2.5);padding-right:calc(var(--spacing,.25rem)*2);padding-left:calc(var(--spacing,.25rem)*8);color:var(--atomic-on-background);flex-direction:row;display:flex;overflow:hidden;&:hover{@media (hover:hover){&{background-color:var(--atomic-neutral-light)}}}}.value-checkbox.selected:focus-visible+label .value-label,.value-checkbox.selected:hover+label .value-label{color:var(--atomic-primary)}.value-checkbox.excluded:focus-visible+label .value-label,.value-checkbox.excluded:hover+label .value-label{color:var(--atomic-error)}`;
-export default styles;
+export default css;

package/dist/atomic/components/components/common/facets/facet-value-exclude/facet-value-exclude.tw.css.js

@@ -1,3 +1,2 @@
-import { css } from 'lit';
-const styles = css`.value-exclude-button:focus-visible atomic-icon{visibility:visible}`;
-export default styles;
+const css = `.value-exclude-button:focus-visible atomic-icon{visibility:visible}`;
+export default css;

package/dist/atomic/components/components/common/facets/numeric-facet-common.tw.css.js

@@ -1,9 +1,3 @@
-import facetCommonStyles from './facet-common.tw.css';
-import facetValueCheckboxStyles from './facet-value-checkbox/facet-value-checkbox.tw.css';
-import facetValueExcludeStyles from './facet-value-exclude/facet-value-exclude.tw.css';
-const styles = [
-    facetValueCheckboxStyles,
-    facetValueExcludeStyles,
-    facetCommonStyles,
-];
-export default styles;
+const css = `/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}.value-checkbox{width:var(--atomic-facet-checkbox-size,1rem);height:var(--atomic-facet-checkbox-size,1rem);left:calc(var(--spacing,.25rem)*2);z-index:1;position:absolute}.value-checkbox+label{cursor:pointer;text-overflow:ellipsis;white-space:nowrap;width:100%;padding-block:calc(var(--spacing,.25rem)*2.5);padding-right:calc(var(--spacing,.25rem)*2);padding-left:calc(var(--spacing,.25rem)*8);color:var(--atomic-on-background);flex-direction:row;display:flex;overflow:hidden;&:hover{@media (hover:hover){&{background-color:var(--atomic-neutral-light)}}}}.value-checkbox.selected:focus-visible+label .value-label,.value-checkbox.selected:hover+label .value-label{color:var(--atomic-primary)}.value-checkbox.excluded:focus-visible+label .value-label,.value-checkbox.excluded:hover+label .value-label{color:var(--atomic-error)}.value-exclude-button:focus-visible atomic-icon{visibility:visible}.value-count{margin-left:calc(var(--spacing,.25rem)*1.5);color:var(--atomic-neutral-dark);[part=value-exclude-button]+&{margin-right:calc(var(--spacing,.25rem)*2)}}:host(.popover-nested){min-width:var(--container-2xs,18rem);&::part(label-button){display:none}&::part(facet){--tw-shadow:0px 2px 8px var(--tw-shadow-color,#e5e8e8bf);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}&::part(values){margin-top:calc(var(--spacing,.25rem)*0);max-height:calc(var(--spacing,.25rem)*96);overflow-y:auto}&::part(search-wrapper){margin-bottom:calc(var(--spacing,.25rem)*2)}}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}`;
+export default css;

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

@@ -1,4 +1,4 @@
-import { buildCommonLayout } from '../../common/atomic-layout-section/layout';
+import { buildSearchLayoutCommon } from '../../common/atomic-layout-section/search-layout';
 export const layoutWebComponentTagName = 'atomic-search-layout';
 export const containerWebComponentTagName = 'atomic-search-interface';
 export const noResultsSelector = `${containerWebComponentTagName}-no-results`;
@@ -8,5 +8,5 @@ export function makeDesktopQuery(mobileBreakpoint) {
     return `only screen and (min-width: ${mobileBreakpoint})`;
 }
 export function buildSearchLayout(element, mobileBreakpoint) {
-    return buildCommonLayout(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noResultsSelector, errorSelector, 'atomic-refine-toggle', 'atomic-sort-dropdown');
+    return buildSearchLayoutCommon(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noResultsSelector, errorSelector, 'atomic-refine-toggle', 'atomic-sort-dropdown');
 }

package/dist/atomic/components/decorators/inject-styles-for-no-shadow-dom.js

@@ -29,7 +29,7 @@ export const injectStylesForNoShadowDOM = (Base) => {
             const isDocumentOrShadowRoot = parent instanceof Document || parent instanceof ShadowRoot;
             if (isDocumentOrShadowRoot) {
                 for (const style of styles) {
-                    const styleSheet = getStyleSheet(style);
+                    const styleSheet = style?.styleSheet;
                     if (styleSheet && !parent.adoptedStyleSheets.includes(styleSheet)) {
                         parent.adoptedStyleSheets.push(styleSheet);
                     }
@@ -38,12 +38,3 @@ export const injectStylesForNoShadowDOM = (Base) => {
         }
     };
 };
-function getStyleSheet(style) {
-    if (style instanceof CSSStyleSheet) {
-        return style;
-    }
-    if (style && typeof style === 'object' && 'styleSheet' in style) {
-        return style.styleSheet;
-    }
-    return null;
-}

package/dist/atomic/components/decorators/with-tailwind-styles.js

@@ -1,6 +1,7 @@
 import { unsafeCSS } from 'lit';
 import theme from "../utils/coveo.tw.css";
 import styles from "../utils/tailwind.global.tw.css";
+import utilities from "../utils/tailwind-utilities/utilities.tw.css";
 const tailwindPropertiesSheet = typeof window !== 'undefined'
     ? (() => {
         const propCss = styles;
@@ -42,6 +43,7 @@ export const withTailwindStyles = (Base) => {
             const baseStyles = [
                 unsafeCSS(theme),
                 unsafeCSS(styles),
+                unsafeCSS(utilities),
             ];
             const customStyles = Base.styles;
             if (Array.isArray(customStyles)) {

package/dist/atomic/components/global/environment.js

@@ -3,7 +3,7 @@ function getWindow() {
 }
 export function getAtomicEnvironment(headlessVersion) {
     return {
-        version: "3.33.1-pre.deccecae3e",
+        version: "3.33.1-pre.e2196e1c80",
         headlessVersion,
     };
 }

package/dist/atomic/components/global/tailwind.default.css.js

@@ -0,0 +1,2 @@
+const css = `@theme inline static{--font-sans: ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; --font-serif: ui-serif,Georgia,Cambria,"Times New Roman",Times,serif; --font-mono: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; --color-red-50: oklch(.971 .013 17.38); --color-red-100: oklch(.936 .032 17.717); --color-red-200: oklch(.885 .062 18.334); --color-red-300: oklch(.808 .114 19.571); --color-red-400: oklch(.704 .191 22.216); --color-red-500: oklch(.637 .237 25.331); --color-red-600: oklch(.577 .245 27.325); --color-red-700: oklch(.505 .213 27.518); --color-red-800: oklch(.444 .177 26.899); --color-red-900: oklch(.396 .141 25.723); --color-red-950: oklch(.258 .092 26.042); --color-orange-50: oklch(.98 .016 73.684); --color-orange-100: oklch(.954 .038 75.164); --color-orange-200: oklch(.901 .076 70.697); --color-orange-300: oklch(.837 .128 66.29); --color-orange-400: oklch(.75 .183 55.934); --color-orange-500: oklch(.705 .213 47.604); --color-orange-600: oklch(.646 .222 41.116); --color-orange-700: oklch(.553 .195 38.402); --color-orange-800: oklch(.47 .157 37.304); --color-orange-900: oklch(.408 .123 38.172); --color-orange-950: oklch(.266 .079 36.259); --color-amber-50: oklch(.987 .022 95.277); --color-amber-100: oklch(.962 .059 95.617); --color-amber-200: oklch(.924 .12 95.746); --color-amber-300: oklch(.879 .169 91.605); --color-amber-400: oklch(.828 .189 84.429); --color-amber-500: oklch(.769 .188 70.08); --color-amber-600: oklch(.666 .179 58.318); --color-amber-700: oklch(.555 .163 48.998); --color-amber-800: oklch(.473 .137 46.201); --color-amber-900: oklch(.414 .112 45.904); --color-amber-950: oklch(.279 .077 45.635); --color-yellow-50: oklch(.987 .026 102.212); --color-yellow-100: oklch(.973 .071 103.193); --color-yellow-200: oklch(.945 .129 101.54); --color-yellow-300: oklch(.905 .182 98.111); --color-yellow-400: oklch(.852 .199 91.936); --color-yellow-500: oklch(.795 .184 86.047); --color-yellow-600: oklch(.681 .162 75.834); --color-yellow-700: oklch(.554 .135 66.442); --color-yellow-800: oklch(.476 .114 61.907); --color-yellow-900: oklch(.421 .095 57.708); --color-yellow-950: oklch(.286 .066 53.813); --color-lime-50: oklch(.986 .031 120.757); --color-lime-100: oklch(.967 .067 122.328); --color-lime-200: oklch(.938 .127 124.321); --color-lime-300: oklch(.897 .196 126.665); --color-lime-400: oklch(.841 .238 128.85); --color-lime-500: oklch(.768 .233 130.85); --color-lime-600: oklch(.648 .2 131.684); --color-lime-700: oklch(.532 .157 131.589); --color-lime-800: oklch(.453 .124 130.933); --color-lime-900: oklch(.405 .101 131.063); --color-lime-950: oklch(.274 .072 132.109); --color-green-50: oklch(.982 .018 155.826); --color-green-100: oklch(.962 .044 156.743); --color-green-200: oklch(.925 .084 155.995); --color-green-300: oklch(.871 .15 154.449); --color-green-400: oklch(.792 .209 151.711); --color-green-500: oklch(.723 .219 149.579); --color-green-600: oklch(.627 .194 149.214); --color-green-700: oklch(.527 .154 150.069); --color-green-800: oklch(.448 .119 151.328); --color-green-900: oklch(.393 .095 152.535); --color-green-950: oklch(.266 .065 152.934); --color-emerald-50: oklch(.979 .021 166.113); --color-emerald-100: oklch(.95 .052 163.051); --color-emerald-200: oklch(.905 .093 164.15); --color-emerald-300: oklch(.845 .143 164.978); --color-emerald-400: oklch(.765 .177 163.223); --color-emerald-500: oklch(.696 .17 162.48); --color-emerald-600: oklch(.596 .145 163.225); --color-emerald-700: oklch(.508 .118 165.612); --color-emerald-800: oklch(.432 .095 166.913); --color-emerald-900: oklch(.378 .077 168.94); --color-emerald-950: oklch(.262 .051 172.552); --color-teal-50: oklch(.984 .014 180.72); --color-teal-100: oklch(.953 .051 180.801); --color-teal-200: oklch(.91 .096 180.426); --color-teal-300: oklch(.855 .138 181.071); --color-teal-400: oklch(.777 .152 181.912); --color-teal-500: oklch(.704 .14 182.503); --color-teal-600: oklch(.6 .118 184.704); --color-teal-700: oklch(.511 .096 186.391); --color-teal-800: oklch(.437 .078 188.216); --color-teal-900: oklch(.386 .063 188.416); --color-teal-950: oklch(.277 .046 192.524); --color-cyan-50: oklch(.984 .019 200.873); --color-cyan-100: oklch(.956 .045 203.388); --color-cyan-200: oklch(.917 .08 205.041); --color-cyan-300: oklch(.865 .127 207.078); --color-cyan-400: oklch(.789 .154 211.53); --color-cyan-500: oklch(.715 .143 215.221); --color-cyan-600: oklch(.609 .126 221.723); --color-cyan-700: oklch(.52 .105 223.128); --color-cyan-800: oklch(.45 .085 224.283); --color-cyan-900: oklch(.398 .07 227.392); --color-cyan-950: oklch(.302 .056 229.695); --color-sky-50: oklch(.977 .013 236.62); --color-sky-100: oklch(.951 .026 236.824); --color-sky-200: oklch(.901 .058 230.902); --color-sky-300: oklch(.828 .111 230.318); --color-sky-400: oklch(.746 .16 232.661); --color-sky-500: oklch(.685 .169 237.323); --color-sky-600: oklch(.588 .158 241.966); --color-sky-700: oklch(.5 .134 242.749); --color-sky-800: oklch(.443 .11 240.79); --color-sky-900: oklch(.391 .09 240.876); --color-sky-950: oklch(.293 .066 243.157); --color-blue-50: oklch(.97 .014 254.604); --color-blue-100: oklch(.932 .032 255.585); --color-blue-200: oklch(.882 .059 254.128); --color-blue-300: oklch(.809 .105 251.813); --color-blue-400: oklch(.707 .165 254.624); --color-blue-500: oklch(.623 .214 259.815); --color-blue-600: oklch(.546 .245 262.881); --color-blue-700: oklch(.488 .243 264.376); --color-blue-800: oklch(.424 .199 265.638); --color-blue-900: oklch(.379 .146 265.522); --color-blue-950: oklch(.282 .091 267.935); --color-indigo-50: oklch(.962 .018 272.314); --color-indigo-100: oklch(.93 .034 272.788); --color-indigo-200: oklch(.87 .065 274.039); --color-indigo-300: oklch(.785 .115 274.713); --color-indigo-400: oklch(.673 .182 276.935); --color-indigo-500: oklch(.585 .233 277.117); --color-indigo-600: oklch(.511 .262 276.966); --color-indigo-700: oklch(.457 .24 277.023); --color-indigo-800: oklch(.398 .195 277.366); --color-indigo-900: oklch(.359 .144 278.697); --color-indigo-950: oklch(.257 .09 281.288); --color-violet-50: oklch(.969 .016 293.756); --color-violet-100: oklch(.943 .029 294.588); --color-violet-200: oklch(.894 .057 293.283); --color-violet-300: oklch(.811 .111 293.571); --color-violet-400: oklch(.702 .183 293.541); --color-violet-500: oklch(.606 .25 292.717); --color-violet-600: oklch(.541 .281 293.009); --color-violet-700: oklch(.491 .27 292.581); --color-violet-800: oklch(.432 .232 292.759); --color-violet-900: oklch(.38 .189 293.745); --color-violet-950: oklch(.283 .141 291.089); --color-purple-50: oklch(.977 .014 308.299); --color-purple-100: oklch(.946 .033 307.174); --color-purple-200: oklch(.902 .063 306.703); --color-purple-300: oklch(.827 .119 306.383); --color-purple-400: oklch(.714 .203 305.504); --color-purple-500: oklch(.627 .265 303.9); --color-purple-600: oklch(.558 .288 302.321); --color-purple-700: oklch(.496 .265 301.924); --color-purple-800: oklch(.438 .218 303.724); --color-purple-900: oklch(.381 .176 304.987); --color-purple-950: oklch(.291 .149 302.717); --color-fuchsia-50: oklch(.977 .017 320.058); --color-fuchsia-100: oklch(.952 .037 318.852); --color-fuchsia-200: oklch(.903 .076 319.62); --color-fuchsia-300: oklch(.833 .145 321.434); --color-fuchsia-400: oklch(.74 .238 322.16); --color-fuchsia-500: oklch(.667 .295 322.15); --color-fuchsia-600: oklch(.591 .293 322.896); --color-fuchsia-700: oklch(.518 .253 323.949); --color-fuchsia-800: oklch(.452 .211 324.591); --color-fuchsia-900: oklch(.401 .17 325.612); --color-fuchsia-950: oklch(.293 .136 325.661); --color-pink-50: oklch(.971 .014 343.198); --color-pink-100: oklch(.948 .028 342.258); --color-pink-200: oklch(.899 .061 343.231); --color-pink-300: oklch(.823 .12 346.018); --color-pink-400: oklch(.718 .202 349.761); --color-pink-500: oklch(.656 .241 354.308); --color-pink-600: oklch(.592 .249 .584); --color-pink-700: oklch(.525 .223 3.958); --color-pink-800: oklch(.459 .187 3.815); --color-pink-900: oklch(.408 .153 2.432); --color-pink-950: oklch(.284 .109 3.907); --color-rose-50: oklch(.969 .015 12.422); --color-rose-100: oklch(.941 .03 12.58); --color-rose-200: oklch(.892 .058 10.001); --color-rose-300: oklch(.81 .117 11.638); --color-rose-400: oklch(.712 .194 13.428); --color-rose-500: oklch(.645 .246 16.439); --color-rose-600: oklch(.586 .253 17.585); --color-rose-700: oklch(.514 .222 16.935); --color-rose-800: oklch(.455 .188 13.697); --color-rose-900: oklch(.41 .159 10.272); --color-rose-950: oklch(.271 .105 12.094); --color-slate-50: oklch(.984 .003 247.858); --color-slate-100: oklch(.968 .007 247.896); --color-slate-200: oklch(.929 .013 255.508); --color-slate-300: oklch(.869 .022 252.894); --color-slate-400: oklch(.704 .04 256.788); --color-slate-500: oklch(.554 .046 257.417); --color-slate-600: oklch(.446 .043 257.281); --color-slate-700: oklch(.372 .044 257.287); --color-slate-800: oklch(.279 .041 260.031); --color-slate-900: oklch(.208 .042 265.755); --color-slate-950: oklch(.129 .042 264.695); --color-gray-50: oklch(.985 .002 247.839); --color-gray-100: oklch(.967 .003 264.542); --color-gray-200: oklch(.928 .006 264.531); --color-gray-300: oklch(.872 .01 258.338); --color-gray-400: oklch(.707 .022 261.325); --color-gray-500: oklch(.551 .027 264.364); --color-gray-600: oklch(.446 .03 256.802); --color-gray-700: oklch(.373 .034 259.733); --color-gray-800: oklch(.278 .033 256.848); --color-gray-900: oklch(.21 .034 264.665); --color-gray-950: oklch(.13 .028 261.692); --color-zinc-50: oklch(.985 0 0); --color-zinc-100: oklch(.967 .001 286.375); --color-zinc-200: oklch(.92 .004 286.32); --color-zinc-300: oklch(.871 .006 286.286); --color-zinc-400: oklch(.705 .015 286.067); --color-zinc-500: oklch(.552 .016 285.938); --color-zinc-600: oklch(.442 .017 285.786); --color-zinc-700: oklch(.37 .013 285.805); --color-zinc-800: oklch(.274 .006 286.033); --color-zinc-900: oklch(.21 .006 285.885); --color-zinc-950: oklch(.141 .005 285.823); --color-neutral-50: oklch(.985 0 0); --color-neutral-100: oklch(.97 0 0); --color-neutral-200: oklch(.922 0 0); --color-neutral-300: oklch(.87 0 0); --color-neutral-400: oklch(.708 0 0); --color-neutral-500: oklch(.556 0 0); --color-neutral-600: oklch(.439 0 0); --color-neutral-700: oklch(.371 0 0); --color-neutral-800: oklch(.269 0 0); --color-neutral-900: oklch(.205 0 0); --color-neutral-950: oklch(.145 0 0); --color-stone-50: oklch(.985 .001 106.423); --color-stone-100: oklch(.97 .001 106.424); --color-stone-200: oklch(.923 .003 48.717); --color-stone-300: oklch(.869 .005 56.366); --color-stone-400: oklch(.709 .01 56.259); --color-stone-500: oklch(.553 .013 58.071); --color-stone-600: oklch(.444 .011 73.639); --color-stone-700: oklch(.374 .01 67.558); --color-stone-800: oklch(.268 .007 34.298); --color-stone-900: oklch(.216 .006 56.043); --color-stone-950: oklch(.147 .004 49.25); --color-black: #000; --color-white: #fff; --spacing: .25rem; --breakpoint-sm: 40rem; --breakpoint-md: 48rem; --breakpoint-lg: 64rem; --breakpoint-xl: 80rem; --breakpoint-2xl: 96rem; --container-3xs: 16rem; --container-2xs: 18rem; --container-xs: 20rem; --container-sm: 24rem; --container-md: 28rem; --container-lg: 32rem; --container-xl: 36rem; --container-2xl: 42rem; --container-3xl: 48rem; --container-4xl: 56rem; --container-5xl: 64rem; --container-6xl: 72rem; --container-7xl: 80rem; --text-xs: .75rem; --text-xs--line-height: calc(1/.75); --text-sm: .875rem; --text-sm--line-height: calc(1.25/.875); --text-base: 1rem; --text-base--line-height: calc(1.5/1); --text-lg: 1.125rem; --text-lg--line-height: calc(1.75/1.125); --text-xl: 1.25rem; --text-xl--line-height: calc(1.75/1.25); --text-2xl: 1.5rem; --text-2xl--line-height: calc(2/1.5); --text-3xl: 1.875rem; --text-3xl--line-height: calc(2.25/1.875); --text-4xl: 2.25rem; --text-4xl--line-height: calc(2.5/2.25); --text-5xl: 3rem; --text-5xl--line-height: 1; --text-6xl: 3.75rem; --text-6xl--line-height: 1; --text-7xl: 4.5rem; --text-7xl--line-height: 1; --text-8xl: 6rem; --text-8xl--line-height: 1; --text-9xl: 8rem; --text-9xl--line-height: 1; --font-weight-thin: 100; --font-weight-extralight: 200; --font-weight-light: 300; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --font-weight-extrabold: 800; --font-weight-black: 900; --tracking-tighter: -.05em; --tracking-tight: -.025em; --tracking-normal: 0em; --tracking-wide: .025em; --tracking-wider: .05em; --tracking-widest: .1em; --leading-tight: 1.25; --leading-snug: 1.375; --leading-normal: 1.5; --leading-relaxed: 1.625; --leading-loose: 2; --radius-xs: .125rem; --radius-sm: .25rem; --radius-md: .375rem; --radius-lg: .5rem; --radius-xl: .75rem; --radius-2xl: 1rem; --radius-3xl: 1.5rem; --radius-4xl: 2rem; --shadow-2xs: 0 1px #0000000d; --shadow-xs: 0 1px 2px 0 #0000000d; --shadow-sm: 0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a; --shadow-md: 0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a; --shadow-lg: 0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a; --shadow-xl: 0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a; --shadow-2xl: 0 25px 50px -12px #00000040; --inset-shadow-2xs: inset 0 1px #0000000d; --inset-shadow-xs: inset 0 1px 1px #0000000d; --inset-shadow-sm: inset 0 2px 4px #0000000d; --drop-shadow-xs: 0 1px 1px #0000000d; --drop-shadow-sm: 0 1px 2px #00000026; --drop-shadow-md: 0 3px 3px #0000001f; --drop-shadow-lg: 0 4px 4px #00000026; --drop-shadow-xl: 0 9px 7px #0000001a; --drop-shadow-2xl: 0 25px 25px #00000026; --blur-xs: 4px; --blur-sm: 8px; --blur-md: 12px; --blur-lg: 16px; --blur-xl: 24px; --blur-2xl: 40px; --blur-3xl: 64px; --perspective-dramatic: 100px; --perspective-near: 300px; --perspective-normal: 500px; --perspective-midrange: 800px; --perspective-distant: 1200px; --aspect-video: 16/9; --ease-in: cubic-bezier(.4,0,1,1); --ease-out: cubic-bezier(0,0,.2,1); --ease-in-out: cubic-bezier(.4,0,.2,1); --animate-spin: spin 1s linear infinite; --animate-ping: ping 1s cubic-bezier(0,0,.2,1)infinite; --animate-pulse: pulse 2s cubic-bezier(.4,0,.6,1)infinite; --animate-bounce: bounce 1s infinite; @keyframes spin { to { transform: rotate(360deg); }}@keyframes ping { 75%,100% { transform: scale(2); opacity: 0; }}@keyframes pulse { 50% { opacity: .5; }}@keyframes bounce { 0%,100% { transform: translateY(-25%); animation-timing-function: cubic-bezier(.8,0,1,1); }50% { transform: none; animation-timing-function: cubic-bezier(0,0,.2,1); }}}`;
+export default css;

package/dist/atomic/components/global/tailwind.properties.css.js

@@ -0,0 +1,2 @@
+const css = `@layer properties{*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-x-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial;--tw-content:""}}`;
+export default css;

package/dist/atomic/components/mixins/commerce-layout-mixin.js

@@ -0,0 +1,48 @@
+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 { unsafeCSS } from 'lit';
+import { buildCommerceLayout } from '../components/commerce/atomic-commerce-layout/commerce-layout';
+import { injectStylesForNoShadowDOM } from '../decorators/inject-styles-for-no-shadow-dom';
+import { randomID } from '../utils/utils';
+/**
+ *
+ * @param superClass The class to extend, typically a LitElement.
+ * @param cssResult The CSSResult to inject into the component styles.
+ * @returns A new class that extends the provided superClass with the commerce layout mixin.
+ *
+ * @remarks
+ * Any Lit component using this mixin MUST declare the following public properties:
+ * - `error: Error`
+ * - `mobileBreakpoint: string`
+ */
+export const CommerceLayoutMixin = (superClass, cssResult) => {
+    var CommerceLayoutMixinClass_1;
+    let CommerceLayoutMixinClass = CommerceLayoutMixinClass_1 = class CommerceLayoutMixinClass extends superClass {
+        // biome-ignore lint/suspicious/noExplicitAny: <>
+        constructor(...args) {
+            super(...args);
+            if (!this.id) {
+                this.id = randomID('atomic-commerce-layout-');
+            }
+        }
+        connectedCallback() {
+            super.connectedCallback();
+            // @ts-expect-error: Casting to CommerceLayoutRequirements to access required properties (`error`, `mobileBreakpoint`) without changing the mixin's template type from LitElement. This keeps the mixin simple but handles invalid values.
+            const self = this;
+            if (self.mobileBreakpoint === undefined) {
+                self.error = new Error('The "mobileBreakpoint" property is not defined. Make sure the component is initialized with a valid value.');
+            }
+            const layout = unsafeCSS(buildCommerceLayout(this, self.mobileBreakpoint));
+            CommerceLayoutMixinClass_1.styles.unshift(layout);
+        }
+    };
+    CommerceLayoutMixinClass.styles = [cssResult];
+    CommerceLayoutMixinClass = CommerceLayoutMixinClass_1 = __decorate([
+        injectStylesForNoShadowDOM
+    ], CommerceLayoutMixinClass);
+    return CommerceLayoutMixinClass;
+};

package/dist/atomic/components/mixins/item-section-mixin.js

@@ -1,28 +1,19 @@
-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 { hideEmptySection } from "../utils/item-section-utils";
-import { injectStylesForNoShadowDOM } from '../decorators/inject-styles-for-no-shadow-dom.js';
 /**
  * Mixin for product section components that provides common functionality.
  * All product section components extend LitElement and call hideEmptySection in updated().
  *
  * @param superClass - The base class to extend
- * @param styles - The styles to apply to the section.
  * @returns A class that extends the superClass with product section functionality
  */
-export function ItemSectionMixin(superClass, styles) {
-    let ProductSectionMixinClass = class ProductSectionMixinClass extends superClass {
+export function ItemSectionMixin(superClass) {
+    class ProductSectionMixinClass extends superClass {
+        createRenderRoot() {
+            return this;
+        }
         updated() {
             hideEmptySection(this);
         }
-    };
-    ProductSectionMixinClass.styles = styles;
-    ProductSectionMixinClass = __decorate([
-        injectStylesForNoShadowDOM
-    ], ProductSectionMixinClass);
+    }
     return ProductSectionMixinClass;
 }

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

@@ -3,7 +3,7 @@ import { s as sectionSelector, f as findSection } from './sections.js';
 function makeDesktopQuery$1(mobileBreakpoint) {
     return `only screen and (min-width: ${mobileBreakpoint})`;
 }
-function buildCommonLayout(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noItemsSelector, errorSelector, refineToggleSelector, sortDropdownSelector) {
+function buildSearchLayoutCommon(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noItemsSelector, errorSelector, refineToggleSelector, sortDropdownSelector) {
     const id = element.id;
     const layoutSelector = `${layoutWebComponentTagName}#${id}`;
     const cleanStatusSelector = `${containerWebComponentTagName}:not(.${noItemsSelector}, .${errorSelector})`;
@@ -92,7 +92,7 @@ function makeDesktopQuery(mobileBreakpoint) {
     return `only screen and (min-width: ${mobileBreakpoint})`;
 }
 function buildSearchLayout(element, mobileBreakpoint) {
-    return buildCommonLayout(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noResultsSelector, errorSelector, 'atomic-refine-toggle', 'atomic-sort-dropdown');
+    return buildSearchLayoutCommon(element, mobileBreakpoint, layoutWebComponentTagName, containerWebComponentTagName, noResultsSelector, errorSelector, 'atomic-refine-toggle', 'atomic-sort-dropdown');
 }
 
 export { buildSearchLayout as b, errorSelector as e, firstSearchExecutedSelector as f, makeDesktopQuery as m, noResultsSelector as n };

package/dist/atomic/components/search-layout.js.map

@@ -1 +1 @@
-{"file":"search-layout.js","mappings":";;SAEgBA,kBAAgB,CAAC,gBAAwB;IACvD,OAAO,+BAA+B,gBAAgB,GAAG,CAAC;AAC5D,CAAC;SACe,iBAAiB,CAC/B,OAAoB,EACpB,gBAAwB,EACxB,yBAAiC,EACjC,4BAAoC,EACpC,eAAuB,EACvB,aAAqB,EACrB,oBAA4B,EAC5B,oBAA4B;IAE5B,MAAM,EAAE,GAAG,OAAO,CAAC,EAAE,CAAC;IACtB,MAAM,cAAc,GAAG,GAAG,yBAAyB,IAAI,EAAE,EAAE,CAAC;IAC5D,MAAM,mBAAmB,GAAG,GAAG,4BAA4B,SAAS,eAAe,MAAM,aAAa,GAAG,CAAC;IAC1G,MAAM,kBAAkB,GAAG,UAAUA,kBAAgB,CAAC,gBAAgB,CAAC,EAAE,CAAC;IAE1E,MAAM,OAAO,GAAG,GAAG,cAAc,oBAAoB,CAAC;IACtD,MAAM,MAAM,GAAG,GAAG,kBAAkB;MAChC,cAAc,IAAI,eAAe,CAAC,QAAQ,CAAC;;;;IAI7C,CAAC;IAEH,MAAM,MAAM,GAAG;QACb,MAAM,aAAa,GAAG,WAAW,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;QACrD,MAAM,WAAW,GAAG,WAAW,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QACjD,IAAI,CAAC,aAAa,IAAI,CAAC,WAAW,EAAE;YAClC,OAAO,EAAE,CAAC;SACX;QAED,MAAM,SAAS,GAAG,aAAa,CAAC,QAAQ,IAAI,OAAO,CAAC;QACpD,MAAM,SAAS,GAAG,aAAa,CAAC,QAAQ,IAAI,OAAO,CAAC;QACpD,MAAM,OAAO,GAAG,WAAW,CAAC,QAAQ,IAAI,KAAK,CAAC;QAC9C,MAAM,OAAO,GAAG,WAAW,CAAC,QAAQ,IAAI,OAAO,CAAC;QAEhD,OAAO,GAAG,kBAAkB;QACxB,cAAc;;;;;uBAKC,SAAS,KAAK,SAAS,YAAY,OAAO,KAAK,OAAO;;;;QAIrE,mBAAmB,IAAI,cAAc;;;;;;;QAOrC,mBAAmB,IAAI,cAAc,IAAI,eAAe,CAAC,QAAQ,CAAC;;;MAGpE,CAAC;KACJ,CAAC;IAEF,MAAM,MAAM,GAAG;QACb,MAAM,aAAa,GAAG,WAAW,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;QACrD,IAAI,CAAC,aAAa,EAAE;YAClB,OAAO,EAAE,CAAC;SACX;QAED,MAAM,YAAY,GAAG,aAAa,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;QACvE,IAAI,CAAC,YAAY,EAAE;YACjB,OAAO,EAAE,CAAC;SACX;QAED,MAAM,cAAc,GAAG,GAAG,cAAc,IAAI,eAAe,CAAC,QAAQ,CAAC,EAAE,CAAC;QACxE,OAAO,GAAG,cAAc,IAAI,oBAAoB;;;;MAI9C,kBAAkB;OACjB,cAAc,IAAI,oBAAoB;;;;QAIrC,cAAc,IAAI,oBAAoB;;;MAGxC,CAAC;KACJ,CAAC;IAEF,MAAM,gBAAgB,GAAG;QACvB,OAAO,GAAG,kBAAkB;QACxB,cAAc,IAAI,eAAe,CACjC,mBAAmB,CACpB;;;MAGD,CAAC;KACJ,CAAC;IAEF,OAAO,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,EAAE,gBAAgB,EAAE,CAAC;SAC7D,MAAM,CAAC,CAAC,WAAW,KAAK,WAAW,KAAK,EAAE,CAAC;SAC3C,IAAI,CAAC,MAAM,CAAC,CAAC;AAClB;;ACrGO,MAAM,yBAAyB,GAAG,sBAAsB,CAAC;AACzD,MAAM,4BAA4B,GAAG,yBAAyB,CAAC;MACzD,iBAAiB,GAAG,GAAG,4BAA4B,cAAc;MACjE,aAAa,GAAG,GAAG,4BAA4B,SAAS;MACxD,2BAA2B,GAAG,GAAG,4BAA4B,mBAAmB;SAE7E,gBAAgB,CAAC,gBAAwB;IACvD,OAAO,+BAA+B,gBAAgB,GAAG,CAAC;AAC5D,CAAC;SACe,iBAAiB,CAC/B,OAAoB,EACpB,gBAAwB;IAExB,OAAO,iBAAiB,CACtB,OAAO,EACP,gBAAgB,EAChB,yBAAyB,EACzB,4BAA4B,EAC5B,iBAAiB,EACjB,aAAa,EACb,sBAAsB,EACtB,sBAAsB,CACvB,CAAC;AACJ;;;;","names":["makeDesktopQuery"],"sources":["src/components/common/atomic-layout-section/layout.ts","src/components/search/atomic-layout/search-layout.ts"],"sourcesContent":["import {findSection, sectionSelector} from './sections';\n\nexport function makeDesktopQuery(mobileBreakpoint: string) {\n  return `only screen and (min-width: ${mobileBreakpoint})`;\n}\nexport function buildCommonLayout(\n  element: HTMLElement,\n  mobileBreakpoint: string,\n  layoutWebComponentTagName: string,\n  containerWebComponentTagName: string,\n  noItemsSelector: string,\n  errorSelector: string,\n  refineToggleSelector: string,\n  sortDropdownSelector: string\n) {\n  const id = element.id;\n  const layoutSelector = `${layoutWebComponentTagName}#${id}`;\n  const cleanStatusSelector = `${containerWebComponentTagName}:not(.${noItemsSelector}, .${errorSelector})`;\n  const mediaQuerySelector = `@media ${makeDesktopQuery(mobileBreakpoint)}`;\n\n  const display = `${layoutSelector} { display: grid }`;\n  const search = `${mediaQuerySelector} {\n    ${layoutSelector} ${sectionSelector('search')} {\n      justify-self: start;\n      width: 80%;\n    }\n  }`;\n\n  const facets = () => {\n    const facetsSection = findSection(element, 'facets');\n    const mainSection = findSection(element, 'main');\n    if (!facetsSection || !mainSection) {\n      return '';\n    }\n\n    const facetsMin = facetsSection.minWidth || '17rem';\n    const facetsMax = facetsSection.maxWidth || '22rem';\n    const mainMin = mainSection.minWidth || '50%';\n    const mainMax = mainSection.maxWidth || '70rem';\n\n    return `${mediaQuerySelector} {\n      ${layoutSelector} {\n        grid-template-areas:\n        '. .                     atomic-section-search .'\n        '. atomic-section-main   atomic-section-main   .';\n        grid-template-columns:\n          1fr minmax(${facetsMin}, ${facetsMax}) minmax(${mainMin}, ${mainMax}) 1fr;\n        column-gap: var(--atomic-layout-spacing-x);\n      }\n\n      ${cleanStatusSelector} ${layoutSelector} {\n        grid-template-areas:\n          '. .                     atomic-section-search .'\n          '. atomic-section-facets atomic-section-main   .'\n          '. atomic-section-facets .                     .';\n      }\n\n      ${cleanStatusSelector} ${layoutSelector} ${sectionSelector('facets')} {\n        display: block;\n      }\n    }`;\n  };\n\n  const refine = (): string => {\n    const statusSection = findSection(element, 'status');\n    if (!statusSection) {\n      return '';\n    }\n\n    const refineToggle = statusSection.querySelector(refineToggleSelector);\n    if (!refineToggle) {\n      return '';\n    }\n\n    const statusSelector = `${layoutSelector} ${sectionSelector('status')}`;\n    return `${statusSelector} ${sortDropdownSelector} {\n      display: none;\n    }\n\n    ${mediaQuerySelector} {\n     ${statusSelector} ${sortDropdownSelector} {\n       display: block;\n      }\n\n      ${statusSelector} ${refineToggleSelector} {\n        display: none;\n       }\n    }`;\n  };\n\n  const horizontalFacets = () => {\n    return `${mediaQuerySelector} {\n      ${layoutSelector} ${sectionSelector(\n        'horizontal-facets'\n      )} > atomic-popover:not(.atomic-hidden) {\n        display: block;\n      }\n    }`;\n  };\n\n  return [display, search, facets(), refine(), horizontalFacets()]\n    .filter((declaration) => declaration !== '')\n    .join('\\n\\n');\n}\n","import {buildCommonLayout} from '../../common/atomic-layout-section/layout';\n\nexport const layoutWebComponentTagName = 'atomic-search-layout';\nexport const containerWebComponentTagName = 'atomic-search-interface';\nexport const noResultsSelector = `${containerWebComponentTagName}-no-results`;\nexport const errorSelector = `${containerWebComponentTagName}-error`;\nexport const firstSearchExecutedSelector = `${containerWebComponentTagName}-search-executed`;\n\nexport function makeDesktopQuery(mobileBreakpoint: string) {\n  return `only screen and (min-width: ${mobileBreakpoint})`;\n}\nexport function buildSearchLayout(\n  element: HTMLElement,\n  mobileBreakpoint: string\n) {\n  return buildCommonLayout(\n    element,\n    mobileBreakpoint,\n    layoutWebComponentTagName,\n    containerWebComponentTagName,\n    noResultsSelector,\n    errorSelector,\n    'atomic-refine-toggle',\n    'atomic-sort-dropdown'\n  );\n}\n"],"version":3}
+{"file":"search-layout.js","mappings":"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","names":["makeDesktopQuery"],"sources":["src/components/common/atomic-layout-section/search-layout.ts","src/components/search/atomic-layout/search-layout.ts"],"sourcesContent":["import {\n  findSection,\n  sectionSelector,\n} from '../../common/atomic-layout-section/sections';\n\nexport function makeDesktopQuery(mobileBreakpoint: string) {\n  return `only screen and (min-width: ${mobileBreakpoint})`;\n}\nexport function buildSearchLayoutCommon(\n  element: HTMLElement,\n  mobileBreakpoint: string,\n  layoutWebComponentTagName: string,\n  containerWebComponentTagName: string,\n  noItemsSelector: string,\n  errorSelector: string,\n  refineToggleSelector: string,\n  sortDropdownSelector: string\n) {\n  const id = element.id;\n  const layoutSelector = `${layoutWebComponentTagName}#${id}`;\n  const cleanStatusSelector = `${containerWebComponentTagName}:not(.${noItemsSelector}, .${errorSelector})`;\n  const mediaQuerySelector = `@media ${makeDesktopQuery(mobileBreakpoint)}`;\n\n  const display = `${layoutSelector} { display: grid }`;\n  const search = `${mediaQuerySelector} {\n    ${layoutSelector} ${sectionSelector('search')} {\n      justify-self: start;\n      width: 80%;\n    }\n  }`;\n\n  const facets = () => {\n    const facetsSection = findSection(element, 'facets');\n    const mainSection = findSection(element, 'main');\n    if (!facetsSection || !mainSection) {\n      return '';\n    }\n\n    const facetsMin = facetsSection.minWidth || '17rem';\n    const facetsMax = facetsSection.maxWidth || '22rem';\n    const mainMin = mainSection.minWidth || '50%';\n    const mainMax = mainSection.maxWidth || '70rem';\n\n    return `${mediaQuerySelector} {\n      ${layoutSelector} {\n        grid-template-areas:\n        '. .                     atomic-section-search .'\n        '. atomic-section-main   atomic-section-main   .';\n        grid-template-columns:\n          1fr minmax(${facetsMin}, ${facetsMax}) minmax(${mainMin}, ${mainMax}) 1fr;\n        column-gap: var(--atomic-layout-spacing-x);\n      }\n\n      ${cleanStatusSelector} ${layoutSelector} {\n        grid-template-areas:\n          '. .                     atomic-section-search .'\n          '. atomic-section-facets atomic-section-main   .'\n          '. atomic-section-facets .                     .';\n      }\n\n      ${cleanStatusSelector} ${layoutSelector} ${sectionSelector('facets')} {\n        display: block;\n      }\n    }`;\n  };\n\n  const refine = (): string => {\n    const statusSection = findSection(element, 'status');\n    if (!statusSection) {\n      return '';\n    }\n\n    const refineToggle = statusSection.querySelector(refineToggleSelector);\n    if (!refineToggle) {\n      return '';\n    }\n\n    const statusSelector = `${layoutSelector} ${sectionSelector('status')}`;\n    return `${statusSelector} ${sortDropdownSelector} {\n      display: none;\n    }\n\n    ${mediaQuerySelector} {\n     ${statusSelector} ${sortDropdownSelector} {\n       display: block;\n      }\n\n      ${statusSelector} ${refineToggleSelector} {\n        display: none;\n       }\n    }`;\n  };\n\n  const horizontalFacets = () => {\n    return `${mediaQuerySelector} {\n      ${layoutSelector} ${sectionSelector(\n        'horizontal-facets'\n      )} > atomic-popover:not(.atomic-hidden) {\n        display: block;\n      }\n    }`;\n  };\n\n  return [display, search, facets(), refine(), horizontalFacets()]\n    .filter((declaration) => declaration !== '')\n    .join('\\n\\n');\n}\n","import {buildSearchLayoutCommon} from '../../common/atomic-layout-section/search-layout';\n\nexport const layoutWebComponentTagName = 'atomic-search-layout';\nexport const containerWebComponentTagName = 'atomic-search-interface';\nexport const noResultsSelector = `${containerWebComponentTagName}-no-results`;\nexport const errorSelector = `${containerWebComponentTagName}-error`;\nexport const firstSearchExecutedSelector = `${containerWebComponentTagName}-search-executed`;\n\nexport function makeDesktopQuery(mobileBreakpoint: string) {\n  return `only screen and (min-width: ${mobileBreakpoint})`;\n}\nexport function buildSearchLayout(\n  element: HTMLElement,\n  mobileBreakpoint: string\n) {\n  return buildSearchLayoutCommon(\n    element,\n    mobileBreakpoint,\n    layoutWebComponentTagName,\n    containerWebComponentTagName,\n    noResultsSelector,\n    errorSelector,\n    'atomic-refine-toggle',\n    'atomic-sort-dropdown'\n  );\n}\n"],"version":3}

package/dist/atomic/components/themes/accessible.css.js

@@ -0,0 +1,2 @@
+const css = `:root{--atomic-primary:#303f9f;--atomic-primary-light:#666ad1;--atomic-primary-dark:#001970;--atomic-on-primary:#fff;--atomic-ring-primary:#303f9f80;--atomic-neutral-dark:#424242;--atomic-neutral-dim:#bfc4c8;--atomic-neutral:#e5e8e8;--atomic-neutral-light:#f6f7f9;--atomic-neutral-lighter:#f2f2f2;--atomic-background:#fff;--atomic-on-background:#000;--atomic-success:#12a244;--atomic-error:#ce3f00;--atomic-visited:#752e9c;--atomic-disabled:#c5cacf;--atomic-success-background:#c5f4e6;--atomic-error-background:#f6a5a8;--atomic-primary-background:#edf6ff;--atomic-inline-code:#cd2113;--atomic-table-outer-border:#757575;--atomic-table-inner-border:#757575;--atomic-table-header-background:#e0e0e0;--atomic-table-header-delimiter:#424242;--atomic-border-radius:.25rem;--atomic-border-radius-md:.5rem;--atomic-border-radius-lg:.75rem;--atomic-border-radius-xl:1rem;--atomic-font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,segoe ui,helvetica neue,helvetica,Ubuntu,roboto,noto,arial,sans-serif;--atomic-font-normal:400;--atomic-font-bold:700;--atomic-text-base:.875rem;--atomic-text-sm:.75rem;--atomic-text-lg:1rem;--atomic-text-xl:1.125rem;--atomic-text-2xl:1.5rem;--atomic-line-height-ratio:1.5;--atomic-layout-spacing-x:1.5rem;--atomic-layout-spacing-y:1rem;--atomic-rating-icon-active-color:#f6ce3c;--atomic-rating-icon-outline:none;--animate-slide-down-modal:slideDown .5s linear forwards;--animate-scale-up-modal:scaleUp .5s cubic-bezier(.165,.84,.44,1)forwards;--spacing:.25rem}`;
+export default css;