@patternfly/chatbot 2.1.0-prerelease.17

package/dist/esm/ChatbotFooter/ChatbotFootnote.d.ts

@@ -0,0 +1,44 @@
+import React from 'react';
+import { PopoverProps } from '@patternfly/react-core';
+export interface ChatbotFootnoteProps extends React.HTMLProps<HTMLDivElement> {
+    /** Label to show for the footnote */
+    label: string;
+    /** Config for the popover which opens up when footnote is clicked */
+    popover?: ChatbotFootnotePopover;
+    /** Custom classname for the Footnote component */
+    className?: string;
+}
+export interface ChatbotFootnotePopover {
+    /** Title for the Footnote popover */
+    title: string;
+    /** Description for the Footnote popover */
+    description: string;
+    /** Optional Banner Image that can be shown in the Footnote Popover */
+    bannerImage?: ChatbotFootnotePopoverBannerImage;
+    /** Optional CTA button that can be used to trigger an action and close the popover */
+    cta?: ChatbotFootnotePopoverCTA;
+    /** Optional link that can be used to show and external link like **Learn More** */
+    link?: ChatbotFootnotePopoverLink;
+    /** Props for PF Popover */
+    popoverProps?: PopoverProps;
+}
+export interface ChatbotFootnotePopoverCTA {
+    /** Label for the CTA */
+    label: string;
+    /** Callback for the CTA */
+    onClick: () => void;
+}
+export interface ChatbotFootnotePopoverBannerImage {
+    /** Source for the banner image */
+    src: string;
+    /** Alternate text for the banner image */
+    alt: string;
+}
+export interface ChatbotFootnotePopoverLink {
+    /** Label for the Link */
+    label: string;
+    /** URL for the Link */
+    url: string;
+}
+export declare const ChatbotFootnote: React.FunctionComponent<ChatbotFootnoteProps>;
+export default ChatbotFootnote;

package/dist/esm/ChatbotFooter/ChatbotFootnote.js

@@ -0,0 +1,49 @@
+// ============================================================================
+// Chatbot Footer - Footnote
+// ============================================================================
+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;
+};
+import React from 'react';
+// Import Patternfly components
+import { Button, Content, ContentVariants, Flex } from '@patternfly/react-core';
+// Import Patternfly icons
+import { InfoCircleIcon } from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
+import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/esm/icons/external-link-alt-icon';
+// Import Chatbot components
+import ChatbotPopover from '../ChatbotPopover/ChatbotPopover';
+export const ChatbotFootnote = (_a) => {
+    var _b, _c, _d, _e, _f;
+    var { label, popover, className } = _a, props = __rest(_a, ["label", "popover", "className"]);
+    // Popover visibility state
+    const [isVisible, setIsVisible] = React.useState(false);
+    // Define popover body content
+    const popoverBodyContent = (React.createElement(React.Fragment, null,
+        (popover === null || popover === void 0 ? void 0 : popover.bannerImage) && React.createElement("img", { src: popover.bannerImage.src, alt: popover.bannerImage.alt }),
+        React.createElement(Content, { component: ContentVariants.h3 }, popover === null || popover === void 0 ? void 0 : popover.title),
+        React.createElement(Content, { component: ContentVariants.p }, popover === null || popover === void 0 ? void 0 : popover.description)));
+    // Define popover footer content
+    const popoverFooterContent = (React.createElement(Flex, { gap: { default: 'gapSm' } },
+        (popover === null || popover === void 0 ? void 0 : popover.cta) && (React.createElement(Button, { variant: "secondary", onClick: () => {
+                var _a;
+                setIsVisible(false);
+                (_a = popover.cta) === null || _a === void 0 ? void 0 : _a.onClick();
+            } }, ((_b = popover.cta) === null || _b === void 0 ? void 0 : _b.label) || 'Got it')),
+        (popover === null || popover === void 0 ? void 0 : popover.link) && (React.createElement(Button, { variant: "link", component: "a", href: popover.link.url, target: "_blank", icon: React.createElement(ExternalLinkAltIcon, null), iconPosition: "end" }, popover.link.label))));
+    return (React.createElement("div", Object.assign({ className: `pf-chatbot__footnote ${className !== null && className !== void 0 ? className : ''}` }, props),
+        popover && (React.createElement(ChatbotPopover, Object.assign({ className: "pf-chatbot__popover--footnote", "aria-label": ((_c = popover.popoverProps) === null || _c === void 0 ? void 0 : _c['aria-label']) || 'More information', isVisible: isVisible, shouldOpen: (_event, _fn) => setIsVisible(true), shouldClose: (_event, _fn) => setIsVisible(false), bodyContent: popoverBodyContent, footerContent: popoverFooterContent, minWidth: ((_d = popover.popoverProps) === null || _d === void 0 ? void 0 : _d.minWidth) || '432', maxWidth: ((_e = popover.popoverProps) === null || _e === void 0 ? void 0 : _e.maxWidth) || '432', distance: ((_f = popover.popoverProps) === null || _f === void 0 ? void 0 : _f.distance) || 16, showClose: false }, popover.popoverProps),
+            React.createElement(Button, { variant: "link", size: "sm" },
+                label,
+                " ",
+                React.createElement(InfoCircleIcon, null)))),
+        !popover && React.createElement(Content, { component: ContentVariants.small }, label)));
+};
+export default ChatbotFootnote;

package/dist/esm/ChatbotFooter/index.d.ts

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

package/dist/esm/ChatbotFooter/index.js

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

package/dist/esm/ChatbotHeader/ChatbotHeader.d.ts

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

package/dist/esm/ChatbotHeader/ChatbotHeader.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { Divider } from '@patternfly/react-core';
+export const ChatbotHeader = ({ className, children }) => (React.createElement("div", { className: "pf-chatbot__header-container" },
+    React.createElement("div", { className: `pf-chatbot__header ${className !== null && className !== void 0 ? className : ''}` }, children),
+    React.createElement(Divider, { className: "pf-chatbot__header__divider" })));
+export default ChatbotHeader;

package/dist/esm/ChatbotHeader/ChatbotHeaderActions.d.ts

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

package/dist/esm/ChatbotHeader/ChatbotHeaderActions.js

@@ -0,0 +1,3 @@
+import React from 'react';
+export const ChatbotHeaderActions = ({ className, children }) => React.createElement("div", { className: `pf-chatbot__actions ${className || ''}` }, children);
+export default ChatbotHeaderActions;

package/dist/esm/ChatbotHeader/ChatbotHeaderMain.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export interface ChatbotHeaderMainProps {
+    /** Custom classname for the header component */
+    className?: string;
+    /** Menu and/or chatbot header components */
+    children: React.ReactNode;
+}
+export declare const ChatbotHeaderMain: React.FunctionComponent<ChatbotHeaderMainProps>;
+export default ChatbotHeaderMain;

package/dist/esm/ChatbotHeader/ChatbotHeaderMain.js

@@ -0,0 +1,3 @@
+import React from 'react';
+export const ChatbotHeaderMain = ({ className, children }) => React.createElement("div", { className: `pf-chatbot__header-main ${className}` }, children);
+export default ChatbotHeaderMain;

package/dist/esm/ChatbotHeader/ChatbotHeaderMenu.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { TooltipProps } from '@patternfly/react-core';
+export interface ChatbotHeaderMenuProps {
+    /** Callback function to attach to menu toggle on top right of chatbot header. */
+    onMenuToggle: () => void;
+    /** Custom classname for the header component */
+    className?: string;
+    /** Props spread to the PF Tooltip component wrapping the display mode dropdown */
+    tooltipProps?: TooltipProps;
+    /** Aria label for menu */
+    menuAriaLabel?: string;
+    /** Ref applied to menu */
+    innerRef?: React.Ref<HTMLButtonElement>;
+}
+export declare const ChatbotHeaderMenu: React.ForwardRefExoticComponent<ChatbotHeaderMenuProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/esm/ChatbotHeader/ChatbotHeaderMenu.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Button, Icon, Tooltip } from '@patternfly/react-core';
+import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon';
+const ChatbotHeaderMenuBase = ({ className, onMenuToggle, tooltipProps, menuAriaLabel = 'Toggle menu', innerRef }) => (React.createElement("div", { className: `pf-chatbot__menu ${className}` },
+    React.createElement(Tooltip, Object.assign({ content: "Menu", position: "bottom" }, tooltipProps),
+        React.createElement(Button, { className: "pf-chatbot__button--toggle-menu", variant: "plain", onClick: onMenuToggle, "aria-label": menuAriaLabel, ref: innerRef, icon: React.createElement(Icon, { size: "xl", isInline: true },
+                React.createElement(BarsIcon, null)) }))));
+export const ChatbotHeaderMenu = React.forwardRef((props, ref) => (React.createElement(ChatbotHeaderMenuBase, Object.assign({ innerRef: ref }, props))));

package/dist/esm/ChatbotHeader/ChatbotHeaderOptionsDropdown.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { TooltipProps, DropdownProps } from '@patternfly/react-core';
+export interface ChatbotHeaderOptionsDropdownProps extends Omit<DropdownProps, 'toggle'> {
+    /** Content to be displayed in the chatbot header */
+    children: React.ReactNode;
+    /** Custom classname for the header component */
+    className?: string;
+    /** Props spread to the PF Tooltip component wrapping the display mode dropdown */
+    tooltipProps?: TooltipProps;
+    /** Aria label for menu toggle */
+    menuToggleAriaLabel?: string;
+}
+export declare const ChatbotHeaderOptionsDropdown: React.FunctionComponent<ChatbotHeaderOptionsDropdownProps>;
+export default ChatbotHeaderOptionsDropdown;

package/dist/esm/ChatbotHeader/ChatbotHeaderOptionsDropdown.js

@@ -0,0 +1,26 @@
+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;
+};
+import React from 'react';
+import { Tooltip, Dropdown, MenuToggle, Icon } from '@patternfly/react-core';
+import EllipsisIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
+export const ChatbotHeaderOptionsDropdown = (_a) => {
+    var { className, children, onSelect, tooltipProps, menuToggleAriaLabel = 'Chatbot options' } = _a, props = __rest(_a, ["className", "children", "onSelect", "tooltipProps", "menuToggleAriaLabel"]);
+    const [isOptionsMenuOpen, setIsOptionsMenuOpen] = React.useState(false);
+    const toggle = (toggleRef) => (React.createElement(Tooltip, Object.assign({ className: "pf-chatbot__tooltip", content: "Chatbot options", position: "bottom" }, tooltipProps),
+        React.createElement(MenuToggle, { className: "pf-chatbot__button--toggle-options", variant: "plain", "aria-label": menuToggleAriaLabel, ref: toggleRef, icon: React.createElement(Icon, { iconSize: "xl", isInline: true },
+                React.createElement(EllipsisIcon, null)), isExpanded: isOptionsMenuOpen, onClick: () => setIsOptionsMenuOpen(!isOptionsMenuOpen) })));
+    return (React.createElement(Dropdown, Object.assign({ className: `pf-chatbot__options ${className !== null && className !== void 0 ? className : ''}`, isOpen: isOptionsMenuOpen, onSelect: (e, value) => {
+            onSelect && onSelect(e, value);
+            setIsOptionsMenuOpen(false);
+        }, onOpenChange: (isOpen) => setIsOptionsMenuOpen(isOpen), popperProps: { position: 'right', preventOverflow: true, appendTo: 'inline' }, shouldFocusToggleOnSelect: true, shouldFocusFirstItemOnOpen: true, toggle: toggle }, props), children));
+};
+export default ChatbotHeaderOptionsDropdown;

package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { TooltipProps, DropdownProps } from '@patternfly/react-core';
+export interface ChatbotHeaderSelectorDropdownProps extends Omit<DropdownProps, 'toggle'> {
+    /** Value of the selected dropdown item */
+    value: string;
+    /** Content to be displayed in the chatbot header */
+    children: React.ReactNode;
+    /** Custom classname for the header component */
+    className?: string;
+    /** Props spread to the PF Tooltip component wrapping the display mode dropdown */
+    tooltipProps?: TooltipProps;
+    /** Aria label for menu toggle */
+    menuToggleAriaLabel?: string;
+    /** Text displayed in Tooltip wrapping the display mode dropdown */
+    tooltipContent?: string;
+}
+export declare const ChatbotHeaderSelectorDropdown: React.FunctionComponent<ChatbotHeaderSelectorDropdownProps>;
+export default ChatbotHeaderSelectorDropdown;

package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.js

@@ -0,0 +1,26 @@
+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;
+};
+import React from 'react';
+import { Tooltip, Dropdown, MenuToggle } from '@patternfly/react-core';
+export const ChatbotHeaderSelectorDropdown = (_a) => {
+    var { value, className, children, onSelect, tooltipProps, tooltipContent = 'Chatbot selector', menuToggleAriaLabel } = _a, props = __rest(_a, ["value", "className", "children", "onSelect", "tooltipProps", "tooltipContent", "menuToggleAriaLabel"]);
+    const [isOptionsMenuOpen, setIsOptionsMenuOpen] = React.useState(false);
+    const [defaultAriaLabel, setDefaultAriaLabel] = React.useState('Chatbot selector');
+    const toggle = (toggleRef) => (React.createElement(Tooltip, Object.assign({ className: "pf-chatbot__tooltip", content: tooltipContent, position: "bottom" }, tooltipProps),
+        React.createElement(MenuToggle, { variant: "secondary", "aria-label": menuToggleAriaLabel !== null && menuToggleAriaLabel !== void 0 ? menuToggleAriaLabel : defaultAriaLabel, ref: toggleRef, isExpanded: isOptionsMenuOpen, onClick: () => setIsOptionsMenuOpen(!isOptionsMenuOpen) }, value)));
+    return (React.createElement(Dropdown, Object.assign({ className: `pf-chatbot__selections ${className !== null && className !== void 0 ? className : ''}`, isOpen: isOptionsMenuOpen, onSelect: (e, value) => {
+            onSelect && onSelect(e, value);
+            setDefaultAriaLabel(`Chatbot selector: ${value}`);
+            setIsOptionsMenuOpen(false);
+        }, onOpenChange: (isOpen) => setIsOptionsMenuOpen(isOpen), popperProps: { position: 'right', appendTo: 'inline' }, shouldFocusToggleOnSelect: true, shouldFocusFirstItemOnOpen: true, toggle: toggle }, props), children));
+};
+export default ChatbotHeaderSelectorDropdown;

package/dist/esm/ChatbotHeader/ChatbotHeaderTitle.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { ChatbotDisplayMode } from '../Chatbot/Chatbot';
+export interface ChatbotHeaderTitleProps {
+    /** Content to be displayed in the chatbot header */
+    children?: React.ReactNode;
+    /** Custom classname for the header component */
+    className?: string;
+    /** Display mode of chatbot, in case you want to conditionally show a title */
+    displayMode?: ChatbotDisplayMode;
+    /** Content to display on full screen */
+    showOnFullScreen?: React.ReactNode | string;
+    /** Content to display on docked screen */
+    showOnDocked?: React.ReactNode | string;
+    /** Content to display on overlay screen */
+    showOnEmbedded?: React.ReactNode | string;
+    /** Content to display by default; this will be shown if a case is not explicitly set */
+    showOnDefault?: React.ReactNode | string;
+}
+export declare const ChatbotHeaderTitle: React.FunctionComponent<ChatbotHeaderTitleProps>;
+export default ChatbotHeaderTitle;

package/dist/esm/ChatbotHeader/ChatbotHeaderTitle.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import { SplitItem } from '@patternfly/react-core';
+import { ChatbotDisplayMode } from '../Chatbot/Chatbot';
+export const ChatbotHeaderTitle = ({ className, children, displayMode, showOnFullScreen, showOnDocked, showOnEmbedded, showOnDefault }) => {
+    const renderChildren = () => {
+        if (displayMode && (showOnDefault || showOnFullScreen || showOnEmbedded || showOnDocked)) {
+            /* eslint-disable indent */
+            switch (displayMode) {
+                case ChatbotDisplayMode.fullscreen:
+                    return showOnFullScreen !== null && showOnFullScreen !== void 0 ? showOnFullScreen : showOnDefault;
+                case ChatbotDisplayMode.docked:
+                    return showOnDocked !== null && showOnDocked !== void 0 ? showOnDocked : showOnDefault;
+                case ChatbotDisplayMode.embedded:
+                    return showOnEmbedded !== null && showOnEmbedded !== void 0 ? showOnEmbedded : showOnDefault;
+                default:
+                    return showOnDefault;
+            }
+            /* eslint-enable indent */
+        }
+        else {
+            return children;
+        }
+    };
+    return (React.createElement(SplitItem, { isFilled: true, className: `pf-chatbot__title ${className || ''}` }, renderChildren()));
+};
+export default ChatbotHeaderTitle;

package/dist/esm/ChatbotHeader/index.d.ts

@@ -0,0 +1,8 @@
+export { default } from './ChatbotHeader';
+export * from './ChatbotHeader';
+export * from './ChatbotHeaderActions';
+export * from './ChatbotHeaderMain';
+export * from './ChatbotHeaderMenu';
+export * from './ChatbotHeaderTitle';
+export * from './ChatbotHeaderOptionsDropdown';
+export * from './ChatbotHeaderSelectorDropdown';

package/dist/esm/ChatbotHeader/index.js

@@ -0,0 +1,8 @@
+export { default } from './ChatbotHeader';
+export * from './ChatbotHeader';
+export * from './ChatbotHeaderActions';
+export * from './ChatbotHeaderMain';
+export * from './ChatbotHeaderMenu';
+export * from './ChatbotHeaderTitle';
+export * from './ChatbotHeaderOptionsDropdown';
+export * from './ChatbotHeaderSelectorDropdown';

package/dist/esm/ChatbotModal/ChatbotModal.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { ModalProps } from '@patternfly/react-core';
+import { ChatbotDisplayMode } from '../Chatbot';
+export interface ChatbotModalProps extends Omit<ModalProps, 'ref'> {
+    /** Display mode for the Chatbot parent; this influences the styles applied */
+    displayMode?: ChatbotDisplayMode;
+    className?: string;
+}
+export declare const ChatbotModal: React.FunctionComponent<ChatbotModalProps>;
+export default ChatbotModal;

package/dist/esm/ChatbotModal/ChatbotModal.js

@@ -0,0 +1,27 @@
+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;
+};
+// ============================================================================
+// Code Modal - Chatbot Modal with Code Editor
+// ============================================================================
+import React from 'react';
+// Import PatternFly components
+import { Modal } from '@patternfly/react-core';
+import { ChatbotDisplayMode } from '../Chatbot';
+export const ChatbotModal = (_a) => {
+    var { children, displayMode = ChatbotDisplayMode.default, className, isOpen } = _a, props = __rest(_a, ["children", "displayMode", "className", "isOpen"]);
+    const modal = (React.createElement(Modal, Object.assign({ isOpen: isOpen, ouiaId: "ChatbotModal", "aria-labelledby": "chatbot-modal-title", "aria-describedby": "chatbot-modal", className: `pf-chatbot__chatbot-modal pf-chatbot__chatbot-modal--${displayMode} ${className}`, backdropClassName: "pf-chatbot__chatbot-modal-backdrop" }, props), children));
+    if ((displayMode === ChatbotDisplayMode.fullscreen || displayMode === ChatbotDisplayMode.embedded) && isOpen) {
+        return React.createElement("div", { className: "pf-v6-c-backdrop pf-chatbot__backdrop" }, modal);
+    }
+    return modal;
+};
+export default ChatbotModal;

package/dist/esm/ChatbotModal/index.d.ts

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

package/dist/esm/ChatbotModal/index.js

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

package/dist/esm/ChatbotPopover/ChatbotPopover.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { PopoverProps } from '@patternfly/react-core';
+export declare const ChatbotPopover: React.FunctionComponent<PopoverProps>;
+export default ChatbotPopover;

package/dist/esm/ChatbotPopover/ChatbotPopover.js

@@ -0,0 +1,22 @@
+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;
+};
+// ============================================================================
+// Chatbot Popover
+// ============================================================================
+import React from 'react';
+// Import PatternFly components
+import { Popover } from '@patternfly/react-core';
+export const ChatbotPopover = (_a) => {
+    var { children, className } = _a, props = __rest(_a, ["children", "className"]);
+    return (React.createElement(Popover, Object.assign({ className: `pf-chatbot__popover ${className !== null && className !== void 0 ? className : ''}`, showClose: false }, props), children));
+};
+export default ChatbotPopover;

package/dist/esm/ChatbotPopover/index.d.ts

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

package/dist/esm/ChatbotPopover/index.js

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

package/dist/esm/ChatbotToggle/ChatbotToggle.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { ButtonProps, TooltipProps } from '@patternfly/react-core';
+export interface ChatbotToggleProps extends ButtonProps {
+    /** Contents of the tooltip applied to the toggle button */
+    toolTipLabel?: React.ReactNode;
+    /** Props spread to the PF Tooltip component */
+    tooltipProps?: Omit<TooltipProps, 'content'>;
+    /** Flag indicating visibility of the chatbot appended to the toggle */
+    isChatbotVisible?: boolean;
+    /** Callback fired when toggle button is clicked */
+    onToggleChatbot?: () => void;
+    /** Accessible label for the toggle button */
+    toggleButtonLabel?: string;
+    /** An image displayed in the chatbot toggle when it is closed */
+    closedToggleIcon?: () => JSX.Element;
+    /** Ref applied to toggle */
+    innerRef?: React.Ref<HTMLButtonElement>;
+}
+declare const ChatbotToggle: React.ForwardRefExoticComponent<ChatbotToggleProps & React.RefAttributes<any>>;
+export default ChatbotToggle;

package/dist/esm/ChatbotToggle/ChatbotToggle.js

@@ -0,0 +1,30 @@
+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;
+};
+// ============================================================================
+// Chatbot Toggle
+// ============================================================================
+import React from 'react';
+import { Button, Tooltip, Icon } from '@patternfly/react-core';
+import AngleDownIcon from '@patternfly/react-icons/dist/esm/icons/angle-down-icon';
+const ChatIcon = () => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" },
+    React.createElement("path", { fill: "var(--pf-t--global--icon--color--inverse)", stroke: "var(--pf-t--global--icon--color--inverse)", strokeLinejoin: "round", strokeWidth: ".75", d: "M3.577 14.382c0 .198.12.38.31.46l.19.04a.492.492 0 0 0 .349-.143l3.028-3.028h8.513a.489.489 0 0 0 .492-.492V2.491A.489.489 0 0 0 15.967 2H1.691a.489.489 0 0 0-.492.491v8.728c0 .135.056.262.143.349a.498.498 0 0 0 .349.143h1.878v2.663h.008v.008ZM2.19 10.72V2.983h13.278v7.729H7.24a.512.512 0 0 0-.35.143l-2.322 2.322v-1.974a.498.498 0 0 0-.142-.348.492.492 0 0 0-.35-.143H2.19v.008Z" }),
+    React.createElement("path", { fill: "var(--pf-t--global--text--color--inverse)", stroke: "var(--pf-t--global--text--color--inverse)", strokeLinejoin: "round", strokeWidth: ".75", d: "M22.301 9.135h-3.963a.489.489 0 0 0-.492.491c0 .27.222.492.492.492h3.472v7.737h-1.88a.404.404 0 0 0-.348.134.492.492 0 0 0-.143.35v1.973l-2.322-2.323a.492.492 0 0 0-.349-.142H8.532v-4.265a.489.489 0 0 0-.492-.492.494.494 0 0 0-.491.492v4.756c0 .277.222.492.491.492h8.514l3.028 3.028a.492.492 0 0 0 .349.142l.19-.04a.502.502 0 0 0 .31-.459V18.83h1.878c.111-.008.262-.048.349-.135a.491.491 0 0 0 .142-.349v-8.72a.489.489 0 0 0-.491-.491h-.008Z" })));
+const ChatbotToggleBase = (_a) => {
+    var { toolTipLabel, isChatbotVisible, onToggleChatbot, tooltipProps, toggleButtonLabel, closedToggleIcon: ClosedToggleIcon, innerRef } = _a, props = __rest(_a, ["toolTipLabel", "isChatbotVisible", "onToggleChatbot", "tooltipProps", "toggleButtonLabel", "closedToggleIcon", "innerRef"]);
+    // Configure icon
+    const closedIcon = ClosedToggleIcon ? React.createElement(ClosedToggleIcon, null) : React.createElement(ChatIcon, null);
+    const icon = isChatbotVisible ? React.createElement(AngleDownIcon, null) : closedIcon;
+    return (React.createElement(Tooltip, Object.assign({ content: toolTipLabel }, tooltipProps),
+        React.createElement(Button, Object.assign({ className: `pf-chatbot__button ${isChatbotVisible ? 'pf-chatbot__button--active' : ''}`, variant: "plain", "aria-label": toggleButtonLabel || `${toolTipLabel} toggle`, onClick: onToggleChatbot, "aria-expanded": isChatbotVisible, icon: React.createElement(Icon, { isInline: true }, icon), ref: innerRef }, props))));
+};
+const ChatbotToggle = React.forwardRef((props, ref) => (React.createElement(ChatbotToggleBase, Object.assign({ innerRef: ref }, props))));
+export default ChatbotToggle;

package/dist/esm/ChatbotToggle/index.d.ts

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

package/dist/esm/ChatbotToggle/index.js

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

package/dist/esm/ChatbotWelcomePrompt/ChatbotWelcomePrompt.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+export interface ChatbotWelcomePromptProps extends React.HTMLProps<HTMLDivElement> {
+    /** Title for the welcome message*/
+    title: string;
+    /** Welcome message */
+    description: string;
+    /** Custom basic prompts to help users coming for the first time to chatbot */
+    prompts?: WelcomePrompt[];
+    /** Custom classname for the WelcomePrompt component */
+    className?: string;
+    /** Custom test id for the WelcomePrompt component */
+    testId?: string;
+}
+export interface WelcomePrompt {
+    /** Message for the welcome prompt */
+    message?: string;
+    /** Title for the welcome prompt */
+    title: string;
+    /** Callback handler for the onClick event for welcome prompt */
+    onClick?: () => void;
+}
+export declare const ChatbotWelcomePrompt: React.FunctionComponent<ChatbotWelcomePromptProps>;
+export default ChatbotWelcomePrompt;

package/dist/esm/ChatbotWelcomePrompt/ChatbotWelcomePrompt.js

@@ -0,0 +1,33 @@
+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;
+};
+// ============================================================================
+// Chatbot Layout - Chat - Welcome
+// ============================================================================
+import React from 'react';
+import { Content, ContentVariants, Card, CardHeader, CardTitle, CardBody } from '@patternfly/react-core';
+export const ChatbotWelcomePrompt = (_a) => {
+    var { title, description, prompts, className, testId } = _a, props = __rest(_a, ["title", "description", "prompts", "className", "testId"]);
+    return (React.createElement("div", Object.assign({ "data-testid": testId, className: `pf-chatbot--layout--welcome ${className !== null && className !== void 0 ? className : ''}` }, props),
+        React.createElement(Content, { component: ContentVariants.h1 },
+            React.createElement("span", { className: "pf-chatbot__hello" }, title),
+            React.createElement("br", null),
+            React.createElement("span", { className: "pf-chatbot__question" }, description)),
+        prompts && (React.createElement("div", { className: "pf-chatbot__prompt-suggestions" }, prompts === null || prompts === void 0 ? void 0 : prompts.map((prompt, index) => (React.createElement(Card, { key: `welcome-prompt-${index}`, className: "pf-chatbot__prompt-suggestion", isClickable: true },
+            React.createElement(CardHeader, { selectableActions: {
+                    onClickAction: prompt.onClick,
+                    selectableActionId: `welcome-prompt-input-${index}`,
+                    selectableActionAriaLabelledby: `welcome-prompt-title-${index}`
+                } },
+                React.createElement(CardTitle, { id: `welcome-prompt-title-${index}` }, prompt.title)),
+            prompt.message && React.createElement(CardBody, null, prompt.message))))))));
+};
+export default ChatbotWelcomePrompt;

package/dist/esm/ChatbotWelcomePrompt/ChatbotWelcomePrompt.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/esm/ChatbotWelcomePrompt/ChatbotWelcomePrompt.test.js

@@ -0,0 +1,44 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import ChatbotWelcomePrompt from './ChatbotWelcomePrompt';
+import userEvent from '@testing-library/user-event';
+describe('ChatbotWelcomePrompt', () => {
+    it('should render welcome prompt', () => {
+        const { container } = render(React.createElement(ChatbotWelcomePrompt, { title: "Hello, Chatbot User", description: "How may I help you today?" }));
+        expect(container).toMatchSnapshot();
+    });
+    it('should render correctly', () => {
+        render(React.createElement(ChatbotWelcomePrompt, { title: "Hello, Chatbot User", description: "How may I help you today?" }));
+        expect(screen.getByText('Hello, Chatbot User')).toBeTruthy();
+        expect(screen.getByText('How may I help you today?')).toBeTruthy();
+    });
+    it('should render prompts with titles correctly', () => {
+        render(React.createElement(ChatbotWelcomePrompt, { title: "Hello, Chatbot User", description: "How may I help you today?", prompts: [{ title: 'Topic 1' }] }));
+        expect(screen.getByText('Topic 1')).toBeTruthy();
+    });
+    it('should render prompts with messages correctly', () => {
+        render(React.createElement(ChatbotWelcomePrompt, { title: "Hello, Chatbot User", description: "How may I help you today?", prompts: [{ title: 'Topic 1', message: 'Helpful prompt for Topic 1' }] }));
+        expect(screen.getByText('Helpful prompt for Topic 1')).toBeTruthy();
+    });
+    it('should render prompts with onClick correctly', () => __awaiter(void 0, void 0, void 0, function* () {
+        const spy = jest.fn();
+        render(React.createElement(ChatbotWelcomePrompt, { title: "Hello, Chatbot User", description: "How may I help you today?", prompts: [{ title: 'Topic 1', message: 'Helpful prompt for Topic 1', onClick: spy }] }));
+        yield userEvent.click(screen.getByRole('button', { name: /Topic 1/i }));
+        expect(spy).toHaveBeenCalled();
+    }));
+    it('should apply className appropriately', () => {
+        render(React.createElement(ChatbotWelcomePrompt, { title: "Hello, Chatbot User", description: "How may I help you today?", className: "test", testId: "welcome-prompt" }));
+        const element = screen.getByTestId('welcome-prompt');
+        expect(element).toHaveClass('test');
+    });
+});

package/dist/esm/ChatbotWelcomePrompt/index.d.ts

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

package/dist/esm/ChatbotWelcomePrompt/index.js

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