@newfold/wp-module-ai-chat 1.0.1 → 1.0.2

package/src/styles/_typing-indicator.scss

@@ -1,162 +0,0 @@
-/* Typing Indicator */
-.nfd-ai-chat-typing-indicator {
-	display: flex;
-	align-items: center;
-	gap: var(--nfd-ai-chat-spacing-sm);
-	padding: var(--nfd-ai-chat-spacing-xs) 0;
-}
-
-.nfd-ai-chat-typing-indicator__dots {
-	display: flex;
-	align-items: center;
-	gap: var(--nfd-ai-chat-spacing-xs);
-
-	span {
-		width: 6px;
-		height: 6px;
-		border-radius: 50%;
-		background: var(--nfd-ai-chat-color-grey-dark);
-		animation: nfd-ai-chat-typing-bounce 1.4s ease-in-out infinite both;
-
-		&:nth-child(2) {
-			animation-delay: 0.2s;
-		}
-
-		&:nth-child(3) {
-			animation-delay: 0.4s;
-		}
-	}
-}
-
-@keyframes nfd-ai-chat-typing-bounce {
-
-	0%,
-	60%,
-	100% {
-		transform: translateY(0);
-	}
-
-	30% {
-		transform: translateY(-4px);
-	}
-}
-
-.nfd-ai-chat-typing-indicator__text {
-	font-size: var(--nfd-ai-chat-font-size-base);
-	color: var(--nfd-ai-chat-color-grey-dark);
-	min-width: 0;
-}
-
-.nfd-ai-chat-typing-indicator__reasoning {
-	font-size: var(--nfd-ai-chat-font-size-sm);
-	color: var(--nfd-ai-chat-color-grey-medium);
-	font-style: italic;
-	line-height: 1.4;
-	margin-top: 4px;
-}
-
-@keyframes nfd-ai-chat-spin {
-
-	from {
-		transform: rotate(0deg);
-	}
-
-	to {
-		transform: rotate(360deg);
-	}
-}
-
-/* Tool Execution */
-.nfd-ai-chat-tool-execution {
-	width: 100%;
-}
-
-.nfd-ai-chat-tool-execution__header {
-	display: flex;
-	align-items: center;
-	gap: 6px;
-	padding: 4px 0;
-	background: none;
-	border: none;
-	cursor: pointer;
-	font-size: var(--nfd-ai-chat-font-size-sm);
-	color: var(--nfd-ai-chat-color-grey-dark);
-	width: 100%;
-	text-align: left;
-
-	&:hover {
-		color: var(--nfd-ai-chat-color-text);
-	}
-}
-
-.nfd-ai-chat-tool-execution__chevron {
-	flex-shrink: 0;
-}
-
-.nfd-ai-chat-tool-execution__header-count {
-	color: var(--nfd-ai-chat-color-grey-medium);
-	margin-left: 4px;
-}
-
-.nfd-ai-chat-tool-execution__list {
-	display: flex;
-	flex-direction: column;
-}
-
-.nfd-ai-chat-tool-execution__item {
-	display: flex;
-	flex-direction: column;
-	gap: 2px;
-	padding: 4px 0;
-}
-
-.nfd-ai-chat-tool-execution__item-header {
-	display: flex;
-	align-items: center;
-	gap: 6px;
-}
-
-.nfd-ai-chat-tool-execution__icon {
-	flex-shrink: 0;
-
-	&--active {
-		color: var(--nfd-ai-chat-color-primary);
-		animation: nfd-ai-chat-spin 1s linear infinite;
-	}
-
-	&--success {
-		color: var(--nfd-ai-chat-color-success);
-	}
-
-	&--error {
-		color: var(--nfd-ai-chat-color-error);
-	}
-
-	&--pending {
-		color: var(--nfd-ai-chat-color-grey-medium);
-	}
-}
-
-.nfd-ai-chat-tool-execution__item-title {
-	font-size: var(--nfd-ai-chat-font-size-sm);
-	color: var(--nfd-ai-chat-color-text);
-}
-
-.nfd-ai-chat-tool-execution__item-params {
-	font-size: var(--nfd-ai-chat-font-size-sm);
-	color: var(--nfd-ai-chat-color-grey-medium);
-	margin-left: 4px;
-}
-
-.nfd-ai-chat-tool-execution__item-progress {
-	font-size: var(--nfd-ai-chat-font-size-sm);
-	color: var(--nfd-ai-chat-color-grey-dark);
-	padding-left: 18px;
-}
-
-.nfd-ai-chat-tool-execution__item-summary {
-	font-size: var(--nfd-ai-chat-font-size-sm);
-	color: var(--nfd-ai-chat-color-grey-medium);
-	padding-left: 18px;
-	margin-top: 2px;
-}

package/src/styles/_ui.scss

@@ -1,173 +0,0 @@
-/* AI Avatar */
-.nfd-ai-chat-avatar {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	border-radius: var(--nfd-ai-chat-radius-full);
-	background: linear-gradient(135deg, var(--nfd-ai-chat-color-primary) 0%, var(--nfd-ai-chat-color-primary-hover) 100%);
-	color: var(--nfd-ai-chat-color-white);
-	transition: transform 0.2s ease, box-shadow 0.2s ease;
-
-	svg {
-		fill: currentcolor;
-	}
-}
-
-/* Chat header - white background, AILogo + pill + actions */
-.nfd-ai-chat-header {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: 12px;
-	background-color: var(--nfd-ai-chat-color-white);
-	padding: 12px 16px;
-	flex-shrink: 0;
-}
-
-/* Header logo: no background, plain icon (override brand) */
-.nfd-ai-chat-header .nfd-ai-chat-header__brand .nfd-ai-chat-avatar {
-	background: none;
-	color: var(--nfd-ai-chat-color-text, #1e1e1e);
-	box-shadow: none;
-}
-
-.nfd-ai-chat-header__brand {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	color: var(--nfd-ai-chat-color-text, #1e1e1e);
-}
-
-.nfd-ai-chat-header__title {
-	font-size: var(--nfd-ai-chat-font-size-base);
-	font-weight: 600;
-	color: var(--nfd-ai-chat-color-text, #1e1e1e);
-	line-height: 1;
-}
-
-.nfd-ai-chat-header__actions {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-}
-
-.nfd-ai-chat-header__btn {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 28px;
-	height: 28px;
-	padding: 0;
-	border: none;
-	background: transparent;
-	color: var(--nfd-ai-chat-color-text, #1e1e1e);
-	cursor: pointer;
-	border-radius: var(--nfd-ai-chat-radius-sm, 4px);
-	transition: background-color 0.15s ease, color 0.15s ease;
-}
-
-.nfd-ai-chat-header__btn:disabled {
-	opacity: 0.5;
-	cursor: not-allowed;
-}
-
-.nfd-ai-chat-header__btn:hover:not(:disabled) {
-	background-color: var(--nfd-ai-chat-color-background, #f5f5f5);
-}
-
-.nfd-ai-chat-header__btn--new {
-	font-size: 16px;
-	line-height: 1;
-	font-weight: 300;
-}
-
-.nfd-ai-chat-header__btn--close svg {
-	display: block;
-}
-
-/* BETA badge - solid dark blue pill (matches editor-chat sidebar) */
-.nfd-ai-chat-blu-beta-badge {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	font-size: 10px;
-	font-weight: 600;
-	padding: 4px 8px;
-	border-radius: 4px;
-	background-color: var(--nfd-ai-chat-color-primary);
-	color: var(--nfd-ai-chat-color-white);
-	text-transform: uppercase;
-	letter-spacing: 0.25px;
-	line-height: 1;
-}
-
-/* Error Alert */
-.nfd-ai-chat-error-alert {
-	display: flex;
-	align-items: flex-start;
-	gap: 12px;
-	padding: 12px 16px;
-	background: rgba(214, 54, 56, 0.08);
-	border: 1px solid var(--nfd-ai-chat-color-error);
-	border-radius: 8px;
-	margin: 8px 0;
-}
-
-.nfd-ai-chat-error-alert__icon {
-	flex-shrink: 0;
-	color: var(--nfd-ai-chat-color-error);
-	margin-top: 2px;
-}
-
-.nfd-ai-chat-error-alert__content {
-	flex: 1;
-	min-width: 0;
-	overflow: hidden;
-}
-
-.nfd-ai-chat-error-alert__message {
-	font-size: var(--nfd-ai-chat-font-size-base);
-	color: var(--nfd-ai-chat-color-error);
-	line-height: 1.5;
-	overflow-wrap: break-word;
-	word-break: break-word;
-	min-width: 0;
-}
-
-/* Suggestion Button */
-.components-button.nfd-ai-chat-suggestion {
-	display: flex;
-	align-items: center;
-	gap: var(--nfd-ai-chat-spacing-sm);
-	padding: var(--nfd-ai-chat-spacing-sm) var(--nfd-ai-chat-spacing-md);
-	background: var(--nfd-ai-chat-color-white);
-	border: 1px solid var(--nfd-ai-chat-color-border);
-	border-radius: var(--nfd-ai-chat-radius-full);
-	font-size: var(--nfd-ai-chat-font-size-sm);
-	color: var(--nfd-ai-chat-color-text-secondary);
-	cursor: pointer;
-	transition: all 0.15s ease;
-	box-shadow: var(--nfd-ai-chat-shadow-sm);
-
-	&:hover {
-		background: var(--nfd-ai-chat-color-background);
-		border-color: var(--nfd-ai-chat-color-primary);
-		color: var(--nfd-ai-chat-color-primary);
-		transform: translateY(-1px);
-		box-shadow: var(--nfd-ai-chat-shadow-md);
-	}
-
-	&:active {
-		transform: translateY(0);
-	}
-}
-
-.nfd-ai-chat-suggestion__icon {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-}
-
-.nfd-ai-chat-suggestion__text {
-	white-space: nowrap;
-}

package/src/styles/_vars.scss

@@ -1,103 +0,0 @@
-/* -------------------------------------------------------------------------- */
-
-/*                         AI Chat CSS Variables                              */
-
-/* -------------------------------------------------------------------------- */
-
-:root {
-
-	/* Default/Base colors - can be overridden by brand-specific variables */
-	--nfd-ai-chat-color-primary: #2271b1;
-	--nfd-ai-chat-color-primary-hover: #135e96;
-	--nfd-ai-chat-color-primary-active: #0e4b72;
-	--nfd-ai-chat-color-primary-light-8: rgba(34, 113, 177, 0.08);
-	--nfd-ai-chat-color-primary-light-12: rgba(34, 113, 177, 0.12);
-	--nfd-ai-chat-color-primary-light-16: rgba(34, 113, 177, 0.16);
-	--nfd-ai-chat-color-primary-light-20: rgba(34, 113, 177, 0.2);
-
-	/* Grey colors */
-	--nfd-ai-chat-color-grey-dark: #666;
-	--nfd-ai-chat-color-grey-medium: #999;
-	--nfd-ai-chat-color-grey-light: #ddd;
-	--nfd-ai-chat-color-grey-placeholder: #9e9e9e;
-
-	/* Error/Danger colors */
-	--nfd-ai-chat-color-error: #d63638;
-	--nfd-ai-chat-color-error-hover: #b32d2e;
-	--nfd-ai-chat-color-error-active: #8a2424;
-	--nfd-ai-chat-color-error-alpha-10: rgba(214, 54, 56, 0.1);
-	--nfd-ai-chat-color-error-alpha-15: rgba(214, 54, 56, 0.15);
-
-	/* Success colors */
-	--nfd-ai-chat-color-success: #00a32a;
-
-	/* UI colors */
-	--nfd-ai-chat-color-border: #e0e0e0;
-	--nfd-ai-chat-color-background: #f5f5f5;
-	--nfd-ai-chat-color-text: #1e1e1e;
-	--nfd-ai-chat-color-text-secondary: #424242;
-	--nfd-ai-chat-color-white: #fff;
-
-	/* Typography */
-	--nfd-ai-chat-font-size-base: 14px;
-	--nfd-ai-chat-font-size-xl: 22px;
-	--nfd-ai-chat-font-size-lg: 20px;
-	--nfd-ai-chat-font-size-md: 16px;
-	--nfd-ai-chat-font-size-sm: 12px;
-	--nfd-ai-chat-font-size-xs: 10px;
-
-	/* Spacing */
-	--nfd-ai-chat-spacing-xs: 4px;
-	--nfd-ai-chat-spacing-sm: 8px;
-	--nfd-ai-chat-spacing-md: 16px;
-	--nfd-ai-chat-spacing-lg: 24px;
-	--nfd-ai-chat-spacing-xl: 32px;
-
-	/* Border radius */
-	--nfd-ai-chat-radius-sm: 4px;
-	--nfd-ai-chat-radius-md: 8px;
-	--nfd-ai-chat-radius-lg: 12px;
-	--nfd-ai-chat-radius-xl: 16px;
-	--nfd-ai-chat-radius-full: 9999px;
-
-	/* Shadows */
-	--nfd-ai-chat-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-	--nfd-ai-chat-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
-	--nfd-ai-chat-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
-}
-
-/* -------------------------------------------------------------------------- */
-
-/*                         Brand-Specific Variables                          */
-
-/* -------------------------------------------------------------------------- */
-
-/* Bluehost Brand */
-.nfd-brand-bluehost,
-[data-brand="bluehost"] {
-
-	/* Primary Bluehost Blue - #0075FA */
-	--nfd-ai-chat-color-primary: #0075fa;
-	--nfd-ai-chat-color-primary-hover: #0066e0;
-	--nfd-ai-chat-color-primary-active: #0055c2;
-	--nfd-ai-chat-color-primary-light-8: rgba(0, 117, 250, 0.08);
-	--nfd-ai-chat-color-primary-light-12: rgba(0, 117, 250, 0.12);
-	--nfd-ai-chat-color-primary-light-16: rgba(0, 117, 250, 0.16);
-	--nfd-ai-chat-color-primary-light-20: rgba(0, 117, 250, 0.2);
-
-	/* Enhanced UI colors for professional look */
-	--nfd-ai-chat-color-background: #f8f9fa;
-	--nfd-ai-chat-color-border: #e5e7eb;
-	--nfd-ai-chat-color-text: #111827;
-	--nfd-ai-chat-color-text-secondary: #6b7280;
-}
-
-/* Add more brands here as needed */
-
-/* Example:
-.nfd-brand-hostgator,
-[data-brand="hostgator"] {
-	--nfd-ai-chat-color-primary: #FF6600;
-	...
-}
-*/

package/src/styles/_welcome.scss

@@ -1,81 +0,0 @@
-.nfd-ai-chat-welcome {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	text-align: center;
-	padding: var(--nfd-ai-chat-spacing-xl) var(--nfd-ai-chat-spacing-md);
-	flex: 1;
-	background: var(--nfd-ai-chat-color-white);
-}
-
-.nfd-ai-chat-welcome__content {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	gap: 16px;
-}
-
-.nfd-ai-chat-welcome__avatar {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	margin-bottom: 24px;
-}
-
-/* Purplish gradient logo on welcome — higher specificity to override brand */
-.nfd-ai-chat-welcome .nfd-ai-chat-welcome__avatar .nfd-ai-chat-avatar {
-	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-	color: #fff;
-	box-shadow: none;
-}
-
-.nfd-ai-chat-welcome__message {
-	display: flex;
-	flex-direction: column;
-	gap: 4px;
-}
-
-.nfd-ai-chat-welcome__title {
-	font-size: var(--nfd-ai-chat-font-size-lg);
-	font-weight: 600;
-	color: var(--nfd-ai-chat-color-text);
-}
-
-.nfd-ai-chat-welcome__subtitle {
-	font-size: var(--nfd-ai-chat-font-size-base);
-	color: var(--nfd-ai-chat-color-text-secondary);
-	line-height: 1.5;
-}
-
-.nfd-ai-chat-welcome__cursor {
-	display: inline-block;
-	width: 2px;
-	height: 1em;
-	margin-left: 2px;
-	vertical-align: text-bottom;
-	background: currentcolor;
-	animation: nfd-ai-chat-cursor-blink 0.8s step-end infinite;
-}
-
-@keyframes nfd-ai-chat-cursor-blink {
-
-	0%,
-	50% {
-		opacity: 1;
-	}
-
-	51%,
-	100% {
-		opacity: 0;
-	}
-}
-
-.nfd-ai-chat-suggestions {
-	display: flex;
-	flex-wrap: wrap;
-	justify-content: center;
-	gap: var(--nfd-ai-chat-spacing-sm);
-	margin-top: var(--nfd-ai-chat-spacing-lg);
-	max-width: 400px;
-}

package/src/styles/app.scss

@@ -1,10 +0,0 @@
-/* AI Chat Core Styles */
-@use "vars";
-@use "mixins";
-@use "messages";
-@use "input";
-@use "welcome";
-@use "ui";
-@use "typing-indicator";
-@use "branding";
-@use "history";

package/src/utils/helpers.js

@@ -1,75 +0,0 @@
-/**
- * Unescape AI response text so display shows normal quotes instead of \"
- * Handles JSON-style escaped quotes that can appear in model/tool output.
- *
- * @param {string} text - Raw message text that may contain \" or \'
- * @return {string} Text with escaped quotes replaced for display
- */
-export const unescapeAiResponse = (text) => {
-	if (!text || typeof text !== "string") {
-		return text;
-	}
-	return text.replace(/\\"/g, '"').replace(/\\'/g, "'");
-};
-
-/**
- * Simple hash function to create a unique identifier from a string
- * Uses a variation of the djb2 hash algorithm
- *
- * @param {string} str - The string to hash
- * @return {string} A hexadecimal hash string
- */
-export const simpleHash = (str) => {
-	// Handle null, undefined, or empty strings
-	if (!str || typeof str !== "string") {
-		return "0";
-	}
-
-	let hash = 5381;
-	for (let i = 0; i < str.length; i++) {
-		// eslint-disable-next-line no-bitwise
-		hash = (hash << 5) + hash + str.charCodeAt(i); // hash * 33 + c
-		// eslint-disable-next-line no-bitwise
-		hash = hash | 0; // Convert to 32-bit integer
-	}
-	// Convert to unsigned and then to hex
-	// eslint-disable-next-line no-bitwise
-	return (hash >>> 0).toString(16);
-};
-
-/**
- * Generate a unique session ID
- *
- * @return {string} New session ID
- */
-export const generateSessionId = () => {
-	return crypto.randomUUID
-		? crypto.randomUUID()
-		: `${Date.now()}-${Math.random().toString(36).substring(2, 15)}`;
-};
-
-/**
- * Debounce function
- *
- * @param {Function} func - Function to debounce
- * @param {number}   wait - Wait time in milliseconds
- * @return {Function} Debounced function
- */
-export const debounce = (func, wait) => {
-	let timeout;
-	return function executedFunction(...args) {
-		const later = () => {
-			clearTimeout(timeout);
-			func(...args);
-		};
-		clearTimeout(timeout);
-		timeout = setTimeout(later, wait);
-	};
-};
-
-export default {
-	unescapeAiResponse,
-	simpleHash,
-	generateSessionId,
-	debounce,
-};