@coveo/atomic 3.33.4-pre.613dec52e8 → 3.33.4-pre.6bf2fc8784

package/dist/esm/stencil-facet-value-c080798e.js

@@ -0,0 +1,39 @@
+import { h } from './index-3f35faca.js';
+import { g as getFieldValueCaption } from './field-utils-f0146383.js';
+import { F as FacetValueBox } from './stencil-facet-value-box-ecd5015e.js';
+import { F as FacetValueCheckbox } from './stencil-facet-value-checkbox-0786f1d8.js';
+import { F as FacetValueLabelHighlight } from './stencil-facet-value-label-highlight-b4083ffd.js';
+import { F as FacetValueLink } from './stencil-facet-value-link-4c270d4d.js';
+
+const FacetValue = ({ facetSearchQuery, displayValuesAs, enableExclusion, facetCount, facetState, facetValue, field, i18n, onExclude, onSelect, setRef, }) => {
+    const displayValue = getFieldValueCaption(field, facetValue, i18n);
+    const isSelected = facetState === 'selected';
+    const isExcluded = facetState === 'excluded';
+    const triStateProps = enableExclusion
+        ? {
+            onExclude,
+            state: facetState,
+        }
+        : {};
+    switch (displayValuesAs) {
+        case 'checkbox':
+            return (h(FacetValueCheckbox, { ...triStateProps, displayValue: displayValue, numberOfResults: facetCount, isSelected: isSelected, i18n: i18n, onClick: onSelect, searchQuery: facetSearchQuery, buttonRef: (element) => {
+                    setRef && setRef(element);
+                } },
+                h(FacetValueLabelHighlight, { displayValue: displayValue, isSelected: isSelected, isExcluded: isExcluded, searchQuery: facetSearchQuery })));
+        case 'link':
+            return (h(FacetValueLink, { displayValue: displayValue, numberOfResults: facetCount, isSelected: isSelected, i18n: i18n, onClick: onSelect, searchQuery: facetSearchQuery, buttonRef: (element) => {
+                    setRef && setRef(element);
+                } },
+                h(FacetValueLabelHighlight, { displayValue: displayValue, isSelected: isSelected, searchQuery: facetSearchQuery })));
+        case 'box':
+            return (h(FacetValueBox, { displayValue: displayValue, numberOfResults: facetCount, isSelected: isSelected, i18n: i18n, onClick: onSelect, searchQuery: facetSearchQuery, buttonRef: (element) => {
+                    setRef && setRef(element);
+                } },
+                h(FacetValueLabelHighlight, { displayValue: displayValue, isSelected: isSelected, searchQuery: facetSearchQuery })));
+    }
+};
+
+export { FacetValue as F };
+
+//# sourceMappingURL=stencil-facet-value-c080798e.js.map

package/dist/esm/stencil-facet-value-c080798e.js.map

@@ -0,0 +1 @@
+{"file":"stencil-facet-value-c080798e.js","mappings":";;;;;;;MAsBa,UAAU,GAAyC,CAAC,EAC/D,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,UAAU,EACV,UAAU,EACV,UAAU,EACV,KAAK,EACL,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,MAAM,GACP;IACC,MAAM,YAAY,GAAG,oBAAoB,CAAC,KAAK,EAAE,UAAU,EAAE,IAAI,CAAC,CAAC;IACnE,MAAM,UAAU,GAAG,UAAU,KAAK,UAAU,CAAC;IAC7C,MAAM,UAAU,GAAG,UAAU,KAAK,UAAU,CAAC;IAC7C,MAAM,aAAa,GAAG,eAAe;UACjC;YACE,SAAS;YACT,KAAK,EAAE,UAAU;SAClB;UACD,EAAE,CAAC;IACP,QAAQ,eAAe;QACrB,KAAK,UAAU;YACb,QACE,EAAC,kBAAkB,OACb,aAAa,EACjB,YAAY,EAAE,YAAY,EAC1B,eAAe,EAAE,UAAU,EAC3B,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,QAAQ,EACjB,WAAW,EAAE,gBAAgB,EAC7B,SAAS,EAAE,CAAC,OAAO;oBACjB,MAAM,IAAI,MAAM,CAAC,OAAO,CAAC,CAAC;iBAC3B;gBAED,EAAC,wBAAwB,IACvB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,gBAAgB,GACH,CACT,EACrB;QACJ,KAAK,MAAM;YACT,QACE,EAAC,cAAc,IACb,YAAY,EAAE,YAAY,EAC1B,eAAe,EAAE,UAAU,EAC3B,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,QAAQ,EACjB,WAAW,EAAE,gBAAgB,EAC7B,SAAS,EAAE,CAAC,OAAO;oBACjB,MAAM,IAAI,MAAM,CAAC,OAAO,CAAC,CAAC;iBAC3B;gBAED,EAAC,wBAAwB,IACvB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,gBAAgB,GACH,CACb,EACjB;QACJ,KAAK,KAAK;YACR,QACE,EAAC,aAAa,IACZ,YAAY,EAAE,YAAY,EAC1B,eAAe,EAAE,UAAU,EAC3B,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,QAAQ,EACjB,WAAW,EAAE,gBAAgB,EAC7B,SAAS,EAAE,CAAC,OAAO;oBACjB,MAAM,IAAI,MAAM,CAAC,OAAO,CAAC,CAAC;iBAC3B;gBAED,EAAC,wBAAwB,IACvB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,gBAAgB,GACH,CACd,EAChB;KACL;AACH;;;;","names":[],"sources":["src/components/common/facets/facet-value/stencil-facet-value.tsx"],"sourcesContent":["import {FunctionalComponent, h} from '@stencil/core';\nimport {i18n} from 'i18next';\nimport {getFieldValueCaption} from '../../../../utils/field-utils';\nimport {FacetValueBox} from '../facet-value-box/stencil-facet-value-box';\nimport {FacetValueCheckbox} from '../facet-value-checkbox/stencil-facet-value-checkbox';\nimport {FacetValueLabelHighlight} from '../facet-value-label-highlight/stencil-facet-value-label-highlight';\nimport {FacetValueLink} from '../facet-value-link/stencil-facet-value-link';\n\nexport interface FacetValueProps {\n  field: string;\n  facetValue: string;\n  facetCount: number;\n  facetState: 'idle' | 'selected' | 'excluded';\n  i18n: i18n;\n  enableExclusion: boolean;\n  onExclude: () => void;\n  onSelect: () => void;\n  displayValuesAs: 'checkbox' | 'link' | 'box';\n  facetSearchQuery: string;\n  setRef?: (btn?: HTMLButtonElement) => void;\n}\n\nexport const FacetValue: FunctionalComponent<FacetValueProps> = ({\n  facetSearchQuery,\n  displayValuesAs,\n  enableExclusion,\n  facetCount,\n  facetState,\n  facetValue,\n  field,\n  i18n,\n  onExclude,\n  onSelect,\n  setRef,\n}) => {\n  const displayValue = getFieldValueCaption(field, facetValue, i18n);\n  const isSelected = facetState === 'selected';\n  const isExcluded = facetState === 'excluded';\n  const triStateProps = enableExclusion\n    ? {\n        onExclude,\n        state: facetState,\n      }\n    : {};\n  switch (displayValuesAs) {\n    case 'checkbox':\n      return (\n        <FacetValueCheckbox\n          {...triStateProps}\n          displayValue={displayValue}\n          numberOfResults={facetCount}\n          isSelected={isSelected}\n          i18n={i18n}\n          onClick={onSelect}\n          searchQuery={facetSearchQuery}\n          buttonRef={(element) => {\n            setRef && setRef(element);\n          }}\n        >\n          <FacetValueLabelHighlight\n            displayValue={displayValue}\n            isSelected={isSelected}\n            isExcluded={isExcluded}\n            searchQuery={facetSearchQuery}\n          ></FacetValueLabelHighlight>\n        </FacetValueCheckbox>\n      );\n    case 'link':\n      return (\n        <FacetValueLink\n          displayValue={displayValue}\n          numberOfResults={facetCount}\n          isSelected={isSelected}\n          i18n={i18n}\n          onClick={onSelect}\n          searchQuery={facetSearchQuery}\n          buttonRef={(element) => {\n            setRef && setRef(element);\n          }}\n        >\n          <FacetValueLabelHighlight\n            displayValue={displayValue}\n            isSelected={isSelected}\n            searchQuery={facetSearchQuery}\n          ></FacetValueLabelHighlight>\n        </FacetValueLink>\n      );\n    case 'box':\n      return (\n        <FacetValueBox\n          displayValue={displayValue}\n          numberOfResults={facetCount}\n          isSelected={isSelected}\n          i18n={i18n}\n          onClick={onSelect}\n          searchQuery={facetSearchQuery}\n          buttonRef={(element) => {\n            setRef && setRef(element);\n          }}\n        >\n          <FacetValueLabelHighlight\n            displayValue={displayValue}\n            isSelected={isSelected}\n            searchQuery={facetSearchQuery}\n          ></FacetValueLabelHighlight>\n        </FacetValueBox>\n      );\n  }\n};\n"],"version":3}

package/dist/esm/{iconButton-779dd472.js → stencil-iconButton-a96fd45a.js}

@@ -10,4 +10,4 @@ const IconButton = (props) => {
 
 export { IconButton as I };
 
-//# sourceMappingURL=iconButton-779dd472.js.map
+//# sourceMappingURL=stencil-iconButton-a96fd45a.js.map

package/dist/esm/stencil-iconButton-a96fd45a.js.map

@@ -0,0 +1 @@
+{"file":"stencil-iconButton-a96fd45a.js","mappings":";;;MAUa,UAAU,GAAyC,CAAC,KAAK;IACpE,QACE,WAAK,KAAK,EAAC,UAAU,EAAC,IAAI,EAAE,GAAG,KAAK,CAAC,UAAU,YAAY;QACzD,EAAC,MAAM,OACD,KAAK,EACT,KAAK,EAAC,oCAAoC,EAC1C,IAAI,EAAE,GAAG,KAAK,CAAC,UAAU,SAAS,EAClC,GAAG,EAAE,KAAK,CAAC,SAAS;YAEpB,mBACE,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAE,GAAG,KAAK,CAAC,UAAU,OAAO,GACnB,CACR;QACR,KAAK,CAAC,KAAK,KACV,YACE,IAAI,EAAE,GAAG,KAAK,CAAC,UAAU,QAAQ,EACjC,KAAK,EAAC,8GAA8G,IAEnH,KAAK,CAAC,KAAK,CACP,CACR,CACG,EACN;AACJ;;;;","names":[],"sources":["src/components/common/stencil-iconButton.tsx"],"sourcesContent":["import {FunctionalComponent, h, VNode} from '@stencil/core';\nimport {Button, StencilButtonProps} from './stencil-button';\n\nexport interface IconButtonProps extends StencilButtonProps {\n  badge?: VNode;\n  buttonRef?: (el?: HTMLButtonElement) => void;\n  icon: string;\n  partPrefix: string;\n}\n\nexport const IconButton: FunctionalComponent<IconButtonProps> = (props) => {\n  return (\n    <div class=\"relative\" part={`${props.partPrefix}-container`}>\n      <Button\n        {...props}\n        class=\"relative h-[2.6rem] w-[2.6rem] p-3\"\n        part={`${props.partPrefix}-button`}\n        ref={props.buttonRef}\n      >\n        <atomic-icon\n          icon={props.icon}\n          class=\"h-4 w-4 shrink-0\"\n          part={`${props.partPrefix}-icon`}\n        ></atomic-icon>\n      </Button>\n      {props.badge && (\n        <span\n          part={`${props.partPrefix}-badge`}\n          class=\"bg-primary text-on-primary absolute -top-2 -right-2 block h-4 w-4 rounded-full text-center text-xs leading-4\"\n        >\n          {props.badge}\n        </span>\n      )}\n    </div>\n  );\n};\n"],"version":3}

package/dist/esm/version.js

@@ -1,2 +1,2 @@
-export const headlessVersion = '3.29.1';
-export const atomicVersion = '3.33.4-pre.613dec52e8';
+export const headlessVersion = '3.29.2';
+export const atomicVersion = '3.33.4-pre.6bf2fc8784';

package/dist/types/components/commerce/atomic-commerce-product-list/atomic-commerce-product-list.d.ts

@@ -36,7 +36,7 @@ export declare class AtomicCommerceProductList extends AtomicCommerceProductList
     bindings: CommerceBindings;
     error: Error;
     private isAppLoaded;
-    private isEveryProductsReady;
+    private isEveryProductReady;
     private resultTemplateRegistered;
     private templateHasError;
     searchOrListingState: SearchState | ProductListingState;

package/dist/types/components/common/atomic-rating/atomic-rating.tw.css.d.ts

@@ -0,0 +1,2 @@
+declare const styles: import("lit").CSSResult;
+export default styles;

package/dist/types/components/common/icon-button.d.ts

@@ -0,0 +1,12 @@
+import { type nothing, type TemplateResult } from 'lit';
+import type { RefOrCallback } from 'lit/directives/ref.js';
+import type { FunctionalComponent } from '../../utils/functional-component-utils';
+import './atomic-icon/atomic-icon';
+import { type ButtonProps } from './button';
+export interface IconButtonProps extends ButtonProps {
+    badge?: TemplateResult | typeof nothing;
+    buttonRef?: RefOrCallback;
+    icon: string;
+    partPrefix: string;
+}
+export declare const renderIconButton: FunctionalComponent<IconButtonProps>;

package/dist/types/components/search/atomic-search-interface/atomic-search-interface.d.ts

@@ -1,28 +1,24 @@
-import { type LogLevel, type SearchEngine, type SearchEngineConfiguration } from '@coveo/headless';
-import { type i18n } from 'i18next';
-import { type CSSResultGroup, LitElement } from 'lit';
-import type { CommonBindings, NonceBindings } from '../../common/interface/bindings';
-import { type BaseAtomicInterface } from '../../common/interface/interface-controller';
-import { type SearchStore } from './store';
+import { LogLevel, SearchEngine, SearchEngineConfiguration } from '@coveo/headless';
+import { i18n } from 'i18next';
+import { InitializeEvent } from '../../../utils/initialization-utils';
+import { StencilBaseAtomicInterface } from '../../common/interface/interface-common-stencil';
+import type { Bindings as _Bindings } from './interfaces';
 export type InitializationOptions = SearchEngineConfiguration;
-export type Bindings = CommonBindings<SearchEngine, SearchStore, AtomicSearchInterface> & NonceBindings;
-declare const AtomicSearchInterface_base: typeof LitElement;
+export type Bindings = _Bindings;
 /**
  * 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.
  */
-export declare class AtomicSearchInterface extends AtomicSearchInterface_base implements BaseAtomicInterface<SearchEngine> {
+export declare class AtomicSearchInterface implements StencilBaseAtomicInterface<SearchEngine> {
     private urlManager;
     private searchStatus;
     private unsubscribeUrlManager;
     private unsubscribeSearchStatus;
     private initialized;
     private store;
-    private interfaceController;
-    error: Error;
+    private commonInterfaceHelper;
+    host: HTMLAtomicSearchInterfaceElement;
+    error?: Error;
     relevanceInspectorIsOpen: boolean;
-    static styles: CSSResultGroup;
     /**
      * A list of non-default fields to include in the query results.
      *
@@ -31,7 +27,7 @@ export declare class AtomicSearchInterface extends AtomicSearchInterface_base im
      * <atomic-search-interface fields-to-include='["fieldA", "fieldB"]'></atomic-search-interface>
      * ```
      */
-    fieldsToInclude: string[];
+    fieldsToInclude: string[] | string;
     /**
      * The search interface [query pipeline](https://docs.coveo.com/en/180/).
      *
@@ -101,17 +97,37 @@ export declare class AtomicSearchInterface extends AtomicSearchInterface_base im
      * The relevance inspector allows to troubleshoot and debug queries.
      */
     enableRelevanceInspector: boolean;
+    /**
+     * The value to set the [nonce](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce) attribute to on inline script and style elements generated by this interface and its child components.
+     * If your application is served with a Content Security Policy (CSP) that doesn't include the `script-src: 'unsafe-inline'` or `style-src: 'unsafe-inline'` directives,
+     * you should ensure that your application server generates a new nonce on every page load and uses the generated value to set this prop and serve the corresponding CSP response headers
+     * (i.e., script-src 'nonce-<YOUR_GENERATED_NONCE>' and style-src 'nonce-<YOUR_GENERATED_NONCE>').
+     * Otherwise you may see console errors such as
+     *  - Refused to execute inline script because it violates the following Content Security Policy directive: [...]
+     *  - Refused to apply inline style because it violates the following Content Security Policy directive: [...].
+     * @example:
+     * ```html
+     * <script nonce="<YOUR_GENERATED_NONCE>">
+     *  import {setNonce} from '@coveo/atomic';
+     *  setNonce('<YOUR_GENERATED_NONCE>');
+     * </script>
+     * ```
+     */
+    CspNonce?: string;
     private i18Initialized;
+    private componentWillLoadCalledPromise;
+    private componentWillLoadResolver;
     constructor();
     connectedCallback(): void;
-    willUpdate(changedProperties: Map<string, unknown>): void;
+    componentWillLoad(): void;
+    updateSearchConfiguration(updatedProp: 'searchHub' | 'pipeline', newValue: string | undefined): void;
     updateSearchHub(): void;
     updatePipeline(): void;
     toggleAnalytics(): void;
-    updateLanguage(): void;
+    updateLanguage(): Promise<void> | undefined;
     updateIconAssetsPath(): void;
     disconnectedCallback(): void;
-    private handleInitialization;
+    handleInitialization(event: InitializeEvent): void;
     scrollToTop(): void;
     closeRelevanceInspector(): void;
     /**
@@ -128,9 +144,7 @@ export declare class AtomicSearchInterface extends AtomicSearchInterface_base im
      * Executes the first search and logs the interface load event to analytics, after initializing connection to the headless search engine.
      */
     executeFirstSearch(): Promise<void>;
-    bindings: Bindings;
-    updateSearchConfiguration(updatedProp: 'searchHub' | 'pipeline', newValue: string | undefined): void;
-    private getBindings;
+    get bindings(): Bindings;
     private initFieldsToInclude;
     registerFieldsToInclude(): void;
     private updateMobileBreakpoint;
@@ -138,16 +152,11 @@ export declare class AtomicSearchInterface extends AtomicSearchInterface_base im
     private getSearchConfiguration;
     private get fragment();
     private initUrlManager;
+    private initAriaLive;
     private initRelevanceInspector;
     private initSearchStatus;
     private updateHash;
     private onHashChange;
     private internalInitialization;
-    render(): import("lit-html").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'atomic-search-interface': AtomicSearchInterface;
-    }
+    render(): any[];
 }
-export {};

package/dist/types/components/search/atomic-search-interface/interfaces.d.ts

@@ -1,5 +1,4 @@
 import type { SearchEngine } from '@coveo/headless';
 import type { CommonBindings, NonceBindings } from '../../common/interface/bindings';
-import type { AtomicSearchInterface } from './atomic-search-interface';
 import type { SearchStore } from './store';
-export type Bindings = CommonBindings<SearchEngine, SearchStore, AtomicSearchInterface> & NonceBindings;
+export type Bindings = CommonBindings<SearchEngine, SearchStore, HTMLAtomicSearchInterfaceElement> & NonceBindings;

package/dist/types/components/search/{atomic-facet → facets/atomic-facet}/atomic-facet.d.ts

@@ -1,9 +1,6 @@
-import { type Facet, type FacetResultsMustMatch, type FacetSortCriterion, type FacetState, type SearchStatus, type SearchStatusState, type TabManager, type TabManagerState } from '@coveo/headless';
-import { LitElement } from 'lit';
-import '../../common/atomic-facet-placeholder/atomic-facet-placeholder';
-import type { InitializableComponent } from "../../../decorators/types";
-import type { Bindings } from '../atomic-search-interface/atomic-search-interface';
-import '../../common/atomic-facet-placeholder/atomic-facet-placeholder';
+import { Facet, FacetState, FacetSortCriterion, SearchStatus, SearchStatusState, FacetResultsMustMatch, TabManagerState, TabManager } from '@coveo/headless';
+import { InitializableComponent } from '../../../../utils/initialization-utils';
+import { Bindings } from '../../atomic-search-interface/atomic-search-interface';
 /**
  * A facet is a list of values for a certain field occurring in the results, ordered using a configurable criteria (e.g., number of occurrences).
  * An `atomic-facet` displays a facet of the results for the current query.
@@ -43,12 +40,12 @@ import '../../common/atomic-facet-placeholder/atomic-facet-placeholder';
  * @part show-less - The show less results button.
  * @part show-more-less-icon - The icons of the show more & show less buttons.
  */
-export declare class AtomicFacet extends LitElement implements InitializableComponent<Bindings> {
-    static styles: import("lit").CSSResult[];
+export declare class AtomicFacet implements InitializableComponent {
     bindings: Bindings;
     facet: Facet;
     searchStatus: SearchStatus;
     tabManager: TabManager;
+    private host;
     facetState: FacetState;
     searchStatusState: SearchStatusState;
     tabManagerState: TabManagerState;
@@ -204,11 +201,11 @@ export declare class AtomicFacet extends LitElement implements InitializableComp
     private showMoreFocus?;
     private headerFocus?;
     private facetConditionsManager?;
-    private facetSearchAriaLive?;
+    protected facetSearchAriaMessage: string;
     initialize(): void;
     disconnectedCallback(): void;
-    shouldUpdate(changedProperties: Map<string, unknown>): boolean;
-    render(): import("lit-html").TemplateResult<1>;
+    componentShouldUpdate(next: FacetState, prev: FacetState, propName: keyof AtomicFacet): boolean;
+    render(): any;
     private renderBody;
     private renderValuesContainer;
     private renderSearchResults;
@@ -219,7 +216,6 @@ export declare class AtomicFacet extends LitElement implements InitializableComp
     private get facetOptions();
     private get facetValueProps();
     private get isHidden();
-    private get host();
     private initConditionManager;
     private registerFacet;
     private initPopover;
@@ -227,4 +223,5 @@ export declare class AtomicFacet extends LitElement implements InitializableComp
     private get facetInfo();
     private get definedLabel();
     private get focusTargets();
+    private isFacetState;
 }

package/dist/types/components/search/index.d.ts

@@ -1,4 +1,2 @@
-export { AtomicFacet } from './atomic-facet/atomic-facet.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';