@coveo/atomic 3.33.9-pre.5fbff5b5f4 → 3.33.9-pre.feafe1d6de

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

@@ -0,0 +1,496 @@
+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 { 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';
+import { customElement, property, state } from 'lit/decorators.js';
+import { when } from 'lit/directives/when.js';
+import { InterfaceController, } from "../../common/interface/interface-controller";
+import { MobileBreakpointController } from "../../common/layout/mobile-breakpoint-controller";
+import { bindingsContext } from "../../context/bindings-context";
+import { errorSelector, firstSearchExecutedSelector, noResultsSelector, } from "../atomic-search-layout/search-layout";
+import { booleanConverter } from "../../../converters/boolean-converter";
+import { errorGuard } from "../../../decorators/error-guard";
+import { watch } from "../../../decorators/watch";
+import { withTailwindStyles } from "../../../decorators/with-tailwind-styles.js";
+import { ChildrenUpdateCompleteMixin } from "../../../mixins/children-update-complete-mixin";
+import { markParentAsReady } from "../../../utils/init-queue";
+import { SafeStorage, StorageItems, } from "../../../utils/local-storage-utils";
+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";
+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.
+ *
+ * @slot default - The default slot where you can add child components to the interface.
+ */
+let AtomicSearchInterface = class AtomicSearchInterface extends ChildrenUpdateCompleteMixin(LitElement) {
+    constructor() {
+        super();
+        this.bindings = {};
+        this.relevanceInspectorIsOpen = false;
+        this.unsubscribeUrlManager = () => { };
+        this.unsubscribeSearchStatus = () => { };
+        this.initialized = false;
+        this.interfaceController = new InterfaceController(this, 'CoveoAtomic', HEADLESS_VERSION);
+        /**
+         * A list of non-default fields to include in the query results.
+         *
+         * Specify the property as an array using a JSON string representation:
+         * ```html
+         * <atomic-search-interface fields-to-include='["fieldA", "fieldB"]'></atomic-search-interface>
+         * ```
+         */
+        this.fieldsToInclude = [];
+        // TODO - KIT-4994: Add disableAnalytics property that defaults to false.
+        // TODO - KIT-4994: Deprecate in favor of disableAnalytics property.
+        // TODO - (v4) KIT-4990: Remove.
+        /**
+         * Whether analytics should be enabled.
+         */
+        this.analytics = true;
+        /**
+         * The search interface language.
+         */
+        this.language = 'en';
+        // TODO - (v4) KIT-4823: Remove.
+        /**
+         * 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;
+        /**
+         * Whether to disable state reflection in the URL parameters.
+         */
+        this.disableStateReflectionInUrl = false;
+        /**
+         * The CSS selector for the container where the interface will scroll back to.
+         */
+        this.scrollContainer = 'atomic-search-interface';
+        /**
+         * The language assets path. By default, this will be a relative URL pointing to `./lang`.
+         *
+         * Example: "/mypublicpath/languages"
+         *
+         */
+        this.languageAssetsPath = './lang';
+        /**
+         * The icon assets path. By default, this will be a relative URL pointing to `./assets`.
+         *
+         * Example: "/mypublicpath/icons"
+         *
+         */
+        this.iconAssetsPath = './assets';
+        // TODO - (v4) KIT-5004: Remove.
+        /**
+         * Whether the relevance inspector shortcut should be enabled for this interface.
+         *
+         * The relevance inspector can be opened by holding the Alt key (Option on Mac) while over the interface, and performing a double click.
+         *
+         * The relevance inspector allows to troubleshoot and debug queries.
+         * @deprecated - replaced by `disable-relevance-inspector` (this defaults to `true`, while the replacement defaults to `false`).
+         */
+        this.enableRelevanceInspector = true;
+        /**
+         * Whether to disable the relevance inspector shortcut for this interface.
+         */
+        this.disableRelevanceInspector = false;
+        this.handleInitialization = (event) => {
+            this.interfaceController.onComponentInitializing(event);
+        };
+        this.handleRelevanceInspectorDoubleClick = (e) => {
+            if (e.altKey) {
+                this.relevanceInspectorIsOpen = !this.relevanceInspectorIsOpen;
+            }
+        };
+        this.onHashChange = () => {
+            this.urlManager.synchronize(this.fragment);
+        };
+        this.store = createSearchStore();
+        new MobileBreakpointController(this, this.store);
+        const { promise, resolve } = Promise.withResolvers();
+        this.i18Initialized = promise;
+        this.i18n = i18next.createInstance(undefined, resolve);
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.store.setLoadingFlag(FirstSearchExecutedFlag);
+        this.initRelevanceInspector();
+        this.addEventListener('atomic/initializeComponent', this.handleInitialization);
+        this.addEventListener('atomic/scrollToTop', this.scrollToTop);
+        this.addEventListener('atomic/relevanceInspector/close', this.closeRelevanceInspector);
+    }
+    willUpdate(changedProperties) {
+        super.willUpdate(changedProperties);
+        if (changedProperties.has('fieldsToInclude')) {
+            this.initFieldsToInclude();
+        }
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        if (typeof this.unsubscribeUrlManager === 'function') {
+            this.unsubscribeUrlManager();
+        }
+        if (typeof this.unsubscribeSearchStatus === 'function') {
+            this.unsubscribeSearchStatus();
+        }
+        window.removeEventListener('hashchange', this.onHashChange);
+        this.removeEventListener('atomic/initializeComponent', this.handleInitialization);
+        this.removeEventListener('atomic/scrollToTop', this.scrollToTop);
+        this.removeEventListener('atomic/relevanceInspector/close', this.closeRelevanceInspector);
+        this.removeEventListener('dblclick', this.handleRelevanceInspectorDoubleClick);
+    }
+    // TODO - (v4) KIT-4991: Make private.
+    scrollToTop() {
+        const scrollContainerElement = document.querySelector(this.scrollContainer);
+        if (!scrollContainerElement) {
+            this.bindings.engine.logger.warn(`Could not find the scroll container with the selector "${this.scrollContainer}". This will prevent UX interactions that require a scroll from working correctly. Please review the CSS selector in the scrollContainer option`);
+            return;
+        }
+        scrollContainerElement.scrollIntoView({ behavior: 'smooth' });
+    }
+    closeRelevanceInspector() {
+        this.relevanceInspectorIsOpen = false;
+    }
+    /**
+     * Initializes the connection with the headless search engine using options for `accessToken` (required), `organizationId` (required), `environment` (defaults to `prod`), and `renewAccessToken`.
+     */
+    initialize(options) {
+        return this.internalInitialization(() => this.initEngine(options));
+    }
+    /**
+     * Initializes the interface using the provided [headless search engine](https://docs.coveo.com/en/headless/latest/reference/modules/Search.html, as opposed to the `initialize` method which internally builds a search engine instance.
+     * This bypasses the properties set on the component, such as analytics, searchHub, pipeline, language, timezone & logLevel.
+     */
+    initializeWithSearchEngine(engine) {
+        if (this.pipeline && this.pipeline !== engine.state.pipeline) {
+            console.warn('Mismatch between search interface pipeline and engine pipeline. The engine pipeline will be used.');
+        }
+        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.');
+        }
+        return this.internalInitialization(() => {
+            this.engine = engine;
+        });
+    }
+    /**
+     *
+     * Executes the first search and logs the interface load event to analytics, after initializing connection to the headless search engine.
+     */
+    async executeFirstSearch() {
+        if (!this.interfaceController.engineIsCreated(this.engine)) {
+            return;
+        }
+        if (!this.initialized) {
+            console.error('You have to wait until the "initialize" promise is fulfilled before executing a search.', this);
+            return;
+        }
+        const safeStorage = new SafeStorage();
+        const standaloneSearchBoxData = safeStorage.getParsedJSON(StorageItems.STANDALONE_SEARCH_BOX_DATA, null);
+        if (!standaloneSearchBoxData) {
+            this.engine.executeFirstSearch();
+            return;
+        }
+        safeStorage.removeItem(StorageItems.STANDALONE_SEARCH_BOX_DATA);
+        const { updateQuery } = loadQueryActions(this.engine);
+        const { value, enableQuerySyntax, analytics } = standaloneSearchBoxData;
+        this.engine.dispatch(updateQuery({ q: value, enableQuerySyntax }));
+        this.engine.executeFirstSearchAfterStandaloneSearchBoxRedirect(analytics);
+    }
+    updateSearchConfiguration(updatedProp, newValue) {
+        if (!this.interfaceController.engineIsCreated(this.engine)) {
+            return;
+        }
+        if (this.engine.state[updatedProp] === newValue) {
+            return;
+        }
+        const { updateSearchConfiguration } = loadSearchConfigurationActions(this.engine);
+        this.engine.dispatch(updateSearchConfiguration({
+            [updatedProp]: newValue,
+        }));
+    }
+    updateSearchHub() {
+        this.updateSearchConfiguration('searchHub', this.searchHub ?? 'default');
+    }
+    updatePipeline() {
+        this.updateSearchConfiguration('pipeline', this.pipeline);
+    }
+    toggleAnalytics() {
+        this.interfaceController.onAnalyticsChange();
+    }
+    updateLanguage() {
+        if (!this.interfaceController.engineIsCreated(this.engine) ||
+            !this.language) {
+            return;
+        }
+        const { updateSearchConfiguration } = loadSearchConfigurationActions(this.engine);
+        this.engine.dispatch(updateSearchConfiguration({
+            locale: this.language,
+        }));
+        return this.interfaceController.onLanguageChange();
+    }
+    updateIconAssetsPath() {
+        this.store.state.iconAssetsPath = this.iconAssetsPath;
+    }
+    getBindings() {
+        return {
+            engine: this.engine,
+            i18n: this.i18n,
+            store: this.store,
+            interfaceElement: this,
+            createStyleElement: () => {
+                const styleTag = document.createElement('style');
+                return styleTag;
+            },
+            // TODO - KIT-4893: Remove once atomic-quickview-modal migration is complete.
+            createScriptElement: () => {
+                const scriptTag = document.createElement('script');
+                return scriptTag;
+            },
+        };
+    }
+    initFieldsToInclude() {
+        const fields = EcommerceDefaultFieldsToInclude.concat(this.fieldsToInclude);
+        this.store.addFieldsToInclude(fields);
+    }
+    registerFieldsToInclude() {
+        this.engine?.dispatch(loadFieldActions(this.engine).registerFieldsToInclude(this.store.state.fieldsToInclude));
+    }
+    initEngine(options) {
+        const searchConfig = this.getSearchConfiguration(options);
+        const analyticsConfig = getAnalyticsConfig(options, this.analytics, this.store);
+        try {
+            this.engine = buildSearchEngine({
+                configuration: {
+                    ...options,
+                    search: searchConfig,
+                    analytics: analyticsConfig,
+                },
+                loggerOptions: {
+                    level: this.logLevel,
+                },
+            });
+        }
+        catch (error) {
+            this.error = error;
+            throw error;
+        }
+    }
+    getSearchConfiguration(options) {
+        const searchConfigFromProps = {
+            searchHub: this.searchHub ?? 'default',
+            pipeline: this.pipeline,
+            locale: this.language,
+            timezone: this.timezone,
+        };
+        if (options.search) {
+            return {
+                ...searchConfigFromProps,
+                ...options.search,
+            };
+        }
+        return searchConfigFromProps;
+    }
+    get fragment() {
+        return window.location.hash.slice(1);
+    }
+    initUrlManager() {
+        if (this.disableStateReflectionInUrl) {
+            return;
+        }
+        if (!this.reflectStateInUrl) {
+            return;
+        }
+        this.urlManager = buildUrlManager(this.engine, {
+            initialState: { fragment: this.fragment },
+        });
+        this.unsubscribeUrlManager = this.urlManager.subscribe(() => this.updateHash());
+        window.addEventListener('hashchange', this.onHashChange);
+    }
+    initRelevanceInspector() {
+        if (this.enableRelevanceInspector && !this.disableRelevanceInspector) {
+            this.addEventListener('dblclick', this.handleRelevanceInspectorDoubleClick);
+        }
+    }
+    initSearchStatus() {
+        this.searchStatus = buildSearchStatus(this.engine);
+        this.unsubscribeSearchStatus = this.searchStatus.subscribe(() => {
+            const hasNoResultsAfterInitialSearch = !this.searchStatus.state.hasResults &&
+                this.searchStatus.state.firstSearchExecuted &&
+                !this.searchStatus.state.hasError;
+            this.classList.toggle(noResultsSelector, hasNoResultsAfterInitialSearch);
+            this.classList.toggle(errorSelector, this.searchStatus.state.hasError);
+            this.classList.toggle(firstSearchExecutedSelector, this.searchStatus.state.firstSearchExecuted);
+            if (this.searchStatus.state.firstSearchExecuted &&
+                this.store.hasLoadingFlag(FirstSearchExecutedFlag)) {
+                this.store.unsetLoadingFlag(FirstSearchExecutedFlag);
+            }
+        });
+    }
+    updateHash() {
+        const newFragment = this.urlManager.state.fragment;
+        if (!this.searchStatus.state.firstSearchExecuted) {
+            history.replaceState(null, document.title, `#${newFragment}`);
+            this.bindings.engine.logger.info(`History replaceState #${newFragment}`);
+            return;
+        }
+        history.pushState(null, document.title, `#${newFragment}`);
+        this.bindings.engine.logger.info(`History pushState #${newFragment}`);
+    }
+    async internalInitialization(initEngine) {
+        await Promise.all([
+            this.interfaceController.onInitialization(initEngine),
+            this.i18Initialized,
+        ]);
+        this.updateLanguage();
+        this.bindings = this.getBindings();
+        markParentAsReady(this);
+        this.pipeline = this.engine.state.pipeline;
+        this.searchHub = this.engine.state.searchHub;
+        this.initSearchStatus();
+        await this.getUpdateComplete();
+        this.initUrlManager();
+        this.initialized = true;
+    }
+    render() {
+        return html `
+      ${when(this.bindings?.engine &&
+            this.enableRelevanceInspector &&
+            !this.disableRelevanceInspector, () => html `<atomic-relevance-inspector
+          ?open=${this.relevanceInspectorIsOpen}
+          .bindings=${this.bindings}
+        ></atomic-relevance-inspector>`)}
+      <slot></slot>
+    `;
+    }
+};
+AtomicSearchInterface.styles = [
+    css`:host{height:inherit;width:inherit;&>slot{height:inherit}}`,
+];
+__decorate([
+    state(),
+    provide({ context: bindingsContext })
+], AtomicSearchInterface.prototype, "bindings", void 0);
+__decorate([
+    state()
+], AtomicSearchInterface.prototype, "error", void 0);
+__decorate([
+    state()
+], AtomicSearchInterface.prototype, "relevanceInspectorIsOpen", void 0);
+__decorate([
+    property({
+        type: Array,
+        attribute: 'fields-to-include',
+        converter: {
+            fromAttribute: (value) => {
+                if (!value)
+                    return [];
+                try {
+                    const parsed = JSON.parse(value);
+                    return Array.isArray(parsed) ? parsed : [];
+                }
+                catch {
+                    return [];
+                }
+            },
+            toAttribute: (value) => JSON.stringify(value),
+        },
+    })
+], AtomicSearchInterface.prototype, "fieldsToInclude", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], AtomicSearchInterface.prototype, "pipeline", void 0);
+__decorate([
+    property({ type: String, attribute: 'search-hub', reflect: true })
+], AtomicSearchInterface.prototype, "searchHub", void 0);
+__decorate([
+    property({
+        type: Boolean,
+        converter: booleanConverter,
+        reflect: true,
+    })
+], AtomicSearchInterface.prototype, "analytics", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], AtomicSearchInterface.prototype, "timezone", void 0);
+__decorate([
+    property({ type: String, attribute: 'log-level', reflect: true })
+], AtomicSearchInterface.prototype, "logLevel", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], AtomicSearchInterface.prototype, "i18n", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], AtomicSearchInterface.prototype, "language", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], AtomicSearchInterface.prototype, "engine", void 0);
+__decorate([
+    property({
+        type: Boolean,
+        attribute: 'reflect-state-in-url',
+        reflect: true,
+        converter: booleanConverter,
+    })
+], AtomicSearchInterface.prototype, "reflectStateInUrl", void 0);
+__decorate([
+    property({
+        type: Boolean,
+        attribute: 'disable-state-reflection-in-url',
+        reflect: true,
+    })
+], AtomicSearchInterface.prototype, "disableStateReflectionInUrl", void 0);
+__decorate([
+    property({ type: String, attribute: 'scroll-container', reflect: true })
+], AtomicSearchInterface.prototype, "scrollContainer", void 0);
+__decorate([
+    property({ type: String, attribute: 'language-assets-path', reflect: true })
+], AtomicSearchInterface.prototype, "languageAssetsPath", void 0);
+__decorate([
+    property({ type: String, attribute: 'icon-assets-path', reflect: true })
+], AtomicSearchInterface.prototype, "iconAssetsPath", void 0);
+__decorate([
+    property({
+        type: Boolean,
+        attribute: 'enable-relevance-inspector',
+        reflect: true,
+        converter: booleanConverter,
+    })
+], AtomicSearchInterface.prototype, "enableRelevanceInspector", void 0);
+__decorate([
+    property({
+        type: Boolean,
+        attribute: 'disable-relevance-inspector',
+        reflect: true,
+    })
+], AtomicSearchInterface.prototype, "disableRelevanceInspector", void 0);
+__decorate([
+    watch('searchHub')
+], AtomicSearchInterface.prototype, "updateSearchHub", null);
+__decorate([
+    watch('pipeline')
+], AtomicSearchInterface.prototype, "updatePipeline", null);
+__decorate([
+    watch('analytics')
+], AtomicSearchInterface.prototype, "toggleAnalytics", null);
+__decorate([
+    watch('language')
+], AtomicSearchInterface.prototype, "updateLanguage", null);
+__decorate([
+    watch('iconAssetsPath')
+], AtomicSearchInterface.prototype, "updateIconAssetsPath", null);
+__decorate([
+    errorGuard()
+], AtomicSearchInterface.prototype, "render", null);
+AtomicSearchInterface = __decorate([
+    customElement('atomic-search-interface'),
+    withTailwindStyles
+], AtomicSearchInterface);
+export { AtomicSearchInterface };

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

@@ -4,12 +4,13 @@ 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 { LitElement, unsafeCSS } from 'lit';
+import { LitElement } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
+import { LayoutStylesController } from "../../common/layout/layout-styles-controller";
+import { watch } from "../../../decorators/watch";
 import { ChildrenUpdateCompleteMixin } from "../../../mixins/children-update-complete-mixin";
 import { LightDomMixin } from "../../../mixins/light-dom";
-import { randomID } from "../../../utils/utils";
-import { DEFAULT_MOBILE_BREAKPOINT } from '../../../utils/replace-breakpoint-utils';
+import { DEFAULT_MOBILE_BREAKPOINT } from "../../../utils/replace-breakpoint-utils";
 import styles from './atomic-search-layout.tw.css';
 import { buildSearchLayout } from './search-layout';
 /**
@@ -27,15 +28,22 @@ let AtomicSearchLayout = class AtomicSearchLayout extends LightDomMixin(Children
          * E.g., 800px, 65rem.
          */
         this.mobileBreakpoint = DEFAULT_MOBILE_BREAKPOINT;
-    }
-    async addStyles() {
-        await this.getUpdateComplete();
-        this.injectStyles(unsafeCSS(buildSearchLayout(this, this.mobileBreakpoint)));
+        this.layoutStylesController = new LayoutStylesController(this, buildSearchLayout, 'atomic-search-layout-');
     }
     connectedCallback() {
         super.connectedCallback();
-        this.id = randomID('atomic-search-layout-');
-        this.addStyles();
+        this.emitBreakpointChangeEvent();
+    }
+    emitBreakpointChangeEvent() {
+        this.dispatchEvent(new CustomEvent('atomic-layout-breakpoint-change', {
+            detail: { breakpoint: this.mobileBreakpoint },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    onMobileBreakpointChange() {
+        this.layoutStylesController.updateStyles();
+        this.emitBreakpointChangeEvent();
     }
 };
 AtomicSearchLayout.styles = [styles];
@@ -45,6 +53,9 @@ __decorate([
 __decorate([
     property({ type: String, reflect: true, attribute: 'mobile-breakpoint' })
 ], AtomicSearchLayout.prototype, "mobileBreakpoint", void 0);
+__decorate([
+    watch('mobileBreakpoint')
+], AtomicSearchLayout.prototype, "onMobileBreakpointChange", null);
 AtomicSearchLayout = __decorate([
     customElement('atomic-search-layout')
 ], AtomicSearchLayout);

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

@@ -1,4 +1,5 @@
 // Auto-generated file
 export { AtomicQuerySummary } from './atomic-query-summary/atomic-query-summary.js';
 export { AtomicResultsPerPage } from './atomic-results-per-page/atomic-results-per-page.js';
+export { AtomicSearchInterface } from './atomic-search-interface/atomic-search-interface.js';
 export { AtomicSearchLayout } from './atomic-search-layout/atomic-search-layout.js';

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

@@ -2,5 +2,6 @@
 export default {
     'atomic-query-summary': async () => await import('./atomic-query-summary/atomic-query-summary.js'),
     'atomic-results-per-page': async () => await import('./atomic-results-per-page/atomic-results-per-page.js'),
+    'atomic-search-interface': async () => await import('./atomic-search-interface/atomic-search-interface.js'),
     'atomic-search-layout': async () => await import('./atomic-search-layout/atomic-search-layout.js'),
 };

package/dist/atomic/components/facet-number-input.js

@@ -42,11 +42,11 @@ const FacetNumberInput = /*@__PURE__*/ proxyCustomElement(class FacetNumberInput
         const inputClasses = 'p-2.5 input-primary placeholder-neutral-dark min-w-0 mr-1';
         const labelClasses = 'text-neutral-dark text-sm';
         const step = this.type === 'integer' ? '1' : 'any';
-        return (h("form", { key: '085a1d3beb08ea5fb4af741c2856060ddfe21cb0', class: "mt-4 gap-y-0.5 px-2", part: "input-form", onSubmit: (e) => {
+        return (h("form", { key: '3afc8c27aad7fc2f3f280a8e5305dfdbc5291f74', class: "mt-4 gap-y-0.5 px-2", part: "input-form", onSubmit: (e) => {
                 e.preventDefault();
                 this.apply();
                 return false;
-            } }, h("label", { key: 'e512e8ba8a9c50fdeea5e4aa28839a6a45c33315', part: "label-start", class: labelClasses, htmlFor: `${this.filterState.facetId}_start` }, minText), h("input", { key: '9573f0e91f52b4be8a8125be85547ee90258e27c', part: "input-start", id: `${this.filterState.facetId}_start`, type: "number", step: step, ref: (ref) => (this.startRef = ref), class: inputClasses, "aria-label": minAria, required: true, min: Number.MIN_SAFE_INTEGER, max: this.end, value: this.filterState.range?.start, onInput: (e) => (this.start = e.target.valueAsNumber) }), h("label", { key: 'db739b28b33e3d480a056e8e86266167d72c619f', part: "label-end", class: labelClasses, htmlFor: `${this.filterState.facetId}_end` }, maxText), h("input", { key: 'ac9b23ed6dfd74a5b8d17dd267dc1e4980ec475b', part: "input-end", id: `${this.filterState.facetId}_end`, type: "number", step: step, ref: (ref) => (this.endRef = ref), class: inputClasses, "aria-label": maxAria, required: true, min: this.start, max: Number.MAX_SAFE_INTEGER, value: this.filterState.range?.end, onInput: (e) => (this.end = e.target.valueAsNumber) }), h(Button, { key: 'bda58c0d3de64935383484edeceadcd7c4576bd4', style: "outline-primary", type: "submit", part: "input-apply-button", class: "flex-none truncate p-2.5", ariaLabel: applyAria, text: apply })));
+            } }, h("label", { key: '9749444397b017e575f1cbc598ef8d4e440dc8b0', part: "label-start", class: labelClasses, htmlFor: `${this.filterState.facetId}_start` }, minText), h("input", { key: '94b1e3e64ec6ef14aff52ecf8e18c52bc987c7a7', part: "input-start", id: `${this.filterState.facetId}_start`, type: "number", step: step, ref: (ref) => (this.startRef = ref), class: inputClasses, "aria-label": minAria, required: true, min: Number.MIN_SAFE_INTEGER, max: this.end, value: this.filterState.range?.start, onInput: (e) => (this.start = e.target.valueAsNumber) }), h("label", { key: '89da4fb4747fb9d0cba5251dd3972677867301de', part: "label-end", class: labelClasses, htmlFor: `${this.filterState.facetId}_end` }, maxText), h("input", { key: '17813e5183986382376d765716ed60bff74de98c', part: "input-end", id: `${this.filterState.facetId}_end`, type: "number", step: step, ref: (ref) => (this.endRef = ref), class: inputClasses, "aria-label": maxAria, required: true, min: this.start, max: Number.MAX_SAFE_INTEGER, value: this.filterState.range?.end, onInput: (e) => (this.end = e.target.valueAsNumber) }), h(Button, { key: 'a98a7d0b356bb5c3eeec2512d96fd5bedc3605a6', style: "outline-primary", type: "submit", part: "input-apply-button", class: "flex-none truncate p-2.5", ariaLabel: applyAria, text: apply })));
     }
     static get style() { return AtomicFacetNumberInputStyle0; }
 }, [0, "atomic-facet-number-input", {

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

@@ -3,7 +3,7 @@ function getWindow() {
 }
 export function getAtomicEnvironment(headlessVersion) {
     return {
-        version: "3.33.9-pre.5fbff5b5f4",
+        version: "3.33.9-pre.feafe1d6de",
         headlessVersion,
     };
 }

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

@@ -1 +1 @@
-{"file":"index.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;;;;;;;;;;;;SAYgB,cAAc,CAAoB,OAAgB;IAChE,OAAO,WAAW,CAAI,OAAO,EAAE,gBAAgB,CAAC,CAAC;AACnD;;MCHa,kBAAmB,SAAQ,KAAK;IAC3C,YAAY,WAAmB,EAAE,UAAkB;QACjD,KAAK,CACH,QAAQ,WAAW,sCAAsC,UAAU,YAAY,CAChF,CAAC;KACH;;;ACfH,MAAM,oBAAoB,GAAG,sBAAsB,CAAC;SAIpC,gBAAgB,CAAI,OAAgB,EAAE,UAAkB;IACtE,OAAO,IAAI,OAAO,CAAI,CAAC,OAAO,EAAE,MAAM;QACpC,MAAM,KAAK,GAAG,gBAAgB,CAC5B,oBAAoB,EACpB,CAAC,IAAO;YACN,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC;SACtB,CACF,CAAC;QACF,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAE7B,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE;YACjC,MAAM,CACJ,IAAI,kBAAkB,CAAC,OAAO,CAAC,QAAQ,CAAC,WAAW,EAAE,EAAE,UAAU,CAAC,CACnE,CAAC;SACH;KACF,CAAC,CAAC;AACL;;ACoDA;;;;;;;;;;SAUgB,mBAAmB,CAAoB,OAAgB;IACrE,OAAO,gBAAgB,CAAI,OAAO,EAAE,gBAAgB,CAAC,CAAC;AACxD;;;;","names":[],"sources":["src/components/commerce/product-template-component-utils/stencil-product-template-decorators.tsx","src/components/common/item-list/context/item-context-controller.ts","src/components/common/item-list/fetch-item-context.ts","src/decorators/commerce/product-template-decorators.ts"],"sourcesContent":["import {Product} from '@coveo/headless/commerce';\nimport {itemContext} from '../../common/item-list/stencil-item-decorators';\n\n/**\n * Retrieves `Product` on a rendered `atomic-product`.\n *\n * This method is useful for building custom product template elements, see [Create a Product List](https://docs.coveo.com/en/atomic/latest/cc-search/create-custom-components/native-components/#custom-product-template-component-example) for more information.\n *\n * You should use the method in the [connectedCallback lifecycle method](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#using_the_lifecycle_callbacks).\n *\n * @param element - The element that the event is dispatched to, which must be the child of a rendered \"atomic-product\".\n * @returns A promise that resolves on initialization of the parent \"atomic-product\" element, or rejects when there is no parent \"atomic-product\" element.\n *\n * @deprecated should only be used for Stencil components. For Lit components, use `fetchProductContext` from \\@/src/decorators/commerce/product-template-decorators.ts\n */\nexport function productContext<T extends Product>(element: Element) {\n  return itemContext<T>(element, 'atomic-product');\n}\n","import type {LitElement, ReactiveController, ReactiveControllerHost} from 'lit';\nimport type {InitializableComponent} from '@/src/decorators/types.js';\nimport {buildCustomEvent} from '@/src/utils/event-utils';\n\ntype LitElementWithError = Omit<\n  Pick<InitializableComponent, 'error'>,\n  'error'\n> &\n  LitElement & {\n    error: Error | null;\n  };\n\nconst itemContextEventName = 'atomic/resolveResult';\n\nexport class MissingParentError extends Error {\n  constructor(elementName: string, parentName: string) {\n    super(\n      `The \"${elementName}\" element must be the child of an \"${parentName}\" element.`\n    );\n  }\n}\n\nfunction extractFolded<T = Record<string, unknown>>(\n  item: Record<string, unknown>,\n  returnFolded: boolean\n): T {\n  if (returnFolded) {\n    if ('children' in item) {\n      return item as T;\n    } else {\n      return {children: [], result: item} as T;\n    }\n  }\n\n  if ('children' in item && 'result' in item) {\n    return item.result as T;\n  }\n  return item as T;\n}\n\n/**\n * A reactive controller that manages item context data from parent components.\n * Handles fetching item data via custom events and manages error states.\n */\nexport class ItemContextController<T = Record<string, unknown>>\n  implements ReactiveController\n{\n  private host: ReactiveControllerHost & LitElementWithError;\n  private parentName: string;\n  private folded: boolean;\n  private _item: T | null = null;\n  private _error: MissingParentError | null = null;\n\n  constructor(\n    host: ReactiveControllerHost & LitElementWithError,\n    options: {parentName?: string; folded?: boolean} = {}\n  ) {\n    this.host = host;\n    this.parentName = options.parentName ?? 'atomic-result';\n    this.folded = options.folded ?? false;\n    host.addController(this);\n  }\n\n  get item(): T | null {\n    return this._error ? null : this._item;\n  }\n\n  get error(): MissingParentError | null {\n    return this._error;\n  }\n\n  get hasError(): boolean {\n    return this._error !== null;\n  }\n\n  hostConnected(): void {\n    this._resolveItemContext();\n  }\n\n  private _resolveItemContext(): void {\n    const event = buildCustomEvent(\n      itemContextEventName,\n      (item: Record<string, unknown>) => {\n        this._item = extractFolded<T>(item, this.folded);\n        this._error = null;\n        this.host.error = null;\n        this.host.requestUpdate();\n      }\n    );\n\n    const canceled = this.host.dispatchEvent(event);\n    if (canceled) {\n      const elementName = (this.host as Element).nodeName.toLowerCase();\n      this._error = new MissingParentError(elementName, this.parentName);\n      this._item = null;\n      this.host.error = this._error;\n      this.host.requestUpdate();\n    }\n  }\n}\n\ntype ItemContextEventHandler<T> = (item: T) => void;\nexport type ItemContextEvent<T> = CustomEvent<ItemContextEventHandler<T>>;\n","import {closest} from '../../../utils/dom-utils.js';\nimport {buildCustomEvent} from '../../../utils/event-utils.js';\nimport {MissingParentError} from './context/item-context-controller.js';\n\nconst itemContextEventName = 'atomic/resolveResult';\n\ntype ItemContextEventHandler<T> = (item: T) => void;\n\nexport function fetchItemContext<T>(element: Element, parentName: string) {\n  return new Promise<T>((resolve, reject) => {\n    const event = buildCustomEvent<ItemContextEventHandler<T>>(\n      itemContextEventName,\n      (item: T) => {\n        return resolve(item);\n      }\n    );\n    element.dispatchEvent(event);\n\n    if (!closest(element, parentName)) {\n      reject(\n        new MissingParentError(element.nodeName.toLowerCase(), parentName)\n      );\n    }\n  });\n}\n","import type {InteractiveProduct, Product} from '@coveo/headless/commerce';\nimport type {LitElement} from 'lit';\nimport {\n  InteractiveItemContextController,\n  type InteractiveItemContextEvent,\n} from '@/src/components/common/item-list/context/interactive-item-context-controller';\nimport {\n  ItemContextController,\n  type ItemContextEvent,\n} from '@/src/components/common/item-list/context/item-context-controller';\nimport {fetchItemContext} from '@/src/components/common/item-list/fetch-item-context';\n\n/**\n * Creates a [Lit reactive controller](https://lit.dev/docs/composition/controllers/) for managing product context in product template components.\n *\n * @param host - The Lit component instance\n * @param options - Configuration options\n * @returns ItemContextController instance configured for atomic-product\n *\n * @example\n * ```typescript\n * @customElement('my-product-component')\n * export class MyProductComponent extends LitElement {\n *   private productController = createProductContextController(this);\n *\n *   @state() product!: Product;\n *\n *   render() {\n *     this.product = this.productController.item;\n *     return html`<div>${this.product?.ec_name}</div>`;\n *   }\n * }\n * ```\n */\nexport function createProductContextController(\n  host: LitElement & {error: Error | null},\n  options: {folded?: boolean} = {}\n): ItemContextController<Product> {\n  return new ItemContextController<Product>(host, {\n    parentName: 'atomic-product',\n    folded: options.folded ?? false,\n  });\n}\n\n/**\n * Creates a [Lit reactive controller](https://lit.dev/docs/composition/controllers/) for managing interactive product context in product template components.\n *\n * @param host - The Lit component instance\n * @returns InteractiveItemContextController instance\n *\n * @example\n * ```typescript\n * @customElement('my-interactive-product-component')\n * export class MyInteractiveProductComponent extends LitElement {\n *   private interactiveProductController = createInteractiveProductContextController(this);\n *\n *   @state() product!: Product;\n *\n *   render() {\n *     this.product = this.interactiveProductController.interactiveItem;\n *     return html`<div>${this.product?.ec_name}</div>`;\n *   }\n * }\n * ```\n */\nexport function createInteractiveProductContextController(\n  host: LitElement & {error: Error}\n): InteractiveItemContextController<InteractiveProduct> {\n  return new InteractiveItemContextController<InteractiveProduct>(host);\n}\n\nexport type ProductContextEvent<T = Product> = ItemContextEvent<T>;\nexport type InteractiveProductContextEvent<\n  T extends InteractiveProduct = InteractiveProduct,\n> = InteractiveItemContextEvent<T>;\n\n/**\n * Retrieves `Product` on a rendered `atomic-product`.\n *\n * This utility function is useful for building custom product template elements, see [Create a Product List](https://docs.coveo.com/en/atomic/latest/cc-search/create-custom-components/native-components/#custom-product-template-component-example) for more information.\n *\n * You should use the utility function in the [`connectedCallback` lifecycle method](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#using_the_lifecycle_callbacks).\n *\n * @param element - The element that the event is dispatched to, which must be the child of a rendered `atomic-product`.\n * @returns A promise that resolves on initialization of the parent `atomic-product` element, or rejects when there is no parent `atomic-product` element.\n */\nexport function fetchProductContext<T extends Product>(element: Element) {\n  return fetchItemContext<T>(element, 'atomic-product');\n}\n"],"version":3}
+{"file":"index.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA;;;;;;;;;;;;SAYgB,cAAc,CAAoB,OAAgB;IAChE,OAAO,WAAW,CAAI,OAAO,EAAE,gBAAgB,CAAC,CAAC;AACnD;;MCHa,kBAAmB,SAAQ,KAAK;IAC3C,YAAY,WAAmB,EAAE,UAAkB;QACjD,KAAK,CACH,QAAQ,WAAW,sCAAsC,UAAU,YAAY,CAChF,CAAC;KACH;;;ACfH,MAAM,oBAAoB,GAAG,sBAAsB,CAAC;SAIpC,gBAAgB,CAAI,OAAgB,EAAE,UAAkB;IACtE,OAAO,IAAI,OAAO,CAAI,CAAC,OAAO,EAAE,MAAM;QACpC,MAAM,KAAK,GAAG,gBAAgB,CAC5B,oBAAoB,EACpB,CAAC,IAAO;YACN,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC;SACtB,CACF,CAAC;QACF,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAE7B,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE;YACjC,MAAM,CACJ,IAAI,kBAAkB,CAAC,OAAO,CAAC,QAAQ,CAAC,WAAW,EAAE,EAAE,UAAU,CAAC,CACnE,CAAC;SACH;KACF,CAAC,CAAC;AACL;;ACoDA;;;;;;;;;;SAUgB,mBAAmB,CAAoB,OAAgB;IACrE,OAAO,gBAAgB,CAAI,OAAO,EAAE,gBAAgB,CAAC,CAAC;AACxD;;;;","names":[],"sources":["src/components/commerce/product-template-component-utils/stencil-product-template-decorators.tsx","src/components/common/item-list/context/item-context-controller.ts","src/components/common/item-list/fetch-item-context.ts","src/decorators/commerce/product-template-decorators.ts"],"sourcesContent":["import {Product} from '@coveo/headless/commerce';\nimport {itemContext} from '../../common/item-list/stencil-item-decorators';\n\n/**\n * Retrieves `Product` on a rendered `atomic-product`.\n *\n * This method is useful for building custom product template elements, see [Create a Product List](https://docs.coveo.com/en/atomic/latest/cc-search/create-custom-components/native-components/#custom-product-template-component-example) for more information.\n *\n * You should use the method in the [connectedCallback lifecycle method](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#using_the_lifecycle_callbacks).\n *\n * @param element - The element that the event is dispatched to, which must be the child of a rendered \"atomic-product\".\n * @returns A promise that resolves on initialization of the parent \"atomic-product\" element, or rejects when there is no parent \"atomic-product\" element.\n *\n * @deprecated should only be used for Stencil components. For Lit components, use `fetchProductContext` from \\@/src/decorators/commerce/product-template-decorators.ts\n */\nexport function productContext<T extends Product>(element: Element) {\n  return itemContext<T>(element, 'atomic-product');\n}\n","import type {LitElement, ReactiveController, ReactiveControllerHost} from 'lit';\nimport type {InitializableComponent} from '@/src/decorators/types.js';\nimport {buildCustomEvent} from '@/src/utils/event-utils';\n\ntype LitElementWithError = Omit<\n  Pick<InitializableComponent, 'error'>,\n  'error'\n> &\n  LitElement & {\n    error: Error | null;\n  };\n\nconst itemContextEventName = 'atomic/resolveResult';\n\nexport class MissingParentError extends Error {\n  constructor(elementName: string, parentName: string) {\n    super(\n      `The \"${elementName}\" element must be the child of an \"${parentName}\" element.`\n    );\n  }\n}\n\nfunction extractFolded<T = Record<string, unknown>>(\n  item: Record<string, unknown>,\n  returnFolded: boolean\n): T {\n  if (returnFolded) {\n    if ('children' in item) {\n      return item as T;\n    } else {\n      return {children: [], result: item} as T;\n    }\n  }\n\n  if ('children' in item && 'result' in item) {\n    return item.result as T;\n  }\n  return item as T;\n}\n\n/**\n * A reactive controller that manages item context data from parent components.\n * Handles fetching item data via custom events and manages error states.\n */\nexport class ItemContextController<T = Record<string, unknown>>\n  implements ReactiveController\n{\n  private host: ReactiveControllerHost & LitElementWithError;\n  private parentName: string;\n  private folded: boolean;\n  private _item: T | null = null;\n  private _error: MissingParentError | null = null;\n\n  constructor(\n    host: ReactiveControllerHost & LitElementWithError,\n    options: {parentName?: string; folded?: boolean} = {}\n  ) {\n    this.host = host;\n    this.parentName = options.parentName ?? 'atomic-result';\n    this.folded = options.folded ?? false;\n    host.addController(this);\n  }\n\n  get item(): T | null {\n    return this._error ? null : this._item;\n  }\n\n  get error(): MissingParentError | null {\n    return this._error;\n  }\n\n  get hasError(): boolean {\n    return this._error !== null;\n  }\n\n  hostConnected(): void {\n    this._resolveItemContext();\n  }\n\n  private _resolveItemContext(): void {\n    const event = buildCustomEvent(\n      itemContextEventName,\n      (item: Record<string, unknown>) => {\n        this._item = extractFolded<T>(item, this.folded);\n        this._error = null;\n        this.host.error = null;\n        this.host.requestUpdate();\n      }\n    );\n\n    const canceled = this.host.dispatchEvent(event);\n    if (canceled) {\n      const elementName = (this.host as Element).nodeName.toLowerCase();\n      this._error = new MissingParentError(elementName, this.parentName);\n      this._item = null;\n      this.host.error = this._error;\n      this.host.requestUpdate();\n    }\n  }\n}\n\ntype ItemContextEventHandler<T> = (item: T) => void;\nexport type ItemContextEvent<T> = CustomEvent<ItemContextEventHandler<T>>;\n","import {closest} from '../../../utils/dom-utils.js';\nimport {buildCustomEvent} from '../../../utils/event-utils.js';\nimport {MissingParentError} from './context/item-context-controller.js';\n\nconst itemContextEventName = 'atomic/resolveResult';\n\ntype ItemContextEventHandler<T> = (item: T) => void;\n\nexport function fetchItemContext<T>(element: Element, parentName: string) {\n  return new Promise<T>((resolve, reject) => {\n    const event = buildCustomEvent<ItemContextEventHandler<T>>(\n      itemContextEventName,\n      (item: T) => {\n        return resolve(item);\n      }\n    );\n    element.dispatchEvent(event);\n\n    if (!closest(element, parentName)) {\n      reject(\n        new MissingParentError(element.nodeName.toLowerCase(), parentName)\n      );\n    }\n  });\n}\n","import type {InteractiveProduct, Product} from '@coveo/headless/commerce';\nimport type {LitElement} from 'lit';\nimport {\n  InteractiveItemContextController,\n  type InteractiveItemContextEvent,\n} from '@/src/components/common/item-list/context/interactive-item-context-controller';\nimport {\n  ItemContextController,\n  type ItemContextEvent,\n} from '@/src/components/common/item-list/context/item-context-controller';\nimport {fetchItemContext} from '@/src/components/common/item-list/fetch-item-context';\n\n/**\n * Creates a [Lit reactive controller](https://lit.dev/docs/composition/controllers/) for managing product context in product template components.\n *\n * @param host - The Lit component instance\n * @param options - Configuration options\n * @returns ItemContextController instance configured for atomic-product\n *\n * @example\n * ```typescript\n * @customElement('my-product-component')\n * export class MyProductComponent extends LitElement {\n *   private productController = createProductContextController(this);\n *\n *   @state() product!: Product;\n *\n *   render() {\n *     this.product = this.productController.item;\n *     return html`<div>${this.product?.ec_name}</div>`;\n *   }\n * }\n * ```\n */\nexport function createProductContextController(\n  host: LitElement & {error: Error | null},\n  options: {folded?: boolean} = {}\n): ItemContextController<Product> {\n  return new ItemContextController<Product>(host, {\n    parentName: 'atomic-product',\n    folded: options.folded ?? false,\n  });\n}\n\n/**\n * Creates a [Lit reactive controller](https://lit.dev/docs/composition/controllers/) for managing interactive product context in product template components.\n *\n * @param host - The Lit component instance\n * @returns InteractiveItemContextController instance\n *\n * @example\n * ```typescript\n * @customElement('my-interactive-product-component')\n * export class MyInteractiveProductComponent extends LitElement {\n *   private interactiveProductController = createInteractiveProductContextController(this);\n *\n *   @state() product!: Product;\n *\n *   render() {\n *     this.product = this.interactiveProductController.interactiveItem;\n *     return html`<div>${this.product?.ec_name}</div>`;\n *   }\n * }\n * ```\n */\nexport function createInteractiveProductContextController(\n  host: LitElement & {error: Error}\n): InteractiveItemContextController<InteractiveProduct> {\n  return new InteractiveItemContextController<InteractiveProduct>(host);\n}\n\nexport type ProductContextEvent<T = Product> = ItemContextEvent<T>;\nexport type InteractiveProductContextEvent<\n  T extends InteractiveProduct = InteractiveProduct,\n> = InteractiveItemContextEvent<T>;\n\n/**\n * Retrieves `Product` on a rendered `atomic-product`.\n *\n * This utility function is useful for building custom product template elements, see [Create a Product List](https://docs.coveo.com/en/atomic/latest/cc-search/create-custom-components/native-components/#custom-product-template-component-example) for more information.\n *\n * You should use the utility function in the [`connectedCallback` lifecycle method](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#using_the_lifecycle_callbacks).\n *\n * @param element - The element that the event is dispatched to, which must be the child of a rendered `atomic-product`.\n * @returns A promise that resolves on initialization of the parent `atomic-product` element, or rejects when there is no parent `atomic-product` element.\n */\nexport function fetchProductContext<T extends Product>(element: Element) {\n  return fetchItemContext<T>(element, 'atomic-product');\n}\n"],"version":3}

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

@@ -25,7 +25,7 @@ const AtomicTabButton = /*@__PURE__*/ proxyCustomElement(class AtomicTabButton e
         return this.active ? '' : 'text-neutral-dark hover:text-primary-light';
     }
     render() {
-        return (h(Host, { key: '57423bb804fc16877dc3cd0625550877ee6c119a', role: "listitem", class: `${this.activeTabClass}`, "aria-current": this.active ? 'true' : 'false', "aria-label": 'tab for ' + this.label, part: 'button-container' + (this.active ? '-active' : '') }, h(Button, { key: 'bcc1b242f139bce30997bd15dda308e4dede9b71', class: `w-full truncate px-2 pb-1 text-xl sm:px-6 ${this.activeTabTextClass}`, part: 'tab-button' + (this.active ? '-active' : ''), onClick: this.select, style: "text-transparent" }, this.label)));
+        return (h(Host, { key: '664e3146ffed0c73ec4baa3dc016da5de5865da4', role: "listitem", class: `${this.activeTabClass}`, "aria-current": this.active ? 'true' : 'false', "aria-label": 'tab for ' + this.label, part: 'button-container' + (this.active ? '-active' : '') }, h(Button, { key: 'dc11bc1ebcaa478d87a544d143028d06d11d6089', class: `w-full truncate px-2 pb-1 text-xl sm:px-6 ${this.activeTabTextClass}`, part: 'tab-button' + (this.active ? '-active' : ''), onClick: this.select, style: "text-transparent" }, this.label)));
     }
     static get style() { return AtomicTabButtonStyle0; }
 }, [0, "atomic-tab-button", {