@patternfly/chatbot 2.1.0-prerelease.17

package/@types/index.d.ts

@@ -0,0 +1,9 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+declare module '*.svg' {
+  const value: any;
+  export = value;
+}
+declare module '*.png' {
+  const value: any;
+  export = value;
+}

package/dist/cjs/AttachMenu/AttachMenu.d.ts

@@ -0,0 +1,29 @@
+import React from 'react';
+import { DropdownProps, DropdownToggleProps, DropdownPopperProps } from '@patternfly/react-core';
+export interface ExtendedDropdownPopperProps extends DropdownPopperProps {
+    distance: string;
+}
+export interface AttachMenuProps extends DropdownProps {
+    /** Items in menu */
+    filteredItems: React.ReactNode;
+    /** A callback for when the input value changes. */
+    handleTextInputChange: (value: string) => void;
+    /** Flag to indicate if menu is opened. */
+    isOpen: boolean;
+    /** Additional properties to pass to the Popper */
+    popperProps?: ExtendedDropdownPopperProps;
+    /** Callback to change the open state of the menu. Triggered by clicking outside of the menu. */
+    onOpenChange: (isOpen: boolean) => void;
+    /** Keys that trigger onOpenChange, defaults to tab and escape. It is highly recommended to include Escape in the array, while Tab may be omitted if the menu contains non-menu items that are focusable. */
+    onOpenChangeKeys?: string[];
+    /** Function callback called when user selects item. */
+    onSelect?: (event?: React.MouseEvent<Element, MouseEvent>, value?: string | number) => void;
+    /** Placeholder for search input */
+    searchInputPlaceholder?: string;
+    /** Aria label for search input */
+    searchInputAriaLabel?: string;
+    /** Toggle to be rendered */
+    toggle: DropdownToggleProps | ((toggleRef: React.RefObject<any>) => React.ReactNode);
+}
+export declare const AttachMenu: React.FunctionComponent<AttachMenuProps>;
+export default AttachMenu;

package/dist/cjs/AttachMenu/AttachMenu.js

@@ -0,0 +1,33 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AttachMenu = void 0;
+// ============================================================================
+// Chatbot Attachment Menu
+// ============================================================================
+const react_1 = __importDefault(require("react"));
+// Import PatternFly components
+const react_core_1 = require("@patternfly/react-core");
+const AttachMenu = (_a) => {
+    var { className, filteredItems, handleTextInputChange, isOpen, popperProps = undefined, onOpenChange, onOpenChangeKeys, onSelect, searchInputPlaceholder, searchInputAriaLabel = 'Filter menu items', toggle } = _a, props = __rest(_a, ["className", "filteredItems", "handleTextInputChange", "isOpen", "popperProps", "onOpenChange", "onOpenChangeKeys", "onSelect", "searchInputPlaceholder", "searchInputAriaLabel", "toggle"]);
+    return (react_1.default.createElement(react_core_1.Dropdown, Object.assign({ className: `pf-chatbot__menu ${className !== null && className !== void 0 ? className : ''}`, isOpen: isOpen, onOpenChange: (isOpen) => onOpenChange(isOpen), onOpenChangeKeys: onOpenChangeKeys !== null && onOpenChangeKeys !== void 0 ? onOpenChangeKeys : ['Esc'], toggle: toggle, popperProps: popperProps, onSelect: onSelect }, props),
+        react_1.default.createElement(react_core_1.MenuSearch, null,
+            react_1.default.createElement(react_core_1.MenuSearchInput, null,
+                react_1.default.createElement(react_core_1.SearchInput, { "aria-label": searchInputAriaLabel, onChange: (_event, value) => handleTextInputChange(value), placeholder: searchInputPlaceholder }))),
+        filteredItems));
+};
+exports.AttachMenu = AttachMenu;
+exports.default = exports.AttachMenu;

package/dist/cjs/AttachMenu/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './AttachMenu';
+export * from './AttachMenu';

package/dist/cjs/AttachMenu/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var AttachMenu_1 = require("./AttachMenu");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(AttachMenu_1).default; } });
+__exportStar(require("./AttachMenu"), exports);

package/dist/cjs/AttachmentEdit/AttachmentEdit.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { ChatbotDisplayMode } from '../Chatbot';
+export interface AttachmentEditProps {
+    /** Text shown in code editor */
+    code: string;
+    /** Filename, including extension, of file shown in editor */
+    fileName: string;
+    /** Function that runs when cancel button is clicked  */
+    onCancel: (event: React.MouseEvent | MouseEvent | KeyboardEvent) => void;
+    /** Function that runs when save button is clicked; allows consumers to use the edited code string  */
+    onSave: (event: React.MouseEvent | MouseEvent | KeyboardEvent, code: string) => void;
+    /** Function that opens and closes modal */
+    handleModalToggle: (event: React.MouseEvent | MouseEvent | KeyboardEvent) => void;
+    /** Whether modal is open */
+    isModalOpen: boolean;
+    /** Title of modal */
+    title?: string;
+    /** Display mode for the Chatbot parent; this influences the styles applied */
+    displayMode?: ChatbotDisplayMode;
+}
+export declare const AttachmentEdit: React.FunctionComponent<AttachmentEditProps>;
+export default AttachmentEdit;

package/dist/cjs/AttachmentEdit/AttachmentEdit.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AttachmentEdit = void 0;
+// ============================================================================
+// Attachment Edit - Chatbot Code Snippet Editor
+// ============================================================================
+const react_1 = __importDefault(require("react"));
+const CodeModal_1 = __importDefault(require("../CodeModal"));
+const Chatbot_1 = require("../Chatbot");
+const AttachmentEdit = ({ fileName, code, handleModalToggle, isModalOpen, onCancel, onSave, title = 'Edit attachment', displayMode = Chatbot_1.ChatbotDisplayMode.default }) => {
+    const handleSave = (_event, code) => {
+        handleModalToggle(_event);
+        onSave(_event, code);
+    };
+    const handleCancel = (_event) => {
+        handleModalToggle(_event);
+        onCancel(_event);
+    };
+    return (react_1.default.createElement(CodeModal_1.default, { code: code, fileName: fileName, handleModalToggle: handleModalToggle, isModalOpen: isModalOpen, onPrimaryAction: handleSave, onSecondaryAction: handleCancel, primaryActionBtn: "Save", secondaryActionBtn: "Cancel", title: title, displayMode: displayMode }));
+};
+exports.AttachmentEdit = AttachmentEdit;
+exports.default = exports.AttachmentEdit;

package/dist/cjs/AttachmentEdit/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './AttachmentEdit';
+export * from './AttachmentEdit';

package/dist/cjs/AttachmentEdit/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var AttachmentEdit_1 = require("./AttachmentEdit");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(AttachmentEdit_1).default; } });
+__exportStar(require("./AttachmentEdit"), exports);

package/dist/cjs/Chatbot/Chatbot.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+export interface ChatbotProps {
+    /** Content to be displayed in the chatbot */
+    children: React.ReactNode;
+    /** Display Mode for the Chatbot */
+    displayMode?: ChatbotDisplayMode;
+    /** Visibility flag for the chatbot */
+    isVisible?: boolean;
+    /** Custom classname for the Chatbot component */
+    className?: string;
+    /** Ref applied to chatbot  */
+    innerRef?: React.Ref<HTMLDivElement>;
+    /** Custom aria label applied to focusable container */
+    ariaLabel?: string;
+}
+export declare enum ChatbotDisplayMode {
+    default = "default",
+    embedded = "embedded",
+    docked = "docked",
+    fullscreen = "fullscreen"
+}
+declare const Chatbot: React.ForwardRefExoticComponent<ChatbotProps & React.RefAttributes<HTMLDivElement>>;
+export default Chatbot;

package/dist/cjs/Chatbot/Chatbot.js

@@ -0,0 +1,49 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatbotDisplayMode = void 0;
+// ============================================================================
+// Chatbot
+// ============================================================================
+const react_1 = __importDefault(require("react"));
+const framer_motion_1 = require("framer-motion");
+var ChatbotDisplayMode;
+(function (ChatbotDisplayMode) {
+    ChatbotDisplayMode["default"] = "default";
+    ChatbotDisplayMode["embedded"] = "embedded";
+    ChatbotDisplayMode["docked"] = "docked";
+    ChatbotDisplayMode["fullscreen"] = "fullscreen";
+})(ChatbotDisplayMode || (exports.ChatbotDisplayMode = ChatbotDisplayMode = {}));
+const ChatbotBase = (_a) => {
+    var { children, displayMode = ChatbotDisplayMode.default, isVisible = true, className, innerRef, ariaLabel } = _a, props = __rest(_a, ["children", "displayMode", "isVisible", "className", "innerRef", "ariaLabel"]);
+    // Configure docked mode
+    react_1.default.useEffect(() => {
+        if (displayMode === ChatbotDisplayMode.docked) {
+            document.documentElement.classList.add('pf-chatbot-allow--docked');
+        }
+        else {
+            document.documentElement.classList.remove('pf-chatbot-allow--docked');
+        }
+    }, [displayMode]);
+    // Configure animations
+    const motionChatbot = {
+        visible: { opacity: 1, y: 0 },
+        hidden: { opacity: 0, y: '16px' }
+    };
+    return (react_1.default.createElement(framer_motion_1.motion.div, Object.assign({ className: `pf-chatbot pf-chatbot--${displayMode} ${!isVisible ? 'pf-chatbot--hidden' : ''} ${className !== null && className !== void 0 ? className : ''}`, variants: motionChatbot, initial: "hidden", animate: isVisible ? 'visible' : 'hidden' }, props), isVisible ? (react_1.default.createElement("section", { "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : 'Chatbot', className: `pf-chatbot-container pf-chatbot-container--${displayMode} ${!isVisible ? 'pf-chatbot-container--hidden' : ''}`, tabIndex: -1, ref: innerRef }, children)) : undefined));
+};
+const Chatbot = react_1.default.forwardRef((props, ref) => (react_1.default.createElement(ChatbotBase, Object.assign({ innerRef: ref }, props))));
+exports.default = Chatbot;

package/dist/cjs/Chatbot/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Chatbot';
+export * from './Chatbot';

package/dist/cjs/Chatbot/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var Chatbot_1 = require("./Chatbot");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Chatbot_1).default; } });
+__exportStar(require("./Chatbot"), exports);

package/dist/cjs/ChatbotAlert/ChatbotAlert.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { AlertProps } from '@patternfly/react-core';
+export interface ChatbotAlert extends AlertProps {
+    /** Callback for when close button is clicked; if none is provided, there will be no way to dismiss the alert */
+    onClose?: () => void;
+}
+export declare const ChatbotAlert: React.FunctionComponent<ChatbotAlert>;
+export default ChatbotAlert;

package/dist/cjs/ChatbotAlert/ChatbotAlert.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatbotAlert = void 0;
+const react_1 = __importDefault(require("react"));
+const react_core_1 = require("@patternfly/react-core");
+const ChatbotAlert = (_a) => {
+    var { variant = 'info', title, children = '', onClose } = _a, props = __rest(_a, ["variant", "title", "children", "onClose"]);
+    return (react_1.default.createElement("div", { className: "pf-chatbot__alert" },
+        react_1.default.createElement(react_core_1.Alert, Object.assign({ variant: variant, isInline: true, title: title, component: "h6" }, (onClose && {
+            actionClose: react_1.default.createElement(react_core_1.AlertActionCloseButton, { onClose: onClose })
+        }), props), children)));
+};
+exports.ChatbotAlert = ChatbotAlert;
+exports.default = exports.ChatbotAlert;

package/dist/cjs/ChatbotAlert/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './ChatbotAlert';
+export * from './ChatbotAlert';

package/dist/cjs/ChatbotAlert/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var ChatbotAlert_1 = require("./ChatbotAlert");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ChatbotAlert_1).default; } });
+__exportStar(require("./ChatbotAlert"), exports);

package/dist/cjs/ChatbotContent/ChatbotContent.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export interface ChatbotContentProps extends React.HTMLProps<HTMLDivElement> {
+    /** Content to be displayed in the chatbot */
+    children: React.ReactNode;
+    /** Custom classname for the ChatbotContent component */
+    className?: string;
+}
+export declare const ChatbotContent: React.FunctionComponent<ChatbotContentProps>;
+export default ChatbotContent;

package/dist/cjs/ChatbotContent/ChatbotContent.js

@@ -0,0 +1,27 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatbotContent = void 0;
+// ============================================================================
+// Chatbot Main
+// ============================================================================
+const react_1 = __importDefault(require("react"));
+const ChatbotContent = (_a) => {
+    var { children, className } = _a, props = __rest(_a, ["children", "className"]);
+    return (react_1.default.createElement("div", Object.assign({ className: `pf-chatbot__content ${className !== null && className !== void 0 ? className : ''}` }, props), children));
+};
+exports.ChatbotContent = ChatbotContent;
+exports.default = exports.ChatbotContent;

package/dist/cjs/ChatbotContent/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './ChatbotContent';
+export * from './ChatbotContent';

package/dist/cjs/ChatbotContent/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var ChatbotContent_1 = require("./ChatbotContent");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ChatbotContent_1).default; } });
+__exportStar(require("./ChatbotContent"), exports);

package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { DropdownProps } from '@patternfly/react-core';
+export interface ChatbotConversationHistoryDropdownProps extends Omit<DropdownProps, 'toggle'> {
+    /** Dropdown items rendered in conversation options dropdown */
+    menuItems: React.ReactNode;
+    /** Optional classname applied to conversation options dropdown */
+    menuClassName?: string;
+    /** Tooltip content and aria-label applied to conversation options dropdown */
+    label?: string;
+    /** Callback for when user selects item. */
+    onSelect?: (event?: React.MouseEvent, value?: string | number) => void;
+}
+export declare const ChatbotConversationHistoryDropdown: React.FunctionComponent<ChatbotConversationHistoryDropdownProps>;
+export default ChatbotConversationHistoryDropdown;

package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatbotConversationHistoryDropdown = void 0;
+// ============================================================================
+// Chatbot Header - Chatbot Conversation History Nav
+// ============================================================================
+const react_1 = __importDefault(require("react"));
+// Import PatternFly components
+const react_core_1 = require("@patternfly/react-core");
+const ellipsis_v_icon_1 = __importDefault(require("@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon"));
+const ChatbotConversationHistoryDropdown = ({ menuItems, menuClassName, onSelect, label }) => {
+    const [isOpen, setIsOpen] = react_1.default.useState(false);
+    const toggle = (toggleRef) => (react_1.default.createElement(react_core_1.Tooltip, { className: "pf-chatbot__tooltip", content: label !== null && label !== void 0 ? label : 'Conversation options', position: "bottom" },
+        react_1.default.createElement(react_core_1.MenuToggle, { className: "pf-chatbot__history-actions", variant: "plain", "aria-label": label !== null && label !== void 0 ? label : 'Conversation options', ref: toggleRef, isExpanded: isOpen, onClick: () => setIsOpen(!isOpen), role: "menuitem" },
+            react_1.default.createElement(ellipsis_v_icon_1.default, null))));
+    return (react_1.default.createElement(react_core_1.Dropdown, { className: `pf-chatbot__selections ${menuClassName !== null && menuClassName !== void 0 ? menuClassName : ''}`, isOpen: isOpen, onSelect: onSelect, onOpenChange: (isOpen) => setIsOpen(isOpen), popperProps: { position: 'right' }, shouldFocusToggleOnSelect: true, shouldFocusFirstItemOnOpen: true, toggle: toggle }, menuItems));
+};
+exports.ChatbotConversationHistoryDropdown = ChatbotConversationHistoryDropdown;
+exports.default = exports.ChatbotConversationHistoryDropdown;

package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.d.ts

@@ -0,0 +1,52 @@
+import React from 'react';
+import { DrawerProps } from '@patternfly/react-core';
+import { ChatbotDisplayMode } from '../Chatbot/Chatbot';
+export interface Conversation {
+    /** Conversation id */
+    id: string;
+    /** Conversation icon */
+    icon?: React.ReactNode;
+    /** Flag for no icon */
+    noIcon?: boolean;
+    /** Conversation */
+    text: string;
+    /** Dropdown items rendered in conversation options dropdown */
+    menuItems?: React.ReactNode;
+    /** Optional classname applied to conversation options dropdown */
+    menuClassName?: string;
+    /** Tooltip content and aria-label applied to conversation options dropdown */
+    label?: string;
+    /** Callback for when user selects item. */
+    onSelect?: (event?: React.MouseEvent, value?: string | number) => void;
+}
+export interface ChatbotConversationHistoryNavProps extends DrawerProps {
+    /** Function called to toggle drawer */
+    onDrawerToggle: (event: React.KeyboardEvent | React.MouseEvent | React.TransitionEvent) => void;
+    /** Flag to indicate whether drawer is open */
+    isDrawerOpen: boolean;
+    /** Function called to close drawer */
+    setIsDrawerOpen: (bool: boolean) => void;
+    activeItemId?: string | number;
+    /** Callback function for when an item is selected */
+    onSelectActiveItem?: (event?: React.MouseEvent, itemId?: string | number) => void;
+    /** Items shown in conversation history */
+    conversations: Conversation[] | {
+        [key: string]: Conversation[];
+    };
+    /** Text shown in blue button */
+    newChatButtonText?: string;
+    /** Callback function for when blue button is clicked. Omit to hide blue "new chat button" */
+    onNewChat?: () => void;
+    /** Content wrapped by conversation history nav */
+    drawerContent?: React.ReactNode;
+    /** Placeholder for search input */
+    searchInputPlaceholder?: string;
+    /** Aria label for search input */
+    searchInputAriaLabel?: string;
+    /** A callback for when the input value changes. Omit to hide input field */
+    handleTextInputChange?: (value: string) => void;
+    /** Display mode of chatbot */
+    displayMode: ChatbotDisplayMode;
+}
+export declare const ChatbotConversationHistoryNav: React.FunctionComponent<ChatbotConversationHistoryNavProps>;
+export default ChatbotConversationHistoryNav;

package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.js

@@ -0,0 +1,83 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChatbotConversationHistoryNav = void 0;
+// ============================================================================
+// Chatbot Header - Chatbot Conversation History Nav
+// ============================================================================
+const react_1 = __importDefault(require("react"));
+// Import PatternFly components
+const react_core_1 = require("@patternfly/react-core");
+const react_icons_1 = require("@patternfly/react-icons");
+const Chatbot_1 = require("../Chatbot/Chatbot");
+const ChatbotConversationHistoryDropdown_1 = __importDefault(require("./ChatbotConversationHistoryDropdown"));
+const ChatbotConversationHistoryNav = (_a) => {
+    var { onDrawerToggle, isDrawerOpen, setIsDrawerOpen, activeItemId, onSelectActiveItem, conversations, newChatButtonText = 'New chat', drawerContent, onNewChat, searchInputPlaceholder = 'Search...', searchInputAriaLabel = 'Filter menu items', handleTextInputChange, displayMode } = _a, props = __rest(_a, ["onDrawerToggle", "isDrawerOpen", "setIsDrawerOpen", "activeItemId", "onSelectActiveItem", "conversations", "newChatButtonText", "drawerContent", "onNewChat", "searchInputPlaceholder", "searchInputAriaLabel", "handleTextInputChange", "displayMode"]);
+    const drawerRef = react_1.default.useRef(null);
+    const onExpand = () => {
+        drawerRef.current && drawerRef.current.focus();
+    };
+    const getNavItem = (conversation) => {
+        var _a;
+        return (react_1.default.createElement(react_core_1.MenuItem, Object.assign({ className: "pf-chatbot__menu-item", itemId: conversation.id, key: conversation.id }, (conversation.noIcon ? {} : { icon: (_a = conversation.icon) !== null && _a !== void 0 ? _a : react_1.default.createElement(react_icons_1.OutlinedCommentAltIcon, null) }), (conversation.menuItems
+            ? {
+                actions: (react_1.default.createElement(ChatbotConversationHistoryDropdown_1.default, { menuClassName: conversation.menuClassName, onSelect: conversation.onSelect, menuItems: conversation.menuItems, label: conversation.label }))
+            }
+            : {})), conversation.text));
+    };
+    const buildMenu = () => {
+        if (Array.isArray(conversations)) {
+            // Render for array of MenuItemObject
+            return (react_1.default.createElement(react_core_1.MenuList, null, conversations.map((conversation) => (react_1.default.createElement(react_1.default.Fragment, { key: conversation.id }, getNavItem(conversation))))));
+        }
+        else {
+            // Render for object with NavItemObject arrays as values
+            return (react_1.default.createElement(react_1.default.Fragment, null, Object.keys(conversations).map((navGroup) => (react_1.default.createElement(react_core_1.MenuGroup, { className: "pf-chatbot__menu-item-header", label: navGroup, key: navGroup },
+                react_1.default.createElement(react_core_1.MenuList, null, conversations[navGroup].map((conversation) => (react_1.default.createElement(react_1.default.Fragment, { key: conversation.id }, getNavItem(conversation))))))))));
+        }
+    };
+    // Menu Content
+    // - Consumers should pass an array to <Chatbot> of the list of conversations
+    // - Groups could be optional, but items need to be ordered by date
+    const menuContent = (react_1.default.createElement(react_core_1.Menu, { isPlain: true, onSelect: onSelectActiveItem, activeItemId: activeItemId },
+        react_1.default.createElement(react_core_1.MenuContent, null, buildMenu())));
+    const panelContent = (react_1.default.createElement(react_core_1.DrawerPanelContent, { focusTrap: { enabled: true }, minSize: "384px", maxSize: "384px" },
+        react_1.default.createElement(react_core_1.DrawerHead, null,
+            react_1.default.createElement(react_core_1.DrawerActions, null,
+                react_1.default.createElement(react_core_1.DrawerCloseButton, { onClick: onDrawerToggle }),
+                onNewChat && react_1.default.createElement(react_core_1.Button, { onClick: onNewChat }, newChatButtonText))),
+        handleTextInputChange && (react_1.default.createElement("div", { className: "pf-chatbot__input" },
+            react_1.default.createElement(react_core_1.SearchInput, { "aria-label": searchInputAriaLabel, onChange: (_event, value) => handleTextInputChange(value), placeholder: searchInputPlaceholder }))),
+        react_1.default.createElement(react_core_1.DrawerPanelBody, null, menuContent)));
+    // An onKeyDown property must be passed to the Drawer component to handle closing
+    // the drawer panel and deactivating the focus trap via the Escape key.
+    const onEscape = (event) => {
+        if (event.key === 'Escape') {
+            // prevents using escape key on menu buttons from closing the panel, but I'm not sure if this is allowed
+            if (event.target instanceof HTMLInputElement && event.target.type !== 'button') {
+                setIsDrawerOpen(false);
+            }
+        }
+    };
+    return (react_1.default.createElement(react_core_1.Drawer, Object.assign({ className: "pf-chatbot__history", isExpanded: isDrawerOpen, onExpand: onExpand, position: "start", onKeyDown: onEscape, isInline: displayMode === Chatbot_1.ChatbotDisplayMode.fullscreen || displayMode === Chatbot_1.ChatbotDisplayMode.embedded }, props),
+        react_1.default.createElement(react_core_1.DrawerContent, { panelContent: panelContent },
+            react_1.default.createElement(react_core_1.DrawerContentBody, null,
+                react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("div", { className: `${isDrawerOpen && (displayMode === Chatbot_1.ChatbotDisplayMode.default || displayMode === Chatbot_1.ChatbotDisplayMode.docked) ? 'pf-v6-c-backdrop pf-chatbot__drawer-backdrop' : undefined} ` }),
+                    drawerContent)))));
+};
+exports.ChatbotConversationHistoryNav = ChatbotConversationHistoryNav;
+exports.default = exports.ChatbotConversationHistoryNav;

package/dist/cjs/ChatbotConversationHistoryNav/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './ChatbotConversationHistoryNav';
+export * from './ChatbotConversationHistoryNav';
+export * from './ChatbotConversationHistoryDropdown';

package/dist/cjs/ChatbotConversationHistoryNav/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var ChatbotConversationHistoryNav_1 = require("./ChatbotConversationHistoryNav");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ChatbotConversationHistoryNav_1).default; } });
+__exportStar(require("./ChatbotConversationHistoryNav"), exports);
+__exportStar(require("./ChatbotConversationHistoryDropdown"), exports);