@swisspost/design-system-components 8.2.1 → 8.2.2

package/loaders/post-tooltip.js

@@ -4794,6 +4794,10 @@ const tooltipTargetAttributeSelector = `[${tooltipTargetAttribute}]`;
 /**
  * Global event listener to show tooltips. This is globalized so that triggers that are rendered
  * async will still work without the need to set listeners on the element itself
+ *
+ * This handler manages both pointer and focus events to properly trigger tooltips.
+ * If the event is a focus event (e.g., keyboard navigation), pointer events are ignored to avoid
+ * interference with tooltip behavior.
  * @param e Event
  * @returns
  */
@@ -4805,7 +4809,9 @@ const globalInterestHandler = (e) => {
     if (!tooltipTarget || tooltipTarget === '')
         return;
     const tooltip = document.getElementById(tooltipTarget);
-    void (tooltip === null || tooltip === void 0 ? void 0 : tooltip.show(targetElement));
+    // Determine if the tooltip was triggered by a focus event
+    const triggeredByFocus = e.type === 'focusin';
+    void (tooltip === null || tooltip === void 0 ? void 0 : tooltip.show(targetElement, triggeredByFocus));
     if (hideTooltipTimeout) {
         window.clearTimeout(hideTooltipTimeout);
         hideTooltipTimeout = null;
@@ -4862,6 +4868,7 @@ const PostTooltip$1 = /*@__PURE__*/ proxyCustomElement(class PostTooltip extends
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.wasOpenedByFocus = false;
         this.placement = 'top';
         this.arrow = true;
         this.delayed = false;
@@ -4921,10 +4928,20 @@ const PostTooltip$1 = /*@__PURE__*/ proxyCustomElement(class PostTooltip extends
     /**
      * Programmatically display the tooltip
      * @param target An element with [data-tooltip-target="id"] where the tooltip should be shown
+     * @param triggeredByFocus A boolean indicating if the tooltip was triggered by a focus event.
      */
-    async show(target) {
+    async show(target, triggeredByFocus = false) {
         if (this.delayed)
             await timeout(OPEN_DELAY);
+        // Determine if the tooltip was opened by a focus event
+        this.wasOpenedByFocus = triggeredByFocus;
+        // Disable pointer events if triggered by focus, otherwise enable them
+        if (this.wasOpenedByFocus) {
+            this.host.style.pointerEvents = 'none';
+        }
+        else {
+            this.host.style.pointerEvents = 'auto';
+        }
         this.popoverRef.show(target);
     }
     /**
@@ -4952,13 +4969,15 @@ const PostTooltip$1 = /*@__PURE__*/ proxyCustomElement(class PostTooltip extends
     }
     /**
      * Pointer or focus left the tooltip, initiate the hiding process
+     * Re-enable pointer events when the tooltip is no longer in focus or hovered
      */
     handleInterestLost() {
         globalHideTooltip(this);
+        this.host.style.pointerEvents = 'auto';
     }
     render() {
         const popoverClass = `${this.arrow ? ' has-arrow' : ''}`;
-        return (h(Host, { key: 'f543fa8f63cc6b65e1a86e34b1a59b4ca0bb9e47', "data-version": version$1, role: "tooltip", onPointerOver: this.handleInterest, onPointerOut: this.handleInterestLost, onFocusIn: this.handleInterest, onFocusOut: this.handleInterestLost }, h("post-popovercontainer", { key: 'e920d62462d209ff25593f7989ca16f6177b7292', class: popoverClass, arrow: this.arrow, placement: this.placement, ref: (el) => (this.popoverRef = el) }, h("slot", { key: '607d7357cb201c7e6e62f9a241392bd5ef1f156e' }))));
+        return (h(Host, { key: '6d5e454da6fb46fb4446d8ed1deb8c6a9f2f2e0f', "data-version": version$1, role: "tooltip", onPointerOver: this.handleInterest, onPointerOut: this.handleInterestLost, onFocusIn: this.handleInterest, onFocusOut: this.handleInterestLost }, h("post-popovercontainer", { key: '7b626cd4699e4178fbd8506b88fae64c94ab1631', class: popoverClass, arrow: this.arrow, placement: this.placement, ref: (el) => (this.popoverRef = el) }, h("slot", { key: 'ae5721af16313dc3737947d2ae130e0514ef2dd8' }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swisspost/design-system-components",
-  "version": "8.2.1",
+  "version": "8.2.2",
   "description": "A collection of web components built with Stencil JS for the Swiss Post Design System.",
   "license": "Apache-2.0",
   "main": "dist/index.cjs.js",
@@ -26,7 +26,7 @@
   "dependencies": {
     "@floating-ui/dom": "1.6.8",
     "@oddbird/popover-polyfill": "0.3.7",
-    "@swisspost/design-system-styles": "8.2.1",
+    "@swisspost/design-system-styles": "8.2.2",
     "ally.js": "1.4.1",
     "long-press-event": "2.5.0"
   },

package/dist/post-components/p-0e04f44b.entry.js

@@ -1 +0,0 @@
-export{P as post_alert}from"./p-b96c35d4.js";import"./p-d2f9de94.js";import"./p-cb757310.js";import"./p-2737eaf5.js";import"./p-deb4131c.js";import"./p-440193f4.js";import"./p-611b3c41.js";import"./p-b095519d.js";

package/dist/post-components/p-30af6382.entry.js

@@ -1 +0,0 @@
-export{P as post_tab_header}from"./p-35f06c3d.js";import"./p-d2f9de94.js";import"./p-cb757310.js";import"./p-b095519d.js";import"./p-440193f4.js";

package/dist/post-components/p-3749f35b.entry.js

@@ -1 +0,0 @@
-export{P as post_accordion_item}from"./p-1a4ef000.js";import"./p-d2f9de94.js";import"./p-cb757310.js";import"./p-247a1668.js";import"./p-deb4131c.js";import"./p-440193f4.js";import"./p-611b3c41.js";

package/dist/post-components/p-444824a1.entry.js

@@ -1 +0,0 @@
-export{P as post_tag}from"./p-326709cb.js";import"./p-d2f9de94.js";import"./p-cb757310.js";

package/dist/post-components/p-605b64b4.entry.js

@@ -1 +0,0 @@
-export{P as post_card_control}from"./p-4c229386.js";import"./p-d2f9de94.js";import"./p-611b3c41.js";import"./p-b095519d.js";import"./p-440193f4.js";import"./p-cb757310.js";

package/dist/post-components/p-60cc57a5.entry.js

@@ -1 +0,0 @@
-export{P as post_logo}from"./p-660594c0.js";import"./p-d2f9de94.js";import"./p-cb757310.js";import"./p-deb4131c.js";import"./p-440193f4.js";import"./p-611b3c41.js";

package/dist/post-components/p-7bf744e9.entry.js

@@ -1 +0,0 @@
-export{P as post_accordion}from"./p-c0aa6d02.js";import"./p-d2f9de94.js";import"./p-cb757310.js";import"./p-247a1668.js";import"./p-611b3c41.js";

package/dist/post-components/p-94d8f3d2.entry.js

@@ -1 +0,0 @@
-export{P as post_popovercontainer}from"./p-50bc322d.js";import"./p-d2f9de94.js";import"./p-cb757310.js";

package/dist/post-components/p-b41129e7.entry.js

@@ -1 +0,0 @@
-export{P as post_tooltip}from"./p-968de7fe.js";import"./p-d2f9de94.js";import"./p-cb757310.js";import"./p-6adeaa6c.js";import"./p-deb4131c.js";import"./p-440193f4.js";import"./p-611b3c41.js";

package/dist/post-components/p-b545df93.entry.js

@@ -1 +0,0 @@
-export{P as post_popover}from"./p-213cfa52.js";import"./p-d2f9de94.js";import"./p-cb757310.js";import"./p-6adeaa6c.js";

package/dist/post-components/p-c4f5fa27.entry.js

@@ -1 +0,0 @@
-export{P as post_tabs}from"./p-18c01d62.js";import"./p-d2f9de94.js";import"./p-cb757310.js";import"./p-2737eaf5.js";

package/dist/post-components/p-c998fdc9.entry.js

@@ -1 +0,0 @@
-export{P as post_icon}from"./p-4aef4c0b.js";import"./p-d2f9de94.js";import"./p-deb4131c.js";import"./p-440193f4.js";import"./p-611b3c41.js";import"./p-cb757310.js";import"./p-b095519d.js";

package/dist/post-components/p-cb757310.js

@@ -1 +0,0 @@
-const o="8.2.1";export{o as v}

package/dist/post-components/p-d2912c01.entry.js

@@ -1 +0,0 @@
-export{P as post_tab_panel}from"./p-f04634da.js";import"./p-d2f9de94.js";import"./p-cb757310.js";

package/dist/post-components/p-e00b4f0d.entry.js

@@ -1 +0,0 @@
-export{P as post_rating}from"./p-17b8b241.js";import"./p-d2f9de94.js";import"./p-cb757310.js";