npmpackage.info

botframework-webchat-component

A highly-customizable web-based client for Azure Bot Services.

4.18.0

1,604

MIT

HTML

441.82 kB

1,376,684 7.2

Installations

npm install botframework-webchat-component

Pull Requests

Open

46

Total

2,136

Closed

567

Merged

1,523

Issues

Open

401

Total

3,185

Closed

2,784

Releases

[4.18.0] - 2024-07-10

v4.18.0

Published on 11 Jul 2024

[4.17.0] - 2024-05-07

v4.17.0

Published on 07 May 2024

[4.16.0] - 2023-11-16

v4.16.0

Published on 17 Nov 2023

[4.15.9] - 2023-08-25

v4.15.9

Published on 26 Aug 2023

[4.15.8] - 2023-06-06

v4.15.8

Published on 07 Jun 2023

v4.15.7

Published on 16 Feb 2023

View all 66 releases

Developer

microsoft

Developer Guide

BETA

Module System

CommonJS, ESM

Min. Node Version

Typescript Support

Yes

Node Version

18.20.3

NPM Version

10.7.0 Statistics

1,604 Stars

2,602 Commits

1,549 Forks

121 Watching

78 Branches

125 Contributors

Updated on 27 Nov 2024

Bundle Size

1.87 MB

Minified

441.82 kB

Minified + Gzipped

Bundlephobia

Languages

HTML (40.76%)

TypeScript (31.02%)

JavaScript (26.16%)

CSS (1.94%)

PowerShell (0.06%)

Dockerfile (0.05%)

Pug (0.01%)

Total Downloads

Cumulative downloads

Total Downloads

1,376,684

Last day

-15.7%

1,379

Compared to previous day

Last week

-4.8%

8,008

Compared to previous week

Last month

3.3%

35,095

Compared to previous month

Last year

21.1%

351,303

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Versions

Click here to find out what is new in Web Chat

Bot Framework Web Chat

This repository contains code for the Bot Framework Web Chat component. The Bot Framework Web Chat component is a highly-customizable web-based client for the Bot Framework v4 SDK. The Bot Framework SDK v4 enables developers to model conversation and build sophisticated bot applications.

This repository is part of the Microsoft Bot Framework - a comprehensive framework for building enterprise-grade conversational AI experiences.

Web Chat supports Content Security Policy (CSP). Web developers are recommended to enable CSP to improve security and protect conversations. You can read more about CSP in this article.

Version notes

This section points out important version notes. For further information, please see the related links and check the CHANGELOG.md

Notes: web developers are advised to use ~ (tilde range) to select minor versions, which contains new features and/or fixes. Use ^ (caret range) to select major versions, which may contains breaking changes.

4.19.0 notable changes

Supports informative message in livestreaming

4.18.0 notable changes

In this release, we are focusing on performance improvements, including memory and load time optimizations.

4.17.0 notable changes

Support livestreaming response

Bots can now livestream their responses. Before Bot Framework SDK support this feature, bot authors can follow the details in LIVESTREAMING.md to construct the livestream responses.

Debut of ES Modules

Web Chat now exports as ES Modules (named exports) along with CommonJS (named and unnamed exports).

Improvement to file upload experience

End-user can now add a message and confirm before uploading their file to the bot. To opt-out of the new experience, pass sendAttachmentOn: 'send' in style options.

Theme pack support

We are excited to add theme pack support. Developers can now pack all their customization in a single package and publish it to NPM.

Experimental Fluent UI theme pack

We are excited to announce Fluent UI theme pack is in the work and is currently in experimental phase. This theme pack is designed for web developers who want to bring a native Copilot user experience to their customers.

We will continue to add new features and support both white-label experience and Fluent UI experience with the same level of parity.

You can wrap Web Chat with <FluentThemeProvider> to try out the new experience.

1import ReactWebChat from 'botframework-webchat';
2import { FluentThemeProvider } from 'botframework-webchat-fluent-theme';
3
4export default function MyComponent() {
5   return (
6      <FluentThemeProvider>
7         <ReactWebChat />
8      </FluentThemeProvider>
9   );
10}

Support HTML-in-Markdown

Web Chat will now render HTML-in-Markdown. We have ported our sanitizer and accessibility fixer to work on HTML level. Both Markdown and HTML-in-Markdown will receive the same treatment and meet our security and accessibility requirements.

You can turn off this option by setting styleOptions.markdownRenderHTML to false.

4.16.1 notable changes

Web Chat now supports Adaptive Cards schema up to 1.6. Some features in Adaptive Cards are in preview or designed to use outside of Bot Framework. Web Chat does not support these features.

4.16.0 notable changes

Starting from 4.16.0, Internet Explorer is no longer supported. After more than a year of the Internet Explorer 11 officially retirement, we decided to stop supporting Internet Explorer. This will help us to bring new features to Web Chat. 4.15.9 is the last version which supports Internet Explorer in limited fashion.

4.12.1 patch: New style property `adaptiveCardsParserMaxVersion`

Web Chat 4.12.1 patch includes a new style property allowing developers to choose the max Adaptive Cards schema version. See PR #3778 for code changes.

To specify a different max version, you can adjust the style options, shown below:

1window.WebChat.renderWebChat(
2   {
3      directLine,
4      store,
5      styleOptions: {
6         adaptiveCardsParserMaxVersion: '1.2'
7      }
8   },
9   document.getElementById('webchat')
10);

Web Chat will apply the maximum schema available according to the Adaptive Cards version (as of this patch, schema 1.3) by default.
An invalid version will revert to Web Chat's default.

Visual focus changes to transcript in Web Chat 4.12.0

A new accessibility update has been added to Web Chat from PR #3703. This change creates visual focus for the transcript (bold black border) and aria-activedescendent focused activity (black dashed border) by default. Where applicable, transcriptVisualKeyboardIndicator... values will also be applied to carousel (CarouselFilmStrip.js) children. This is done in order to match current default focus styling for Adaptive Cards, which may be a child of a carousel.

To modify these styles, you can change the following props via styleOptions:

  transcriptActivityVisualKeyboardIndicatorColor: DEFAULT_SUBTLE,
  transcriptActivityVisualKeyboardIndicatorStyle: 'dashed',
  transcriptActivityVisualKeyboardIndicatorWidth: 1,
  transcriptVisualKeyboardIndicatorColor: 'Black',
  transcriptVisualKeyboardIndicatorStyle: 'solid',
  transcriptVisualKeyboardIndicatorWidth: 2,

The above code shows the default values you will see in Web Chat.

API refactor into new package in Web Chat 4.11.0

The Web Chat API has been refactored into a separate package. To learn more, check out the API refactor summary.

Direct Line Speech support in Web Chat 4.7.0

Starting from Web Chat 4.7.0, Direct Line Speech is supported, and it is the preferred way to provide an integrated speech functionality in Web Chat. We are working on closing feature gaps between Direct Line Speech and Web Speech API (includes Cognitive Services and browser-provided speech functionality).

Upgrading to 4.6.0

Starting from Web Chat 4.6.0, Web Chat requires React 16.8.6 or up.

Although we recommend that you upgrade your host app at your earliest convenience, we understand that host app may need some time before its React dependencies are updated, especially in regards to huge applications.

If your app is not ready for React 16.8.6 yet, you can follow the hybrid React sample to dual-host React in your app.

Speech changes in Web Chat 4.5.0

There is a breaking change on behavior expectations regarding speech and input hint in Web Chat. Please refer to the section on input hint behavior before 4.5.0 for details.

Migrating from Web Chat v3 to v4

View migration docs to learn about migrating from Web Chat v3.

How to use

First, create a bot using Azure Bot Service. Once the bot is created, you will need to obtain the bot's Web Chat secret in Azure Portal. Then use the secret to generate a token and pass it to your Web Chat.

Connect a client app to bot

Web Chat provides UI on top of the Direct Line and Direct Line Speech Channels. There are two ways to connect to your bot through HTTP calls from the client: by sending the Bot secret or generating a token via the secret.

We strongly recommend using the token API instead of providing the app with your secret. To learn more about why, see the authentication documentation on the token API and client security.

For further reading, please see the following links:

Using Web Chat with Azure Bot Services authentication
Enhanced Direct Line authentication features

Integrate with JavaScript

Web Chat is designed to integrate with your existing website using JavaScript or React. Integrating with JavaScript will give you moderate styling and customizability options.

You can use the full, typical Web Chat package (called full-feature bundle) that contains the most typically used features.

Here is how how you can add Web Chat control to your website:

1<!DOCTYPE html>
2<html>
3  <head>
4    <script
5      crossorigin="anonymous"
6      src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"
7    ></script>
8    <style>
9      html,
10      body {
11         height: 100%;
12      }
13
14      body {
15        margin: 0;
16      }
17
18      #webchat {
19        height: 100%;
20        width: 100%;
21      }
22    </style>
23  </head>
24  <body>
25    <div id="webchat" role="main"></div>
26    <script>
27      window.WebChat.renderWebChat(
28        {
29          directLine: window.WebChat.createDirectLine({
30            token: 'YOUR_DIRECT_LINE_TOKEN'
31          }),
32          userID: 'YOUR_USER_ID',
33          username: 'Web Chat User',
34          locale: 'en-US'
35        },
36        document.getElementById('webchat')
37      );
38    </script>
39  </body>
40</html>

userID, username, and locale are all optional parameters to pass into the renderWebChat method. To learn more about Web Chat props, look at the Web Chat API Reference documentation.

Assigning userID as a static value is not recommended since this will cause all users to share state. Please see the API userID entry for more information.

More information on localization can be found in the Localization documentation.

Screenshot of Web Chat

See the working sample of the full Web Chat bundle.

Integrate with React

For full customizability, you can use React to recompose components of Web Chat.

To install the production build from NPM, run npm install botframework-webchat. See our version notes on how to select a version.

1import React, { useMemo } from 'react';
2import ReactWebChat, { createDirectLine } from 'botframework-webchat';
3
4export default () => {
5  const directLine = useMemo(() => createDirectLine({ token: 'YOUR_DIRECT_LINE_TOKEN' }), []);
6
7  return <ReactWebChat directLine={directLine} userID="YOUR_USER_ID" />;
8};

You can also run npm install botframework-webchat@main to install a development build that is synced with Web Chat's GitHub main branch.

See the working sample of Web Chat rendered via React.

Experimental support for Redux DevTools

Web Chat internally use Redux for state management. Redux DevTools is enabled in the NPM build as an opt-in feature.

This is for glancing into how Web Chat works. This is not an API explorer and is not an endorsement of using the Redux store to programmatically access the UI. The hooks API should be used instead.

To use Redux DevTools, use the createStoreWithDevTools function for creating a Redux DevTools-enabled store.

1  import React, { useMemo } from 'react';
2- import ReactWebChat, { createDirectLine, createStore } from 'botframework-webchat';
3+ import ReactWebChat, { createDirectLine, createStoreWithDevTools } from 'botframework-webchat';
4
5  export default () => {
6    const directLine = useMemo(() => createDirectLine({ token: 'YOUR_DIRECT_LINE_TOKEN' }), []);
7-   const store = useMemo(() => createStore(), []);
8+   const store = useMemo(() => createStoreWithDevTools(), []);
9
10    return <ReactWebChat directLine={directLine} store={store} userID="YOUR_USER_ID" />;
11  };

There are some limitations when using the Redux DevTools:

The Redux store uses side-effects via redux-saga. Time-traveling may break the UI.
Many UI states are stored in React context and state. They are not exposed in the Redux store.
Some time-sensitive UIs are based on real-time clock and not affected by time-traveling.
Dispatching actions are not officially supported. Please use hooks API instead.
Actions and reducers may move in and out of Redux store across versions. Hooks API is the official API for accessing the UI.

Customizing the Web Chat UI

Web Chat is designed to be customizable without forking the source code. The table below outlines what kind of customizations you can achieve when you are importing Web Chat in different ways. This list is not exhaustive.

	CDN bundle	React
Change colors	✔	✔
Change sizes	✔	✔
Update/replace CSS styles	✔	✔
Listen to events	✔	✔
Interact with hosting webpage	✔	✔
Custom render activities		✔
Custom render attachments		✔
Add new UI components		✔
Recompose the whole UI		✔

See more about customizing Web Chat to learn more on customization.

Supported Activity Types on the Web Chat Client

Bot Framework has many activity types, but not all are supported in Web Chat. View activity types docs to learn more.

Samples list

View the complete list of Web Chat samples for more ideas on customizing Web Chat.

How to test with Web Chat's latest bits

Web Chat latest bits are available on the Web Chat daily releases page.

Dailies will be released after 3:00AM Pacific Standard Time when changes have been committed to the main branch.

Contributing

See our Contributing page for details on how to build the project and our repository guidelines for Pull Requests.

See our CODE OF CONDUCT page for details about the Microsoft Code of Conduct.

Reporting Security Issues

View the security documentation to learn more about reporting security issues.

No vulnerabilities found.

10

Maintained

Determines if the project is "actively maintained".

10

Code-Review

Determines if the project requires code review before pull requests (aka merge requests) are merged.

10

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

10

License

Determines if the project has defined a license.

10

Dangerous-Workflow

Determines if the project's GitHub Action workflows avoid dangerous patterns.

10

Security-Policy

Determines if the project has published a security policy.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

Packaging

Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.

10

Dependency-Update-Tool

Determines if the project uses a dependency update tool.

8

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

5

Pinned-Dependencies

Determines if the project has declared and pinned its dependencies.

Reason

dependency not pinned by hash detected -- score normalized to 5

Details

Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/daily-release.yaml:16: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/daily-release.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/daily-release.yaml:63: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/daily-release.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/daily-release.yaml:69: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/daily-release.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/daily-release.yaml:79: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/daily-release.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/daily-release.yaml:83: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/daily-release.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/daily-release.yaml:117: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/daily-release.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/playground.yaml:17: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/playground.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/playground.yaml:37: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/playground.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/playground.yaml:43: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/playground.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:17: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:20: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:64: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:70: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:81: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:86: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:92: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:130: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:192: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:202: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:212: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/preview-branch.yml:222: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/preview-branch.yml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/publish-github-pages.yaml:17: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/publish-github-pages.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/publish-github-pages.yaml:104: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/publish-github-pages.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/publish-github-pages.yaml:114: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/publish-github-pages.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/publish-github-pages.yaml:120: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/publish-github-pages.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/samples.07.a.upload-to-azure-storage.yaml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.a.upload-to-azure-storage.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/samples.07.a.upload-to-azure-storage.yaml:32: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.a.upload-to-azure-storage.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/samples.07.a.upload-to-azure-storage.yaml:49: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.a.upload-to-azure-storage.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/samples.07.a.upload-to-azure-storage.yaml:55: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.a.upload-to-azure-storage.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/samples.07.b.sso-for-enterprise.yaml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.b.sso-for-enterprise.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/samples.07.b.sso-for-enterprise.yaml:32: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.b.sso-for-enterprise.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/samples.07.b.sso-for-enterprise.yaml:49: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.b.sso-for-enterprise.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/samples.07.b.sso-for-enterprise.yaml:55: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.b.sso-for-enterprise.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/samples.07.c.sso-for-intranet.yaml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.c.sso-for-intranet.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/samples.07.c.sso-for-intranet.yaml:32: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.c.sso-for-intranet.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/samples.07.c.sso-for-intranet.yaml:49: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.c.sso-for-intranet.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/samples.07.c.sso-for-intranet.yaml:55: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.c.sso-for-intranet.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/samples.07.d.sso-for-teams.yaml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.d.sso-for-teams.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/samples.07.d.sso-for-teams.yaml:32: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.d.sso-for-teams.yaml/master?enable=pin
Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/samples.07.d.sso-for-teams.yaml:49: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.d.sso-for-teams.yaml/master?enable=pin
Warn: third-party GitHubAction not pinned by hash: .github/workflows/samples.07.d.sso-for-teams.yaml:55: update your workflow using https://app.stepsecurity.io/secureworkflow/vtardia/varo-flux/samples.07.d.sso-for-teams.yaml/master?enable=pin
Warn: containerImage not pinned by hash: chrome.dockerfile:4: pin your Docker image by updating selenium/node-chrome to selenium/node-chrome@sha256:e407fe4afca4af95806f54dca73a331b1b9d4237f160d22617c8a5b22c74a72d
Warn: containerImage not pinned by hash: packages/test/harness/Dockerfile:5
Warn: containerImage not pinned by hash: playground.dockerfile:5
Warn: containerImage not pinned by hash: samples/01.getting-started/l.sharepoint-web-part/Dockerfile:5
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/a.upload-to-azure-storage/Dockerfile:8
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/a.upload-to-azure-storage/Dockerfile-run:6
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/b.sso-for-enterprise/Dockerfile:8
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/b.sso-for-enterprise/Dockerfile:22
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/b.sso-for-enterprise/Dockerfile-run:6
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/c.sso-for-intranet/Dockerfile:6
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/c.sso-for-intranet/Dockerfile-run:6
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/d.sso-for-teams/Dockerfile:6
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/d.sso-for-teams/Dockerfile-run:6
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/e.sso-on-behalf-of-authentication/Dockerfile:8
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/e.sso-on-behalf-of-authentication/Dockerfile:22
Warn: containerImage not pinned by hash: samples/07.advanced-web-chat-apps/e.sso-on-behalf-of-authentication/Dockerfile-run:6
Warn: containerImage not pinned by hash: testharness.dockerfile:5
Warn: containerImage not pinned by hash: testharness2.dockerfile:5
Warn: npmCommand not pinned by hash: playground.dockerfile:13
Warn: npmCommand not pinned by hash: samples/01.getting-started/l.sharepoint-web-part/Dockerfile:9
Warn: npmCommand not pinned by hash: samples/01.getting-started/l.sharepoint-web-part/Dockerfile:24
Warn: npmCommand not pinned by hash: samples/01.getting-started/l.sharepoint-web-part/Dockerfile:31
Warn: npmCommand not pinned by hash: samples/01.getting-started/l.sharepoint-web-part/Dockerfile:33
Warn: npmCommand not pinned by hash: samples/07.advanced-web-chat-apps/a.upload-to-azure-storage/Dockerfile:31
Warn: npmCommand not pinned by hash: samples/07.advanced-web-chat-apps/b.sso-for-enterprise/Dockerfile:48
Warn: npmCommand not pinned by hash: samples/07.advanced-web-chat-apps/c.sso-for-intranet/Dockerfile:29
Warn: npmCommand not pinned by hash: samples/07.advanced-web-chat-apps/d.sso-for-teams/Dockerfile:29
Warn: npmCommand not pinned by hash: samples/07.advanced-web-chat-apps/e.sso-on-behalf-of-authentication/Dockerfile:48
Warn: npmCommand not pinned by hash: testharness.dockerfile:13
Warn: npmCommand not pinned by hash: testharness2.dockerfile:13
Info: no insecure (not pinned by hash) dependency downloads found in Dockerfiles
Info: no insecure (not pinned by hash) dependency downloads found in shell scripts

0

CII-Best-Practices

Determines if the project has a CII Best Practices Badge.

0

Signed-Releases

Determines if the project cryptographically signs release artifacts.

0

Token-Permissions

Determines if the project's workflows follow the principle of least privilege.

0

Fuzzing

Determines if the project uses fuzzing.

Score

7.2

/10

Last Scanned on 2022-08-15

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More

Other packages similar to botframework-webchat-component

botframework-webchat

4.18.0

A highly-customizable web-based chat client for Azure Bot Services.

botframework-directlinejs

0.15.5

Client library for the Microsoft Bot Framework Direct Line 3.0 protocol

last-commit-log

3.4.0

Node.js module to get the last git commit information - mostly to be used by CI/CD and building phase

@twilio/flex-webchat-ui

2.9.4

Twilio Customer Frame

botframework-webchat-component

Installations

Pull Requests

46

2,136

567

1,523

Issues

401

3,185

2,784

Releases

Developer

Developer Guide

CommonJS, ESM

Yes

18.20.3

10.7.0

Statistics

Bundle Size

1.87 MB

441.82 kB

Languages

Total Downloads

1,376,684

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

Peer Dependencies

Dev Dependencies

Click here to find out what is new in Web Chat

Bot Framework Web Chat

Version notes

4.19.0 notable changes

4.18.0 notable changes

4.17.0 notable changes

Support livestreaming response

Debut of ES Modules

Improvement to file upload experience

Theme pack support

Experimental Fluent UI theme pack

Support HTML-in-Markdown

4.16.1 notable changes

4.16.0 notable changes

4.12.1 patch: New style property adaptiveCardsParserMaxVersion

Visual focus changes to transcript in Web Chat 4.12.0

API refactor into new package in Web Chat 4.11.0

Direct Line Speech support in Web Chat 4.7.0

Upgrading to 4.6.0

Speech changes in Web Chat 4.5.0

Migrating from Web Chat v3 to v4

How to use

Connect a client app to bot

Integrate with JavaScript

Integrate with React

Experimental support for Redux DevTools

Customizing the Web Chat UI

Supported Activity Types on the Web Chat Client

Samples list

Further reading

API Reference

Browser compatibility

Accessibility

Localization

Notifications

Telemetry

Technical Support Guide

Speech

Integrate with Direct Line Speech

Integrate with Cognitive Services Speech Services

Browser-provided engine or other engines

How to test with Web Chat's latest bits

Contributing

Reporting Security Issues

10

10

10

10

4.12.1 patch: New style property `adaptiveCardsParserMaxVersion`