Echoed Assistant

Echoed Assistant is a reusable, embeddable React chatbot component that answers questions based on user-uploaded documents. It’s designed to be drop-in friendly: supply an API key from your Echoed dashboard (or use a server-side proxy), allow users to upload docs (PDF, DOCX, TXT, PPTX, images, etc.), and the assistant will respond using the uploaded content as its knowledge base.

✨ Highlights

• Single-component install (EchoedAssistant) for easy embedding in React apps
• Document upload + semantic retrieval (PDF, DOCX, PPTX, TXT, images with OCR, etc.)
• Works with short-lived client keys or server-side proxy using a secret key
• Customizable UI, theme tokens, and event callbacks
• Designed to be framework-neutral for styling (Tailwind-friendly)

📦 Install

npm install echoed-assistant
# or
yarn add echoed-assistant

🚀 Quick Start (React)

import React from "react";
import EchoedAssistant from "echoed-assistant";

export default function App() {
  return (
    <div style={{ height: 600, maxWidth: 720, margin: "0 auto" }}>
      <EchoedAssistant apiKey="YOUR_CLIENT_KEY_OR_PROXY_TOKEN" />
    </div>
  );
}

Security tip: Avoid shipping privileged dashboard keys in client-side code. Use the proxy example below for production.

🔧 Props (commonly used)

• apiKey: string — API key or short-lived token for the Echoed dashboard (or use proxy token)

The component supports additional advanced props for power users. Refer to the package source for the full type signature.

🧭 How it works (overview)

1. User uploads documents through the component UI.
2. Files are posted to your Echoed dashboard API (authorized by provided key).
3. Dashboard processes files (text extraction, OCR, embeddings) and stores a knowledge index.
4. When a user asks a question, the client queries the dashboard for semantic retrieval + generation.
5. Responses are returned and rendered in the component.

🛠 Troubleshooting

• Upload errors: Confirm CORS config and file-size limits on the dashboard. Check network console and onError callback.
• Empty responses: Ensure the uploaded docs finished processing (indexing) on the dashboard before querying.
• Auth failures: Verify the token scope and that the Authorization header is correct.
• Styling issues: The component is style-neutral. Wrap it or pass styles/theme to match your app.

🧩 Contributing

Contributions are welcome! Suggested improvements:

• Additional parsers (more document formats / OCR improvements)
• i18n / RTL support
• Prebuilt visual themes
• Smaller bundle variants

Please open issues or PRs against the repository.

📜 License

MIT — see LICENSE.

📌 Changelog

See CHANGELOG.md for detailed release notes.

If you want, I can also:

• generate a ready-to-use README.md file (this file is prepared for that),
• create a short README badge snippet for your package page, or
• prepare a minimal example/ folder with a sample React app demonstrating the component.

Which would you like next?