Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3,931 changes: 1,992 additions & 1,939 deletions .pnp.cjs

Large diffs are not rendered by default.

Binary file modified .yarn/install-state.gz
Binary file not shown.
82 changes: 51 additions & 31 deletions package-lock.json

Large diffs are not rendered by default.

6 changes: 3 additions & 3 deletions packages/module/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -51,16 +51,16 @@
"unist-util-visit": "^5.0.0"
},
"peerDependencies": {
"monaco-editor": "^0.54.0",
"@monaco-editor/react": "^4.7.0",
"monaco-editor": "^0.54.0",
"react": "^18 || ^19",
"react-dom": "^18 || ^19"
},
"peerDependenciesMeta": {
"monaco-editor": {
"@monaco-editor/react": {
"optional": false
},
"@monaco-editor/react": {
"monaco-editor": {
"optional": false
}
},
Expand Down
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
---
section: extensions
subsection: chatbot
subsection: ChatBot
id: Overview
sortValue: 1
source: About
---

**Note:** The PatternFly ChatBot extension lives in its own package [`@patternfly/chatbot`](https://www.npmjs.com/package/@patternfly/chatbot)

It is important to leverage AI in a way that improves the experiences of your users. In alignment with our [AI principles](/patternfly-ai/about-ai#ai-principles) and [ethical design guidelines,](/patternfly-ai/ai-guidelines) we've created this ChatBot extension. The PatternFly ChatBot contains a React implementation of an AI ChatBot, to provide your users with access to convenient and persistent help.
It is important to leverage AI in a way that improves the experiences of your users. In alignment with our [AI principles](/ai/about-ai#ai-principles) and [ethical design guidelines,](/ai/ai-guidelines) we've created this ChatBot extension. The PatternFly ChatBot contains a React implementation of an AI ChatBot, to provide your users with access to convenient and persistent help.

_Only use this ChatBot when it adds value to your users' experiences._ Don't use it simply for the sake of novelty—your users will only be excited to interact with a new ChatBot feature if it directly helps them reach their goals.

Expand All @@ -22,7 +22,7 @@ To illustrate the capabilities of the ChatBot, including more complex interactio
- [ChatBot attachments via file upload](/extensions/chatbot/messages/demo#attach-via-upload-button-in-message-bar)
- [ChatBot attachments via built-in menu](/extensions/chatbot/messages/demo#attach-via-menu-of-options-in-message-bar)

To learn how to write for ChatBot experiences, refer to our [conversation design guidelines](/patternfly-ai/conversation-design/#writing-for-chatbots).
To learn how to write for ChatBot experiences, refer to our [conversation design guidelines](/ai/conversation-design/#writing-for-chatbots).

To learn how to design ChatBot experiences, [refer to the design guidelines](/extensions/chatbot/overview/design-guidelines).

Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
section: extensions
subsection: chatbot
subsection: ChatBot
id: Overview
sortValue: 1
source: design-guidelines
Expand Down Expand Up @@ -351,7 +351,7 @@ Choose the download action location that best works for your ChatBot:

#### Download via conversation history drawer

If your ChatBot uses a conversation history drawer, you can provide a download option in the [actions menu linked to a previous conversation](/patternfly-ai/chatbot/ui#drawer-with-conversation-actions).
If your ChatBot uses a conversation history drawer, you can provide a download option in the [actions menu linked to a previous conversation](/extensions/chatbot/ui#drawer-with-conversation-actions).

<div class="ws-docs-content-img">
![Expanded menu for previous chat in the history window, which shows a download option.](./img/download-chat-history.svg)
Expand Down Expand Up @@ -429,7 +429,7 @@ Refer to the additional guidelines for [accessing a ChatBot](#accessing-a-chatbo

## Content considerations

For guidance on writing ChatBot content, refer to our [conversation design guidelines](/patternfly-ai/conversation-design).
For guidance on writing ChatBot content, refer to our [conversation design guidelines](/ai/conversation-design).

## Accessibility

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
# Sidenav top-level section
# should be the same for all markdown files
section: extensions
subsection: chatbot
subsection: ChatBot
# Sidenav secondary level section
# should be the same for all markdown files
id: Analytics
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
# Sidenav top-level section
# should be the same for all markdown files
section: extensions
subsection: chatbot
subsection: ChatBot
# Sidenav secondary level section
# should be the same for all markdown files
id: Customizing messages
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
# Sidenav top-level section
# should be the same for all markdown files
section: extensions
subsection: chatbot
subsection: ChatBot
# Sidenav secondary level section
# should be the same for all markdown files
id: Messages
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
# Sidenav top-level section
# should be the same for all markdown files
section: extensions
subsection: chatbot
subsection: ChatBot
# Sidenav secondary level section
# should be the same for all markdown files
id: UI
Expand Down Expand Up @@ -129,7 +129,7 @@ Your code structure should look like this:

### Welcome message

To introduce users to the ChatBot experience, display a welcome message before they input their first message. This brief message should follow our [conversation design guidelines](/patternfly-ai/conversation-design) to welcome users to the ChatBot experience and encourage them to interact.
To introduce users to the ChatBot experience, display a welcome message before they input their first message. This brief message should follow our [conversation design guidelines](/ai/conversation-design) to welcome users to the ChatBot experience and encourage them to interact.

This message can be dismissed once a user sends their first message. To change the arrangement of the message within the message box, specify the `position` in the `<MessageBox>` component.

Expand Down Expand Up @@ -474,7 +474,7 @@ To make the onboarding modal compact, with less spacing, pass `isCompact` to the

Based on the [PatternFly modal](/components/modal), this modal adapts to the ChatBot display mode and is meant to display terms and conditions for using a ChatBot in your project. The image in the header can be toggled on or off depending on whether the `image` and `altText` props are provided.

This example also includes an example of how to use [skip to content](/patternfly-ai/chatbot/ui#skip-to-content). When the terms of use modal is open, focus is placed on the terms of use container. When it is closed, focus is placed on the ChatBot. In a real example with a functioning ChatBot toggle, you would also want to place focus on the toggle when appropriate.
This example also includes an example of how to use [skip to content](/extensions/chatbot/ui#skip-to-content). When the terms of use modal is open, focus is placed on the terms of use container. When it is closed, focus is placed on the ChatBot. In a real example with a functioning ChatBot toggle, you would also want to place focus on the toggle when appropriate.

```js file="./TermsOfUse.tsx" isFullscreen

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
# Sidenav top-level section
# should be the same for all markdown files
section: extensions
subsection: chatbot
subsection: ChatBot
# Sidenav secondary level section
# should be the same for all markdown files
id: Messages
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
# Sidenav top-level section
# should be the same for all markdown files
section: extensions
subsection: chatbot
subsection: ChatBot
# Sidenav secondary level section
# should be the same for all markdown files
id: Overview
Expand Down Expand Up @@ -133,7 +133,7 @@ This demo displays a ChatBot in a static, inline drawer. This demo includes:

### Primary color background

This demo displays an embedded ChatBot with a [primary background color](/design-foundations/colors#background-colors). This example includes the same features as the [Embedded ChatBot demo](/patternfly-ai/chatbot/overview/demo/#embedded-chatbot)&mdash;the only differences are that the background color is adjusted via the `isPrimary` prop and some of the sample Messages have changed. You can use the same logic to adjust the background color in any ChatBot layout.
This demo displays an embedded ChatBot with a [primary background color](/design-foundations/colors#background-colors). This example includes the same features as the [Embedded ChatBot demo](/extensions/chatbot/overview/demo/#embedded-chatbot)&mdash;the only differences are that the background color is adjusted via the `isPrimary` prop and some of the sample Messages have changed. You can use the same logic to adjust the background color in any ChatBot layout.

```js file="./WhiteEmbeddedChatbot.tsx" isFullscreen

Expand Down
Loading
Loading