@product7/product7-js 0.1.3 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3664,16 +3664,12 @@
3664
3664
  }
3665
3665
 
3666
3666
  .messenger-message-sender {
3667
- font-size: var(--font-size-xs);
3668
- font-weight: var(--font-weight-medium);
3669
- color: var(--msg-text-secondary);
3670
- margin-bottom: 2px;
3671
- margin-left: 0;
3667
+ display: none;
3672
3668
  }
3673
3669
 
3674
3670
  .messenger-message-bubble {
3675
- padding: var(--spacing-3) var(--spacing-4);
3676
- border-radius: 1.25rem;
3671
+ padding: 7px 13px;
3672
+ border-radius: 1.125rem;
3677
3673
  word-wrap: break-word;
3678
3674
  max-width: 100%;
3679
3675
  }
@@ -3693,6 +3689,7 @@
3693
3689
 
3694
3690
  .messenger-message-content {
3695
3691
  font-size: var(--font-size-base);
3692
+ font-weight: var(--font-weight-medium);
3696
3693
  line-height: var(--line-height-relaxed);
3697
3694
  }
3698
3695
 
@@ -3867,7 +3864,7 @@
3867
3864
 
3868
3865
  .messenger-chat-empty h3 {
3869
3866
  margin: 0 0 var(--spacing-2);
3870
- font-size: var(--font-size-xl);
3867
+ font-size: var(--font-size-base);
3871
3868
  font-weight: var(--font-weight-semibold);
3872
3869
  color: var(--msg-text);
3873
3870
  }
@@ -4187,7 +4184,7 @@
4187
4184
 
4188
4185
  .messenger-prechat-title {
4189
4186
  margin: 0 0 var(--spacing-2);
4190
- font-size: var(--font-size-lg);
4187
+ font-size: var(--font-size-base);
4191
4188
  font-weight: var(--font-weight-semibold);
4192
4189
  color: var(--msg-text);
4193
4190
  }
@@ -4584,11 +4581,11 @@
4584
4581
  EMPTY STATE
4585
4582
  ======================================== */
4586
4583
  .messenger-empty-state {
4584
+ flex: 1;
4587
4585
  display: flex;
4588
4586
  flex-direction: column;
4589
4587
  align-items: center;
4590
4588
  justify-content: center;
4591
- height: 100%;
4592
4589
  text-align: center;
4593
4590
  padding: var(--spacing-10);
4594
4591
  }
@@ -4947,9 +4944,14 @@
4947
4944
 
4948
4945
  .messenger-home-changelog-card-desc {
4949
4946
  margin: 0;
4950
- font-size: var(--font-size-base);
4947
+ font-size: var(--font-size-sm);
4948
+ font-weight: var(--font-weight-normal);
4951
4949
  color: var(--msg-text-secondary);
4952
4950
  line-height: var(--line-height-relaxed);
4951
+ display: -webkit-box;
4952
+ -webkit-line-clamp: 3;
4953
+ -webkit-box-orient: vertical;
4954
+ overflow: hidden;
4953
4955
  }
4954
4956
 
4955
4957
  .messenger-home-availability,
@@ -10012,7 +10014,9 @@
10012
10014
 
10013
10015
  _updateCollectionsList() {
10014
10016
  const container = this.element.querySelector('.messenger-help-collections');
10015
- const collections = this.state.helpArticles || [];
10017
+ const collections = (this.state.helpArticles || []).filter(
10018
+ (c) => (c.articleCount || 0) > 0
10019
+ );
10016
10020
  const searchQuery = (this.state.helpSearchQuery || '').toLowerCase();
10017
10021
 
10018
10022
  const filtered = searchQuery
@@ -10093,7 +10097,7 @@
10093
10097
 
10094
10098
  if (icon.startsWith('ph:')) {
10095
10099
  return `<span class="messenger-help-collection-icon">
10096
- <iconify-icon icon="${icon}" width="22" height="22"></iconify-icon>
10100
+ <iconify-icon icon="${icon}"></iconify-icon>
10097
10101
  </span>`;
10098
10102
  }
10099
10103
 
@@ -10102,7 +10106,7 @@
10102
10106
 
10103
10107
  _defaultCollectionIcon() {
10104
10108
  return `<span class="messenger-help-collection-icon">
10105
- <iconify-icon icon="ph:book-open-duotone" width="22" height="22"></iconify-icon>
10109
+ <iconify-icon icon="ph:book-open-duotone"></iconify-icon>
10106
10110
  </span>`;
10107
10111
  }
10108
10112
 
@@ -10234,9 +10238,6 @@
10234
10238
  ${this.options.logoUrl ? `<img src="${this.options.logoUrl}" alt="${this.state.teamName}" />` : ''}
10235
10239
  </div>
10236
10240
  <div class="messenger-home-avatars">${avatarsHtml}</div>
10237
- <button class="sdk-close-btn" aria-label="Close">
10238
- <iconify-icon icon="ph:x-duotone" width="18" height="18"></iconify-icon>
10239
- </button>
10240
10241
  </div>
10241
10242
  <div class="messenger-home-welcome">
10242
10243
  <span class="messenger-home-greeting">${this.state.greetingMessage}</span>
@@ -10381,7 +10382,7 @@
10381
10382
  }
10382
10383
  <div class="messenger-home-changelog-card-content">
10383
10384
  <h4 class="messenger-home-changelog-card-title">${item.title}</h4>
10384
- <p class="messenger-home-changelog-card-desc">${item.description || ''}</p>
10385
+ <p class="messenger-home-changelog-card-desc">${this._stripHtml(item.description)}</p>
10385
10386
  </div>
10386
10387
  </div>
10387
10388
  `
@@ -10395,6 +10396,13 @@
10395
10396
  `;
10396
10397
  }
10397
10398
 
10399
+ _stripHtml(html) {
10400
+ if (!html) return '';
10401
+ const tmp = document.createElement('div');
10402
+ tmp.innerHTML = html;
10403
+ return (tmp.textContent || tmp.innerText || '').trim();
10404
+ }
10405
+
10398
10406
  _formatDate(dateString) {
10399
10407
  if (!dateString) return '';
10400
10408
  const date = new Date(dateString);
@@ -10408,12 +10416,6 @@
10408
10416
  }
10409
10417
 
10410
10418
  _attachEvents() {
10411
- this.element
10412
- .querySelector('.sdk-close-btn')
10413
- .addEventListener('click', () => {
10414
- this.state.setOpen(false);
10415
- });
10416
-
10417
10419
  const msgBtn = this.element.querySelector(
10418
10420
  '.messenger-home-message-btn:not(.messenger-feedback-btn)'
10419
10421
  );