@product7/product7-js 0.5.5 → 0.5.7

package/src/styles/liveChat.js

@@ -0,0 +1,17 @@
+import { liveChatComponentsStyles } from './liveChat-components.js';
+import { liveChatCoreStyles } from './liveChat-core.js';
+import { liveChatFeaturesStyles } from './liveChat-features.js';
+import { liveChatViewsStyles } from './liveChat-views.js';
+
+export const liveChatStyles =
+	liveChatCoreStyles +
+	liveChatViewsStyles +
+	liveChatComponentsStyles +
+	liveChatFeaturesStyles;
+
+export {
+	liveChatComponentsStyles,
+	liveChatCoreStyles,
+	liveChatFeaturesStyles,
+	liveChatViewsStyles,
+};

package/src/styles/{webChatCustomStyles.js → liveChatCustomStyles.js}

@@ -1,4 +1,4 @@
-export function applywebChatCustomStyles(options = {}) {
+export function applyliveChatCustomStyles(options = {}) {
 	const {
 		primaryColor = '#155EEF',
 		textColor = '#1d1d1f',
@@ -6,11 +6,11 @@
 		theme = 'light',
 	} = options;
 
-	let styleElement = document.getElementById('product7-web-chat-custom-styles');
+	let styleElement = document.getElementById('product7-liveChat-custom-styles');
 
 	if (!styleElement) {
 		styleElement = document.createElement('style');
-		styleElement.id = 'product7-web-chat-custom-styles';
+		styleElement.id = 'product7-liveChat-custom-styles';
 		document.head.appendChild(styleElement);
 	}
 
@@ -37,16 +37,16 @@
 	const darkBorder = adjustColor(backgroundColor, 34);
 
 	styleElement.textContent = `
-		#product7-web-chat-widget {
+		#product7-liveChat-widget {
 			--color-primary: ${primaryColor} !important;
 			--color-primary-hover: ${adjustColor(primaryColor, -10)} !important;
 		}
 
-		.web-chat-launcher-btn {
+		.liveChat-launcher-btn {
 			background: ${primaryColor} !important;
 		}
 
-		.web-chat-launcher-btn:hover {
+		.liveChat-launcher-btn:hover {
 			box-shadow: 0 8px 24px ${adjustColor(primaryColor, 0, 0.3)} !important;
 		}
 
@@ -60,25 +60,25 @@
 			border-color: ${adjustColor(primaryColor, -10)} !important;
 		}
 
-		.web-chat-compose-send:hover:not(:disabled) {
+		.liveChat-compose-send:hover:not(:disabled) {
 			background: ${primaryColor} !important;
 			border-color: ${primaryColor} !important;
 			color: #FFFFFF !important;
 		}
 
-		.web-chat-nav-tab.active .web-chat-nav-icon,
-		.web-chat-nav-tab.active .web-chat-nav-label {
+		.liveChat-nav-tab.active .liveChat-nav-icon,
+		.liveChat-nav-tab.active .liveChat-nav-label {
 			color: ${primaryColor} !important;
 		}
 
-		.web-chat-home-view::before {
+		.liveChat-home-view::before {
 			background: radial-gradient(circle, ${adjustColor(primaryColor, 0, 0.08)} 0%, transparent 70%) !important;
 		}
 
 		${
 			backgroundColor !== '#ffffff'
 				? `
-		.web-chat-panel-content {
+		.liveChat-panel-content {
 			background: ${backgroundColor} !important;
 		}
 		`
@@ -88,23 +88,23 @@
 		${
 			textColor !== '#1d1d1f'
 				? `
-		.web-chat-panel-content,
-		.web-chat-view {
+		.liveChat-panel-content,
+		.liveChat-view {
 			color: ${textColor} !important;
 		}
 		`
 				: ''
 		}
 
-		/* Dark theme is now handled by CSS custom properties in web-chat-core.js */
+		/* Dark theme is now handled by CSS custom properties in liveChat-core.js */
 	`;
 
 	console.log('✅ Custom web chat styles applied:', { primaryColor, theme });
 }
 
-export function removewebChatCustomStyles() {
+export function removeliveChatCustomStyles() {
 	const styleElement = document.getElementById(
-		'product7-web-chat-custom-styles'
+		'product7-liveChat-custom-styles'
 	);
 	if (styleElement && styleElement.parentNode) {
 		styleElement.parentNode.removeChild(styleElement);

package/src/styles/styles.js

@@ -3,8 +3,8 @@ import { changelogStyles } from './changelog.js';
 import { componentsStyles } from './components.js';
 import { designTokens } from './design-tokens.js';
 import { feedbackStyles } from './feedback.js';
+import { liveChatStyles } from './liveChat.js';
 import { surveyStyles } from './survey.js';
-import { webChatStyles } from './web-chat.js';
 
 export const CSS_STYLES =
 	designTokens +
@@ -13,7 +13,7 @@ export const CSS_STYLES =
 	feedbackStyles +
 	changelogStyles +
 	surveyStyles +
-	webChatStyles;
+	liveChatStyles;
 
 export {
 	baseStyles,
@@ -21,6 +21,6 @@ export {
 	componentsStyles,
 	designTokens,
 	feedbackStyles,
+	liveChatStyles,
 	surveyStyles,
-	webChatStyles,
 };

package/src/widgets/BaseWidget.js

@@ -1,4 +1,4 @@
-export class BaseWidget {
+export class BaseWidget {
 	static STORAGE_KEY = 'feedback_submitted';
 	static DEFAULT_COOLDOWN_DAYS = 30;
 
@@ -384,7 +384,7 @@ export class BaseWidget {
 <div class="feedback-panel-header">
   <h3>Send Feedback</h3>
   <button class="sdk-close-btn" type="button" aria-label="Close">
-    <iconify-icon icon="ph:x-duotone" width="18" height="18"></iconify-icon>
+    <iconify-icon icon="ph:x" width="18" height="18"></iconify-icon>
   </button>
 </div>
         <div class="feedback-panel-body">

package/src/widgets/ChangelogWidget.js

@@ -1,4 +1,4 @@
-import { BaseWidget } from './BaseWidget.js';
+import { BaseWidget } from './BaseWidget.js';
 
 export class ChangelogWidget extends BaseWidget {
 	constructor(options) {
@@ -112,7 +112,7 @@ export class ChangelogWidget extends BaseWidget {
 		this.modalElement.innerHTML = `
 			<div class="changelog-modal-container">
 				<button class="changelog-modal-close" type="button" aria-label="Close">
-					<iconify-icon icon="ph:x-duotone" width="18" height="18"></iconify-icon>
+					<iconify-icon icon="ph:x" width="18" height="18"></iconify-icon>
 				</button>
 				<div class="changelog-modal-content">
 					<div class="changelog-loading">
@@ -263,7 +263,7 @@ export class ChangelogWidget extends BaseWidget {
 				<div class="changelog-list-modal-header">
 					<h2>${this.options.title || "What's New"} 🎉</h2>
 					<button class="changelog-list-modal-close" type="button" aria-label="Close">
-						<iconify-icon icon="ph:x-duotone" width="18" height="18"></iconify-icon>
+						<iconify-icon icon="ph:x" width="18" height="18"></iconify-icon>
 					</button>
 				</div>
 				<div class="changelog-list-modal-body">