{"id":36703283,"url":"https://github.com/botfront/rasa-webchat","last_synced_at":"2026-01-12T11:40:17.729Z","repository":{"id":37359529,"uuid":"125552270","full_name":"botfront/rasa-webchat","owner":"botfront","description":"A feature-rich chat widget for Rasa and Botfront","archived":false,"fork":false,"pushed_at":"2025-08-21T16:04:10.000Z","size":9510,"stargazers_count":1021,"open_issues_count":25,"forks_count":511,"subscribers_count":35,"default_branch":"master","last_synced_at":"2025-10-27T00:55:01.324Z","etag":null,"topics":["chat","chat-application","chat-widget","chatbots","rasa-core","webchat"],"latest_commit_sha":null,"homepage":"https://botfront.io/rasa","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/botfront.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-03-16T18:01:46.000Z","updated_at":"2025-10-22T15:44:04.000Z","dependencies_parsed_at":"2024-06-18T15:28:27.830Z","dependency_job_id":"e5b60e1a-a04d-476c-8ea7-d30e0e9845f7","html_url":"https://github.com/botfront/rasa-webchat","commit_stats":{"total_commits":588,"total_committers":31,"mean_commits":"18.967741935483872","dds":0.7312925170068028,"last_synced_commit":"d76b096aa6736dfbebe129a366f1d6b560c97b29"},"previous_names":["mrbot-ai/rasa-webchat"],"tags_count":92,"template":false,"template_full_name":null,"purl":"pkg:github/botfront/rasa-webchat","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/botfront%2Frasa-webchat","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/botfront%2Frasa-webchat/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/botfront%2Frasa-webchat/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/botfront%2Frasa-webchat/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/botfront","download_url":"https://codeload.github.com/botfront/rasa-webchat/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/botfront%2Frasa-webchat/sbom","scorecard":{"id":248798,"data":{"date":"2025-08-11","repo":{"name":"github.com/botfront/rasa-webchat","commit":"d76b096aa6736dfbebe129a366f1d6b560c97b29"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":3.4,"checks":[{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Code-Review","score":4,"reason":"Found 12/30 approved changesets -- score normalized to 4","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Token-Permissions","score":0,"reason":"detected GitHub workflow tokens with excessive permissions","details":["Warn: no topLevel permission defined: .github/workflows/test.yaml:1","Info: no jobLevel write permissions found"],"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Dangerous-Workflow","score":10,"reason":"no dangerous workflow patterns detected","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Pinned-Dependencies","score":3,"reason":"dependency not pinned by hash detected -- score normalized to 3","details":["Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/test.yaml:10: update your workflow using https://app.stepsecurity.io/secureworkflow/botfront/rasa-webchat/test.yaml/master?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/test.yaml:11: update your workflow using https://app.stepsecurity.io/secureworkflow/botfront/rasa-webchat/test.yaml/master?enable=pin","Info:   0 out of   2 GitHub-owned GitHubAction dependencies pinned","Info:   1 out of   1 npmCommand dependencies pinned"],"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: Apache License 2.0: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":-1,"reason":"internal error: error during branchesHandler.setup: internal error: githubv4.Query: Resource not accessible by integration","details":null,"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 12 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":0,"reason":"126 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8","Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92","Warn: Project is vulnerable to: GHSA-6chw-6frg-f759","Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw","Warn: Project is vulnerable to: GHSA-whgm-jr23-g3j9","Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw","Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25","Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw","Warn: Project is vulnerable to: GHSA-w8qv-6jwh-64r5","Warn: Project is vulnerable to: GHSA-257v-vj4p-3w2h","Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-3wcq-x3mq-6r9p","Warn: Project is vulnerable to: GHSA-ff7x-qrg7-qggm","Warn: Project is vulnerable to: GHSA-r9p9-mrjm-926w","Warn: Project is vulnerable to: GHSA-434g-2637-qmqr","Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m","Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw","Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p","Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747","Warn: Project is vulnerable to: GHSA-vjh7-7g9h-fjfh","Warn: Project is vulnerable to: GHSA-273r-mgr4-v34f","Warn: Project is vulnerable to: GHSA-r7qp-cfhv-p84w","Warn: Project is vulnerable to: GHSA-4gmj-3p3h-gm8h","Warn: Project is vulnerable to: GHSA-6h5x-7c5m-7cr7","Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc","Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx","Warn: Project is vulnerable to: GHSA-74fj-2j2h-c42q","Warn: Project is vulnerable to: GHSA-pw2r-vq6v-hr8c","Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc","Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp","Warn: Project is vulnerable to: GHSA-fjxv-7rqg-78g4","Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44","Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988","Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj","Warn: Project is vulnerable to: GHSA-pfq8-rq6v-vf5m","Warn: Project is vulnerable to: GHSA-6x33-pw7p-hmpq","Warn: Project is vulnerable to: GHSA-c7qv-q95q-8v27","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22","Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp","Warn: Project is vulnerable to: GHSA-7r28-3m3f-r2pr","Warn: Project is vulnerable to: GHSA-r8j5-h5cx-65gg","Warn: Project is vulnerable to: GHSA-2pr6-76vf-7546","Warn: Project is vulnerable to: GHSA-8j8c-7jfh-h6hx","Warn: Project is vulnerable to: GHSA-896r-f27r-55mw","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-282f-qqgm-c34q","Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp","Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq","Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488","Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-wrvr-8mpx-r7pp","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-92xj-mqp7-vmcj","Warn: Project is vulnerable to: GHSA-wxgw-qj99-44c2","Warn: Project is vulnerable to: GHSA-5rrq-pxf6-6jx5","Warn: Project is vulnerable to: GHSA-8fr3-hfg3-gpgp","Warn: Project is vulnerable to: GHSA-gf8q-jrpm-jvxq","Warn: Project is vulnerable to: GHSA-2r2c-g63r-vccr","Warn: Project is vulnerable to: GHSA-cfm4-qjh2-4765","Warn: Project is vulnerable to: GHSA-x4jg-mjrx-434g","Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p","Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr","Warn: Project is vulnerable to: GHSA-76c9-3jph-rj3q","Warn: Project is vulnerable to: GHSA-6fx8-h7jm-663j","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j","Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w","Warn: Project is vulnerable to: GHSA-h7cp-r72f-jxh6","Warn: Project is vulnerable to: GHSA-v62p-rq8g-8h59","Warn: Project is vulnerable to: GHSA-566m-qj78-rww5","Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j","Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp","Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg","Warn: Project is vulnerable to: GHSA-hxcc-f52p-wc94","Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p","Warn: Project is vulnerable to: GHSA-4rq4-32rv-6wp6","Warn: Project is vulnerable to: GHSA-64g7-mvw6-v9qj","Warn: Project is vulnerable to: GHSA-25hc-qcg6-38wj","Warn: Project is vulnerable to: GHSA-qm95-pgcg-qqfq","Warn: Project is vulnerable to: GHSA-cqmj-92xf-r6r9","Warn: Project is vulnerable to: GHSA-c9g6-9335-x697","Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq","Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9","Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw","Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc","Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh","Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p","Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36","Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc","Warn: Project is vulnerable to: GHSA-52f5-9888-hmc6","Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v","Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3","Warn: Project is vulnerable to: GHSA-w5p7-h5w8-2hfq","Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v","Warn: Project is vulnerable to: GHSA-38fc-wpqx-33j7","Warn: Project is vulnerable to: GHSA-9m6j-fcg5-2442","Warn: Project is vulnerable to: GHSA-hh27-ffr2-f2jc","Warn: Project is vulnerable to: GHSA-rqff-837h-mm52","Warn: Project is vulnerable to: GHSA-8v38-pw62-9cw2","Warn: Project is vulnerable to: GHSA-hgjh-723h-mx2j","Warn: Project is vulnerable to: GHSA-jf5r-8hm2-f872","Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6","Warn: Project is vulnerable to: GHSA-4v9v-hfq4-rm2v","Warn: Project is vulnerable to: GHSA-9jgg-88mc-972h","Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7","Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693","Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q","Warn: Project is vulnerable to: GHSA-72mh-269x-7mh5","Warn: Project is vulnerable to: GHSA-h4j5-c7cj-74xg","Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh","Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-17T08:05:42.674Z","repository_id":37359529,"created_at":"2025-08-17T08:05:42.674Z","updated_at":"2025-08-17T08:05:42.674Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28338972,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-12T10:58:46.209Z","status":"ssl_error","status_checked_at":"2026-01-12T10:58:42.742Z","response_time":98,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["chat","chat-application","chat-widget","chatbots","rasa-core","webchat"],"created_at":"2026-01-12T11:40:17.017Z","updated_at":"2026-01-12T11:40:17.720Z","avatar_url":"https://github.com/botfront.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n\n\u003ca href=\"https://www.npmjs.com/package/botfront\"\u003e\n    \u003cimg alt=\"npm\" src=\"https://img.shields.io/npm/v/rasa-webchat.svg\"\u003e\n\u003c/a\u003e\n\u003ca href='https://github.com/botfront/botfront/blob/master/LICENSE'\u003e\n    \u003cimg alt=\"License\" src=\"https://img.shields.io/github/license/botfront/rasa-webchat\"\u003e\n\u003c/a\u003e\n\u003ca href='https://spectrum.chat/botfront'\u003e\n    \u003cimg alt=\"Spectrum link\" src=\"https://withspectrum.github.io/badge/badge.svg\"\u003e\n\u003c/a\u003e\n\u003c/p\u003e\n\u003ch1 align=\"center\"\u003eRasa Webchat 💬\u003c/h1\u003e\n\u003ch5 align=\"center\"\u003e\n A chat widget to deploy virtual assistants made with \u003ca href=\"https://github.com/rasaHQ/rasa\"\u003eRasa\u003c/a\u003e or \u003ca href=\"https://github.com/botfront/botfront?utm_source=rasa_webchat\"\u003eBotfront\u003c/a\u003e on any website.\n\u003c/h5\u003e\n\u003cbr /\u003e\n\u003cbr /\u003e\n\n\u003cdiv align=\"center\"\u003e\n\u003cimg align=\"center\" src=\"./rasa_webchat.gif\" alt=\"demonstration\"\u003e\n\u003c/div\u003e\n\u003cbr /\u003e\n\n### ⚠️ Version 1.0.1 of the rasa webchat is made to work with version 2.3.x and 2.4.x of rasa. Use 1.0.0 for other rasa versions.\n\n\u003cbr /\u003e\n\n## Features\n- Text Messages\n- Quick Replies\n- Images\n- Carousels\n- Markdown support\n- Persistent sessions\n- Typing indications\n- Smart delay between messages\n- Easy to import in a script tag or as a React Component\n\n## 🔥 Promo: check out our other cool open source project\n\n\u003ca href=\"https://github.com/botfront/botfront?utm_source=rasa_webchat\"\u003e\n\u003cimg align=\"center\" src=\"https://github.com/botfront/botfront/raw/master/botfront_animation.gif\" alt=\"demonstration\" width=\"100%\"\u003e\n\u003c/a\u003e\n\n\n## Usage\n\n### In a `\u003cscript\u003e` tag\n\nIn your `\u003cbody/\u003e`:\n```html\n\u003cscript\u003e!(function () {\n  let e = document.createElement(\"script\"),\n    t = document.head || document.getElementsByTagName(\"head\")[0];\n  (e.src =\n    \"https://cdn.jsdelivr.net/npm/rasa-webchat@1.x.x/lib/index.js\"),\n    // Replace 1.x.x with the version that you want\n    (e.async = !0),\n    (e.onload = () =\u003e {\n      window.WebChat.default(\n        {\n          customData: { language: \"en\" },\n          socketUrl: \"https://bf-botfront.development.agents.botfront.cloud\",\n          // add other props here\n        },\n        null\n      );\n    }),\n    t.insertBefore(e, t.firstChild);\n})();\n\u003c/script\u003e\n```\n\n⚠️ We recommend adding a version tag to prevent breaking changes from major versions, e.g for version 1.0.0 https://cdn.jsdelivr.net/npm/rasa-webchat@1.0.0/lib/index.js,\nhowever this will not work with versions below 1.0.0. If you do not specify a version, you will get served the latest available version of the rasa-webchat.\n\nAbout images: `width` and `height` define the size in pixels that images in messages are crop-scaled to. If not present, the image will scale to the maximum width of the container and the image.\n\n### As a React component\n\nInstall the [npm package](https://npmjs.com/rasa-webchat):\n```bash\nnpm install rasa-webchat\n```\n\nThen:\n\n```javascript\nimport Widget from 'rasa-webchat';\n\nfunction CustomWidget = () =\u003e {\n  return (\n    \u003cWidget\n      initPayload={\"/get_started\"}\n      socketUrl={\"http://localhost:5500\"}\n      socketPath={\"/socket.io/\"}\n      customData={{\"language\": \"en\"}} // arbitrary custom data. Stay minimal as this will be added to the socket\n      title={\"Title\"}\n    /\u003e\n  )\n}\n```\n\n- Make sure to have the prop `embedded`\nset to `true` if you don't want to see the launcher.\n\n\n\n## Parameters\n| Prop / Param                 | Default value          | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |\n|------------------------|--------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| `initPayload`          | `null`             | Payload sent to Rasa when conversation starts                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |\n| `socketUrl`            | `null`             | Socket URL                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |\n| `socketPath`           | `null`             | Close the chat window                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        |\n| `customData`           | `null`             | Arbitrary object sent with the socket. If using with Botfront, it must include the language (e.g. `{\"language\": \"en\"}`)                                                                                                                                                                                                                                                                                                                                                                                                      |\n| `docViewer`            | `false`            | If you add this prop to the component or to the init script, `docViewer=true` , this will treat links in received messages as links to a document ( `.pdf .doc .xlsx` etc. ) and will open them in a popup using `https://docs.google.com/viewer` service                                                                                                                                                                                                                                                                    |\n| `title`                | `'Welcome\"`        | Title shown in the header of the widget                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      |\n| `subtitle`             | `null`             | Subtitle shown under the title in the header of the widget                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |\n| `inputTextFieldHint`   | `\"Type a message\"` | User message input field placeholder                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         |\n| `hideWhenNotConnected` | `true`             | If `true` the widget will hide when the connection to the socket is lost                                                                                                                                                                                                                                                                                                                                                                                                                                                     |\n| `connectOn`            | `\"mount\"`          | This prop lets you choose when the widget will try connecting to the server. By default, it tries connecting as soon as it mounts. If you select `connectOn='open'` it will only attempt connection when the widget is opened. it can only take the values `mount` and `open`.                                                                                                                                                                                                                                               |\n| `onSocketEvent`        | `null`             | call custom code on a specific socket event                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |\n| `embedded`             | `false`            | Set to `true` if you want to embed the in a web page. The widget will always be open and the `initPayload` will be triggered immediately                                                                                                                                                                                                                                                                                                                                                                                     |\n| `showFullScreenButton` | `false`            | Show a full screen toggle                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    |\n| `displayUnreadCount`   | `false`            | Path to an image displayed on the launcher when the widget is closed                                                                                                                                                                                                                                                                                                                                                                                                                                                         |\n| `showMessageDate`      | `false`            | Show message date. Can be overriden with a function: `(timestamp, message) =\u003e return 'my custom date'`                                                                                                                                                                                                                                                                                                                                                                                                                       |\n| `customMessageDelay`   | See below          | This prop is a function, the function take a message string as an argument. The defined function will be called everytime a message is received and the returned value will be used as a milliseconds delay before displaying a new message.                                                                                                                                                                                                                                                                                 |\n| `params`               | See below          | Essentially used to customize the image size, also used to change storage options.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |\n| `storage`              | `\"local\"`          | ⚠️ This is not a prop, it has to be passed inside the params object above. \u003cbr\u003e Specifies the storage location of the conversation state in the browser. `\"session\"` defines the state to be stored in the session storage. The session storage persists on reload of the page, and is cleared after the browser or tab is closed, or when `sessionStorage.clear()`is called. `\"local\"` defines the state to be stored in the local stoage. The local storage persists after the the browser is closed, and is cleared when the cookies of the browser are cleared, or when `localStorage.clear()`is called. |\n| `customComponent`      | `null`             | Custom component to be used with custom responses. E.g.: `customComponent={ (messageData) =\u003e (\u003cdiv\u003eCustom React component\u003c/div\u003e)}`. Please note that this can only be used if you call the webchat from a React application as you can't write a component in pure Javscript. |\n| `onWidgetEvent`        | `{}`             | call custom code on a specific widget event ( `onChatOpen`, `onChatClose`, `onChatHidden`, are available for now ), add a function to the desired object property in the props to have it react to the event. |\n\n### Additional Examples\n\n##### `customMessageDelay`\n```javascript\n(message) =\u003e {\n    let delay = message.length * 30;\n    if (delay \u003e 2 * 1000) delay = 3 * 1000;\n    if (delay \u003c 400) delay = 1000;\n    return delay;\n}\n```\n\n##### `onSocketEvent`\n```jsx\nonSocketEvent={{\n  'bot_uttered': () =\u003e console.log('the bot said something'),\n  'connect': () =\u003e console.log('connection established'),\n  'disconnect': () =\u003e doSomeCleanup(),\n}}\n```\n\n##### `params`\n\nThe `params` props only allows to specify custom image dimensions:\n```jsx\nparams={{\n        images: {\n          dims: {\n            width: 300,\n            height: 200\n          }\n        }\n      }}\n```\n\n### Other features\n\n#### Tooltips\n\nText messages received when the widget is closed will be shown as a tooltip.\n\n#### Sending a message on page load\n\nWhen reconnecting to an existing chat session, the bot will send a message contained in the localStorage key specified by the `NEXT_MESSAGE` constant. The message should be stringified JSON with a `message` property describing the message and an `expiry` property set to a UNIX timestamp in milliseconds after which this message should not be sent. This is useful if you would like your bot to be able to offer your user to navigate around the site.\n\n#### Sending a payload from your React app\n\n```jsx\nfunction myComponent() {\n    const webchatRef = useRef(null);\n    \n    // triggered when something happens in your app\n    function callback() {\n        if (webchatRef.current \u0026\u0026 webchatRef.current.sendMessage) {\n            webchatRef.current.sendMessage('/myIntent{\"entityName\":\"value\"}');\n        }\n    }\n    \n    return \u003cRasaWebchat\n        ref={webchatRef}\n    /\u003e;\n}\n```\n\nThe payload can be any message that the user would normally send, but if you want to force an intent and maybe some entities, you can use that format\n`/myIntent{\"entity1\":\"value1\",\"entity2\":\"value2\"}`\n\n### Backends\n\nThe widget can be used with any backend but is primarily designed to be used with [Rasa](https://github.com/rasaHQ/rasa) or [Botfront](https://github.com/botfront/botfront).\n\n#### Rasa\n\nUse the `socketio` channel: See [instructions in the Rasa documentation](https://rasa.com/docs/core/connectors/#socketio-connector)\n\nIf you want to process `customData` in Rasa  you have to [create a new channel](https://rasa.com/docs/core/connectors/#custom-channels). Use channel `rasa_core.channels.socketio` as a template for your new channel. In this channel, `customData` can be retrieved via `data['customData']`. Then you can  modify `sender_id`, save `customData` to the database, fill slots or whatever you need to with your additional data.\n\n\n#### Botfront\n\nThe Rasa Webchat is developped by the [Botfront](https://botfront.io) team and it works with Botfront. If your bot is multilingual, make sure to specificy the current language in the `customData` prop. E.g. `customData={{language: 'en'}}`. See in [Botfront docs](https://botfront.io/docs/channels/webchat/) for more details.\n\n\n## Styles\n\nFrom version 0.8 we started prefixing all css classes, if you already had css styling for the widget, just prepend `rw-` to all the classes you changed.\n\nhierarchy:\n```\n.rw-conversation-container\n  |-- .rw-header\n        |-- .rw-title\n        |-- .rw-close-function\n        |-- .rw-loading\n  |-- .rw-messages-container\n        |-- .rw-message\n              |-- .rw-client\n              |-- .rw-response\n        |-- .rw-replies\n              |-- .rw-reply\n              |-- .rw-response\n        |-- .rw-snippet\n              |-- .rw-snippet-title\n              |-- .rw-snippet-details\n              |-- .rw-link\n        |-- .rw-imageFrame\n        |-- .rw-videoFrame\n  |-- .rw-sender\n        |-- .rw-new-message\n        |-- .rw-send\n```\n\n| Class                   |  Description                                                        |\n|-------------------------|---------------------------------------------------------------------|\n| .rw-widget-container       | The div containing the chatbox of the default version               |\n| .rw-widget-embedded        | div of the embedded chatbox (using embedded prop)                   |\n| .rw-full-screen            | div of the fullscreen chatbox (using fullScreenMode prop)           |\n| .rw-conversation-container | the parent div containing the header, message-container and sender  |\n| .rw-messages-container     | the central area where the messages appear                          |\n| .rw-sender                 | div of the bottom area which prompts user input                     |\n| .rw-new-message            | the text input element of sender                                    |\n| .rw-send                   | the send icon element of sender                                     |\n| .rw-header                 | div of the top area with the chatbox header                         |\n| .rw-title                  | the title element of the header                                     |\n| .rw-close-button           | the close icon of the header                                        |\n| .rw-loading                | the loading status element of the header                            |\n| .rw-message                | the boxes holding the messages of client and response               |\n| .rw-replies                | the area that gives quick reply options                             |\n| .rw-snippet                | a component for describing links                                    |\n| .rw-imageFrame             | a container for sending images                                      |\n| .rw-videoFrame             | a container for sending video                                       |\n\n\n## Contributors\n[@PHLF](https://github.com/phlf)\n[@znat](https://github.com/znat)\n[@TheoTomalty](https://github.com/TheoTomalty)\n[@Hub4IT](https://github.com/Hub4IT)\n[@dliuproduction](https://github.com/dliuproduction)\n[@MatthieuJnon](https://github.com/MatthieuJnon)\n[@mofortin](https://github.com/mofortin)\n[@GuillaumeTech](https://github.com/GuillaumeTech)\n                                 \n\u003cbr/\u003e\n\u003ch2 align=\"center\"\u003eLicense\u003c/h2\u003e\n\nCopyright (C) 2021 Dialogue Technologies Inc.\n\nLicensed under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n    http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.(C) 2021 Dialogue Technologies Inc. All rights reserved.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbotfront%2Frasa-webchat","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbotfront%2Frasa-webchat","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbotfront%2Frasa-webchat/lists"}