@patternfly/chatbot 2.2.0-prerelease.30 → 2.2.0-prerelease.31

package/dist/cjs/Message/ErrorMessage/ErrorMessage.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { AlertProps } from '@patternfly/react-core';
+declare const ErrorMessage: ({ title, actionLinks, children, ...props }: AlertProps) => React.JSX.Element;
+export default ErrorMessage;

package/dist/cjs/Message/ErrorMessage/ErrorMessage.js

@@ -0,0 +1,26 @@
+"use strict";
+// ============================================================================
+// Chatbot Main - Message - Content - Error
+// ============================================================================
+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 });
+const react_1 = __importDefault(require("react"));
+const react_core_1 = require("@patternfly/react-core");
+const ErrorMessage = (_a) => {
+    var { title, actionLinks, children } = _a, props = __rest(_a, ["title", "actionLinks", "children"]);
+    return (react_1.default.createElement(react_core_1.Alert, Object.assign({ isInline: true, variant: "danger", title: title, actionLinks: actionLinks }, props), children));
+};
+exports.default = ErrorMessage;

package/dist/cjs/Message/Message.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-import { AvatarProps, LabelGroupProps } from '@patternfly/react-core';
+import { AlertProps, AvatarProps, LabelGroupProps } from '@patternfly/react-core';
 import { ActionProps } from '../ResponseActions/ResponseActions';
 import { SourcesCardProps } from '../SourcesCard';
 import { QuickStart, QuickstartAction } from './QuickStarts/types';
@@ -102,6 +102,8 @@ export interface MessageProps extends Omit<React.HTMLProps<HTMLDivElement>, 'rol
     additionalRehypePlugins?: PluggableList;
     /** Whether to open links in message in new tab. */
     openLinkInNewTab?: boolean;
+    /** Optional inline error message that can be displayed in the message */
+    error?: AlertProps;
 }
 export declare const MessageBase: React.FunctionComponent<MessageProps>;
 declare const Message: React.ForwardRefExoticComponent<Omit<MessageProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/Message/Message.js

@@ -46,8 +46,9 @@ const rehype_unwrap_images_1 = __importDefault(require("rehype-unwrap-images"));
 const rehype_external_links_1 = __importDefault(require("rehype-external-links"));
 const rehype_sanitize_1 = __importDefault(require("rehype-sanitize"));
 const LinkMessage_1 = __importDefault(require("./LinkMessage/LinkMessage"));
+const ErrorMessage_1 = __importDefault(require("./ErrorMessage/ErrorMessage"));
 const MessageBase = (_a) => {
-    var { role, content, extraContent, name, avatar, timestamp, isLoading, actions, sources, botWord = 'AI', loadingWord = 'Loading message', codeBlockProps, quickResponses, quickResponseContainerProps = { numLabels: 5 }, attachments, hasRoundAvatar = true, avatarProps, quickStarts, userFeedbackForm, userFeedbackComplete, isLiveRegion = true, innerRef, tableProps, openLinkInNewTab = true, additionalRehypePlugins = [] } = _a, props = __rest(_a, ["role", "content", "extraContent", "name", "avatar", "timestamp", "isLoading", "actions", "sources", "botWord", "loadingWord", "codeBlockProps", "quickResponses", "quickResponseContainerProps", "attachments", "hasRoundAvatar", "avatarProps", "quickStarts", "userFeedbackForm", "userFeedbackComplete", "isLiveRegion", "innerRef", "tableProps", "openLinkInNewTab", "additionalRehypePlugins"]);
+    var { role, content, extraContent, name, avatar, timestamp, isLoading, actions, sources, botWord = 'AI', loadingWord = 'Loading message', codeBlockProps, quickResponses, quickResponseContainerProps = { numLabels: 5 }, attachments, hasRoundAvatar = true, avatarProps, quickStarts, userFeedbackForm, userFeedbackComplete, isLiveRegion = true, innerRef, tableProps, openLinkInNewTab = true, additionalRehypePlugins = [], error } = _a, props = __rest(_a, ["role", "content", "extraContent", "name", "avatar", "timestamp", "isLoading", "actions", "sources", "botWord", "loadingWord", "codeBlockProps", "quickResponses", "quickResponseContainerProps", "attachments", "hasRoundAvatar", "avatarProps", "quickStarts", "userFeedbackForm", "userFeedbackComplete", "isLiveRegion", "innerRef", "tableProps", "openLinkInNewTab", "additionalRehypePlugins", "error"]);
     const { beforeMainContent, afterMainContent, endContent } = extraContent || {};
     let rehypePlugins = [rehype_unwrap_images_1.default];
     if (openLinkInNewTab) {
@@ -77,7 +78,7 @@ const MessageBase = (_a) => {
                 react_1.default.createElement("div", { className: "pf-chatbot__message-and-actions" },
                     isLoading ? (react_1.default.createElement(MessageLoading_1.default, { loadingWord: loadingWord })) : (react_1.default.createElement(react_1.default.Fragment, null,
                         beforeMainContent && react_1.default.createElement(react_1.default.Fragment, null, beforeMainContent),
-                        react_1.default.createElement(react_markdown_1.default, { components: {
+                        error ? (react_1.default.createElement(ErrorMessage_1.default, Object.assign({}, error))) : (react_1.default.createElement(react_markdown_1.default, { components: {
                                 p: (props) => react_1.default.createElement(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.p }, props)),
                                 code: (_a) => {
                                     var { children } = _a, props = __rest(_a, ["children"]);
@@ -106,7 +107,7 @@ const MessageBase = (_a) => {
                                 th: (props) => react_1.default.createElement(ThMessage_1.default, Object.assign({}, props)),
                                 img: (props) => react_1.default.createElement(ImageMessage_1.default, Object.assign({}, props)),
                                 a: (props) => (react_1.default.createElement(LinkMessage_1.default, { href: props.href, rel: props.rel, target: props.target }, props.children))
-                            }, remarkPlugins: [remark_gfm_1.default], rehypePlugins: rehypePlugins }, content),
+                            }, remarkPlugins: [remark_gfm_1.default], rehypePlugins: rehypePlugins }, content)),
                         afterMainContent && react_1.default.createElement(react_1.default.Fragment, null, afterMainContent))),
                     !isLoading && sources && react_1.default.createElement(SourcesCard_1.default, Object.assign({}, sources)),
                     quickStarts && quickStarts.quickStart && (react_1.default.createElement(QuickStartTile_1.default, { quickStart: quickStarts.quickStart, onSelectQuickStart: quickStarts.onSelectQuickStart, minuteWord: quickStarts.minuteWord, minuteWordPlural: quickStarts.minuteWordPlural, prerequisiteWord: quickStarts.prerequisiteWord, prerequisiteWordPlural: quickStarts.prerequisiteWordPlural, quickStartButtonAriaLabel: quickStarts.quickStartButtonAriaLabel })),

package/dist/cjs/Message/Message.test.js

@@ -20,6 +20,7 @@ const user_event_1 = __importDefault(require("@testing-library/user-event"));
 const monitor_sampleapp_quickstart_1 = require("./QuickStarts/monitor-sampleapp-quickstart");
 const monitor_sampleapp_quickstart_with_image_1 = require("./QuickStarts/monitor-sampleapp-quickstart-with-image");
 const rehype_external_links_1 = __importDefault(require("../__mocks__/rehype-external-links"));
+const react_core_1 = require("@patternfly/react-core");
 const ALL_ACTIONS = [
     { label: /Good response/i },
     { label: /Bad response/i },
@@ -139,6 +140,13 @@ const EMPTY_TABLE = `
 
  `;
 const IMAGE = `![Multi-colored wavy lines on a black background](https://cdn.dribbble.com/userupload/10651749/file/original-8a07b8e39d9e8bf002358c66fce1223e.gif)`;
+const ERROR = {
+    title: 'Could not load chat',
+    children: 'Wait a few minutes and check your network settings. If the issue persists: ',
+    actionLinks: (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(react_core_1.AlertActionLink, { component: "a", href: "#" }, "Start a new chat"),
+        react_1.default.createElement(react_core_1.AlertActionLink, { component: "a", href: "#" }, "Contact support")))
+};
 const checkListItemsRendered = () => {
     const items = ['Item 1', 'Item 2', 'Item 3'];
     expect(react_2.screen.getAllByRole('listitem')).toHaveLength(3);
@@ -594,4 +602,21 @@ describe('Message', () => {
         // we are mocking rehype libraries, so we can't test target _blank addition on links directly with RTL
         expect(rehype_external_links_1.default).not.toHaveBeenCalled();
     });
+    it('should handle error correctly', () => {
+        (0, react_2.render)(react_1.default.createElement(Message_1.default, { avatar: "./img", role: "user", name: "User", error: ERROR }));
+        expect(react_2.screen.getByRole('heading', { name: /Could not load chat/i })).toBeTruthy();
+        expect(react_2.screen.getByRole('link', { name: /Start a new chat/i })).toBeTruthy();
+        expect(react_2.screen.getByRole('link', { name: /Contact support/i })).toBeTruthy();
+        expect(react_2.screen.getByText('Wait a few minutes and check your network settings. If the issue persists:')).toBeTruthy();
+    });
+    it('should handle error correctly when loading', () => {
+        (0, react_2.render)(react_1.default.createElement(Message_1.default, { avatar: "./img", role: "user", name: "User", error: ERROR, isLoading: true }));
+        expect(react_2.screen.queryByRole('heading', { name: /Could not load chat/i })).toBeFalsy();
+        expect(react_2.screen.getByText('Loading message')).toBeTruthy();
+    });
+    it('should handle error correctly when these is content', () => {
+        (0, react_2.render)(react_1.default.createElement(Message_1.default, { avatar: "./img", role: "user", name: "User", error: ERROR, content: "Test" }));
+        expect(react_2.screen.getByRole('heading', { name: /Could not load chat/i })).toBeTruthy();
+        expect(react_2.screen.queryByText('Test')).toBeFalsy();
+    });
 });

package/dist/cjs/index.d.ts

@@ -52,3 +52,5 @@ export { default as SourcesCard } from './SourcesCard';
 export * from './SourcesCard';
 export { default as TermsOfUse } from './TermsOfUse';
 export * from './TermsOfUse';
+export { default as tracking } from './tracking';
+export * from './tracking';

package/dist/cjs/index.js

@@ -18,7 +18,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TermsOfUse = exports.SourcesCard = exports.SourceDetailsMenuItem = exports.Settings = exports.ResponseActions = exports.PreviewAttachment = exports.MessageBox = exports.MessageBar = exports.Message = exports.LoadingMessage = exports.FileDropZone = exports.FileDetailsLabel = exports.FileDetails = exports.Compare = exports.CodeModal = exports.ChatbotWelcomePrompt = exports.ChatbotToggle = exports.ChatbotPopover = exports.ChatbotModal = exports.ChatbotHeader = exports.ChatbotFooter = exports.ChatbotConversationHistoryNav = exports.ChatbotContent = exports.ChatbotAlert = exports.Chatbot = exports.AttachMenu = exports.AttachmentEdit = void 0;
+exports.tracking = exports.TermsOfUse = exports.SourcesCard = exports.SourceDetailsMenuItem = exports.Settings = exports.ResponseActions = exports.PreviewAttachment = exports.MessageBox = exports.MessageBar = exports.Message = exports.LoadingMessage = exports.FileDropZone = exports.FileDetailsLabel = exports.FileDetails = exports.Compare = exports.CodeModal = exports.ChatbotWelcomePrompt = exports.ChatbotToggle = exports.ChatbotPopover = exports.ChatbotModal = exports.ChatbotHeader = exports.ChatbotFooter = exports.ChatbotConversationHistoryNav = exports.ChatbotContent = exports.ChatbotAlert = exports.Chatbot = exports.AttachMenu = exports.AttachmentEdit = void 0;
 var AttachmentEdit_1 = require("./AttachmentEdit");
 Object.defineProperty(exports, "AttachmentEdit", { enumerable: true, get: function () { return __importDefault(AttachmentEdit_1).default; } });
 __exportStar(require("./AttachmentEdit"), exports);
@@ -100,3 +100,6 @@ __exportStar(require("./SourcesCard"), exports);
 var TermsOfUse_1 = require("./TermsOfUse");
 Object.defineProperty(exports, "TermsOfUse", { enumerable: true, get: function () { return __importDefault(TermsOfUse_1).default; } });
 __exportStar(require("./TermsOfUse"), exports);
+var tracking_1 = require("./tracking");
+Object.defineProperty(exports, "tracking", { enumerable: true, get: function () { return __importDefault(tracking_1).default; } });
+__exportStar(require("./tracking"), exports);

package/dist/cjs/tracking/console_tracking_provider.d.ts

@@ -0,0 +1,10 @@
+import { TrackingSpi } from './tracking_spi';
+import { TrackingApi, TrackingEventProperties } from './tracking_api';
+export declare class ConsoleTrackingProvider implements TrackingSpi, TrackingApi {
+    trackPageView(url: string | undefined): void;
+    registerProvider(): void;
+    initialize(): void;
+    identify(userID: string): void;
+    trackSingleItem(item: string, properties?: TrackingEventProperties): void;
+    getKey(): string;
+}

package/dist/cjs/tracking/console_tracking_provider.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConsoleTrackingProvider = void 0;
+class ConsoleTrackingProvider {
+    trackPageView(url) {
+        // eslint-disable-next-line no-console
+        console.log('ConsoleProvider pageView', url);
+    }
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    registerProvider() { }
+    initialize() {
+        // eslint-disable-next-line no-console
+        console.log('ConsoleProvider initialize');
+    }
+    identify(userID) {
+        // eslint-disable-next-line no-console
+        console.log('ConsoleProvider identify', userID);
+    }
+    trackSingleItem(item, properties) {
+        // eslint-disable-next-line no-console
+        console.log('ConsoleProvider: ' + item, properties);
+    }
+    getKey() {
+        return 'console';
+    }
+}
+exports.ConsoleTrackingProvider = ConsoleTrackingProvider;

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

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

package/dist/cjs/tracking/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 tracking_registry_1 = require("./tracking_registry");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(tracking_registry_1).default; } });
+__exportStar(require("./tracking_registry"), exports);

package/dist/cjs/tracking/posthog_tracking_provider.d.ts

@@ -0,0 +1,9 @@
+import { TrackingApi, TrackingEventProperties } from './tracking_api';
+import { InitProps, TrackingSpi } from './tracking_spi';
+export declare class PosthogTrackingProvider implements TrackingSpi, TrackingApi {
+    getKey(): string;
+    initialize(props: InitProps): void;
+    identify(userID: string): void;
+    trackPageView(url: string | undefined): void;
+    trackSingleItem(item: string, properties?: TrackingEventProperties): void;
+}

package/dist/cjs/tracking/posthog_tracking_provider.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PosthogTrackingProvider = void 0;
+const posthog_js_1 = require("posthog-js");
+class PosthogTrackingProvider {
+    getKey() {
+        return 'posthogKey';
+    }
+    initialize(props) {
+        // eslint-disable-next-line no-console
+        console.log('PosthogProvider initialize');
+        const posthogKey = props.posthogKey;
+        posthog_js_1.posthog.init(posthogKey, {
+            // eslint-disable-next-line camelcase
+            api_host: 'https://us.i.posthog.com',
+            // eslint-disable-next-line camelcase
+            person_profiles: 'identified_only' // or 'always' to create profiles for anonymous users as well
+        });
+    }
+    identify(userID) {
+        // eslint-disable-next-line no-console
+        console.log('PosthogProvider userID: ' + userID);
+        posthog_js_1.posthog.identify(userID);
+    }
+    trackPageView(url) {
+        // eslint-disable-next-line no-console
+        console.log('PostHogProvider url', url);
+        // TODO posthog seems to record that automatically.
+        //  How to not clash with this here? Just leave as no-op?
+    }
+    trackSingleItem(item, properties) {
+        // eslint-disable-next-line no-console
+        console.log('PosthogProvider: trackSingleItem' + item, properties);
+        posthog_js_1.posthog.capture(item, { properties });
+    }
+}
+exports.PosthogTrackingProvider = PosthogTrackingProvider;

package/dist/cjs/tracking/segment_tracking_provider.d.ts

@@ -0,0 +1,10 @@
+import { TrackingApi, TrackingEventProperties } from './tracking_api';
+import { InitProps, TrackingSpi } from './tracking_spi';
+export declare class SegmentTrackingProvider implements TrackingSpi, TrackingApi {
+    private analytics;
+    getKey(): string;
+    initialize(props: InitProps): void;
+    identify(userID: string): void;
+    trackPageView(url: string | undefined): void;
+    trackSingleItem(item: string, properties?: TrackingEventProperties): void;
+}

package/dist/cjs/tracking/segment_tracking_provider.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SegmentTrackingProvider = void 0;
+const analytics_next_1 = require("@segment/analytics-next");
+class SegmentTrackingProvider {
+    getKey() {
+        return 'segmentKey';
+    }
+    initialize(props) {
+        // eslint-disable-next-line no-console
+        console.log('SegmentProvider initialize');
+        const segmentKey = props.segmentKey;
+        // We need to create an object here, as ts lint is unhappy otherwise
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const integrations = props.segmentIntegrations;
+        this.analytics = analytics_next_1.AnalyticsBrowser.load({
+            writeKey: segmentKey,
+            cdnURL: props.segmentCdn
+        }, {
+            integrations: Object.assign({}, integrations)
+        });
+    }
+    identify(userID) {
+        // eslint-disable-next-line no-console
+        console.log('SegmentProvider userID: ' + userID);
+        if (this.analytics) {
+            this.analytics.identify(userID);
+        }
+    }
+    trackPageView(url) {
+        // eslint-disable-next-line no-console
+        console.log('SegmentProvider url', url);
+        if (this.analytics) {
+            if (url) {
+                this.analytics.page(url);
+            }
+            else {
+                this.analytics.page(); // Uses window.url
+            }
+        }
+    }
+    trackSingleItem(item, properties) {
+        // eslint-disable-next-line no-console
+        console.log('SegmentProvider: trackSingleItem' + item, properties);
+        if (this.analytics) {
+            this.analytics.track(item, { properties });
+        }
+    }
+}
+exports.SegmentTrackingProvider = SegmentTrackingProvider;

package/dist/cjs/tracking/trackingProviderProxy.d.ts

@@ -0,0 +1,9 @@
+import { TrackingApi, TrackingEventProperties } from './tracking_api';
+declare class TrackingProviderProxy implements TrackingApi {
+    providers: TrackingApi[];
+    constructor(providers: TrackingApi[]);
+    identify(userID: string): void;
+    trackSingleItem(eventName: string, properties?: TrackingEventProperties): void;
+    trackPageView(url: string | undefined): void;
+}
+export default TrackingProviderProxy;

package/dist/cjs/tracking/trackingProviderProxy.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+class TrackingProviderProxy {
+    constructor(providers) {
+        this.providers = [];
+        this.providers = providers;
+    }
+    identify(userID) {
+        for (const provider of this.providers) {
+            provider.identify(userID);
+        }
+    }
+    trackSingleItem(eventName, properties) {
+        for (const provider of this.providers) {
+            provider.trackSingleItem(eventName, properties);
+        }
+    }
+    trackPageView(url) {
+        for (const provider of this.providers) {
+            provider.trackPageView(url);
+        }
+    }
+}
+exports.default = TrackingProviderProxy;

package/dist/cjs/tracking/tracking_api.d.ts

@@ -0,0 +1,8 @@
+export interface TrackingEventProperties {
+    [key: string]: string | number | boolean | undefined;
+}
+export interface TrackingApi {
+    identify: (userID: string) => void;
+    trackPageView: (url: string | undefined) => void;
+    trackSingleItem: (eventName: string, properties: TrackingEventProperties | undefined) => void;
+}

package/dist/cjs/tracking/tracking_api.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/tracking/tracking_registry.d.ts

@@ -0,0 +1,4 @@
+import { InitProps } from './tracking_spi';
+import { TrackingApi } from './tracking_api';
+export declare const getTrackingProviders: (initProps: InitProps) => TrackingApi;
+export default getTrackingProviders;

package/dist/cjs/tracking/tracking_registry.js

@@ -0,0 +1,33 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTrackingProviders = void 0;
+const trackingProviderProxy_1 = __importDefault(require("./trackingProviderProxy"));
+const console_tracking_provider_1 = require("./console_tracking_provider");
+const segment_tracking_provider_1 = require("./segment_tracking_provider");
+const posthog_tracking_provider_1 = require("./posthog_tracking_provider");
+const umami_tracking_provider_1 = require("./umami_tracking_provider");
+const getTrackingProviders = (initProps) => {
+    const providers = [];
+    providers.push(new segment_tracking_provider_1.SegmentTrackingProvider());
+    providers.push(new posthog_tracking_provider_1.PosthogTrackingProvider());
+    providers.push(new umami_tracking_provider_1.UmamiTrackingProvider());
+    // TODO dynamically find and register providers
+    // Initialize them
+    const enabledProviders = [];
+    for (const provider of providers) {
+        const key = provider.getKey();
+        if (Object.keys(initProps).indexOf(key) > -1) {
+            provider.initialize(initProps);
+            enabledProviders.push(provider);
+        }
+    }
+    // Add the console provider
+    const consoleTrackingProvider = new console_tracking_provider_1.ConsoleTrackingProvider();
+    enabledProviders.push(consoleTrackingProvider); // TODO noop- provider?
+    return new trackingProviderProxy_1.default(enabledProviders);
+};
+exports.getTrackingProviders = getTrackingProviders;
+exports.default = exports.getTrackingProviders;

package/dist/cjs/tracking/tracking_spi.d.ts

@@ -0,0 +1,9 @@
+import { TrackingApi, TrackingEventProperties } from './tracking_api';
+export interface InitProps {
+    [key: string]: string | number | boolean;
+}
+export interface TrackingSpi extends TrackingApi {
+    getKey: () => string;
+    initialize: (props: InitProps) => void;
+    trackSingleItem: (item: string, properties?: TrackingEventProperties) => void;
+}

package/dist/cjs/tracking/tracking_spi.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/tracking/umami_tracking_provider.d.ts

@@ -0,0 +1,14 @@
+import { InitProps, TrackingSpi } from './tracking_spi';
+import { TrackingApi, TrackingEventProperties } from './tracking_api';
+declare global {
+    interface Window {
+        umami: any;
+    }
+}
+export declare class UmamiTrackingProvider implements TrackingSpi, TrackingApi {
+    getKey(): string;
+    initialize(props: InitProps): void;
+    identify(userID: string): void;
+    trackPageView(url: string | undefined): void;
+    trackSingleItem(item: string, properties?: TrackingEventProperties): void;
+}

package/dist/cjs/tracking/umami_tracking_provider.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UmamiTrackingProvider = void 0;
+class UmamiTrackingProvider {
+    getKey() {
+        return 'umamiKey';
+    }
+    initialize(props) {
+        // eslint-disable-next-line no-console
+        console.log('UmamiProvider initialize');
+        const umamiKey = props.umamiKey;
+        const hostUrl = props.umamiHostUrl;
+        const script = document.createElement('script');
+        script.src = hostUrl + '/script.js';
+        script.async = true;
+        script.defer = true;
+        // Configure Umami properties
+        script.setAttribute('data-website-id', umamiKey);
+        script.setAttribute('data-domains', 'localhost'); // TODO ?
+        script.setAttribute('data-auto-track', 'false');
+        script.setAttribute('data-host-url', hostUrl); // TODO ?
+        script.setAttribute('data-exclude-search', 'false'); // TODO ?
+        document.body.appendChild(script);
+    }
+    identify(userID) {
+        var _a;
+        // eslint-disable-next-line no-console
+        console.log('UmamiProvider userID: ' + userID);
+        (_a = window.umami) === null || _a === void 0 ? void 0 : _a.identify({ userID });
+    }
+    trackPageView(url) {
+        var _a;
+        // eslint-disable-next-line no-console
+        console.log('UmamiProvider url', url);
+        (_a = window.umami) === null || _a === void 0 ? void 0 : _a.track({ url });
+    }
+    trackSingleItem(item, properties) {
+        var _a;
+        // eslint-disable-next-line no-console
+        console.log('UmamiProvider: trackSingleItem' + item, properties);
+        (_a = window.umami) === null || _a === void 0 ? void 0 : _a.track(item, properties);
+    }
+}
+exports.UmamiTrackingProvider = UmamiTrackingProvider;

package/dist/dynamic/tracking/package.json

@@ -0,0 +1 @@
+{"main":"../../cjs/tracking/index.js","module":"../../esm/tracking/index.js","typings":"../../esm/tracking/index.d.ts"}

package/dist/esm/Message/ErrorMessage/ErrorMessage.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { AlertProps } from '@patternfly/react-core';
+declare const ErrorMessage: ({ title, actionLinks, children, ...props }: AlertProps) => React.JSX.Element;
+export default ErrorMessage;

package/dist/esm/Message/ErrorMessage/ErrorMessage.js

@@ -0,0 +1,21 @@
+// ============================================================================
+// Chatbot Main - Message - Content - Error
+// ============================================================================
+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 { Alert } from '@patternfly/react-core';
+const ErrorMessage = (_a) => {
+    var { title, actionLinks, children } = _a, props = __rest(_a, ["title", "actionLinks", "children"]);
+    return (React.createElement(Alert, Object.assign({ isInline: true, variant: "danger", title: title, actionLinks: actionLinks }, props), children));
+};
+export default ErrorMessage;

package/dist/esm/Message/Message.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode } from 'react';
-import { AvatarProps, LabelGroupProps } from '@patternfly/react-core';
+import { AlertProps, AvatarProps, LabelGroupProps } from '@patternfly/react-core';
 import { ActionProps } from '../ResponseActions/ResponseActions';
 import { SourcesCardProps } from '../SourcesCard';
 import { QuickStart, QuickstartAction } from './QuickStarts/types';
@@ -102,6 +102,8 @@ export interface MessageProps extends Omit<React.HTMLProps<HTMLDivElement>, 'rol
     additionalRehypePlugins?: PluggableList;
     /** Whether to open links in message in new tab. */
     openLinkInNewTab?: boolean;
+    /** Optional inline error message that can be displayed in the message */
+    error?: AlertProps;
 }
 export declare const MessageBase: React.FunctionComponent<MessageProps>;
 declare const Message: React.ForwardRefExoticComponent<Omit<MessageProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/esm/Message/Message.js

@@ -40,8 +40,9 @@ import rehypeUnwrapImages from 'rehype-unwrap-images';
 import rehypeExternalLinks from 'rehype-external-links';
 import rehypeSanitize from 'rehype-sanitize';
 import LinkMessage from './LinkMessage/LinkMessage';
+import ErrorMessage from './ErrorMessage/ErrorMessage';
 export const MessageBase = (_a) => {
-    var { role, content, extraContent, name, avatar, timestamp, isLoading, actions, sources, botWord = 'AI', loadingWord = 'Loading message', codeBlockProps, quickResponses, quickResponseContainerProps = { numLabels: 5 }, attachments, hasRoundAvatar = true, avatarProps, quickStarts, userFeedbackForm, userFeedbackComplete, isLiveRegion = true, innerRef, tableProps, openLinkInNewTab = true, additionalRehypePlugins = [] } = _a, props = __rest(_a, ["role", "content", "extraContent", "name", "avatar", "timestamp", "isLoading", "actions", "sources", "botWord", "loadingWord", "codeBlockProps", "quickResponses", "quickResponseContainerProps", "attachments", "hasRoundAvatar", "avatarProps", "quickStarts", "userFeedbackForm", "userFeedbackComplete", "isLiveRegion", "innerRef", "tableProps", "openLinkInNewTab", "additionalRehypePlugins"]);
+    var { role, content, extraContent, name, avatar, timestamp, isLoading, actions, sources, botWord = 'AI', loadingWord = 'Loading message', codeBlockProps, quickResponses, quickResponseContainerProps = { numLabels: 5 }, attachments, hasRoundAvatar = true, avatarProps, quickStarts, userFeedbackForm, userFeedbackComplete, isLiveRegion = true, innerRef, tableProps, openLinkInNewTab = true, additionalRehypePlugins = [], error } = _a, props = __rest(_a, ["role", "content", "extraContent", "name", "avatar", "timestamp", "isLoading", "actions", "sources", "botWord", "loadingWord", "codeBlockProps", "quickResponses", "quickResponseContainerProps", "attachments", "hasRoundAvatar", "avatarProps", "quickStarts", "userFeedbackForm", "userFeedbackComplete", "isLiveRegion", "innerRef", "tableProps", "openLinkInNewTab", "additionalRehypePlugins", "error"]);
     const { beforeMainContent, afterMainContent, endContent } = extraContent || {};
     let rehypePlugins = [rehypeUnwrapImages];
     if (openLinkInNewTab) {
@@ -71,7 +72,7 @@ export const MessageBase = (_a) => {
                 React.createElement("div", { className: "pf-chatbot__message-and-actions" },
                     isLoading ? (React.createElement(MessageLoading, { loadingWord: loadingWord })) : (React.createElement(React.Fragment, null,
                         beforeMainContent && React.createElement(React.Fragment, null, beforeMainContent),
-                        React.createElement(Markdown, { components: {
+                        error ? (React.createElement(ErrorMessage, Object.assign({}, error))) : (React.createElement(Markdown, { components: {
                                 p: (props) => React.createElement(TextMessage, Object.assign({ component: ContentVariants.p }, props)),
                                 code: (_a) => {
                                     var { children } = _a, props = __rest(_a, ["children"]);
@@ -100,7 +101,7 @@ export const MessageBase = (_a) => {
                                 th: (props) => React.createElement(ThMessage, Object.assign({}, props)),
                                 img: (props) => React.createElement(ImageMessage, Object.assign({}, props)),
                                 a: (props) => (React.createElement(LinkMessage, { href: props.href, rel: props.rel, target: props.target }, props.children))
-                            }, remarkPlugins: [remarkGfm], rehypePlugins: rehypePlugins }, content),
+                            }, remarkPlugins: [remarkGfm], rehypePlugins: rehypePlugins }, content)),
                         afterMainContent && React.createElement(React.Fragment, null, afterMainContent))),
                     !isLoading && sources && React.createElement(SourcesCard, Object.assign({}, sources)),
                     quickStarts && quickStarts.quickStart && (React.createElement(QuickStartTile, { quickStart: quickStarts.quickStart, onSelectQuickStart: quickStarts.onSelectQuickStart, minuteWord: quickStarts.minuteWord, minuteWordPlural: quickStarts.minuteWordPlural, prerequisiteWord: quickStarts.prerequisiteWord, prerequisiteWordPlural: quickStarts.prerequisiteWordPlural, quickStartButtonAriaLabel: quickStarts.quickStartButtonAriaLabel })),

package/dist/esm/Message/Message.test.js

@@ -15,6 +15,7 @@ import userEvent from '@testing-library/user-event';
 import { monitorSampleAppQuickStart } from './QuickStarts/monitor-sampleapp-quickstart';
 import { monitorSampleAppQuickStartWithImage } from './QuickStarts/monitor-sampleapp-quickstart-with-image';
 import rehypeExternalLinks from '../__mocks__/rehype-external-links';
+import { AlertActionLink } from '@patternfly/react-core';
 const ALL_ACTIONS = [
     { label: /Good response/i },
     { label: /Bad response/i },
@@ -134,6 +135,13 @@ const EMPTY_TABLE = `
 
  `;
 const IMAGE = `![Multi-colored wavy lines on a black background](https://cdn.dribbble.com/userupload/10651749/file/original-8a07b8e39d9e8bf002358c66fce1223e.gif)`;
+const ERROR = {
+    title: 'Could not load chat',
+    children: 'Wait a few minutes and check your network settings. If the issue persists: ',
+    actionLinks: (React.createElement(React.Fragment, null,
+        React.createElement(AlertActionLink, { component: "a", href: "#" }, "Start a new chat"),
+        React.createElement(AlertActionLink, { component: "a", href: "#" }, "Contact support")))
+};
 const checkListItemsRendered = () => {
     const items = ['Item 1', 'Item 2', 'Item 3'];
     expect(screen.getAllByRole('listitem')).toHaveLength(3);
@@ -589,4 +597,21 @@ describe('Message', () => {
         // we are mocking rehype libraries, so we can't test target _blank addition on links directly with RTL
         expect(rehypeExternalLinks).not.toHaveBeenCalled();
     });
+    it('should handle error correctly', () => {
+        render(React.createElement(Message, { avatar: "./img", role: "user", name: "User", error: ERROR }));
+        expect(screen.getByRole('heading', { name: /Could not load chat/i })).toBeTruthy();
+        expect(screen.getByRole('link', { name: /Start a new chat/i })).toBeTruthy();
+        expect(screen.getByRole('link', { name: /Contact support/i })).toBeTruthy();
+        expect(screen.getByText('Wait a few minutes and check your network settings. If the issue persists:')).toBeTruthy();
+    });
+    it('should handle error correctly when loading', () => {
+        render(React.createElement(Message, { avatar: "./img", role: "user", name: "User", error: ERROR, isLoading: true }));
+        expect(screen.queryByRole('heading', { name: /Could not load chat/i })).toBeFalsy();
+        expect(screen.getByText('Loading message')).toBeTruthy();
+    });
+    it('should handle error correctly when these is content', () => {
+        render(React.createElement(Message, { avatar: "./img", role: "user", name: "User", error: ERROR, content: "Test" }));
+        expect(screen.getByRole('heading', { name: /Could not load chat/i })).toBeTruthy();
+        expect(screen.queryByText('Test')).toBeFalsy();
+    });
 });