@product7/feedback-sdk 1.4.5 → 1.4.7

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@product7/feedback-sdk",
-	"version": "1.4.5",
+	"version": "1.4.7",
 	"description": "JavaScript SDK for integrating Product7 feedback widgets into any website",
 	"main": "dist/feedback-sdk.js",
 	"module": "src/index.js",

package/src/styles/feedback.js

@@ -1,7 +1,7 @@
 export const feedbackStyles = `
 .feedback-widget-button {
   position: fixed;
-  z-index: var(--z-modal);
+  z-index: var(--z-notification);
 }
 
 .feedback-widget-button.position-bottom-right {
@@ -43,6 +43,8 @@ export const feedbackStyles = `
   background: var(--color-primary);
   box-shadow: var(--shadow-md);
   width: fit-content;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .feedback-trigger-btn:hover:not(:disabled) {
@@ -81,6 +83,7 @@ export const feedbackStyles = `
   transition: opacity var(--transition-base);
   box-shadow: var(--shadow-sm);
   cursor: pointer;
+  pointer-events: none;
 }
 
 .feedback-minimize-icon svg,
@@ -93,6 +96,7 @@ export const feedbackStyles = `
 
 .feedback-widget-button:not(.minimized) .feedback-trigger-btn:hover .feedback-minimize-icon {
   opacity: 1;
+  pointer-events: auto;
 }
 
 .feedback-widget-button.minimized .feedback-trigger-btn {
@@ -112,6 +116,7 @@ export const feedbackStyles = `
 
 .feedback-widget-button.minimized .feedback-trigger-btn:hover .feedback-expand-icon {
   opacity: 1;
+  pointer-events: auto;
 }
 
 .feedback-panel {

package/src/widgets/ButtonWidget.js

@@ -41,6 +41,21 @@ export class ButtonWidget extends BaseWidget {
 		const button = this.element.querySelector('.feedback-trigger-btn');
 		const minimizeIcon = this.element.querySelector('.feedback-minimize-icon');
 		const expandIcon = this.element.querySelector('.feedback-expand-icon');
+		const isControlIcon = (target) => {
+			if (!(target instanceof Element)) return false;
+			return Boolean(
+				target.closest('.feedback-minimize-icon') ||
+					target.closest('.feedback-expand-icon')
+			);
+		};
+		const openIfAllowed = (target) => {
+			if (isControlIcon(target)) {
+				return;
+			}
+			if (!this.isMinimized) {
+				this.openPanel();
+			}
+		};
 
 		minimizeIcon.addEventListener('click', (e) => {
 			e.stopPropagation();
@@ -55,16 +70,13 @@ export class ButtonWidget extends BaseWidget {
 		});
 
 		button.addEventListener('click', (e) => {
-			if (
-				e.target.closest('.feedback-minimize-icon') ||
-				e.target.closest('.feedback-expand-icon')
-			) {
-				return;
-			}
+			openIfAllowed(e.target);
+		});
 
-			if (!this.isMinimized) {
-				this.openPanel();
-			}
+		// Pointer events improve consistency across touch and mouse devices.
+		button.addEventListener('pointerup', (e) => {
+			if (e.pointerType === 'mouse') return;
+			openIfAllowed(e.target);
 		});
 	}