@fluid-topics/ft-popover 1.2.8 → 1.2.9

package/build/ftds-popover.d.ts

@@ -6,6 +6,7 @@ import { Position } from "@fluid-topics/ft-tooltip";
 export declare class FtdsPopover extends FtLitElement implements FtdsPopoverProperties {
     static elementDefinitions: ElementDefinitionsMap;
     static styles: import("lit").CSSResult;
+    private popoverOpenTriggeredWithKeyboard;
     heading: string;
     closeButtonLabel: string;
     openButtonLabel: string;
@@ -25,7 +26,7 @@ export declare class FtdsPopover extends FtLitElement implements FtdsPopoverProp
     renderHeading(): typeof nothing | import("lit").TemplateResult<1>;
     updated(properties: PropertyValues<FtdsPopover>): void;
     close(): void;
-    open(): void;
+    open(event: PointerEvent): void;
     hasTextLinkContent(): boolean;
     private watchFocusIn;
     private watchEscapeKey;

package/build/ftds-popover.js

@@ -16,6 +16,7 @@ import { FtIcons } from "@fluid-topics/ft-icon";
 class FtdsPopover extends FtLitElement {
     constructor() {
         super(...arguments);
+        this.popoverOpenTriggeredWithKeyboard = false;
         this.heading = "";
         this.closeButtonLabel = "close info";
         this.openButtonLabel = "more info";
@@ -31,12 +32,13 @@ class FtdsPopover extends FtLitElement {
         };
         this.watchEscapeKey = (event) => {
             if (event.key === "Escape") {
-                this.closeAndFocusOpeningButton();
+                this.close();
+                this.openingButton.focus();
             }
         };
-        this.closeAndFocusOpeningButton = () => {
+        this.closeAndFocusOpeningButton = (event) => {
             this.close();
-            this.openingButton.focus();
+            !!event.pointerType ? this.openingButton.focusWithoutTooltip() : this.openingButton.focus();
         };
     }
     render() {
@@ -118,7 +120,8 @@ class FtdsPopover extends FtLitElement {
         this.opened = false;
         this.dispatchEvent(new CustomEvent("opened-changed", { detail: { opened: false } }));
     }
-    open() {
+    open(event) {
+        this.popoverOpenTriggeredWithKeyboard = !event.pointerType;
         this.opened = true;
         this.dispatchEvent(new CustomEvent("opened-changed", { detail: { opened: true } }));
     }
@@ -136,7 +139,7 @@ class FtdsPopover extends FtLitElement {
         this.popoverWrapper.style.top = `${y}px`;
         this.popoverWrapper.classList.add("ftds-popover--wrapper-positioned");
         this.popoverLinkTypography.hidden = !this.hasTextLinkContent();
-        this.closingButton.focus();
+        this.popoverOpenTriggeredWithKeyboard ? this.closingButton.focus() : this.closingButton.focusWithoutTooltip();
     }
 }
 FtdsPopover.elementDefinitions = {

package/build/ftds-popover.styles.js

@@ -13,7 +13,7 @@ export const styles = css `
 
     .ftds-popover--container {
         position: absolute;
-        z-index: 2;
+        z-index: 100;
         display: block;
         margin: auto;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-popover",
-  "version": "1.2.8",
+  "version": "1.2.9",
   "description": "A simple popover component",
   "keywords": [
     "Lit"
@@ -20,12 +20,12 @@
   },
   "dependencies": {
     "@fluid-topics/design-system-variables": "0.1.5",
-    "@fluid-topics/ft-button": "1.2.8",
-    "@fluid-topics/ft-icon": "1.2.8",
-    "@fluid-topics/ft-link": "1.2.8",
-    "@fluid-topics/ft-typography": "1.2.8",
-    "@fluid-topics/ft-wc-utils": "1.2.8",
+    "@fluid-topics/ft-button": "1.2.9",
+    "@fluid-topics/ft-icon": "1.2.9",
+    "@fluid-topics/ft-link": "1.2.9",
+    "@fluid-topics/ft-typography": "1.2.9",
+    "@fluid-topics/ft-wc-utils": "1.2.9",
     "lit": "3.1.0"
   },
-  "gitHead": "26d2cbd5aba536de63759b72e1c171449519d74e"
+  "gitHead": "d845852f5b176916a556b5a23d38be9472fa1fc6"
 }