{"id":34636769,"url":"https://github.com/0xarchit/anywhere-chatbot-chatty","last_synced_at":"2026-04-11T22:10:36.317Z","repository":{"id":317005254,"uuid":"1063983019","full_name":"0xarchit/AnyWhere-ChatBot-Chatty","owner":"0xarchit","description":"AnyWhere Chatbot (\"Chatty\") is a lightweight, drop-in JavaScript widget that adds a floating, context-aware chatbot to any website.","archived":false,"fork":false,"pushed_at":"2025-09-28T06:10:57.000Z","size":965,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-09-28T08:27:34.161Z","etag":null,"topics":["anywhere-chatbot","chatbot","chatty","genai-chatbot","javascript"],"latest_commit_sha":null,"homepage":"https://chatty.0xarchit.is-a.dev","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/0xarchit.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-09-25T11:32:50.000Z","updated_at":"2025-09-28T06:11:01.000Z","dependencies_parsed_at":"2025-09-28T08:27:36.760Z","dependency_job_id":"63be4483-2480-4a9c-842e-3e1b4edde477","html_url":"https://github.com/0xarchit/AnyWhere-ChatBot-Chatty","commit_stats":null,"previous_names":["0xarchit/anywhere-chatbot-chatty"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/0xarchit/AnyWhere-ChatBot-Chatty","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/0xarchit%2FAnyWhere-ChatBot-Chatty","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/0xarchit%2FAnyWhere-ChatBot-Chatty/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/0xarchit%2FAnyWhere-ChatBot-Chatty/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/0xarchit%2FAnyWhere-ChatBot-Chatty/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/0xarchit","download_url":"https://codeload.github.com/0xarchit/AnyWhere-ChatBot-Chatty/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/0xarchit%2FAnyWhere-ChatBot-Chatty/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28005408,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-12-24T02:00:07.193Z","response_time":83,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["anywhere-chatbot","chatbot","chatty","genai-chatbot","javascript"],"created_at":"2025-12-24T17:02:35.059Z","updated_at":"2025-12-24T17:04:09.692Z","avatar_url":"https://github.com/0xarchit.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# AnyWhere Chatbot — Chatty\n[![GitHub stars](https://img.shields.io/github/stars/0xarchit/AnyWhere-ChatBot-Chatty?style=flat-square\u0026logo=github)](https://github.com/0xarchit/AnyWhere-ChatBot-Chatty/stargazers)\n[![Issues](https://img.shields.io/github/issues/0xarchit/AnyWhere-ChatBot-Chatty?style=flat-square)](https://github.com/0xarchit/AnyWhere-ChatBot-Chatty/issues)\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen?style=flat-square)](https://github.com/0xarchit/AnyWhere-ChatBot-Chatty/pulls)\n[![Last Commit](https://img.shields.io/github/last-commit/0xarchit/AnyWhere-ChatBot-Chatty?style=flat-square)](https://github.com/0xarchit/AnyWhere-ChatBot-Chatty)\n[![Repo Size](https://img.shields.io/github/repo-size/0xarchit/AnyWhere-ChatBot-Chatty?style=flat-square)](https://github.com/0xarchit/AnyWhere-ChatBot-Chatty)\n[![Forks](https://img.shields.io/github/forks/0xarchit/AnyWhere-ChatBot-Chatty?style=flat-square)](https://github.com/0xarchit/AnyWhere-ChatBot-Chatty/network/members)\n[![Open PRs](https://img.shields.io/github/issues-pr/0xarchit/AnyWhere-ChatBot-Chatty?style=flat-square)](https://github.com/0xarchit/AnyWhere-ChatBot-Chatty/pulls)\n[![Top Language](https://img.shields.io/github/languages/top/0xarchit/AnyWhere-ChatBot-Chatty?style=flat-square)](https://github.com/0xarchit/AnyWhere-ChatBot-Chatty)\n[![Website Status](https://img.shields.io/website-up-down-green-red/https/chatty.0xarchit.is-a.dev/?style=flat-square)](https://chatty.0xarchit.is-a.dev)\n\n\nAnyWhere Chatbot (\"Chatty\") is a lightweight, drop-in JavaScript widget that adds a floating, context-aware chatbot to any website. The widget is delivered as a single script via Jsdelivr cdn. Chatty supports customizable branding, theme mode, system prompt, and optional page context capture.\n\n**Quick Start**\n- **Install:** Add the script tag to any page near the end of the `body`.\n\n\t\t```html\n\t\t\u003cscript src=\"https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js\"\n\t\t\tmode=\"dark\"\n\t\t\tbrandName=\"AnyWhere ChatBot\"\n\t\t\tsystemPrompt=\"You are testing chatbot for AnyWhere Chatbot created and owned by 0xArchit.\"\n\t\t\tcontext=\"toggle\"\u003e\u003c/script\u003e\n\t\t```\n\n\n## Screenshots\n\n- Demo 1 — Chatty on GitHub Profile Analyzer tool\n\n\t![Demo 1 — GitHub Profile Analyzer](assets/demo1.png)\n\n- Demo 2 — Chatty integrated on my portfolio website\n\n\t![Demo 2 — Portfolio Website](assets/demo2.png)\n\n- Testing — Local testing page for Chatty\n\n\t![Testing — Local Test Page](assets/testing.png)\n\n\n**How it Works**\n- The script creates a floating chat toggle in the bottom-right of the page and opens a compact chat window when clicked.\n- It uses a Shadow DOM to encapsulate styles and markup so it won't clash with your site's CSS.\n- Chat history is stored in `sessionStorage` under the key `chatbotHistory` for the current browser session.\n- Optionally the widget can capture a lightweight page context (title, metadata and nearby text snippets) and include that with user messages to improve relevance.\n\n**Script Attributes (options)**\n- **`mode`**: Set the visual theme. Accepted values: `\"dark\"` or `\"light\"`. If omitted, Chatty prefers the user's `prefers-color-scheme` setting. Example: `mode=\"dark\"`.\n- **`brandName`**: A short name shown in the chat header. Default: `Chatty`. Example: `brandName=\"AnyWhere ChatBot\"`.\n- **`systemPrompt`**: The assistant system prompt used to guide the model's behaviour. Provide a short descriptive instruction. Example: `systemPrompt=\"You are a helpful assistant for AnyWhere ChatBot.\"\n\t`\n\n- **`context`**: Controls page context capture. Accepts values such as `true`, `false`, `toggle`. For convenience, the following are also understood: `yes/no`, `on/off`, `1/0`, `always/never`, `auto/default/toggle`. Internally these map to one of three modes:\n\t- `always` → include page context with every request (e.g., `context=\"true\"`, `context=\"yes\"`, `context=\"always\"`).\n\t- `never` → never include page context (e.g., `context=\"false\"`, `context=\"no\"`, `context=\"never\"`).\n\t- `toggle` → show a small context toggle in the chat UI so visitors can enable/disable context per session (e.g., `context=\"toggle\"`, `context=\"auto\"`, omitted attribute).\n\nExample attribute usage: `context=\"toggle\"`, `context=\"true\"`, `context=\"false\"`, `context=\"always\"`, `context=\"never\"`.\n\n**Examples**\n- Minimal (defaults):\n\n\t```html\n\t\u003cscript src=\"https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js\"\u003e\u003c/script\u003e\n\t```\n\n- Custom brand and light mode:\n\n\t\t```html\n\t\t\u003cscript src=\"https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js\"\n\t\t\tmode=\"light\"\n\t\t\tbrandName=\"SupportBot\"\u003e\u003c/script\u003e\n\t\t```\n\n- Context always enabled with a custom system prompt:\n\n\t\t```html\n\t\t\u003cscript src=\"https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js\"\n\t\t\tcontext=\"true\"\n\t\t\tsystemPrompt=\"You are a friendly support assistant for ExampleCorp.\"\u003e\u003c/script\u003e\n\t\t```\n\n- Programmatic insertion (useful when loading scripts conditionally):\n\n\t```html\n\t\u003cscript\u003e\n\t\tconst s = document.createElement('script');\n\t\ts.src = 'https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js';\n\t\ts.setAttribute('mode', 'dark');\n\t\ts.setAttribute('brandName', 'AnyWhere ChatBot');\n\t\tdocument.body.appendChild(s);\n\t\u003c/script\u003e\n\t```\n\n- Force context off (no page text captured):\n\n\t```html\n\t\u003cscript src=\"https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js\" context=\"false\"\u003e\u003c/script\u003e\n\t```\n\n- Toggleable context with a different brand and light mode:\n\n\t\t```html\n\t\t\u003cscript src=\"https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js\"\n\t\t\tmode=\"light\"\n\t\t\tbrandName=\"AnyWhere ChatBot\"\n\t\t\tcontext=\"toggle\"\u003e\u003c/script\u003e\n\t\t```\n\n- Self-hosted CDN path example:\n\n\t```html\n\t\u003cscript src=\"https://cdn.example.com/widgets/chatty.js\"\n\tmode=\"dark\"\n\tbrandName=\"AnyWhere ChatBot\"\n\tsystemPrompt=\"You are a helpful assistant for AnyWhere ChatBot.\"\u003e\u003c/script\u003e\n\t```\n\n- Defer loading via `defer` attribute so it doesn't block rendering:\n\n\t```html\n\t\u003cscript defer src=\"https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js\" mode=\"dark\"\u003e\u003c/script\u003e\n\t```\n\n- Programmatically set attributes including context mode:\n\n\t```html\n\t\u003cscript\u003e\n\t\tconst s = document.createElement('script');\n\t\ts.src = 'https://cdn.jsdelivr.net/gh/0xarchit/AnyWhere-ChatBot-Chatty@1.0.0/chatty.min.js';\n\t\ts.setAttribute('mode', 'dark');\n\t\ts.setAttribute('brandName', 'AnyWhere ChatBot');\n\t\ts.setAttribute('context', 'always'); // also accepts: toggle/never/true/false/default\n\t\ts.setAttribute('systemPrompt', 'You are a friendly support assistant.');\n\t\tdocument.body.appendChild(s);\n\t\u003c/script\u003e\n\t```\n\n**Customization \u0026 Theming**\n- `mode` controls the built-in dark/light palette. Because Chatty uses Shadow DOM, your site CSS won't affect the widget. If you want to change the widget visuals you'll need to modify the script.\n- `brandName` and `systemPrompt` are the easiest ways to adapt the assistant to your site and tone of voice.\n- The input placeholder and button icons come from the script; editing them requires changing the `chatty.js` source.\n\nTip: If you plan to support multiple themes later, consider wrapping your overrides in CSS custom properties and reading them inside the widget (requires editing `chatty.js`).\n\n**Privacy \u0026 Data Handling**\n- Chatty may send user messages (and optionally captured page context) to the configured backend or third-party API defined inside the script. In the distributed `chatty.js` the variable `apiEndpoint` points to an external service — confirm and host or modify this endpoint to a service you control if you have privacy requirements.\n- Do not enable `context=\"true\"` on pages that contain sensitive personal data unless you are sure the backend is acceptable for such data.\n- Chat history is stored only in the browser session (`sessionStorage`) and is not persisted to the cdn server by the widget itself.\n\nConfiguration notes:\n- The page context captured is plain text from visible elements (headings, paragraphs, list items, etc.) and trimmed to a safe length; it excludes content inside `script`, `style`, and `noscript`.\n- Only one Chatty instance is intended per page. If you add multiple script tags, the last one runs and creates one widget.\n\n**Accessibility**\n- The widget uses semantic elements and keyboard-focusable controls. It includes a toggle button that can be activated with keyboard and has visually distinct focus styles.\n- If your page has strict accessibility requirements, verify contrast and focus order with your auditing tools and adjust the hosted script as needed.\n\n**Troubleshooting**\n- Chat button does not appear:\n\t- Confirm the script `src` URL is correct and the CDN is serving the file.\n\t- Check the browser console for syntax errors or blocked cross-origin requests (CSP).\n- Chat opens but messages don't send:\n\t- Inspect the network tab to see if requests are hitting the configured `apiEndpoint`.\n\t- Confirm the remote API accepts the payload and CORS is configured.\n- Context toggle not visible or not working:\n\t- If `context` is set to `true`/`always` or `false`/`never` the toggle will be forced on/off. Use `context=\"toggle\"` (or `auto`/omit) for a visible toggle.\n- Clearing chat history:\n\t- Open developer console and run: `sessionStorage.removeItem('chatbotHistory')`.\n\n**Developer Notes**\n- The widget creates a container with id `0xarchit-chatbot-container` and uses Shadow DOM for isolation.\n- Chat messages are rendered inside an element with id `0xarchit-chatbot-messages` and history is read from / written to `sessionStorage`.\n - When context is enabled, the page text is appended to the last user message in the payload sent to the API, keeping the on-screen chat history clean.\n\n**Contributing \u0026 Support**\n- To contribute or customize, edit `chatty.js` and test locally by loading `main.html` in your browser.\n- For help integrating on specific platforms (WordPress, Shopify, etc.), open an issue or create a fork with platform-specific examples.\n\n\n## Future Goals\n\n- Multi-theme support: built-in themes (e.g., primary colors, compact/comfortable density) and a `theme` attribute.\n- Custom theming API: CSS custom properties and/or a lightweight config object to override palette, shapes, and spacing without editing the script.\n- Markdown rendering for assistant messages (links, code blocks, lists) with safe sanitization.\n- Streaming responses for faster perceived latency and typing effect.\n- Internationalization (i18n): UI strings and placeholder configurable via attributes; RTL layout support.\n- Persistence options: opt-in localStorage persistence and export/import chat transcripts.\n\n## License\nSee [LICENSE](LICENSE)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2F0xarchit%2Fanywhere-chatbot-chatty","html_url":"https://awesome.ecosyste.ms/projects/github.com%2F0xarchit%2Fanywhere-chatbot-chatty","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2F0xarchit%2Fanywhere-chatbot-chatty/lists"}