Wovvtech AI Assistant 🚀

wovvmap-ai-assistant ek cross-platform NPM package hai jo aapke Mall ya Store ke liye ek powerful AI-driven Chat Assistant provide karta hai. Iska use karke aap Web (React) aur Native (React Native) dono platforms par ek premium AI chat interface integration kar sakte hain.

✨ Features

• Cross-Platform: React Web aur React Native dono ke liye separate optimized components.
• Smart Data Registration: Sirf mapData pass karein, package apne aap backend me stores register kar lega.
• Unique Navigation: onNavigate callback ab store name ke saath unique key (ID) bhi deta hai, jisse duplicate names ka confusion khatam ho jata hai.
• Smart Scrolling: Lambe assistant replies apne aap top se dikhenge, jabki user messages bottom par scroll honge.
• Highly Customizable: Custom gradients, fonts, aur greetings support.

📦 Installation

npm install wovvmap-ai-assistant
# or
yarn add wovvmap-ai-assistant

🌐 Web Usage (React)

import { WovvAIAssistantWeb } from 'wovvmap-ai-assistant/web';
import 'wovvmap-ai-assistant/styles.css'; // Import styles for Tailwind CSS to work

function App() {
  return (
    <WovvAIAssistantWeb 
      baseUrl="http://localhost:3000"
      mallId="MALL_001"
      name="Mall Buddy"
      initialGreeting="Namaste! Main aapki kya madad kar sakta hoon?"
      mapData={myStoreList} // Array of searchable points
      theme={{
        themePrimary: "#8B5EC8",
        themeBg: "linear-gradient(to bottom, #8B5EC8, #68A5DA)",
        themeFontPrimary: "'Poppins-Bold', cursive"
      }}
      onNavigate={(storeName, key) => {
        console.log(`Navigating to ${storeName} with ID: ${key}`);
        // Trigger your map navigation logic here
      }}
    />
  );
}

📱 Native Usage (React Native)

import { WovvAIAssistantNative } from 'wovvmap-ai-assistant/native';

function App() {
  return (
    <WovvAIAssistantNative 
      baseUrl="http://your-api.com"
      mallId="MALL_001"
      mapData={myStoreList}
      primaryColor="#8B5EC8"
      onNavigate={(storeName, key) => {
        // Mobile map navigation logic
      }}
    />
  );
}

⚙️ Props Configuration

| Prop | Type | Description | | :--- | :--- | :--- | | baseUrl | string | Aapke backend API ka base URL (e.g. http://localhost:3000). | | mallId | string | Mall ka unique identifier jo backend me data register karne ke liye kaam aata hai. | | mapData | any[] | Stores/Points ka array. Agar ye pass kiya gaya hai, toh package ise automatically /api/register par bhej dega. | | initialGreeting | string | AI ka pehla welcome message. | | onNavigate | (name, key) => void| Jab user "Get Directions" par click karega, ye function trigger hoga. Isme store ka naam aur unique key milengi. | | theme | WovvAIAssistantTheme | (Web Only) Custom colors, gradients, aur font settings. | | primaryColor | string | UI ka main color. |

🛠️ Performance & Best Practices

• Auto-Wait: Package tab tak Chat UI enable nahi karta jab tak mapData backend me successfully register na ho jaye. Developer ko manually register karne ki zarurat nahi hai.
• Debounced Scrolling: New messages par intelligent scroll logic chalta hai taaki reading experience seamless rahe.
• Native Optimization: React Native me KeyboardAvoidingView ka use kiya gaya hai taaki chatting ke waqt UI hide na ho.

Made with ❤️ by WovvTech Team.