@product7/product7-js 0.1.3 → 0.1.5

package/package.json

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

package/src/styles/messenger-components.js

@@ -37,16 +37,12 @@ export const messengerComponentsStyles = `
 }
 
 .messenger-message-sender {
-  font-size: var(--font-size-xs);
-  font-weight: var(--font-weight-medium);
-  color: var(--msg-text-secondary);
-  margin-bottom: 2px;
-  margin-left: 0;
+  display: none;
 }
 
 .messenger-message-bubble {
-  padding: var(--spacing-3) var(--spacing-4);
-  border-radius: 1.25rem;
+  padding: 7px 13px;
+  border-radius: 1.125rem;
   word-wrap: break-word;
   max-width: 100%;
 }
@@ -66,6 +62,7 @@ export const messengerComponentsStyles = `
 
 .messenger-message-content {
   font-size: var(--font-size-base);
+  font-weight: var(--font-weight-medium);
   line-height: var(--line-height-relaxed);
 }
 
@@ -240,7 +237,7 @@ export const messengerComponentsStyles = `
 
 .messenger-chat-empty h3 {
   margin: 0 0 var(--spacing-2);
-  font-size: var(--font-size-xl);
+  font-size: var(--font-size-base);
   font-weight: var(--font-weight-semibold);
   color: var(--msg-text);
 }
@@ -560,7 +557,7 @@ export const messengerComponentsStyles = `
 
 .messenger-prechat-title {
   margin: 0 0 var(--spacing-2);
-  font-size: var(--font-size-lg);
+  font-size: var(--font-size-base);
   font-weight: var(--font-weight-semibold);
   color: var(--msg-text);
 }

package/src/styles/messenger-features.js

@@ -90,11 +90,11 @@ export const messengerFeaturesStyles = `
    EMPTY STATE
    ======================================== */
 .messenger-empty-state {
+  flex: 1;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  height: 100%;
   text-align: center;
   padding: var(--spacing-10);
 }

package/src/styles/messenger-views.js

@@ -283,9 +283,14 @@ export const messengerViewsStyles = `
 
 .messenger-home-changelog-card-desc {
   margin: 0;
-  font-size: var(--font-size-base);
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-normal);
   color: var(--msg-text-secondary);
   line-height: var(--line-height-relaxed);
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
 }
 
 .messenger-home-availability,

package/src/widgets/messenger/views/HelpView.js

@@ -55,7 +55,9 @@ export class HelpView {
 
 	_updateCollectionsList() {
 		const container = this.element.querySelector('.messenger-help-collections');
-		const collections = this.state.helpArticles || [];
+		const collections = (this.state.helpArticles || []).filter(
+			(c) => (c.articleCount || 0) > 0
+		);
 		const searchQuery = (this.state.helpSearchQuery || '').toLowerCase();
 
 		const filtered = searchQuery
@@ -136,7 +138,7 @@ export class HelpView {
 
 		if (icon.startsWith('ph:')) {
 			return `<span class="messenger-help-collection-icon">
-				<iconify-icon icon="${icon}" width="22" height="22"></iconify-icon>
+				<iconify-icon icon="${icon}"></iconify-icon>
 			</span>`;
 		}
 
@@ -145,7 +147,7 @@ export class HelpView {
 
 	_defaultCollectionIcon() {
 		return `<span class="messenger-help-collection-icon">
-			<iconify-icon icon="ph:book-open-duotone" width="22" height="22"></iconify-icon>
+			<iconify-icon icon="ph:book-open-duotone"></iconify-icon>
 		</span>`;
 	}
 

package/src/widgets/messenger/views/HomeView.js

@@ -37,9 +37,6 @@ export class HomeView {
 							${this.options.logoUrl ? `<img src="${this.options.logoUrl}" alt="${this.state.teamName}" />` : ''}
 						</div>
 						<div class="messenger-home-avatars">${avatarsHtml}</div>
-						<button class="sdk-close-btn" aria-label="Close">
-							<iconify-icon icon="ph:x-duotone" width="18" height="18"></iconify-icon>
-						</button>
 					</div>
 					<div class="messenger-home-welcome">
 						<span class="messenger-home-greeting">${this.state.greetingMessage}</span>
@@ -184,7 +181,7 @@ export class HomeView {
 				}
 				<div class="messenger-home-changelog-card-content">
 					<h4 class="messenger-home-changelog-card-title">${item.title}</h4>
-					<p class="messenger-home-changelog-card-desc">${item.description || ''}</p>
+					<p class="messenger-home-changelog-card-desc">${this._stripHtml(item.description)}</p>
 				</div>
 			</div>
 		`
@@ -198,6 +195,13 @@ export class HomeView {
 		`;
 	}
 
+	_stripHtml(html) {
+		if (!html) return '';
+		const tmp = document.createElement('div');
+		tmp.innerHTML = html;
+		return (tmp.textContent || tmp.innerText || '').trim();
+	}
+
 	_formatDate(dateString) {
 		if (!dateString) return '';
 		const date = new Date(dateString);
@@ -211,12 +215,6 @@ export class HomeView {
 	}
 
 	_attachEvents() {
-		this.element
-			.querySelector('.sdk-close-btn')
-			.addEventListener('click', () => {
-				this.state.setOpen(false);
-			});
-
 		const msgBtn = this.element.querySelector(
 			'.messenger-home-message-btn:not(.messenger-feedback-btn)'
 		);