@blumessage/react-chat 1.5.1 → 1.7.0

package/dist/BlumessageChat.js

@@ -237,7 +237,7 @@ primaryColor = "linear-gradient(to right, #3b82f6,rgb(8, 98, 242))",
 // Help bubble props
 showHelpBubble = true, helpBubbleMessage = "Have a question? We're here to help!", helpBubbleIcon = 'message-circle-question-mark', helpBubbleIconName, helpBubbleShowAfter = 1, // 1 second
 helpBubbleHideAfter = 5, // 5 seconds
-helpBubbleBackgroundColor = "#000000", }, ref) => {
+helpBubbleBackgroundColor = "#000000", context, }, ref) => {
     const [isInitialized, setIsInitialized] = (0, react_1.useState)(false);
     const [error, setError] = (0, react_1.useState)(null);
     const [messages, setMessages] = (0, react_1.useState)(initialMessages);
@@ -496,6 +496,10 @@ helpBubbleBackgroundColor = "#000000", }, ref) => {
             if (token) {
                 requestBody.token = token;
             }
+            // Include user context if provided
+            if (context && Object.keys(context).length > 0) {
+                requestBody.context = context;
+            }
             const response = await fetch('https://api.blumessage.com/api/v1/conversations', {
                 method: 'POST',
                 headers: {
@@ -711,6 +715,10 @@ helpBubbleBackgroundColor = "#000000", }, ref) => {
                 if (token) {
                     requestBody.token = token;
                 }
+                // Include user context if provided
+                if (context && Object.keys(context).length > 0) {
+                    requestBody.context = context;
+                }
                 const response = await fetch('https://api.blumessage.com/api/v1/conversations', {
                     method: 'POST',
                     headers: {
@@ -1007,7 +1015,25 @@ helpBubbleBackgroundColor = "#000000", }, ref) => {
                         ? 'bg-gray-900 border-gray-700'
                         : 'bg-white border-gray-100'}`, style: { padding: isMobile ? '12px 16px' : '16px 24px' }, children: (0, jsx_runtime_1.jsxs)("div", { className: `flex items-center rounded-2xl px-4 py-3 border ${theme === 'dark'
                             ? 'bg-gray-800 border-gray-600'
-                            : 'bg-gray-50 border-gray-200'}`, children: [(0, jsx_runtime_1.jsx)("textarea", { className: `flex-1 border-none bg-transparent outline-none text-sm font-inherit resize-none ${theme === 'dark' ? 'text-gray-100' : 'text-gray-700'}`, placeholder: placeholder, value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: handleKeyPress, rows: 1, style: {
+                            : 'bg-gray-50 border-gray-200'}`, children: [(0, jsx_runtime_1.jsx)("textarea", { className: `flex-1 border-none bg-transparent outline-none text-sm font-inherit resize-none ${theme === 'dark' ? 'text-gray-100' : 'text-gray-700'}`, placeholder: placeholder, value: inputValue, onChange: (e) => {
+                                    const newValue = e.target.value;
+                                    if (newValue.length <= 1000) {
+                                        setInputValue(newValue);
+                                    }
+                                }, onPaste: (e) => {
+                                    e.preventDefault();
+                                    const pastedText = e.clipboardData.getData('text');
+                                    const currentValue = inputValue;
+                                    const newValue = currentValue + pastedText;
+                                    if (newValue.length <= 1000) {
+                                        setInputValue(newValue);
+                                    }
+                                    else {
+                                        // Truncate to exactly 1000 characters
+                                        const truncatedValue = newValue.substring(0, 1000);
+                                        setInputValue(truncatedValue);
+                                    }
+                                }, onKeyDown: handleKeyPress, rows: 1, maxLength: 1000, style: {
                                     minHeight: '20px',
                                     maxHeight: isMobile ? '100px' : '120px',
                                     overflowY: inputValue.split('\n').length > 4 ? 'auto' : 'hidden',