@patternfly/chatbot 6.3.0-prerelease.13 → 6.3.0-prerelease.14

package/dist/esm/ResponseActions/ResponseActions.test.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import ResponseActions from './ResponseActions';
@@ -29,7 +29,7 @@ const CUSTOM_ACTIONS = [
             onClick: jest.fn(),
             tooltipContent: 'Regenerate',
             clickedTooltipContent: 'Regenerated',
-            icon: React.createElement(RedoIcon, null)
+            icon: _jsx(RedoIcon, {})
         },
         download: {
             ariaLabel: 'Download',
@@ -37,13 +37,13 @@ const CUSTOM_ACTIONS = [
             onClick: jest.fn(),
             tooltipContent: 'Download',
             clickedTooltipContent: 'Downloaded',
-            icon: React.createElement(DownloadIcon, null)
+            icon: _jsx(DownloadIcon, {})
         },
         info: {
             ariaLabel: 'Info',
             onClick: jest.fn(),
             tooltipContent: 'Info',
-            icon: React.createElement(InfoCircleIcon, null)
+            icon: _jsx(InfoCircleIcon, {})
         }
     }
 ];
@@ -59,7 +59,7 @@ describe('ResponseActions', () => {
         jest.clearAllMocks();
     });
     it('should handle click within group of buttons correctly', () => __awaiter(void 0, void 0, void 0, function* () {
-        render(React.createElement(ResponseActions, { actions: {
+        render(_jsx(ResponseActions, { actions: {
                 positive: { onClick: jest.fn() },
                 negative: { onClick: jest.fn() },
                 copy: { onClick: jest.fn() },
@@ -90,7 +90,7 @@ describe('ResponseActions', () => {
     }));
     it('should handle click outside of group of buttons correctly', () => __awaiter(void 0, void 0, void 0, function* () {
         // using message just so we have something outside the group that's rendered
-        render(React.createElement(Message, { name: "Bot", role: "bot", avatar: "", content: "I updated your account with those settings. You're ready to set up your first dashboard!", actions: {
+        render(_jsx(Message, { name: "Bot", role: "bot", avatar: "", content: "I updated your account with those settings. You're ready to set up your first dashboard!", actions: {
                 positive: {},
                 negative: {}
             } }));
@@ -110,21 +110,21 @@ describe('ResponseActions', () => {
     }));
     it('should render buttons correctly', () => {
         ALL_ACTIONS.forEach(({ type, label }) => {
-            render(React.createElement(ResponseActions, { actions: { [type]: { onClick: jest.fn() } } }));
+            render(_jsx(ResponseActions, { actions: { [type]: { onClick: jest.fn() } } }));
             expect(screen.getByRole('button', { name: label })).toBeTruthy();
         });
     });
     it('should be able to call onClick correctly', () => __awaiter(void 0, void 0, void 0, function* () {
         ALL_ACTIONS.forEach((_a) => __awaiter(void 0, [_a], void 0, function* ({ type, label }) {
             const spy = jest.fn();
-            render(React.createElement(ResponseActions, { actions: { [type]: { onClick: spy } } }));
+            render(_jsx(ResponseActions, { actions: { [type]: { onClick: spy } } }));
             yield userEvent.click(screen.getByRole('button', { name: label }));
             expect(spy).toHaveBeenCalledTimes(1);
         }));
     }));
     it('should swap clicked and non-clicked aria labels on click', () => __awaiter(void 0, void 0, void 0, function* () {
         ALL_ACTIONS.forEach((_a) => __awaiter(void 0, [_a], void 0, function* ({ type, label, clickedLabel }) {
-            render(React.createElement(ResponseActions, { actions: { [type]: { onClick: jest.fn() } } }));
+            render(_jsx(ResponseActions, { actions: { [type]: { onClick: jest.fn() } } }));
             expect(screen.getByRole('button', { name: label })).toBeTruthy();
             yield userEvent.click(screen.getByRole('button', { name: label }));
             expect(screen.getByRole('button', { name: clickedLabel })).toBeTruthy();
@@ -132,7 +132,7 @@ describe('ResponseActions', () => {
     }));
     it('should swap clicked and non-clicked tooltips on click', () => __awaiter(void 0, void 0, void 0, function* () {
         ALL_ACTIONS.forEach((_a) => __awaiter(void 0, [_a], void 0, function* ({ type, label, clickedLabel }) {
-            render(React.createElement(ResponseActions, { actions: { [type]: { onClick: jest.fn() } } }));
+            render(_jsx(ResponseActions, { actions: { [type]: { onClick: jest.fn() } } }));
             expect(screen.getByRole('button', { name: label })).toBeTruthy();
             yield userEvent.click(screen.getByRole('button', { name: label }));
             expect(screen.getByRole('tooltip', { name: clickedLabel })).toBeTruthy();
@@ -147,32 +147,32 @@ describe('ResponseActions', () => {
             { type: 'listen', ariaLabel: 'Listen up' }
         ];
         actions.forEach(({ type, ariaLabel }) => {
-            render(React.createElement(ResponseActions, { actions: { [type]: { onClick: jest.fn(), ariaLabel } } }));
+            render(_jsx(ResponseActions, { actions: { [type]: { onClick: jest.fn(), ariaLabel } } }));
             expect(screen.getByRole('button', { name: ariaLabel })).toBeTruthy();
         });
     });
     it('should be able to disable buttons', () => {
         ALL_ACTIONS.forEach(({ type, label }) => {
-            render(React.createElement(ResponseActions, { actions: { [type]: { onClick: jest.fn(), isDisabled: true } } }));
+            render(_jsx(ResponseActions, { actions: { [type]: { onClick: jest.fn(), isDisabled: true } } }));
             expect(screen.getByRole('button', { name: label })).toBeDisabled();
         });
     });
     it('should be able to add class to buttons', () => {
         ALL_ACTIONS.forEach(({ type, label }) => {
-            render(React.createElement(ResponseActions, { actions: { [type]: { onClick: jest.fn(), className: 'test' } } }));
+            render(_jsx(ResponseActions, { actions: { [type]: { onClick: jest.fn(), className: 'test' } } }));
             expect(screen.getByRole('button', { name: label })).toHaveClass('test');
         });
     });
     it('should be able to add custom attributes to buttons', () => {
         ALL_ACTIONS_DATA_TEST.forEach(({ type, dataTestId }) => {
-            render(React.createElement(ResponseActions, { actions: { [type]: { onClick: jest.fn(), 'data-testid': dataTestId } } }));
+            render(_jsx(ResponseActions, { actions: { [type]: { onClick: jest.fn(), 'data-testid': dataTestId } } }));
             expect(screen.getByTestId(dataTestId)).toBeTruthy();
         });
     });
     it('should be able to add custom actions', () => {
         CUSTOM_ACTIONS.forEach((action) => {
             const key = Object.keys(action)[0];
-            render(React.createElement(ResponseActions, { actions: {
+            render(_jsx(ResponseActions, { actions: {
                     [key]: {
                         tooltipContent: action[key].tooltipContent,
                         onClick: action[key].onClick,

package/dist/esm/Settings/SettingsForm.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FunctionComponent } from 'react';
 export interface SettingsFormProps {
     /** Class applied to form container */
     className?: string;
@@ -11,5 +11,5 @@ export interface SettingsFormProps {
     /** Sets form to compact styling. */
     isCompact?: boolean;
 }
-export declare const SettingsForm: React.FunctionComponent<SettingsFormProps>;
+export declare const SettingsForm: FunctionComponent<SettingsFormProps>;
 export default SettingsForm;

package/dist/esm/Settings/SettingsForm.js

@@ -9,12 +9,9 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const SettingsForm = (_a) => {
     var { className, fields = [], isCompact } = _a, props = __rest(_a, ["className", "fields", "isCompact"]);
-    return (React.createElement("div", Object.assign({ className: `pf-chatbot__settings-form-container ${isCompact ? 'pf-m-compact' : ''} ${className ? ` ${className}` : ''}` }, props),
-        React.createElement("form", { className: "pf-chatbot__settings-form" }, fields.map((field) => (React.createElement("div", { className: "pf-chatbot__settings-form-row", key: field.label },
-            React.createElement("label", { className: "pf-chatbot__settings-label", htmlFor: field.id }, field.label),
-            field.field))))));
+    return (_jsx("div", Object.assign({ className: `pf-chatbot__settings-form-container ${isCompact ? 'pf-m-compact' : ''} ${className ? ` ${className}` : ''}` }, props, { children: _jsx("form", { className: "pf-chatbot__settings-form", children: fields.map((field) => (_jsxs("div", { className: "pf-chatbot__settings-form-row", children: [_jsx("label", { className: "pf-chatbot__settings-label", htmlFor: field.id, children: field.label }), field.field] }, field.label))) }) })));
 };
 export default SettingsForm;

package/dist/esm/Settings/SettingsForm.test.js

@@ -1,11 +1,11 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Button } from '@patternfly/react-core';
 import { render, screen } from '@testing-library/react';
 import { SettingsForm } from './SettingsForm';
 import '@testing-library/jest-dom';
 describe('SettingsForm', () => {
     it('should render settingsForm with custom classname', () => {
-        const { container } = render(React.createElement(SettingsForm, { className: "custom-settings" }));
+        const { container } = render(_jsx(SettingsForm, { className: "custom-settings" }));
         expect(container.querySelector('.custom-settings')).toBeTruthy();
     });
     it('should render settingsForm with fields', () => {
@@ -13,10 +13,10 @@ describe('SettingsForm', () => {
             {
                 id: 'archived-chat',
                 label: 'Archive chat',
-                field: (React.createElement(Button, { id: "archived-chat", variant: "secondary" }, "Archive chat"))
+                field: (_jsx(Button, { id: "archived-chat", variant: "secondary", children: "Archive chat" }))
             }
         ];
-        render(React.createElement(SettingsForm, { fields: fields }));
+        render(_jsx(SettingsForm, { fields: fields }));
         expect(screen.getByRole('button', { name: 'Archive chat' })).toBeTruthy();
     });
     it('should render settingsForm with isCompact', () => {
@@ -24,10 +24,10 @@ describe('SettingsForm', () => {
             {
                 id: 'archived-chat',
                 label: 'Archive chat',
-                field: (React.createElement(Button, { id: "archived-chat", variant: "secondary" }, "Archive chat"))
+                field: (_jsx(Button, { id: "archived-chat", variant: "secondary", children: "Archive chat" }))
             }
         ];
-        render(React.createElement(SettingsForm, { "data-testid": "settings-form", fields: fields, isCompact: true }));
+        render(_jsx(SettingsForm, { "data-testid": "settings-form", fields: fields, isCompact: true }));
         expect(screen.getByTestId('settings-form')).toHaveClass('pf-m-compact');
     });
 });

package/dist/esm/SourceDetailsMenuItem/SourceDetailsMenuItem.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FunctionComponent } from 'react';
 export interface SourceDetailsMenuItemProps extends React.HTMLProps<HTMLDivElement> {
     /** Icon */
     icon: React.ReactNode;
@@ -7,5 +7,5 @@ export interface SourceDetailsMenuItemProps extends React.HTMLProps<HTMLDivEleme
     /** Description of source */
     type?: string;
 }
-export declare const SourceDetailsMenuItem: React.FunctionComponent<SourceDetailsMenuItemProps>;
+export declare const SourceDetailsMenuItem: FunctionComponent<SourceDetailsMenuItemProps>;
 export default SourceDetailsMenuItem;

package/dist/esm/SourceDetailsMenuItem/SourceDetailsMenuItem.js

@@ -9,16 +9,10 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Icon, Flex, Stack, StackItem } from '@patternfly/react-core';
 export const SourceDetailsMenuItem = (_a) => {
     var { icon, name, type } = _a, props = __rest(_a, ["icon", "name", "type"]);
-    return (React.createElement(Flex, Object.assign({ className: "pf-chatbot__source-details", gap: { default: 'gapSm' } }, props),
-        React.createElement(Flex, { justifyContent: { default: 'justifyContentCenter' }, alignItems: { default: 'alignItemsCenter' }, alignSelf: { default: 'alignSelfCenter' } },
-            React.createElement(Icon, { className: "pf-chatbot__source-details-icon" }, icon)),
-        React.createElement(Stack, { className: "pf-chatbot__source-details-text" },
-            React.createElement(StackItem, null,
-                React.createElement("span", { className: "pf-chatbot__source-details-heading" }, name)),
-            type && React.createElement(StackItem, { className: "pf-chatbot__source-details-subhead" }, type))));
+    return (_jsxs(Flex, Object.assign({ className: "pf-chatbot__source-details", gap: { default: 'gapSm' } }, props, { children: [_jsx(Flex, { justifyContent: { default: 'justifyContentCenter' }, alignItems: { default: 'alignItemsCenter' }, alignSelf: { default: 'alignSelfCenter' }, children: _jsx(Icon, { className: "pf-chatbot__source-details-icon", children: icon }) }), _jsxs(Stack, { className: "pf-chatbot__source-details-text", children: [_jsx(StackItem, { children: _jsx("span", { className: "pf-chatbot__source-details-heading", children: name }) }), type && _jsx(StackItem, { className: "pf-chatbot__source-details-subhead", children: type })] })] })));
 };
 export default SourceDetailsMenuItem;

package/dist/esm/SourcesCard/SourcesCard.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FunctionComponent } from 'react';
 import { CardProps } from '@patternfly/react-core';
 export interface SourcesCardProps extends CardProps {
     /** Additional classes for the pagination navigation container. */
@@ -36,5 +36,5 @@ export interface SourcesCardProps extends CardProps {
     /** Label for English words "show less" */
     showLessWords?: string;
 }
-declare const SourcesCard: React.FunctionComponent<SourcesCardProps>;
+declare const SourcesCard: FunctionComponent<SourcesCardProps>;
 export default SourcesCard;

package/dist/esm/SourcesCard/SourcesCard.js

@@ -9,17 +9,15 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-// ============================================================================
-// Chatbot Main - Messages - Sources Card
-// ============================================================================
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
 // Import PatternFly components
 import { Button, ButtonVariant, Card, CardBody, CardFooter, CardTitle, ExpandableSection, ExpandableSectionVariant, Icon, pluralize, Truncate } from '@patternfly/react-core';
 import { ExternalLinkSquareAltIcon } from '@patternfly/react-icons';
 const SourcesCard = (_a) => {
     var { className, isDisabled, paginationAriaLabel = 'Pagination', sources, sourceWord = 'source', sourceWordPlural = 'sources', toNextPageAriaLabel = 'Go to next page', toPreviousPageAriaLabel = 'Go to previous page', onNextClick, onPreviousClick, onSetPage, showMoreWords = 'show more', showLessWords = 'show less', isCompact } = _a, props = __rest(_a, ["className", "isDisabled", "paginationAriaLabel", "sources", "sourceWord", "sourceWordPlural", "toNextPageAriaLabel", "toPreviousPageAriaLabel", "onNextClick", "onPreviousClick", "onSetPage", "showMoreWords", "showLessWords", "isCompact"]);
-    const [page, setPage] = React.useState(1);
-    const [isExpanded, setIsExpanded] = React.useState(false);
+    const [page, setPage] = useState(1);
+    const [isExpanded, setIsExpanded] = useState(false);
     const onToggle = (_event, isExpanded) => {
         setIsExpanded(isExpanded);
     };
@@ -29,41 +27,20 @@ const SourcesCard = (_a) => {
     };
     const renderTitle = (title) => {
         if (title) {
-            return React.createElement(Truncate, { content: title });
+            return _jsx(Truncate, { content: title });
         }
         return `Source ${page}`;
     };
-    return (React.createElement("div", { className: "pf-chatbot__source" },
-        React.createElement("span", null, pluralize(sources.length, sourceWord, sourceWordPlural)),
-        React.createElement(Card, Object.assign({ isCompact: isCompact, className: "pf-chatbot__sources-card" }, props),
-            React.createElement(CardTitle, { className: "pf-chatbot__sources-card-title" },
-                React.createElement(Button, { component: "a", variant: ButtonVariant.link, href: sources[page - 1].link, icon: sources[page - 1].isExternal ? React.createElement(ExternalLinkSquareAltIcon, null) : undefined, iconPosition: "end", isInline: true, rel: sources[page - 1].isExternal ? 'noreferrer' : undefined, target: sources[page - 1].isExternal ? '_blank' : undefined }, renderTitle(sources[page - 1].title))),
-            sources[page - 1].body && (React.createElement(CardBody, { className: `pf-chatbot__sources-card-body` }, sources[page - 1].hasShowMore ? (
-            // prevents extra VO announcements of button text - parent Message has aria-live
-            React.createElement("div", { "aria-live": "off" },
-                React.createElement(ExpandableSection, { variant: ExpandableSectionVariant.truncate, toggleText: isExpanded ? showLessWords : showMoreWords, onToggle: onToggle, isExpanded: isExpanded, truncateMaxLines: 2 }, sources[page - 1].body))) : (React.createElement("div", { className: "pf-chatbot__sources-card-body-text" }, sources[page - 1].body)))),
-            sources.length > 1 && (React.createElement(CardFooter, { className: "pf-chatbot__sources-card-footer-container" },
-                React.createElement("div", { className: "pf-chatbot__sources-card-footer" },
-                    React.createElement("nav", { className: `pf-chatbot__sources-card-footer-buttons ${className}`, "aria-label": paginationAriaLabel },
-                        React.createElement(Button, { variant: ButtonVariant.plain, isDisabled: isDisabled || page === 1, "data-action": "previous", onClick: (event) => {
-                                const newPage = page >= 1 ? page - 1 : 1;
-                                onPreviousClick && onPreviousClick(event, newPage);
-                                handleNewPage(event, newPage);
-                            }, "aria-label": toPreviousPageAriaLabel },
-                            React.createElement(Icon, { iconSize: "lg" },
-                                React.createElement("svg", { className: "pf-v6-svg", viewBox: "0 0 280 500", fill: "currentColor", "aria-hidden": "true", role: "img", width: "1em", height: "1em" },
-                                    React.createElement("path", { d: "M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z" })))),
-                        React.createElement("span", { "aria-hidden": "true" },
-                            page,
-                            "/",
-                            sources.length),
-                        React.createElement(Button, { variant: ButtonVariant.plain, isDisabled: isDisabled || page === sources.length, "aria-label": toNextPageAriaLabel, "data-action": "next", onClick: (event) => {
-                                const newPage = page + 1 <= sources.length ? page + 1 : sources.length;
-                                onNextClick && onNextClick(event, newPage);
-                                handleNewPage(event, newPage);
-                            } },
-                            React.createElement(Icon, { isInline: true, iconSize: "lg" },
-                                React.createElement("svg", { className: "pf-v6-svg", viewBox: "0 0 180 500", fill: "currentColor", "aria-hidden": "true", role: "img", width: "1em", height: "1em" },
-                                    React.createElement("path", { d: "M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z" })))))))))));
+    return (_jsxs("div", { className: "pf-chatbot__source", children: [_jsx("span", { children: pluralize(sources.length, sourceWord, sourceWordPlural) }), _jsxs(Card, Object.assign({ isCompact: isCompact, className: "pf-chatbot__sources-card" }, props, { children: [_jsx(CardTitle, { className: "pf-chatbot__sources-card-title", children: _jsx(Button, { component: "a", variant: ButtonVariant.link, href: sources[page - 1].link, icon: sources[page - 1].isExternal ? _jsx(ExternalLinkSquareAltIcon, {}) : undefined, iconPosition: "end", isInline: true, rel: sources[page - 1].isExternal ? 'noreferrer' : undefined, target: sources[page - 1].isExternal ? '_blank' : undefined, children: renderTitle(sources[page - 1].title) }) }), sources[page - 1].body && (_jsx(CardBody, { className: `pf-chatbot__sources-card-body`, children: sources[page - 1].hasShowMore ? (
+                        // prevents extra VO announcements of button text - parent Message has aria-live
+                        _jsx("div", { "aria-live": "off", children: _jsx(ExpandableSection, { variant: ExpandableSectionVariant.truncate, toggleText: isExpanded ? showLessWords : showMoreWords, onToggle: onToggle, isExpanded: isExpanded, truncateMaxLines: 2, children: sources[page - 1].body }) })) : (_jsx("div", { className: "pf-chatbot__sources-card-body-text", children: sources[page - 1].body })) })), sources.length > 1 && (_jsx(CardFooter, { className: "pf-chatbot__sources-card-footer-container", children: _jsx("div", { className: "pf-chatbot__sources-card-footer", children: _jsxs("nav", { className: `pf-chatbot__sources-card-footer-buttons ${className}`, "aria-label": paginationAriaLabel, children: [_jsx(Button, { variant: ButtonVariant.plain, isDisabled: isDisabled || page === 1, "data-action": "previous", onClick: (event) => {
+                                            const newPage = page >= 1 ? page - 1 : 1;
+                                            onPreviousClick && onPreviousClick(event, newPage);
+                                            handleNewPage(event, newPage);
+                                        }, "aria-label": toPreviousPageAriaLabel, children: _jsx(Icon, { iconSize: "lg", children: _jsx("svg", { className: "pf-v6-svg", viewBox: "0 0 280 500", fill: "currentColor", "aria-hidden": "true", role: "img", width: "1em", height: "1em", children: _jsx("path", { d: "M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z" }) }) }) }), _jsxs("span", { "aria-hidden": "true", children: [page, "/", sources.length] }), _jsx(Button, { variant: ButtonVariant.plain, isDisabled: isDisabled || page === sources.length, "aria-label": toNextPageAriaLabel, "data-action": "next", onClick: (event) => {
+                                            const newPage = page + 1 <= sources.length ? page + 1 : sources.length;
+                                            onNextClick && onNextClick(event, newPage);
+                                            handleNewPage(event, newPage);
+                                        }, children: _jsx(Icon, { isInline: true, iconSize: "lg", children: _jsx("svg", { className: "pf-v6-svg", viewBox: "0 0 180 500", fill: "currentColor", "aria-hidden": "true", role: "img", width: "1em", height: "1em", children: _jsx("path", { d: "M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z" }) }) }) })] }) }) }))] }))] }));
 };
 export default SourcesCard;

package/dist/esm/SourcesCard/SourcesCard.test.js

@@ -7,14 +7,14 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import '@testing-library/jest-dom';
 import SourcesCard from './SourcesCard';
 describe('SourcesCard', () => {
     it('should render card correctly if one source with only a link is passed in', () => {
-        render(React.createElement(SourcesCard, { sources: [{ link: '' }] }));
+        render(_jsx(SourcesCard, { sources: [{ link: '' }] }));
         expect(screen.getByText('1 source')).toBeTruthy();
         expect(screen.getByText('Source 1')).toBeTruthy();
         // no buttons or navigation when there is only 1 source
@@ -22,23 +22,23 @@ describe('SourcesCard', () => {
         expect(screen.queryByText('1/1')).toBeFalsy();
     });
     it('should render card correctly if one source with a title is passed in', () => {
-        render(React.createElement(SourcesCard, { sources: [{ title: 'How to make an apple pie', link: '' }] }));
+        render(_jsx(SourcesCard, { sources: [{ title: 'How to make an apple pie', link: '' }] }));
         expect(screen.getByText('1 source')).toBeTruthy();
         expect(screen.getByText('How to make an apple pie')).toBeTruthy();
     });
     it('should render card correctly if one source with a body is passed in', () => {
-        render(React.createElement(SourcesCard, { sources: [{ link: '', body: 'To make an apple pie, you must first...' }] }));
+        render(_jsx(SourcesCard, { sources: [{ link: '', body: 'To make an apple pie, you must first...' }] }));
         expect(screen.getByText('1 source')).toBeTruthy();
         expect(screen.getByText('To make an apple pie, you must first...')).toBeTruthy();
     });
     it('should render card correctly if one source with a title and body is passed in', () => {
-        render(React.createElement(SourcesCard, { sources: [{ title: 'How to make an apple pie', link: '', body: 'To make an apple pie, you must first...' }] }));
+        render(_jsx(SourcesCard, { sources: [{ title: 'How to make an apple pie', link: '', body: 'To make an apple pie, you must first...' }] }));
         expect(screen.getByText('1 source')).toBeTruthy();
         expect(screen.getByText('How to make an apple pie')).toBeTruthy();
         expect(screen.getByText('To make an apple pie, you must first...')).toBeTruthy();
     });
     it('should render multiple cards correctly', () => {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ] }));
@@ -49,7 +49,7 @@ describe('SourcesCard', () => {
         screen.getByRole('button', { name: /Go to next page/i });
     });
     it('should navigate between cards correctly', () => __awaiter(void 0, void 0, void 0, function* () {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ] }));
@@ -64,7 +64,7 @@ describe('SourcesCard', () => {
         expect(screen.getByRole('button', { name: /Go to next page/i })).toBeDisabled();
     }));
     it('should apply className appropriately', () => {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], className: "test" }));
@@ -72,7 +72,7 @@ describe('SourcesCard', () => {
         expect(element).toHaveClass('test');
     });
     it('should disable pagination appropriately', () => {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], isDisabled: true }));
@@ -80,39 +80,39 @@ describe('SourcesCard', () => {
         expect(screen.getByRole('button', { name: /Go to next page/i })).toBeDisabled();
     });
     it('should render navigation aria label appropriately', () => {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ] }));
         expect(screen.getByRole('navigation', { name: /Pagination/i })).toBeTruthy();
     });
     it('should change paginationAriaLabel appropriately', () => {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], paginationAriaLabel: "Navegaci\u00F3n" }));
         expect(screen.getByRole('navigation', { name: /Navegación/i })).toBeTruthy();
     });
     it('should change sourceWord appropriately', () => {
-        render(React.createElement(SourcesCard, { sources: [{ title: 'How to make an apple pie', link: '' }], sourceWord: 'fuente' }));
+        render(_jsx(SourcesCard, { sources: [{ title: 'How to make an apple pie', link: '' }], sourceWord: 'fuente' }));
         expect(screen.getByText('1 fuente')).toBeTruthy();
     });
     it('should sourceWordPlural appropriately', () => {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], sourceWordPlural: 'fuentes' }));
         expect(screen.getByText('2 fuentes')).toBeTruthy();
     });
     it('should change toNextPageAriaLabel appropriately', () => {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], toNextPageAriaLabel: "Pase a la siguiente p\u00E1gina" }));
         expect(screen.getByRole('button', { name: /Pase a la siguiente página/i })).toBeTruthy();
     });
     it('should change toPreviousPageAriaLabel appropriately', () => {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], toPreviousPageAriaLabel: "Presione para regresar a la p\u00E1gina anterior" }));
@@ -120,7 +120,7 @@ describe('SourcesCard', () => {
     });
     it('should call onNextClick appropriately', () => __awaiter(void 0, void 0, void 0, function* () {
         const spy = jest.fn();
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], onNextClick: spy }));
@@ -129,7 +129,7 @@ describe('SourcesCard', () => {
     }));
     it('should call onPreviousClick appropriately', () => __awaiter(void 0, void 0, void 0, function* () {
         const spy = jest.fn();
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], onPreviousClick: spy }));
@@ -139,7 +139,7 @@ describe('SourcesCard', () => {
     }));
     it('should call onSetPage appropriately', () => __awaiter(void 0, void 0, void 0, function* () {
         const spy = jest.fn();
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 { title: 'How to make an apple pie', link: '' },
                 { title: 'How to make cookies', link: '' }
             ], onSetPage: spy }));
@@ -149,7 +149,7 @@ describe('SourcesCard', () => {
         expect(spy).toHaveBeenCalledTimes(2);
     }));
     it('should handle showMore appropriately', () => __awaiter(void 0, void 0, void 0, function* () {
-        render(React.createElement(SourcesCard, { sources: [
+        render(_jsx(SourcesCard, { sources: [
                 {
                     title: 'Getting started with Red Hat OpenShift',
                     link: '#',

package/dist/esm/TermsOfUse/TermsOfUse.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import type { FunctionComponent } from 'react';
 import { ModalProps } from '@patternfly/react-core';
 import { ChatbotDisplayMode } from '../Chatbot';
 export interface TermsOfUseProps extends ModalProps {
@@ -31,6 +31,6 @@ export interface TermsOfUseProps extends ModalProps {
     /** Sets modal to compact styling. */
     isCompact?: boolean;
 }
-export declare const TermsOfUseBase: React.FunctionComponent<TermsOfUseProps>;
-declare const TermsOfUse: React.ForwardRefExoticComponent<Omit<TermsOfUseProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const TermsOfUseBase: FunctionComponent<TermsOfUseProps>;
+declare const TermsOfUse: import("react").ForwardRefExoticComponent<Omit<TermsOfUseProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 export default TermsOfUse;

package/dist/esm/TermsOfUse/TermsOfUse.js

@@ -9,10 +9,8 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-// ============================================================================
-// Terms of Use Modal - Chatbot Modal Extension
-// ============================================================================
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
 import { Button, Content, ModalBody, ModalFooter, ModalHeader } from '@patternfly/react-core';
 import { ChatbotDisplayMode } from '../Chatbot';
 import ChatbotModal from '../ChatbotModal/ChatbotModal';
@@ -25,18 +23,8 @@ export const TermsOfUseBase = (_a) => {
     const handleSecondaryAction = (_event) => {
         onSecondaryAction(_event);
     };
-    const modal = (React.createElement(ChatbotModal, Object.assign({ isOpen: isModalOpen, ouiaId: ouiaId, "aria-labelledby": "terms-of-use-title", "aria-describedby": "terms-of-use-modal", className: `pf-chatbot__terms-of-use-modal pf-chatbot__terms-of-use-modal--${displayMode} ${isCompact ? 'pf-m-compact' : ''} ${className ? className : ''}`, displayMode: displayMode }, props),
-        React.createElement("section", { className: `pf-chatbot__terms-of-use--section`, "aria-label": title, tabIndex: -1, ref: innerRef },
-            React.createElement(ModalHeader, { className: "pf-chatbot__terms-of-use--modal-header" },
-                React.createElement("div", { className: "pf-chatbot__terms-of-use--header" },
-                    !isCompact && image && altText && (React.createElement("img", { src: image, className: "pf-chatbot__terms-of-use--image", alt: altText })),
-                    React.createElement("h1", { className: "pf-chatbot__terms-of-use--title" }, title))),
-            React.createElement(ModalBody, { className: "pf-chatbot__terms-of-use--modal-body" },
-                React.createElement(Content, null, children)),
-            React.createElement(ModalFooter, { className: "pf-chatbot__terms-of-use--footer" },
-                React.createElement(Button, { isBlock: true, key: "terms-of-use-modal-primary", variant: "primary", onClick: handlePrimaryAction, form: "terms-of-use-form", size: "lg" }, primaryActionBtn),
-                React.createElement(Button, { isBlock: true, key: "terms-of-use-modal-secondary", variant: "secondary", onClick: handleSecondaryAction, size: "lg" }, secondaryActionBtn)))));
+    const modal = (_jsx(ChatbotModal, Object.assign({ isOpen: isModalOpen, ouiaId: ouiaId, "aria-labelledby": "terms-of-use-title", "aria-describedby": "terms-of-use-modal", className: `pf-chatbot__terms-of-use-modal pf-chatbot__terms-of-use-modal--${displayMode} ${isCompact ? 'pf-m-compact' : ''} ${className ? className : ''}`, displayMode: displayMode }, props, { children: _jsxs("section", { className: `pf-chatbot__terms-of-use--section`, "aria-label": title, tabIndex: -1, ref: innerRef, children: [_jsx(ModalHeader, { className: "pf-chatbot__terms-of-use--modal-header", children: _jsxs("div", { className: "pf-chatbot__terms-of-use--header", children: [!isCompact && image && altText && (_jsx("img", { src: image, className: "pf-chatbot__terms-of-use--image", alt: altText })), _jsx("h1", { className: "pf-chatbot__terms-of-use--title", children: title })] }) }), _jsx(ModalBody, { className: "pf-chatbot__terms-of-use--modal-body", children: _jsx(Content, { children: children }) }), _jsxs(ModalFooter, { className: "pf-chatbot__terms-of-use--footer", children: [_jsx(Button, { isBlock: true, variant: "primary", onClick: handlePrimaryAction, form: "terms-of-use-form", size: "lg", children: primaryActionBtn }, "terms-of-use-modal-primary"), _jsx(Button, { isBlock: true, variant: "secondary", onClick: handleSecondaryAction, size: "lg", children: secondaryActionBtn }, "terms-of-use-modal-secondary")] })] }) })));
     return modal;
 };
-const TermsOfUse = React.forwardRef((props, ref) => (React.createElement(TermsOfUseBase, Object.assign({ innerRef: ref }, props))));
+const TermsOfUse = forwardRef((props, ref) => (_jsx(TermsOfUseBase, Object.assign({ innerRef: ref }, props))));
 export default TermsOfUse;

package/dist/esm/TermsOfUse/TermsOfUse.test.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import userEvent from '@testing-library/user-event';
@@ -16,15 +16,13 @@ import { Content } from '@patternfly/react-core';
 const handleModalToggle = jest.fn();
 const onPrimaryAction = jest.fn();
 const onSecondaryAction = jest.fn();
-const body = (React.createElement(Content, null,
-    React.createElement("h1", null, "Heading 1"),
-    React.createElement("p", null, "Legal text")));
+const body = (_jsxs(Content, { children: [_jsx("h1", { children: "Heading 1" }), _jsx("p", { children: "Legal text" })] }));
 describe('TermsOfUse', () => {
     afterEach(() => {
         jest.clearAllMocks();
     });
     it('should render modal correctly', () => {
-        render(React.createElement(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, ouiaId: "Terms" }, body));
+        render(_jsx(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, ouiaId: "Terms", children: body }));
         expect(screen.getByRole('heading', { name: /Terms of use/i })).toBeTruthy();
         expect(screen.getByRole('button', { name: /Accept/i })).toBeTruthy();
         expect(screen.getByRole('button', { name: /Decline/i })).toBeTruthy();
@@ -34,39 +32,39 @@ describe('TermsOfUse', () => {
         expect(screen.getByRole('dialog')).toHaveClass('pf-chatbot__terms-of-use-modal--default');
     });
     it('should handle image and altText props', () => {
-        render(React.createElement(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, image: "./image.png", altText: "Test image" }, body));
+        render(_jsx(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, image: "./image.png", altText: "Test image", children: body }));
         expect(screen.getByRole('img')).toBeTruthy();
         expect(screen.getByRole('img')).toHaveAttribute('alt', 'Test image');
     });
     it('should handle className prop', () => {
-        render(React.createElement(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, className: "test" }, body));
+        render(_jsx(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, className: "test", children: body }));
         expect(screen.getByRole('dialog')).toHaveClass('pf-chatbot__terms-of-use-modal');
         expect(screen.getByRole('dialog')).toHaveClass('pf-chatbot__terms-of-use-modal--default');
         expect(screen.getByRole('dialog')).toHaveClass('test');
     });
     it('should handle title prop', () => {
-        render(React.createElement(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, title: "Updated title" }, body));
+        render(_jsx(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, title: "Updated title", children: body }));
         expect(screen.getByRole('heading', { name: /Updated title/i })).toBeTruthy();
         expect(screen.queryByRole('heading', { name: /Terms of use/i })).toBeFalsy();
     });
     it('should handle primary button prop', () => {
-        render(React.createElement(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, primaryActionBtn: "First" }, body));
+        render(_jsx(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, primaryActionBtn: "First", children: body }));
         expect(screen.getByRole('button', { name: /First/i })).toBeTruthy();
         expect(screen.queryByRole('button', { name: /Accept/i })).toBeFalsy();
     });
     it('should handle secondary button prop', () => {
-        render(React.createElement(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, secondaryActionBtn: "Second" }, body));
+        render(_jsx(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, secondaryActionBtn: "Second", children: body }));
         expect(screen.getByRole('button', { name: /Second/i })).toBeTruthy();
         expect(screen.queryByRole('button', { name: /Deny/i })).toBeFalsy();
     });
     it('should handle primary button click', () => __awaiter(void 0, void 0, void 0, function* () {
-        render(React.createElement(TermsOfUse, { isModalOpen: true, onPrimaryAction: onPrimaryAction, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle }, body));
+        render(_jsx(TermsOfUse, { isModalOpen: true, onPrimaryAction: onPrimaryAction, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, children: body }));
         yield userEvent.click(screen.getByRole('button', { name: /Accept/i }));
         expect(onPrimaryAction).toHaveBeenCalledTimes(1);
         expect(handleModalToggle).toHaveBeenCalledTimes(1);
     }));
     it('should handle secondary button click', () => __awaiter(void 0, void 0, void 0, function* () {
-        render(React.createElement(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle }, body));
+        render(_jsx(TermsOfUse, { isModalOpen: true, onSecondaryAction: onSecondaryAction, handleModalToggle: handleModalToggle, children: body }));
         yield userEvent.click(screen.getByRole('button', { name: /Decline/i }));
         expect(onSecondaryAction).toHaveBeenCalledTimes(1);
         expect(handleModalToggle).not.toHaveBeenCalled();