@coveo/atomic 3.59.2 → 3.59.4

package/dist/esm/components/ipx/atomic-ipx-tab/atomic-ipx-tab.js

@@ -1,8 +1,7 @@
 import { buildTab } from "@coveo/headless";
-import { LitElement, css, html, nothing } from "lit";
+import { LitElement, css, html } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 import { when } from "lit/directives/when.js";
-import { renderButton } from "../../common/button.js";
 import { createAppLoadedListener } from "../../common/interface/store.js";
 import { dispatchTabLoaded } from "../../common/tabs/tab-common.js";
 import { bindStateToController } from "../../../decorators/bind-state.js";
@@ -18,6 +17,17 @@ function _ts_metadata(k, v) {
     if ("object" == typeof Reflect && "function" == typeof Reflect.metadata) return Reflect.metadata(k, v);
 }
 class AtomicIpxTab extends LitElement {
+    connectedCallback() {
+        super.connectedCallback();
+        this.addEventListener('click', this.handleClick);
+        this.addEventListener('keydown', this.handleKeydown);
+        this.updateHostAttributes();
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.removeEventListener('click', this.handleClick);
+        this.removeEventListener('keydown', this.handleKeydown);
+    }
     initialize() {
         this.tab = buildTab(this.bindings.engine, {
             options: {
@@ -33,42 +43,55 @@ class AtomicIpxTab extends LitElement {
         });
     }
     select() {
-        this.tab.select();
+        this.tab?.select();
     }
     updated() {
-        if (this.tabState) this.active = this.tabState.isActive;
+        if (this.tabState) {
+            this.active = this.tabState.isActive;
+            this.updateHostAttributes();
+        }
         dispatchTabLoaded(this);
     }
+    updateHostAttributes() {
+        this.setAttribute('role', 'tab');
+        this.setAttribute('aria-selected', this.active ? 'true' : 'false');
+        this.tabIndex = this.active ? 0 : -1;
+    }
     render() {
-        return when(this.isAppLoaded, ()=>{
-            const buttonClasses = [
-                'relative',
-                'pb-3',
-                'mt-1',
-                'mr-6',
-                'font-semibold'
-            ];
-            if (this.tabState.isActive) buttonClasses.push('active');
-            return renderButton({
-                props: {
-                    style: 'text-transparent',
-                    part: 'tab',
-                    class: buttonClasses.join(' '),
-                    ariaLabel: this.bindings.i18n.t('tab-search', {
-                        label: this.label
-                    }),
-                    title: this.label,
-                    ariaPressed: this.tabState.isActive ? 'true' : 'false',
-                    onClick: ()=>this.tab.select()
-                }
-            })(html`${this.label}`);
-        }, ()=>nothing);
+        return html`<span part="tab" title=${this.label}
+      >${when(this.isAppLoaded, ()=>this.label)}</span
+    >`;
     }
     constructor(...args){
-        super(...args), this.label = 'no-label', this.active = false, this.isAppLoaded = false;
+        super(...args), this.label = 'no-label', this.active = false, this.isAppLoaded = false, this.handleClick = ()=>{
+            this.tab?.select();
+        }, this.handleKeydown = (event)=>{
+            if ('Enter' === event.key || ' ' === event.key) {
+                event.preventDefault();
+                this.tab?.select();
+                return;
+            }
+            const tablist = this.closest('[role="tablist"]');
+            if (!tablist) return;
+            const tabs = Array.from(tablist.querySelectorAll('[role="tab"]'));
+            const currentIndex = tabs.indexOf(this);
+            if (-1 === currentIndex) return;
+            let nextIndex = null;
+            if ('ArrowRight' === event.key) nextIndex = (currentIndex + 1) % tabs.length;
+            else if ('ArrowLeft' === event.key) nextIndex = (currentIndex - 1 + tabs.length) % tabs.length;
+            else if ('Home' === event.key) nextIndex = 0;
+            else if ('End' === event.key) nextIndex = tabs.length - 1;
+            if (null !== nextIndex) {
+                event.preventDefault();
+                tabs.forEach((tab, index)=>{
+                    tab.tabIndex = index === nextIndex ? 0 : -1;
+                });
+                tabs[nextIndex].focus();
+            }
+        };
     }
 }
-AtomicIpxTab.styles = css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */.active:after{background-color:var(--atomic-primary);border-radius:var(--atomic-border-radius);bottom:calc(var(--spacing,.25rem)*0);content:"";display:block;height:calc(var(--spacing,.25rem)*1);position:absolute;width:100%}[part=tab]{max-width:150px;overflow:hidden;text-overflow:ellipsis}`;
+AtomicIpxTab.styles = css`/*! tailwindcss v4.3.0 | 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)))){*,::backdrop,:after,:before{--tw-font-weight:initial}}}:host{cursor:pointer;display:flex}:host:focus-visible{--tw-outline-style:none;outline-style:none}[part=tab]{margin-right:calc(var(--spacing,.25rem)*6);margin-top:calc(var(--spacing,.25rem)*1);padding-bottom:calc(var(--spacing,.25rem)*3);--tw-font-weight:var(--font-weight-semibold,600);color:var(--atomic-on-background);font-weight:var(--font-weight-semibold,600);max-width:150px;overflow:hidden;position:relative;text-overflow:ellipsis}:host(:focus-visible) [part=tab],:host(:hover) [part=tab]{color:var(--atomic-primary)}:host([active]) [part=tab]:after{background-color:var(--atomic-primary);border-radius:var(--atomic-border-radius);bottom:calc(var(--spacing,.25rem)*0);content:"";display:block;height:calc(var(--spacing,.25rem)*1);position:absolute;width:100%}@property --tw-font-weight{syntax:"*";inherits:false}`;
 _ts_decorate([
     property({
         type: String,

package/dist/esm/components/ipx/atomic-ipx-tabs/atomic-ipx-tabs.js

@@ -17,7 +17,9 @@ class AtomicIpxTabs extends LightDomMixin(SlotsForNoShadowDOMMixin(LitElement))
     initialize() {}
     render() {
         return html`<atomic-tab-bar
-      >${this.renderDefaultSlotContent()}</atomic-tab-bar
+      ><div role="tablist" style="display:flex;flex-direction:row;width:100%">
+        ${this.renderDefaultSlotContent()}
+      </div></atomic-tab-bar
     >`;
     }
 }

package/dist/esm/components/search/atomic-search-box/atomic-search-box.js

@@ -201,6 +201,7 @@ class AtomicSearchBox extends LitElement {
                 if (!e.shiftKey) this.onSubmit();
                 break;
             case 'Escape':
+                this.isExpanded = false;
                 this.suggestionManager.clearSuggestions();
                 break;
             case 'ArrowDown':

package/dist/esm/generated/dayjs-locales-data.js

@@ -25,11 +25,11 @@ const locales = {
     cy: ()=>import("dayjs/locale/cy"),
     da: ()=>import("dayjs/locale/da"),
     'de-AT': ()=>import("dayjs/locale/de-at"),
-    'de-CH': ()=>import("dayjs/locale/de-ch"),
     de: ()=>import("dayjs/locale/de"),
+    'de-CH': ()=>import("dayjs/locale/de-ch"),
     dv: ()=>import("dayjs/locale/dv"),
-    el: ()=>import("dayjs/locale/el"),
     'en-AU': ()=>import("dayjs/locale/en-au"),
+    el: ()=>import("dayjs/locale/el"),
     'en-CA': ()=>import("dayjs/locale/en-ca"),
     'en-GB': ()=>import("dayjs/locale/en-gb"),
     'en-IE': ()=>import("dayjs/locale/en-ie"),
@@ -55,9 +55,9 @@ const locales = {
     fr: ()=>import("dayjs/locale/fr"),
     fy: ()=>import("dayjs/locale/fy"),
     ga: ()=>import("dayjs/locale/ga"),
-    gd: ()=>import("dayjs/locale/gd"),
     gl: ()=>import("dayjs/locale/gl"),
     'gom-LATN': ()=>import("dayjs/locale/gom-latn"),
+    gd: ()=>import("dayjs/locale/gd"),
     gu: ()=>import("dayjs/locale/gu"),
     he: ()=>import("dayjs/locale/he"),
     hi: ()=>import("dayjs/locale/hi"),
@@ -122,14 +122,14 @@ const locales = {
     te: ()=>import("dayjs/locale/te"),
     tet: ()=>import("dayjs/locale/tet"),
     tg: ()=>import("dayjs/locale/tg"),
-    th: ()=>import("dayjs/locale/th"),
     tk: ()=>import("dayjs/locale/tk"),
+    th: ()=>import("dayjs/locale/th"),
     'tl-PH': ()=>import("dayjs/locale/tl-ph"),
-    tlh: ()=>import("dayjs/locale/tlh"),
     tr: ()=>import("dayjs/locale/tr"),
-    tzl: ()=>import("dayjs/locale/tzl"),
+    tlh: ()=>import("dayjs/locale/tlh"),
     'tzm-LATN': ()=>import("dayjs/locale/tzm-latn"),
     tzm: ()=>import("dayjs/locale/tzm"),
+    tzl: ()=>import("dayjs/locale/tzl"),
     'ug-CN': ()=>import("dayjs/locale/ug-cn"),
     uk: ()=>import("dayjs/locale/uk"),
     ur: ()=>import("dayjs/locale/ur"),

package/dist/esm/global/environment.js

@@ -3,7 +3,7 @@ function getWindow() {
 }
 function getAtomicEnvironment(headlessVersion) {
     return {
-        version: "3.59.2",
+        version: "3.59.4",
         headlessVersion
     };
 }

package/dist/esm/utils/hidden-state-controller.js

@@ -0,0 +1,29 @@
+const shadowSheet = new CSSStyleSheet();
+shadowSheet.replaceSync(':host(:state(empty)) { display: none }');
+const lightSheet = new CSSStyleSheet();
+lightSheet.replaceSync(':state(empty) { display: none }');
+class HiddenStateController {
+    hostConnected() {
+        const root = this.host.shadowRoot;
+        if (root) {
+            if (!root.adoptedStyleSheets.includes(shadowSheet)) root.adoptedStyleSheets.push(shadowSheet);
+        } else {
+            const parentRoot = this.host.getRootNode();
+            if (!parentRoot.adoptedStyleSheets.includes(lightSheet)) parentRoot.adoptedStyleSheets.push(lightSheet);
+        }
+    }
+    set isEmpty(value) {
+        if (value) this.internals.states.add('empty');
+        else this.internals.states.delete('empty');
+    }
+    get isEmpty() {
+        return this.internals.states.has('empty');
+    }
+    constructor(host){
+        this.host = host;
+        this.internals = host.attachInternals();
+        this.internals.states.add('empty');
+        host.addController(this);
+    }
+}
+export { HiddenStateController };

package/dist/esm/versions.js

@@ -1,3 +1,3 @@
-const atomicVersion = "3.59.2";
+const atomicVersion = "3.59.4";
 export { version as headlessVersion } from "@coveo/headless/package.json";
 export { atomicVersion };

package/dist/types/components/insight/atomic-insight-smart-snippet-feedback-modal/atomic-insight-smart-snippet-feedback-modal.d.ts

@@ -7,8 +7,6 @@ import type { InitializableComponent } from '../../../decorators/types';
  *
  * When the modal is opened, the class `atomic-modal-opened` is added to the body, allowing further customization.
  *
- * @internal
- *
  * @part backdrop - The transparent backdrop hiding the content behind the modal.
  * @part container - The modal's outermost container with the outline and background.
  * @part header-wrapper - The wrapper around the header.

package/dist/types/components/insight/atomic-insight-tab/atomic-insight-tab.d.ts

@@ -29,12 +29,17 @@ export declare class AtomicInsightTab extends LitElement implements TabCommon, I
     tab: InsightTab;
     private isAppLoaded;
     private tabId;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     initialize(): void;
     /**
      * Activates the tab.
      */
     select(): void;
     protected updated(): void;
+    private updateHostAttributes;
+    private handleClick;
+    private handleKeydown;
     render(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/dist/types/components/insight/atomic-insight-user-actions-modal/atomic-insight-user-actions-modal.d.ts

@@ -8,8 +8,6 @@ import type { InitializableComponent } from '../../../decorators/types';
  *
  * When the modal is opened, the CSS class `atomic-modal-opened` is added to the interface element and the body, allowing further customization.
  *
- * @internal
- *
  * @part title - The title element displaying "user-actions" text.
  * @part close-button - The button used to close the modal.
  * @part close-icon - The close icon within the close button.

package/dist/types/components/ipx/atomic-ipx-tab/atomic-ipx-tab.d.ts

@@ -28,13 +28,18 @@ export declare class AtomicIpxTab extends LitElement implements TabCommon, Initi
     private tabState;
     tab: Tab;
     private isAppLoaded;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     initialize(): void;
     /**
      * Activates the tab.
      */
     select(): void;
     protected updated(): void;
-    render(): symbol | import("lit-html").TemplateResult;
+    private updateHostAttributes;
+    private handleClick;
+    private handleKeydown;
+    render(): import("lit-html").TemplateResult<1>;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coveo/atomic",
-  "version": "3.59.2",
+  "version": "3.59.4",
   "description": "A web-component library for building modern UIs interfacing with the Coveo platform",
   "homepage": "https://docs.coveo.com/en/atomic/latest/",
   "license": "Apache-2.0",
@@ -55,23 +55,23 @@
     "./custom-elements-manifest": "./custom-elements.json"
   },
   "dependencies": {
-    "@coveo/relay-event-types": "19.6.0",
+    "@coveo/relay-event-types": "19.13.0",
     "@lit/context": "1.1.6",
     "@open-wc/lit-helpers": "0.7.0",
     "@popperjs/core": "2.11.8",
     "@salesforce-ux/design-system": "2.30.3",
     "@stencil/core": "4.20.0",
     "cssnano": "7.1.9",
-    "dayjs": "1.11.20",
+    "dayjs": "1.11.21",
     "dompurify": "3.4.5",
     "escape-html": "1.0.3",
     "i18next": "25.10.10",
     "i18next-http-backend": "3.0.6",
     "lit": "3.3.3",
     "marked": "12.0.2",
-    "@coveo/atomic-legacy": "0.0.19",
+    "@coveo/atomic-legacy": "0.0.20",
     "@coveo/bueno": "1.1.9",
-    "@coveo/headless": "3.51.3"
+    "@coveo/headless": "3.51.4"
   },
   "devDependencies": {
     "@ag-ui/client": "0.0.53",
@@ -79,12 +79,12 @@
     "@playwright/test": "1.60.0",
     "@rollup/plugin-replace": "6.0.3",
     "@rslib/core": "0.21.5",
-    "@storybook/addon-a11y": "10.4.0",
-    "@storybook/addon-docs": "10.4.0",
+    "@storybook/addon-a11y": "10.4.1",
+    "@storybook/addon-docs": "10.4.1",
     "@storybook/addon-mcp": "0.6.0",
-    "@storybook/addon-vitest": "10.4.0",
+    "@storybook/addon-vitest": "10.4.1",
     "@storybook/icons": "2.0.2",
-    "@storybook/web-components-vite": "10.4.0",
+    "@storybook/web-components-vite": "10.4.1",
     "@tailwindcss/postcss": "4.3.0",
     "@tailwindcss/vite": "4.3.0",
     "@types/escape-html": "1.0.4",
@@ -102,23 +102,23 @@
     "postcss": "8.5.15",
     "postcss-load-config": "6.0.1",
     "prettier": "3.8.3",
-    "puppeteer": "24.42.0",
+    "puppeteer": "24.43.1",
     "react": "19.2.6",
     "remark-gfm": "4.0.1",
     "shadow-dom-testing-library": "1.13.1",
-    "storybook": "10.4.0",
+    "storybook": "10.4.1",
     "tailwindcss": "4.3.0",
     "ts-dedent": "2.2.0",
     "ts-lit-plugin": "2.0.2",
     "typescript": "6.0.3",
-    "vite": "8.0.10",
+    "vite": "8.0.14",
     "vitest": "4.1.7",
     "@coveo/atomic-a11y": "1.0.0"
   },
   "peerDependencies": {
     "typescript": ">=5.0.0",
     "@coveo/bueno": "^1.1.9",
-    "@coveo/headless": "^3.51.3"
+    "@coveo/headless": "^3.51.4"
   },
   "peerDependenciesMeta": {
     "typescript": {